Commit a2b594c96286ec5d660d8d64f8a3768d4853e830
Committed by
GitHub
1 parent
0dafaa59
fix: Fix the problem that the table setting menu cannot be dragged (#1503)
Showing
1 changed file
with
10 additions
and
8 deletions
src/components/Table/src/components/settings/ColumnSetting.vue
@@ -117,14 +117,16 @@ | @@ -117,14 +117,16 @@ | ||
117 | import { useI18n } from '/@/hooks/web/useI18n'; | 117 | import { useI18n } from '/@/hooks/web/useI18n'; |
118 | import { useTableContext } from '../../hooks/useTableContext'; | 118 | import { useTableContext } from '../../hooks/useTableContext'; |
119 | import { useDesign } from '/@/hooks/web/useDesign'; | 119 | import { useDesign } from '/@/hooks/web/useDesign'; |
120 | - import { useSortable } from '/@/hooks/web/useSortable'; | 120 | + // import { useSortable } from '/@/hooks/web/useSortable'; |
121 | import { isFunction, isNullAndUnDef } from '/@/utils/is'; | 121 | import { isFunction, isNullAndUnDef } from '/@/utils/is'; |
122 | import { getPopupContainer as getParentContainer } from '/@/utils'; | 122 | import { getPopupContainer as getParentContainer } from '/@/utils'; |
123 | import { cloneDeep, omit } from 'lodash-es'; | 123 | import { cloneDeep, omit } from 'lodash-es'; |
124 | + import Sortablejs from 'sortablejs'; | ||
125 | + import type Sortable from 'sortablejs'; | ||
124 | 126 | ||
125 | interface State { | 127 | interface State { |
126 | checkAll: boolean; | 128 | checkAll: boolean; |
127 | - isInit: boolean; | 129 | + isInit?: boolean; |
128 | checkedList: string[]; | 130 | checkedList: string[]; |
129 | defaultCheckList: string[]; | 131 | defaultCheckList: string[]; |
130 | } | 132 | } |
@@ -158,7 +160,7 @@ | @@ -158,7 +160,7 @@ | ||
158 | let inited = false; | 160 | let inited = false; |
159 | 161 | ||
160 | const cachePlainOptions = ref<Options[]>([]); | 162 | const cachePlainOptions = ref<Options[]>([]); |
161 | - const plainOptions = ref<Options[]>([]); | 163 | + const plainOptions = ref<Options[] | any>([]); |
162 | 164 | ||
163 | const plainSortOptions = ref<Options[]>([]); | 165 | const plainSortOptions = ref<Options[]>([]); |
164 | 166 | ||
@@ -267,9 +269,9 @@ | @@ -267,9 +269,9 @@ | ||
267 | }); | 269 | }); |
268 | setColumns(checkedList); | 270 | setColumns(checkedList); |
269 | } | 271 | } |
270 | - | ||
271 | - let sortable = null; | ||
272 | - let sortableOrder = []; | 272 | + |
273 | + let sortable: Sortable; | ||
274 | + let sortableOrder: string[] = []; | ||
273 | // reset columns | 275 | // reset columns |
274 | function reset() { | 276 | function reset() { |
275 | state.checkedList = [...state.defaultCheckList]; | 277 | state.checkedList = [...state.defaultCheckList]; |
@@ -289,7 +291,7 @@ | @@ -289,7 +291,7 @@ | ||
289 | const el = columnListEl.$el as any; | 291 | const el = columnListEl.$el as any; |
290 | if (!el) return; | 292 | if (!el) return; |
291 | // Drag and drop sort | 293 | // Drag and drop sort |
292 | - sortable = Sortable.create(unref(el), { | 294 | + sortable = Sortablejs.create(unref(el), { |
293 | animation: 500, | 295 | animation: 500, |
294 | delay: 400, | 296 | delay: 400, |
295 | delayOnTouchOnly: true, | 297 | delayOnTouchOnly: true, |
@@ -348,7 +350,7 @@ | @@ -348,7 +350,7 @@ | ||
348 | if (isFixed && !item.width) { | 350 | if (isFixed && !item.width) { |
349 | item.width = 100; | 351 | item.width = 100; |
350 | } | 352 | } |
351 | - table.setCacheColumnsByField?.(item.dataIndex, { fixed: isFixed }); | 353 | + table.setCacheColumnsByField?.(item.dataIndex as string, { fixed: isFixed }); |
352 | setColumns(columns); | 354 | setColumns(columns); |
353 | } | 355 | } |
354 | 356 |