diff --git a/src/views/prison/questionnairerecord/QuestionnaireOutputfile.vue b/src/views/prison/questionnairerecord/QuestionnaireOutputfile.vue index 409143c6..7384449b 100644 --- a/src/views/prison/questionnairerecord/QuestionnaireOutputfile.vue +++ b/src/views/prison/questionnairerecord/QuestionnaireOutputfile.vue @@ -40,7 +40,7 @@ class="question-item" > {{ index + 1 }}. - {{ questionWithAnswer.question.title }} + {{ questionWithAnswer.question.title }}: @@ -243,8 +243,9 @@ const getAnswerByQuestionId = (questionId: number): Answer | undefined => { /** 获取答案显示值(兼容不同字段名) */ const getAnswerDisplayValue = (answer?: Answer): string => { if (!answer) return '' - // 优先使用 answerText,其次使用 optionIds - return answer.answerText || answer.optionIds || '-' + // 优先使用 answerText,其次使用 optionIds,并去除前后空格和特殊字符 + const value = answer.answerText || answer.optionIds || '' + return String(value).trim().replace(/^["']|["']$/g, '') } /** 问卷类型标签 */ @@ -386,7 +387,11 @@ const exportToWord = async () => { } // 获取预览容器的HTML内容 - const previewHTML = previewRef.value.innerHTML + let previewHTML = previewRef.value.innerHTML + + // 清理可能导致WPS显示引号的特殊字符 + previewHTML = previewHTML.replace(/[\u201C\u201D\u2018\u2019]/g, '') // 移除中文引号 + previewHTML = previewHTML.replace(/^["']|["']$/gm, '') // 移除行首尾的引号 // 构建完整的HTML文档,使用与预览页面一致的样式 const fullHTML = ` @@ -399,7 +404,6 @@ const exportToWord = async () => { body { font-family: 'Microsoft YaHei', '微软雅黑', SimSun, Arial, sans-serif; font-size: 11pt; - line-height: 1.5; margin: 15pt; padding: 15pt; } @@ -419,13 +423,15 @@ const exportToWord = async () => { } .description-content { color: #000; - line-height: 1.5; font-size: 11pt; + margin-bottom: 6pt; + line-height: 1.5; } .instruction-content { color: #000; font-size: 11pt; font-weight: 500; + margin-bottom: 6pt; line-height: 1.5; } .partition-title { @@ -446,6 +452,7 @@ const exportToWord = async () => { .question-item { font-size: 11pt; color: #000; + margin-bottom: 8pt; line-height: 1.5; page-break-inside: avoid; } @@ -534,99 +541,99 @@ defineExpose({ open, exportToWord }) } h1 { + font-family: 'Microsoft YaHei', '微软雅黑', SimSun, Arial, sans-serif; + font-size: 18pt; font-weight: 500; color: #000; text-align: center; } .section-title { - margin: 15px 0; - font-size: 16px; - font-weight: 500; + font-family: 'Microsoft YaHei', '微软雅黑', SimSun, Arial, sans-serif; + margin-bottom: 15pt; + font-size: 18pt; + font-weight: 700; color: #000; } .description-content { color: #000; - line-height: 1.8; - font-size: 14px; + line-height: 3; + font-size: 11pt; } .instruction-content { color: #000; - font-size: 16px; + font-size: 11pt; font-weight: 500; - line-height: 1.8; + line-height: 3; } .partition-title { - margin-bottom: 16px; - margin-top: 24px; + margin-top: 15pt; color: #000; - font-size: 15px; + font-size: 15pt; font-weight: 500; } .partition-title:first-child { margin-top: 0; } .question-count { - font-size: 12px; + font-size: 11pt; color: #909399; font-weight: normal; - margin-left: 4px; + margin-left: 2pt; } .question-item { - font-size: 14px; + font-size: 11pt; color: #000; - line-height: 1.6; - margin-bottom: 16px; + line-height: 3; page-break-inside: avoid; } .question-index { - margin-right: 4px; + margin-right: 2pt; } .question-title { - margin-right: 8px; + margin-right: 4pt; } .question-help-inline { display: inline-flex; align-items: center; - gap: 6px; + gap: 3pt; color: #909399; - font-size: 13px; - padding: 4px 8px; + font-size: 11pt; background: #f4f4f5; - border-radius: 4px; - margin-right: 8px; + border-radius: 2pt; + margin-right: 6pt; } .question-options-inline { display: inline-flex; flex-wrap: wrap; - gap: 12px; + gap: 8pt; align-items: center; } .option-item { display: inline-flex; align-items: center; - gap: 8px; + gap: 3pt; } .question-rating-inline, .question-date-inline, .question-number-inline { display: inline-flex; align-items: center; - gap: 12px; + gap: 8pt; flex-wrap: wrap; - margin-left: 8px; + margin-left: 3pt; } .rating-info, .date-info, .number-info { display: inline-flex; - gap: 16px; + gap: 11pt; color: #909399; - font-size: 13px; + font-size: 11pt; } .question-input-inline { color: #000; - font-size: 14px; - line-height: 2.2; + font-size: 11pt; + line-height: 3; text-decoration: underline; }