zuaa
/
vue-vben-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: Fix the problem that the table setting menu cannot be dragged (#1503)

This commit is contained in:
lzdjack 2021-12-18 22:23:42 +08:00 committed by GitHub
parent 0dafaa5972
commit a2b594c962
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Table/src/components/settings/ColumnSetting.vue
View File

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