【修改】 wps出题样式优化，错误提示去除

src/views/paper/question/WpsPptxForm.vue

@@ -139,9 +139,10 @@
                       v-loading="loading"
                       :data="list"
                       @selection-change="handleSelectionChange"
+                      style="width: 100%"
                     >
                       <!-- <el-table-column type="selection" width="55" /> -->
-                      <el-table-column label="考点" align="center" prop="contentIn" width="360px" />
+                      <el-table-column label="考点" align="center" prop="contentIn"/>
                       <el-table-column label="权值" align="center" prop="scoreRate" width="100px" />
                       <el-table-column label="操作" align="center" width="100px">
                         <template #default="scope">
@@ -283,7 +284,10 @@
     <input type="file" id="slideFile" accept=".pptx" />
     <button @click="getSlideDataInfo">文件解析</button>
     <div style="height: 400px; overflow: hidden; display: flex; gap: 16px">
-      <div style="flex: 0.5; overflow: auto; border: 1px solid #eee; padding: 8px">
+      <div
+        class="tree-wrap"
+        style="flex: 0.5; overflow: auto; border: 1px solid #eee; padding: 8px"
+      >
         <h3>考点</h3>
         <el-tree
           style="max-width: 600px"
@@ -294,18 +298,17 @@
         />
       </div>
 
-      <div style="flex: 1.5; overflow: auto; border: 1px solid #eee; padding: 8px">
+      <div style="flex: 1.5; overflow: auto; border: 1px solid #eee; padding: 8px; width: 90%;">
         <h3>考点详情</h3>
         <el-table :data="list" style="width: 100%">
-          <el-table-column prop="contentIn" label="值" width="500px" />
-
-          <el-table-column prop="scoreRate" label="权值" width="100">
+          <el-table-column prop="contentIn" label="值" />
+          <el-table-column prop="scoreRate" label="权值" width="100px">
             <template #default="{ row }">
-              <el-input v-model="row.scoreRate" size="small" style="width: 40px" />
+              <el-input v-model="row.scoreRate" size="small" style="width: 50px" />
             </template>
           </el-table-column>
 
-          <el-table-column label="操作" width="100">
+          <el-table-column label="操作" width="100px">
             <template #default="{ row }">
               <span
                 @click="removePoint(row)"
@@ -318,11 +321,15 @@
         </el-table>
       </div>
     </div>
-
     <!-- <el-skeleton :rows="5" animated v-if="pptxPointsList.length < 0 && isLoading" />
      -->
   </el-dialog>
-  <el-dialog v-model="dialogFormVisiblePptxInfos" :title="titles" width="300px" class="fixed-dialog-height">
+  <el-dialog
+    v-model="dialogFormVisiblePptxInfos"
+    :title="titles"
+    width="300px"
+    class="fixed-dialog-height"
+  >
     <div class="dialog-scroll-content">
       <el-tree
         style="max-width: 600px"
@@ -348,6 +355,7 @@ import { defaultProps, handleTree } from '@/utils/tree'
 import { FormRules } from 'element-plus'
 import { cloneDeep } from 'lodash-es'
 import FileForm from './components/FileForm.vue'
+import { ElLoading } from 'element-plus'
 
 defineOptions({ name: 'WpsPptxFrom' })
 const pptxPointsList = ref<Tree[]>([]) // 树形结构
@@ -408,12 +416,12 @@ const formData = ref({
 
 // 定义 pptxPoints 类型
 interface PptxPoints {
-  firstName: string;
-  slideIndex: string;
-  function: string;
-  examName: string;
-  examCode: string;
-  method?: string;
+  firstName: string
+  slideIndex: string
+  function: string
+  examName: string
+  examCode: string
+  method?: string
 }
 let pptxPointsInfosList: PptxPoints[] = []
 const removePoint = (row) => {
@@ -477,18 +485,29 @@ const handleCheckChange = (data: any, _checked: boolean, _indeterminate: boolean
   }
 }
 const file = ref()
+
 // 获取slide文件，并使用文件流进行解析
 const getSlideDataInfo = async () => {
   const fileInput = document.getElementById('slideFile') as HTMLInputElement
   if (fileInput != null) {
-    if (fileInput.files && fileInput.files[0]) {
-      file.value = fileInput.files[0]
-    } else {
-      return
+    const loading = ElLoading.service({
+      target: '.tree-wrap', // 只遮罩左侧树区域
+      text: '正在读取考点…',
+      background: 'rgba(255,255,255,0.6)'
+    })
+    try {
+      if (fileInput.files && fileInput.files[0]) {
+        file.value = fileInput.files[0]
+      } else {
+        loading.close()
+        return
+      }
+      const res = await PptxApi.getSlideDataInfo({ file: file.value })
+      pptxPointsList.value = []
+      pptxPointsList.value.push(...handleTree(res.data))
+    } finally {
+      loading.close()
     }
-    const res = await PptxApi.getSlideDataInfo({ file: file.value })
-    pptxPointsList.value = []
-    pptxPointsList.value.push(...handleTree(res.data))
   }
 }
 
@@ -505,10 +524,10 @@ const textIndex = ref()
 const handleNodelClick = async (row: any) => {
   console.log(row)
   if (!row.click) {
-    return 
+    return
   }
   // 获取名称
-  chineseName.value = '【' + row.belongTo +'】【' + row.name + '】'
+  chineseName.value = '【' + row.belongTo + '】【' + row.name + '】'
   textIndex.value = row.index
   const res = await PptxApi.getSlideByNameList(row.type)
   pptxPointsInfoList.value = []
@@ -535,14 +554,14 @@ const submitPptxPoints = async () => {
   for (let i = 0; i < res.data.length; i++) {
     var indexFlag = false
     for (let x = 0; x < list.value.length; x++) {
-      list.value[x].scoreRate='1'
+      list.value[x].scoreRate = '1'
       if (res.data[i].content == list.value[x].content) {
         // 如果存在相同的数据话 不进入
         indexFlag = true
       }
     }
     if (!indexFlag) {
-      (res.data[i] as any).sort = list.value.length + 1
+      ;(res.data[i] as any).sort = list.value.length + 1
       list.value.push(res.data[i])
     }
   }
@@ -576,7 +595,8 @@ const submitPptxPoints = async () => {
   // pptxPointsList.value = []
 }
 const formRules = reactive<FormRules>({
-  status: [{ required: true, message: '启用状态必填', trigger: 'blur' }]
+  status: [{ required: true, message: '启用状态必填', trigger: 'blur' }],
+  pointNames: [{ required: true, message: '知识点必填', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
 // 左侧试题描述
@@ -638,7 +658,7 @@ const deleteUrl = (index: number) => {
 const handleUploadSuccess = ({ url, fileType }) => {
   const index = documentList.value.findIndex((item) => item.fileType === fileType)
   if (index !== -1) {
-    documentList.value[index].url = url1
+    documentList.value[index].url = url
   }
 }
 /** 打开弹窗 */
@@ -654,8 +674,8 @@ const open = async (queryParams: any, type: string, id?: number) => {
       const res = await QuestionApi.getQuestion(id)
       formData.value = res
       console.log(formData.value)
-  list.value = formData.value.answerList as any[]
-  documentList.value = res.fileUploads as any[]
+      list.value = formData.value.answerList as any[]
+      documentList.value = res.fileUploads as any[]
     } finally {
       formLoading.value = false
     }
@@ -976,7 +996,7 @@ const openPoints = async () => {
   padding: 0 20px 20px 20px;
 }
 .dialog-scroll-content {
-  height: 400px;
+  height: 350px;
   overflow-y: auto;
 }
 </style>