yanlongqi/AnCao
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

改为使用下划线字符填充而不是CSS样式

Browse Source 
1. 将填空题从CSS边框样式改为传统的下划线字符（____）
2. 移除像素计算，使用纯文本下划线字符
3. 保持最少8个下划线字符的最小长度
4. 根据答案长度动态调整下划线数量

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
燕陇琪 2025-11-18 02:45:15 +08:00
parent 78413e98d7
commit 0464223d00
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
web/src/pages/ExamPrint.tsx
View File

@ -151,33 +151,33 @@ const ExamPrint: React.FC = () => {
? [String(question.answer)] ? [String(question.answer)]
: [] : []
// 计算下划线宽度，根据答案长度自动调整 // 计算下划线字符数量
const calculateUnderscoreWidth = (blankIndex: number, totalBlanks: number) => { const calculateUnderscoreCount = (blankIndex: number, totalBlanks: number) => {
// 优先使用 answer_lengths 字段（在 show_answer=false 时也会返回） // 优先使用 answer_lengths 字段（在 show_answer=false 时也会返回）
if (question.answer_lengths && question.answer_lengths[blankIndex] !== undefined) { if (question.answer_lengths && question.answer_lengths[blankIndex] !== undefined) {
const answerLength = question.answer_lengths[blankIndex] const answerLength = question.answer_lengths[blankIndex]
// 每个字符对应约4px宽度，最少8个字符=32px，最多60px // 最少8个下划线字符
return Math.max(Math.max(answerLength, 8) * 4, 32) return Math.max(answerLength, 8)
} }
// 如果有实际的答案数据，使用答案长度 // 如果有实际的答案数据，使用答案长度
if (answers[blankIndex]) { if (answers[blankIndex]) {
const answerText = String(answers[blankIndex]) const answerText = String(answers[blankIndex])
// 每个字符对应约4px宽度，最少8个字符=32px // 最少8个下划线字符
return Math.max(Math.max(answerText.length, 8) * 4, 32) return Math.max(answerText.length, 8)
} }
// 如果没有任何答案数据，使用默认策略 // 如果没有任何答案数据，使用默认策略
if (totalBlanks === 1) { if (totalBlanks === 1) {
return 32 // 单个填空：32px（约8个字符） return 8 // 单个填空：8个下划线字符
} else { } else {
// 多个填空：30-40px循环（约8-10个字符） // 多个填空：8-12个下划线字符循环
const widths = [32, 36, 40, 34, 38] const counts = [8, 10, 12, 9, 11]
return widths[blankIndex % widths.length] return counts[blankIndex % counts.length]
} }
} }
// 处理题目内容，将 **** 替换为双下划线 // 处理题目内容，将 **** 替换为下划线字符
const renderQuestionContent = (content: string) => { const renderQuestionContent = (content: string) => {
if (!content) return content if (!content) return content
@ -187,11 +187,11 @@ const ExamPrint: React.FC = () => {
// 先计算出总共有多少个填空 // 先计算出总共有多少个填空
const totalBlanks = (content.match(/\*{4,}/g) || []).length const totalBlanks = (content.match(/\*{4,}/g) || []).length
// 将所有的 **** 替换为连续的下划线 // 将所有的 **** 替换为下划线字符
processedContent = processedContent.replace(/\*{4,}/g, () => { processedContent = processedContent.replace(/\*{4,}/g, () => {
const width = calculateUnderscoreWidth(blankIndex, totalBlanks) const underscoreCount = calculateUnderscoreCount(blankIndex, totalBlanks)
blankIndex++ blankIndex++
return `<span style="border-bottom: 1px solid #000; margin: 0 1px 1px 1px; display: inline-block; width: ${width}px; height: 0; vertical-align: text-bottom;"></span>` return '_'.repeat(underscoreCount)
}) })
return processedContent return processedContent