Bläddra i källkod

完善试题页的新增/修改逻辑

lm 1 månad sedan
förälder
incheckning
d3bb13cda9
2 ändrade filer med 69 tillägg och 28 borttagningar
  1. 8 8
      src/components/QuestionTypeShow.vue
  2. 61 20
      src/views/surveyManagement/CreateQuestionnaire.vue

+ 8 - 8
src/components/QuestionTypeShow.vue

@@ -4,9 +4,9 @@
         v-if="[0,3].includes(Number(questionType))" 
         :class="{vertical:!isHorizontal}"> 
         <el-radio v-for="radioItem in questionSubOptions" 
-            :key="radioItem.value" 
-            :value="radioItem.value"
-        >{{ radioItem.label }}</el-radio>
+            :key="radioItem.id" 
+            :value="radioItem.id"
+        >{{ radioItem.content }}</el-radio>
     </el-radio-group>
         
     <!-- 多选 -->
@@ -16,9 +16,9 @@
 
         <el-checkbox 
             v-for="checkItem in questionSubOptions" 
-            :key="checkItem.value"
-            :label="checkItem.label"
-            :value="checkItem.value"
+            :key="checkItem.id"
+            :label="checkItem.content"
+            :value="checkItem.id"
         />
     </el-checkbox-group>
 
@@ -52,9 +52,9 @@
 <script setup lang="ts">
 
 interface Option {
-    label: String
+    content: String
     score?: String
-    value?: Number
+    id?: Number
 }
 const props = defineProps({
     questionType:{  //题目展示类型  单选0/多选1/问答2/评分单选3 / 评分题4

+ 61 - 20
src/views/surveyManagement/CreateQuestionnaire.vue

@@ -136,9 +136,9 @@ import {addQuestionnaireApi} from '@/api/surveyManagement'
 
 // 题目选项信息 参数
 interface Option {
-    label: String
+    content: String
     score?: String
-    value?: Number
+    id?: Number
 }
 // 题目信息 参数
 interface QuestionItm {
@@ -179,7 +179,27 @@ const addedQuestionList = ref<QuestionItm[]>([
         extraConfig:[],    // 是否必答 required, 是否横排 isHorizontal
         options: [] ,
         evaluationType:''
-    }
+    },
+    {
+        id:1,
+        questionTitleName: '测试',   //题目名称
+        questionScore: 20,  //题目分值
+        questionType: '0',   //题目类型
+        extraConfig:[],    // 是否必答 required, 是否横排 isHorizontal
+        options: [
+            {
+                content: '单选测试1',
+                score: '',
+                id:1
+            },
+            {
+                content: '单选测试2',
+                score: '',
+                id:1
+            },
+        ] ,
+        evaluationType:''
+    },
 ])
 
 // 默认的试题信息
@@ -206,8 +226,10 @@ const questionTotalScore = computed(()=>{
     },{questionScore:0}).questionScore
 })
 
+// 当前选择修改的题目 id
+const currentEditQuestionId = ref()
 
-// 选中题型时的处理
+// 选中题型时的处理  
 const CheckedQuestionType = (type:any) => {
     console.log('触发操作了',type)
     selectedQuestionType.value = type
@@ -242,10 +264,12 @@ const resetQuestionForm = (questionType)=>{
         evaluationType:0  //默认展示 数字式
     }
 }
+// 表单数据触发变化了
 const HandleQuestionChange = (params)=>{
     const { key, val, formData: data } = params
     switch(key){
         case 'question_type':{
+            console.log('表单重置了--')
             resetQuestionForm(val)
         }
     }
@@ -256,41 +280,58 @@ const { HandleDragStart, HandleDragEnd } = useHandleMoveUpAndDown(addedQuestionL
 
 
 const addedIndex = ref(1)
-// 添加试题信息
+// 添加/修改 试题信息
 const AddQuesiton = (params)=>{
     const {formRef,formData} = params
     console.log('获取到试题信息了',formData)
-
-    // 不能用最后一个id来添加
-    let id = addedIndex.value + 1
-    addedIndex.value += 1
-    
-    let options = formData.options.map(item=>{
+    // 试题选项配置 _如果有的话
+     let options = formData?.options?.map(item=>{
         return {
-            label:item.content,
-            value:item.id,
+            content:item.content,
+            id:item.id,
             score:item.score
         }
-    })
-    addedQuestionList.value.push({id ,...formData,options})
+    }) || []
+    if(currentEditQuestionId.value){
+        // 修改试题
+        addedQuestionList.value  = addedQuestionList.value.map(item=>{
+            if(item.id == currentEditQuestionId.value){
+                return {
+                    ...formData,
+                    options
+                }
+            }else{
+                return item
+            }
+        })
+        currentEditQuestionId.value = ''
+    }else{
+        // 新增试题
+        // 不能用最后一个id来添加
+        let id = addedIndex.value + 1
+        addedIndex.value += 1
+        addedQuestionList.value.push({id ,...formData,options})
+    }
     formRef.resetFields()
     selectedQuestionType.value = ''
 }
 
 
 
+// 删除当前题目
 const DeleteQuestion = (row)=>{
-    // 删除当前题目
     addedQuestionList.value = addedQuestionList.value.filter(item=>{
         return item.id !== row.id   
     })
 }
-const EditQuestion = (row)=>{
 
+// 修改选择的题目
+const EditQuestion = (row)=>{
     console.log('当前编辑的行',row)
-    // 待完善
-    defaultQuestionData.value = row
+    currentEditQuestionId.value = row.id  
+    // 先后顺序不要反
     CheckedQuestionType(row.questionType)
+    defaultQuestionData.value = row
 }
 
 // 保存试卷
@@ -312,7 +353,7 @@ const SaveQuestionnaire = async ()=>{
                         answerData:item.options.map((opt,optIndex)=>{
                             return {
                                 questionSortCode: optIndex + 1,
-                                answerName: opt.label,
+                                answerName: opt.content,
                                 answerScore: opt.score
                             }
                         })