From a2b594c96286ec5d660d8d64f8a3768d4853e830 Mon Sep 17 00:00:00 2001
From: lzdjack <51448229+lzdjack@users.noreply.github.com>
Date: Sat, 18 Dec 2021 22:23:42 +0800
Subject: [PATCH] fix: Fix the problem that the table setting menu cannot be
 dragged (#1503)

---
 .../src/components/settings/ColumnSetting.vue  | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/components/Table/src/components/settings/ColumnSetting.vue b/src/components/Table/src/components/settings/ColumnSetting.vue
index b2506dbe9..56c042f9d 100644
--- a/src/components/Table/src/components/settings/ColumnSetting.vue
+++ b/src/components/Table/src/components/settings/ColumnSetting.vue
@@ -117,14 +117,16 @@
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useTableContext } from '../../hooks/useTableContext';
   import { useDesign } from '/@/hooks/web/useDesign';
-  import { useSortable } from '/@/hooks/web/useSortable';
+  // import { useSortable } from '/@/hooks/web/useSortable';
   import { isFunction, isNullAndUnDef } from '/@/utils/is';
   import { getPopupContainer as getParentContainer } from '/@/utils';
   import { cloneDeep, omit } from 'lodash-es';
+  import Sortablejs from 'sortablejs';
+  import type Sortable from 'sortablejs';
 
   interface State {
     checkAll: boolean;
-    isInit: boolean;
+    isInit?: boolean;
     checkedList: string[];
     defaultCheckList: string[];
   }
@@ -158,7 +160,7 @@
       let inited = false;
 
       const cachePlainOptions = ref<Options[]>([]);
-      const plainOptions = ref<Options[]>([]);
+      const plainOptions = ref<Options[] | any>([]);
 
       const plainSortOptions = ref<Options[]>([]);
 
@@ -267,9 +269,9 @@
         });
         setColumns(checkedList);
       }
-      
-      let sortable = null;
-      let sortableOrder = [];
+
+      let sortable: Sortable;
+      let sortableOrder: string[] = [];
       // reset columns
       function reset() {
         state.checkedList = [...state.defaultCheckList];
@@ -289,7 +291,7 @@
           const el = columnListEl.$el as any;
           if (!el) return;
           // Drag and drop sort
-          sortable = Sortable.create(unref(el), {
+          sortable = Sortablejs.create(unref(el), {
             animation: 500,
             delay: 400,
             delayOnTouchOnly: true,
@@ -348,7 +350,7 @@
         if (isFixed && !item.width) {
           item.width = 100;
         }
-        table.setCacheColumnsByField?.(item.dataIndex, { fixed: isFixed });
+        table.setCacheColumnsByField?.(item.dataIndex as string, { fixed: isFixed });
         setColumns(columns);
       }