fix: 修改拖拽

src/views/apps/customer-app/crowd-scene.vue

@@ -4,7 +4,7 @@
  * @Author: 无尘
  * @Date: 2020-08-27 10:16:37
  * @LastEditors: 无尘
- * @LastEditTime: 2020-08-28 15:05:54
+ * @LastEditTime: 2020-09-02 18:02:15
  -->
 
 <template>
@@ -25,7 +25,13 @@
       <div class="crowd-scene-table_left">
         <el-table
           :data="memberCrowdData"
+          ref="memberCrowdData"
           style="width: 100%">
+          <el-table-column prop="" label="" width="56" class-name="move-row-cell">
+            <template>
+              <span class="font-22 iconfont icontuozhuaiopen color-c0c4cc" style="cursor: move;"></span>
+            </template>
+          </el-table-column>
           <el-table-column
             prop=""
             label="人群名称"
@@ -78,8 +84,9 @@
 import commonAlertTip from '@/components/common/common-alert-tip.vue';
 import fetch from '@/api/my-customer-app.js';
 const { getGroupData, getClassifyData, postSortGroup } = fetch;
-import { _debounce } from '@/common/js/public';
-import showMsg from '@/common/js/showmsg';
+import { _debounce } from '@/common/js/public.js';
+import showMsg from '@/common/js/showmsg.js';
+import Sortable from 'sortablejs';
 export default {
   name: 'CrowdScenePage',
   components: { commonAlertTip },
@@ -106,6 +113,7 @@ export default {
     if (!!that.brandId) {
       that.getGroupList();
     }
+    that.rowDrop('memberCrowdData');
   },
   // methods
   methods: {
@@ -151,84 +159,24 @@ export default {
       that.getGroupList();
     },
     /**
-     * @description: 置顶 先删除后追加首部
-     * @param {Number} index
-     * @param {Object} row
-     * @param {Array} arr
-     * @returns {Boolean}
-     * @author: 无尘
-     */
-    toTop(index, row, arr ) {
-      const that = this;
-      if (index == 0) {
-        return false;
-      }
-      let newTable = JSON.parse(JSON.stringify(arr));
-      newTable.splice(index, 1);
-      newTable.unshift(row);
-      // 保存设置
-      that.setSort();
-    },
-    /**
-     * @description: 向上
-     * @param {Number} index
-     * @param {Object} row
-     * @param {Array} arr
-     * @returns {Boolean}
-     * @author: 无尘
-     */
-    toPre(index, row, arr) {
-      const that = this;
-      if (index == 0) {
-        return false;
-      }
-      let newTable = JSON.parse(JSON.stringify(arr));
-      let temp = {};
-      temp = newTable[index - 1];
-      newTable[index - 1] = row;
-      newTable[index] = temp;
-      // 保存设置
-      that.setSort();
-    },
-    /**
-     * @description: 向下
-     * @param {Number} index
-     * @param {Object} row
-     * @param {Array} arr
-     * @returns {Boolean}
+     * @description: 拖拽排序
+     * @param {String} data
      * @author: 无尘
      */
-    toNext(index, row, arr) {
+    rowDrop(data) {
+      const tbody = this.$refs[data].$el.querySelectorAll('.el-table__body-wrapper > table > tbody')[0];
       const that = this;
-      if (index == arr.length - 1) {
-        return false;
-      }
-      let newTable = JSON.parse(JSON.stringify(arr));
-      let temp = {};
-      temp = newTable[index + 1];
-      newTable[index + 1] = row;
-      newTable[index] = temp;
-      // 保存设置
-      that.setSort();
-    },
-    /**
-     * @description: 置底 先删除后追加尾部
-     * @param {Number} index
-     * @param {Object} row
-     * @param {Array} arr
-     * @returns {Boolean}
-     * @author: 无尘
-     */
-    toBottom(index, row, arr) {
-      const that = this;
-      if (index == arr.length - 1) {
-        return false;
-      }
-      let newTable = JSON.parse(JSON.stringify(arr));
-      newTable.splice(index, 1);
-      newTable.push(row);
-      // 保存设置
-      that.setSort();
+      Sortable.create(tbody, {
+        onEnd({ newIndex, oldIndex }) {
+          if (newIndex == oldIndex) {
+            return false;
+          }
+          let arr = JSON.parse(JSON.stringify(that[data]));
+          const currRow = arr.splice(oldIndex, 1)[0];
+          arr.splice(newIndex, 0, currRow);
+          that.setSort(arr);
+        }
+      });
     },
     setSort() {
       const that = this;

src/views/apps/customer-app/data-dimension.vue

@@ -4,7 +4,7 @@
  * @Author: 无尘
  * @Date: 2020-08-27 11:36:51
  * @LastEditors: 无尘
- * @LastEditTime: 2020-09-02 10:09:36
+ * @LastEditTime: 2020-09-02 18:00:03
 -->
 
 <template>
@@ -30,7 +30,7 @@
           style="width: 100%">
           <el-table-column prop="" label="" width="56" class-name="move-row-cell show-icon">
             <template>
-              <span class="font-22 iconfont icontuozhuaiopen color-c4c6cf" style="cursor: move;"></span>
+              <span class="font-22 iconfont icontuozhuaiopen color-c0c4cc" style="cursor: move;"></span>
             </template>
           </el-table-column>
           <el-table-column
@@ -57,7 +57,7 @@
           style="width: 100%">
           <el-table-column prop="" label="" width="56" class-name="move-row-cell show-icon">
             <template>
-              <span class="font-22 iconfont icontuozhuaiopen color-c4c6cf" style="cursor: move;"></span>
+              <span class="font-22 iconfont icontuozhuaiopen color-c0c4cc" style="cursor: move;"></span>
             </template>
           </el-table-column>
           <el-table-column