feat(Design): 优化题目顺序和索引

- 调整题目移动逻辑，更新题目索引
- 修复新建题目时的索引问题
- 优化选择题目组件，实时更新题目索引
- 调整调查创建页面，初始化时设置题目索引

components.d.ts

@@ -31,12 +31,14 @@ declare module 'vue' {
     VanCol: typeof import('vant/es')['Col']
     VanDivider: typeof import('vant/es')['Divider']
     VanField: typeof import('vant/es')['Field']
+    VanForm: typeof import('vant/es')['Form']
     VanGrid: typeof import('vant/es')['Grid']
     VanGridItem: typeof import('vant/es')['GridItem']
     VanIcon: typeof import('vant/es')['Icon']
     VanList: typeof import('vant/es')['List']
     VanNavBar: typeof import('vant/es')['NavBar']
     VanPicker: typeof import('vant/es')['Picker']
+    VanPopover: typeof import('vant/es')['Popover']
     VanPopup: typeof import('vant/es')['Popup']
     VanRadio: typeof import('vant/es')['Radio']
     VanRadioGroup: typeof import('vant/es')['RadioGroup']

src/views/Design/components/ActionCompoents/QuestionAction.vue

@@ -274,7 +274,6 @@ const questionMove = (action) => {
     questions.value.splice(questionIndex.value, 1);
     questions.value.splice(questionIndex.value + 1, 0, temp);
     emit('move', 'down');
-
     questionIndex.value += 1;
   } else if (action.action === 'up') {
     if (questionIndex.value === 0) {
@@ -295,6 +294,7 @@ const questionMove = (action) => {
     const temp = JSON.parse(JSON.stringify(questions.value[questionIndex.value]));
     const newQuestion = {
       ...temp,
+      title: questionIndex.value + 1,
       id: uuidv4(),
       question_index: questionsInfo.value.survey.last_question_index + 1
     };
@@ -311,8 +311,8 @@ const getSkipTypeText = (skipType) => {
   const ls = [];
   logics.map((item) => {
     if (
-      item.skip_type === skipType
-      && item.question_index === activeQuestion.value.question_index
+      item.skip_type === skipType &&
+      item.question_index === activeQuestion.value.question_index
     ) {
       ls.push(item);
     }
@@ -328,13 +328,13 @@ const getSkipTypeText = (skipType) => {
 
 const questionSetting = (type) => {
   switch (type) {
-  case 'before':
-    questionBeforeShow.value = true;
+    case 'before':
+      questionBeforeShow.value = true;
 
-    break;
-  case 'after':
-    questionBeforeShow.value = true;
-    break;
+      break;
+    case 'after':
+      questionBeforeShow.value = true;
+      break;
   }
   skipType.value = type === 'before' ? 1 : 0;
 };

src/views/Design/components/ChooseQuestion.vue

@@ -41,12 +41,9 @@
 <script setup>
 import QuestionAction from '@/views/Design/components/ActionCompoents/QuestionAction.vue';
 import { basicQuesTypeList } from '@/utils/common.js';
+import { watch } from 'vue';
 
 const props = defineProps({
-  index: {
-    type: Number,
-    default: 0
-  },
   questions: {
     type: Array,
     default: () => []
@@ -66,6 +63,22 @@ const props = defineProps({
     default: true
   }
 });
+const element = defineModel('element', {
+  type: Object,
+  default: () => {
+    return {};
+  }
+});
+const index = defineModel('index', {
+  type: Number
+});
+
+watch(
+  () => index.value,
+  (newVal) => {
+    element.value.title = newVal + 1;
+  }
+);
 
 // 获取题目选项
 const getQuestionType = (type) => {
@@ -78,12 +91,6 @@ const getQuestionType = (type) => {
   return typeName;
 };
 
-const element = defineModel('element', {
-  type: Object,
-  default: () => {
-    return {};
-  }
-});
 // if (props.index + 1 !== Number(element.value.title)) {
 //   element.value.title = props.index + 1;
 // }
@@ -93,7 +100,7 @@ const emit = defineEmits(['getChooseQuestionId', 'move', 'copy', 'setting', 'log
 
 // 选中题目
 const chooseItem = () => {
-  emit('getChooseQuestionId', element.value, props.index);
+  emit('getChooseQuestionId', element.value, index.value);
 };
 </script>
 <style scoped lang="scss">

src/views/Survey/views/Create/Index.vue

@@ -420,25 +420,35 @@ const saveTitle = () => {
 const quesList = ref(basicQuesTypeList);
 
 const questionEvent = (item) => {
+  cons;
+  // 更新坐标
+  let index = questionInfo.value.questions.length + 1;
+  if (activeId.value) {
+    let filterIndex = questionInfo.value.questions.findIndex((item) => {
+      return item.id === activeId.value;
+    });
+    index = filterIndex + 2;
+  }
   let questionJson = {};
   const id = uuidv4();
   questionJson = JSON.parse(
     JSON.stringify({
       ...item.json,
       id,
+      title: index,
       question_type: Number(item.question_type),
       question_index: questionInfo.value.survey.last_question_index + 1,
       options:
         item.json.options.length > 0
           ? item.json.options.map((item) => {
-            return item.map((it) => {
-              return {
-                ...it,
-                // 主键生成
-                id: uuidv4()
-              };
-            });
-          })
+              return item.map((it) => {
+                return {
+                  ...it,
+                  // 主键生成
+                  id: uuidv4()
+                };
+              });
+            })
           : []
     })
   );
@@ -527,9 +537,10 @@ const getQuestionDetail = () => {
   return snQuestions({ sn: route.query.sn }).then((res) => {
     if (res.data) {
       questionInfo.value.survey = Object.assign({}, res.data.data.survey);
-      questionInfo.value.questions = res.data.data.questions.map((item) => {
+      questionInfo.value.questions = res.data.data.questions.map((item, index) => {
         return {
-          ...item
+          ...item,
+          title: index + 1
         };
       });
       questionInfo.value.logics = res.data.data.logics.map((item) => {
@@ -577,7 +588,7 @@ const previewQuestion = () => {
   router.push({ name: 'preview', query: { ...route.query } });
 };
 
-onMounted(async() => {
+onMounted(async () => {
   await getQuestionDetail();
 });
 </script>