导出样式调整

src/views/prison/questionnairerecord/QuestionnaireOutputfile.vue

@@ -40,7 +40,7 @@
               class="question-item"
             >
               <span class="question-index">{{ index + 1 }}.</span>
-              <span class="question-title">{{ questionWithAnswer.question.title }}</span>
+              <span class="question-title">{{ questionWithAnswer.question.title }}：</span>
 
               <!-- 帮助说明 -->
               <span v-if="questionWithAnswer.question.helpText" class="question-help-inline">
@@ -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;
 }
 </style>