style(components): 优化富文本编辑器和条款预览的样式- 在 Editor 组件中添加了 .editor .ql-editor 的样式，以优化文本编辑区域的换行和单词断行

- 在 ofService 组件中调整了对话框宽度
- 在 tournaments 组件中注释掉了查看对局记录按钮
- 在 policy 和 ofService 的预览组件中，添加了处理长文本内容的样式和方法，以提高可读性

src/components/Editor/index.vue

@@ -241,4 +241,9 @@ const handleUploadError = (err: any) => {
 .ql-snow .ql-picker.ql-font .ql-picker-item[data-value='monospace']::before {
   content: '等宽字体';
 }
+
+.editor .ql-editor {
+  white-space: pre-wrap; /* 强制换行 */
+  word-break: break-all; /* 防止长单词或URL溢出 */
+}
 </style>

src/views/system/business/ofService/index.vue

@@ -66,7 +66,7 @@
       <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
     </el-card>
     <!-- 添加或修改使用条款管理对话框 -->
-    <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
+    <el-dialog :title="dialog.title" v-model="dialog.visible" width="600px" append-to-body>
       <el-form ref="ofServiceFormRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="条款标题" prop="title">
           <el-input v-model="form.title" placeholder="请输入条款标题" />

src/views/system/business/ofService/indexPreview.vue

@@ -21,15 +21,43 @@ onMounted(() => {
 const fetchTos = async () => {
   try {
     const res = await getTermsServiceListMax();
-    tosContent.value = DOMPurify.sanitize(res.data.content);
+    // 处理获取到的内容，确保格式良好
+    const formattedContent = handleLineBreaks(res.data.content);
+    tosContent.value = DOMPurify.sanitize(formattedContent);
   } catch (error) {
     console.error('获取服务条款失败', error);
   }
 };
+
+// 确保文本内容中适当的换行符
+const handleLineBreaks = (content: string): string => {
+  let formattedContent = content.replace(/\s+/g, ' ');
+  // 在每80个非空白字符后插入一个<br>标签以强制换行
+  formattedContent = formattedContent.replace(/(\S{80})/g, '$1<br>');
+  return formattedContent;
+};
 </script>
 
 <style scoped>
 .tos-container {
   padding: 20px;
+  word-break: break-word; /* 强制长单词换行 */
+}
+
+/* 针对卡片内部内容的样式 */
+.tos-container div {
+  word-break: break-word;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .tos-container {
+    padding: 15px; /* 减少内边距 */
+  }
+
+  .el-card {
+    width: 100%; /* 占满父容器宽度 */
+    margin: 0 auto; /* 居中对齐 */
+  }
 }
 </style>

src/views/system/business/policy/indexPolicyPreview.vue

@@ -21,15 +21,39 @@ onMounted(() => {
 const fetchTos = async () => {
   try {
     const res = await getPrivacyPolicyListMax();
-    tosContent.value = DOMPurify.sanitize(res.data.content);
+    tosContent.value = DOMPurify.sanitize(handleLineBreaks(res.data.content));
   } catch (error) {
     console.error('获取服务条款失败', error);
   }
 };
+
+const handleLineBreaks = (content: string): string => {
+  let formattedContent = content.replace(/\s+/g, ' ');
+  formattedContent = formattedContent.replace(/(\S{80})/g, '$1<br>');
+  return formattedContent;
+};
 </script>
 
 <style scoped>
 .tos-container {
   padding: 20px;
+  word-break: break-all;
+  white-space: pre-wrap;
+}
+
+.tos-container div {
+  word-break: break-all;
+  white-space: pre-wrap;
+}
+
+@media (max-width: 768px) {
+  .tos-container {
+    padding: 10px;
+  }
+
+  .el-card {
+    width: 100%;
+    margin: 0 auto;
+  }
 }
 </style>

src/views/system/business/tournaments/index.vue

@@ -359,9 +359,9 @@
       @close="cancelAudit"
     >
       <!-- 查看对局记录按钮 -->
-      <div class="dialog-header-actions" v-if="auditDialog.mode === 'view'">
+<!--      <div class="dialog-header-actions" v-if="auditDialog.mode === 'view'">
         <el-button type="primary">查看对局记录</el-button>
-      </div>
+      </div>-->
 
       <!-- 比赛信息展示 -->
       <div class="tournament-info" v-if="tournamentInfo.id">