mirror of
https://github.com/jekip/naive-ui-admin.git
synced 2026-02-04 13:42:27 +08:00
@@ -25,13 +25,26 @@
|
|||||||
</template>
|
</template>
|
||||||
<div class="table-toolbar-inner">
|
<div class="table-toolbar-inner">
|
||||||
<n-checkbox-group v-model:value="checkList" @update:value="onChange">
|
<n-checkbox-group v-model:value="checkList" @update:value="onChange">
|
||||||
<Draggable v-model="columnsList" animation="300" item-key="key" @end="draggableEnd">
|
<Draggable
|
||||||
|
v-model="columnsList"
|
||||||
|
animation="300"
|
||||||
|
item-key="key"
|
||||||
|
filter=".no-draggable"
|
||||||
|
:move="onMove"
|
||||||
|
@end="draggableEnd"
|
||||||
|
>
|
||||||
<template #item="{ element }">
|
<template #item="{ element }">
|
||||||
<div
|
<div
|
||||||
class="table-toolbar-inner-checkbox"
|
class="table-toolbar-inner-checkbox"
|
||||||
:class="{ 'table-toolbar-inner-checkbox-dark': getDarkTheme === true }"
|
:class="{
|
||||||
|
'table-toolbar-inner-checkbox-dark': getDarkTheme === true,
|
||||||
|
'no-draggable': element.draggable === false,
|
||||||
|
}"
|
||||||
>
|
>
|
||||||
<span class="drag-icon">
|
<span
|
||||||
|
class="drag-icon"
|
||||||
|
:class="{ 'drag-icon-hidden': element.draggable === false }"
|
||||||
|
>
|
||||||
<n-icon size="18">
|
<n-icon size="18">
|
||||||
<DragOutlined />
|
<DragOutlined />
|
||||||
</n-icon>
|
</n-icon>
|
||||||
@@ -211,6 +224,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onMove(e) {
|
||||||
|
if (e.draggedContext.element.draggable === false) return false;
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
//固定
|
//固定
|
||||||
function fixedColumn(item, fixed) {
|
function fixedColumn(item, fixed) {
|
||||||
if (!state.checkList.includes(item.key)) return;
|
if (!state.checkList.includes(item.key)) return;
|
||||||
@@ -232,6 +250,7 @@
|
|||||||
onChange,
|
onChange,
|
||||||
onCheckAll,
|
onCheckAll,
|
||||||
onSelection,
|
onSelection,
|
||||||
|
onMove,
|
||||||
resetColumns,
|
resetColumns,
|
||||||
fixedColumn,
|
fixedColumn,
|
||||||
draggableEnd,
|
draggableEnd,
|
||||||
@@ -275,6 +294,10 @@
|
|||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
cursor: move;
|
cursor: move;
|
||||||
|
&-hidden {
|
||||||
|
visibility: hidden;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fixed-item {
|
.fixed-item {
|
||||||
|
|||||||
@@ -14,6 +14,8 @@ export interface BasicColumn extends TableBaseColumn {
|
|||||||
auth?: string[];
|
auth?: string[];
|
||||||
// 业务控制是否显示
|
// 业务控制是否显示
|
||||||
ifShow?: boolean | ((column: BasicColumn) => boolean);
|
ifShow?: boolean | ((column: BasicColumn) => boolean);
|
||||||
|
// 控制是否支持拖拽,默认支持
|
||||||
|
draggable?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface TableActionType {
|
export interface TableActionType {
|
||||||
|
|||||||
Reference in New Issue
Block a user