update

src/components/pages/easy/addCourse.vue

@@ -230,7 +230,10 @@
                             item.taskJson[0].chapterData.length == 0
                             "><img src="../../../assets/icon/new/c_none.png" alt /><span>请添加学习内容</span></div>
                           <div v-else class="add_chapters_box" style="display: flex; flex-direction: column">
-                            <div class="chapter_upload" v-for="(item1, index1) in item.taskJson[0]
+                            <div @dragstart="dragStart(item1, index1,index)"
+                              @dragover.prevent="dragOver(index1)"
+                              @dragend="dragEnd()"
+                              draggable class="chapter_upload" v-for="(item1, index1) in item.taskJson[0]
                               .chapterData" :key="item1.id" @click="
     getChapterData(
       $event,
@@ -240,6 +243,9 @@
       item1.type
     )
     ">
+                                  <div
+                                class="chapter_upload_drag"
+                              ></div>
                               <div class="chapter_upload_t" style="width: 100%"></div>
                               <div class="chapter_upload_o" style="
                                   position: relative;
@@ -9567,6 +9573,24 @@ export default {
         // }, 0);
       }
     },
+    dragStart(val, i, j) {
+      this.taskCount = j
+      this.oldIndex = i;
+      this.oldData = val;
+    },
+    dragOver(i) {
+      this.newIndex = i;
+    },
+    dragEnd() {
+      let newItems = [...this.unitJson[this.unitIndex].chapterInfo[0].taskJson[this.taskCount].chapterData];
+      // 删除老的节点
+      newItems.splice(this.oldIndex, 1);
+      // 在列表中目标位置增加新的节点
+      newItems.splice(this.newIndex, 0, this.oldData);
+      this.unitJson[this.unitIndex].chapterInfo[0].taskJson[this.taskCount].chapterData = [...newItems];
+      this.newIndex = "";
+      this.$forceUpdate()
+    },
   },
   beforeDestroy() {
     clearTimeout(this.timer);
@@ -10642,6 +10666,17 @@ export default {
   box-sizing: border-box;
 }
 
+.chapter_upload_drag{
+  position: absolute;
+  cursor: pointer;
+  width: 16px;
+  height: 16px;
+  left: -9px;
+  background-image: url("../../../assets/icon/new/icon_course_drag.png");
+  background-size: 100% 100%;
+  z-index: 10;
+}
+
 .chapter_upload_t {
   background-color: #fff;
   position: absolute;