From 419e5741c62e1760559ba54fc0bb3e17500418d9 Mon Sep 17 00:00:00 2001
From: maojianhui <3605828735@qq.com>
Date: Thu, 10 Oct 2024 16:37:51 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E7=BC=96?=
 =?UTF-8?q?=E8=BE=91=E9=97=AE=E5=8D=B7=E7=95=8C=E9=9D=A2=E6=8B=96=E5=8A=A8?=
 =?UTF-8?q?=E6=93=8D=E4=BD=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/DetailInfo/index.vue | 22 ++++++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/pages/DetailInfo/index.vue b/src/pages/DetailInfo/index.vue
index 82f06b6..99d53bd 100644
--- a/src/pages/DetailInfo/index.vue
+++ b/src/pages/DetailInfo/index.vue
@@ -100,6 +100,13 @@
               group="people"
               @update="onUpdate"
           >-->
+          <VueDraggable 
+            v-model="question"
+            :animation="300" 
+            ghost-class="ghost"
+            @end="updateQuestionSerialNumbers"
+          >
+          
           <div v-for="q in question" :key="q.serial_num" >
             <!-- 根据问题类型渲染组件 -->
             <div v-if="q.question_type === 1">
@@ -148,7 +155,7 @@
               </el-skeleton>
             </div>
           </div>
-          <!--</VueDraggable>-->
+          </VueDraggable>
         </div>
         <div class="flex justify-center items-center gap-160 mt-20">
           <button class="btn btn-success dark:opacity-75 dark:text-white"
@@ -425,8 +432,19 @@ const submit = (state:number) => {
   });
 };**/
 
+//导入可拖动组件
+import {VueDraggable} from 'vue-draggable-plus';
+//修改serial_num
+const updateQuestionSerialNumbers = () => {
+  question.value.forEach((q, index) => {
+    q.serial_num = index + 1;
+  });
+}
+
 </script>
 
 <style scoped>
-
+.ghost {
+  opacity: 0.4;
+}
 </style>

From 0074025cb22dc08b74a8852599bb8e48d237dd07 Mon Sep 17 00:00:00 2001
From: maojianhui <3605828735@qq.com>
Date: Sun, 13 Oct 2024 23:45:33 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E4=BA=86=E6=8B=96?=
 =?UTF-8?q?=E6=8B=BD=E5=90=8E=E6=98=BE=E7=A4=BA=E9=94=99=E8=AF=AF=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                   |  1 +
 src/pages/DetailInfo/index.vue | 18 +++++++++++++-----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index fe03863..6ecfedc 100644
--- a/package.json
+++ b/package.json
@@ -29,6 +29,7 @@
     "unplugin-auto-import": "^0.18.3",
     "unplugin-vue-components": "^0.27.4",
     "vue": "^3.4.26",
+    "vue-draggable-next": "^2.2.1",
     "vue-hooks-plus": "^2.2.1",
     "vue-router": "^4.3.2"
   },
diff --git a/src/pages/DetailInfo/index.vue b/src/pages/DetailInfo/index.vue
index 99d53bd..1696b28 100644
--- a/src/pages/DetailInfo/index.vue
+++ b/src/pages/DetailInfo/index.vue
@@ -100,7 +100,7 @@
               group="people"
               @update="onUpdate"
           >-->
-          <VueDraggable 
+          <VueDraggableNext 
             v-model="question"
             :animation="300" 
             ghost-class="ghost"
@@ -155,7 +155,7 @@
               </el-skeleton>
             </div>
           </div>
-          </VueDraggable>
+          </VueDraggableNext>
         </div>
         <div class="flex justify-center items-center gap-160 mt-20">
           <button class="btn btn-success dark:opacity-75 dark:text-white"
@@ -223,6 +223,7 @@ import radio from "@/pages/DetailInfo/radio.vue";
 import SkeletonCard from "@/pages/DetailInfo/skeletonCard.vue";
 import router from "@/router";
 import {closeLoading, startLoading} from "@/utilities";
+import {VueDraggableNext} from "vue-draggable-next"
 
 const selectedOption = ref(1);
 const selectedNumber = ref(1);
@@ -343,6 +344,12 @@ const addQuestion = () => {
     unique: setting.isUnique,
   });
 
+  question.value.forEach((q, index) => {
+    q.serial_num = index + 1;
+  });
+
+  console.log(question.value)
+
   // 等待 DOM 更新完成后再执行滚动
   nextTick(() => {
     if (questionnaireContainer.value) {
@@ -357,7 +364,7 @@ const cleanReg = () => {
 watch(selectedOption, cleanReg);
 
 const deleteQuestion = (serial_num: number) => {
-  console.log(serial_num);
+  // console.log(serial_num);
     question.value = question.value.filter((item) => item.serial_num !== serial_num);
     question.value.forEach((item) => {
       if (item.serial_num > serial_num) {
@@ -370,7 +377,7 @@ const dataReverse = () => {
   submitData.value = deepCopy(formData.value);
   question.value = deepCopy(formData.value.questions);
   time.value = submitData.value.time
-  console.log(question.value);
+  // console.log(question.value);
   ElNotification.success('成功放弃修改');
   showModal('reverseQuestionnaireSubmit',true)
   router.push('/admin')
@@ -379,7 +386,7 @@ const dataReverse = () => {
 const submit = (state:number) => {
   submitData.value.time = time.value
   submitData.value.questions = question.value;
-  console.log(question.value);
+  // console.log(question.value);
   if(isNew === 'false') {
     useRequest(() => setQuestionnaireDetailAPI(submitData.value), {
       onBefore: () => startLoading(),
@@ -439,6 +446,7 @@ const updateQuestionSerialNumbers = () => {
   question.value.forEach((q, index) => {
     q.serial_num = index + 1;
   });
+  console.log(question.value)
 }
 
 </script>