@gct-paas/v-ben 0.1.4-dev.11 → 0.1.4-dev.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.min.css +2 -1
- package/dist/loader.esm.min.js +693 -0
- package/es/_virtual/_plugin-vue_export-helper.mjs +7 -8
- package/es/components/index.mjs +7 -0
- package/es/components/v-ben-button/index.mjs +7 -8
- package/es/components/v-ben-button/src/BasicButton.vue.mjs +5 -40
- package/es/components/v-ben-button/src/BasicButton.vue_vue_type_script_setup_true_lang.mjs +37 -0
- package/es/components/v-ben-button/src/PopConfirmButton.vue.mjs +5 -46
- package/es/components/v-ben-button/src/PopConfirmButton.vue_vue_type_script_lang.mjs +36 -0
- package/es/components/v-ben-button/src/custom-button.vue.mjs +7 -7
- package/es/components/v-ben-button/src/custom-button.vue_vue_type_script_setup_true_name_custom-button_lang.mjs +22 -0
- package/es/components/v-ben-button/src/props.mjs +27 -27
- package/es/components/v-ben-dropdown/index.mjs +4 -4
- package/es/components/v-ben-dropdown/src/Dropdown.vue.mjs +5 -113
- package/es/components/v-ben-dropdown/src/Dropdown.vue_vue_type_script_setup_true_lang.mjs +87 -0
- package/es/components/v-ben-table/index.mjs +3 -0
- package/es/components/v-ben-table/src/BasicTable.vue.d.ts +6 -6
- package/es/components/v-ben-table/src/BasicTable.vue.mjs +33 -49
- package/es/components/v-ben-table/src/BasicTable.vue_vue_type_script_lang.mjs +41 -0
- package/es/components/v-ben-table/src/components/HeaderCell.vue.mjs +8 -8
- package/es/components/v-ben-table/src/components/HeaderCell.vue_vue_type_script_lang.mjs +15 -0
- package/es/components/v-ben-table/src/components/TableAction.vue.mjs +6 -174
- package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_script_setup_true_lang.mjs +145 -0
- package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_style_index_0_lang.css +37 -0
- package/es/components/v-ben-table/src/components/TableActionAuto.vue.mjs +6 -181
- package/es/components/v-ben-table/src/components/TableActionAuto.vue_vue_type_script_setup_true_lang.mjs +159 -0
- package/es/components/v-ben-table/src/components/TableActionAuto.vue_vue_type_style_index_0_lang.css +37 -0
- package/es/components/v-ben-table/src/props.d.ts +2 -2
- package/es/components/v-ben-table/src/props.mjs +155 -134
- package/es/hooks/useDesign.mjs +8 -7
- package/es/index.mjs +12 -14
- package/es/loader.d.ts +1 -0
- package/es/utils/is.mjs +29 -35
- package/package.json +6 -6
- package/dist/index.esm.min.mjs +0 -796
- package/dist/index.min.cjs +0 -1
- package/dist/index.system.min.js +0 -1
- package/es/components/v-ben-button/src/BasicButton.vue2.mjs +0 -5
- package/es/components/v-ben-button/src/PopConfirmButton.vue2.mjs +0 -5
- package/es/components/v-ben-button/src/custom-button.vue3.mjs +0 -32
- package/es/components/v-ben-dropdown/src/Dropdown.vue2.mjs +0 -5
- package/es/components/v-ben-table/src/BasicTable.vue2.mjs +0 -48
- package/es/components/v-ben-table/src/components/HeaderCell.vue2.mjs +0 -20
- package/es/components/v-ben-table/src/components/TableAction.css +0 -37
- package/es/components/v-ben-table/src/components/TableAction.vue3.mjs +0 -6
- package/es/components/v-ben-table/src/components/TableActionAuto.css +0 -37
- package/es/components/v-ben-table/src/components/TableActionAuto.vue3.mjs +0 -6
- /package/es/components/v-ben-button/src/{custom-button.css → custom-button.vue_vue_type_style_index_0_scoped_305f4090_lang.css} +0 -0
|
@@ -1,53 +1,37 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
|
|
2
|
+
import BasicTable_vue_vue_type_script_lang_default from "./BasicTable.vue_vue_type_script_lang.mjs";
|
|
3
|
+
import { Fragment, createBlock, createElementBlock, createSlots, createVNode, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderList, renderSlot, resolveComponent, vShow, withCtx, withDirectives } from "vue";
|
|
4
|
+
//#region src/components/v-ben-table/src/BasicTable.vue
|
|
5
|
+
var _hoisted_1 = { ref: "wrapRef" };
|
|
6
|
+
var _hoisted_2 = {
|
|
7
|
+
key: 0,
|
|
8
|
+
class: "pr26px"
|
|
9
9
|
};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
10
|
+
var _hoisted_3 = {
|
|
11
|
+
key: 1,
|
|
12
|
+
class: "pr8px"
|
|
13
13
|
};
|
|
14
14
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
renderSlot(_ctx.$slots, "bodyCell", normalizeProps(guardReactiveProps(data || {})))
|
|
35
|
-
]),
|
|
36
|
-
_: 2
|
|
37
|
-
}, [
|
|
38
|
-
renderList(Object.keys(_ctx.$slots), (item) => {
|
|
39
|
-
return {
|
|
40
|
-
name: item,
|
|
41
|
-
fn: withCtx((data) => [
|
|
42
|
-
renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))
|
|
43
|
-
])
|
|
44
|
-
};
|
|
45
|
-
})
|
|
46
|
-
]), 1040, ["expanded-row-keys", "onChange"]), [
|
|
47
|
-
[vShow, _ctx.getEmptyDataIsShowTable]
|
|
48
|
-
])
|
|
49
|
-
], 512);
|
|
15
|
+
const _component_HeaderCell = resolveComponent("HeaderCell");
|
|
16
|
+
const _component_a_table = resolveComponent("a-table");
|
|
17
|
+
return openBlock(), createElementBlock("div", _hoisted_1, [renderSlot(_ctx.$slots, "beforeTable"), withDirectives(createVNode(_component_a_table, mergeProps({ ref: "tableElRef" }, _ctx.getBindValues, {
|
|
18
|
+
"expanded-row-keys": _ctx.expandKeysList,
|
|
19
|
+
"onUpdate:expandedRowKeys": _cache[0] || (_cache[0] = ($event) => _ctx.expandKeysList = $event),
|
|
20
|
+
onChange: _ctx.handleTableChange
|
|
21
|
+
}), createSlots({
|
|
22
|
+
headerCell: withCtx(({ column }) => [_ctx.rowDraggable && column?.dataIndex === _ctx.getBindValues.columns[0].dataIndex ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [_ctx.isTreeTable ? (openBlock(), createElementBlock("span", _hoisted_2)) : (openBlock(), createElementBlock("span", _hoisted_3)), createVNode(_component_HeaderCell, { column }, null, 8, ["column"])], 64)) : (openBlock(), createBlock(_component_HeaderCell, {
|
|
23
|
+
key: 1,
|
|
24
|
+
column
|
|
25
|
+
}, null, 8, ["column"]))]),
|
|
26
|
+
bodyCell: withCtx((data) => [renderSlot(_ctx.$slots, "bodyCell", normalizeProps(guardReactiveProps(data || {})))]),
|
|
27
|
+
_: 2
|
|
28
|
+
}, [renderList(Object.keys(_ctx.$slots), (item) => {
|
|
29
|
+
return {
|
|
30
|
+
name: item,
|
|
31
|
+
fn: withCtx((data) => [renderSlot(_ctx.$slots, item, normalizeProps(guardReactiveProps(data || {})))])
|
|
32
|
+
};
|
|
33
|
+
})]), 1040, ["expanded-row-keys", "onChange"]), [[vShow, _ctx.getEmptyDataIsShowTable]])], 512);
|
|
50
34
|
}
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
export {
|
|
35
|
+
var BasicTable_default = /* @__PURE__ */ _plugin_vue_export_helper_default(BasicTable_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
|
|
36
|
+
//#endregion
|
|
37
|
+
export { BasicTable_default as default };
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import HeaderCell_default from "./components/HeaderCell.vue.mjs";
|
|
2
|
+
import { basicProps } from "./props.mjs";
|
|
3
|
+
import { computed, defineComponent, ref } from "vue";
|
|
4
|
+
import { omit } from "lodash-es";
|
|
5
|
+
//#region src/components/v-ben-table/src/BasicTable.vue?vue&type=script&lang.ts
|
|
6
|
+
var BasicTable_vue_vue_type_script_lang_default = defineComponent({
|
|
7
|
+
name: "BasicTable",
|
|
8
|
+
components: { HeaderCell: HeaderCell_default },
|
|
9
|
+
props: basicProps,
|
|
10
|
+
emits: ["change"],
|
|
11
|
+
setup(props, { attrs, emit, slots, expose }) {
|
|
12
|
+
const tableElRef = ref(null);
|
|
13
|
+
const expandKeysList = ref([]);
|
|
14
|
+
const formRef = ref(null);
|
|
15
|
+
const getBindValues = computed(() => {
|
|
16
|
+
let propsData = { ...attrs };
|
|
17
|
+
propsData = omit(propsData, ["class", "onChange"]);
|
|
18
|
+
return propsData;
|
|
19
|
+
});
|
|
20
|
+
function handleTableChange(...args) {
|
|
21
|
+
emit("change", ...args);
|
|
22
|
+
}
|
|
23
|
+
return {
|
|
24
|
+
formRef,
|
|
25
|
+
tableElRef,
|
|
26
|
+
getBindValues,
|
|
27
|
+
handleTableChange,
|
|
28
|
+
expandKeysList,
|
|
29
|
+
getEmptyDataIsShowTable: computed(() => {
|
|
30
|
+
const { emptyDataIsShowTable, useSearchForm, dataSource } = props;
|
|
31
|
+
if (emptyDataIsShowTable || !useSearchForm) return true;
|
|
32
|
+
return !!dataSource.length;
|
|
33
|
+
})
|
|
34
|
+
};
|
|
35
|
+
},
|
|
36
|
+
mounted() {
|
|
37
|
+
this.expandKeysList = this.getBindValues.expandedRowKeys;
|
|
38
|
+
}
|
|
39
|
+
});
|
|
40
|
+
//#endregion
|
|
41
|
+
export { BasicTable_vue_vue_type_script_lang_default as default };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
|
|
1
|
+
import HeaderCell_vue_vue_type_script_lang_default from "./HeaderCell.vue_vue_type_script_lang.mjs";
|
|
2
|
+
import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_export-helper.mjs";
|
|
3
|
+
import { createElementBlock, openBlock, toDisplayString } from "vue";
|
|
4
|
+
//#region src/components/v-ben-table/src/components/HeaderCell.vue
|
|
5
5
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
6
|
-
|
|
6
|
+
return openBlock(), createElementBlock("span", null, toDisplayString(_ctx.getTitle), 1);
|
|
7
7
|
}
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
export {
|
|
8
|
+
var HeaderCell_default = /* @__PURE__ */ _plugin_vue_export_helper_default(HeaderCell_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
|
|
9
|
+
//#endregion
|
|
10
|
+
export { HeaderCell_default as default };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { computed, defineComponent } from "vue";
|
|
2
|
+
//#region src/components/v-ben-table/src/components/HeaderCell.vue?vue&type=script&lang.ts
|
|
3
|
+
var HeaderCell_vue_vue_type_script_lang_default = defineComponent({
|
|
4
|
+
name: "TableHeaderCell",
|
|
5
|
+
components: {},
|
|
6
|
+
props: { column: {
|
|
7
|
+
type: Object,
|
|
8
|
+
default: () => ({})
|
|
9
|
+
} },
|
|
10
|
+
setup(props) {
|
|
11
|
+
return { getTitle: computed(() => props.column?.customTitle || props.column?.title) };
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
//#endregion
|
|
15
|
+
export { HeaderCell_vue_vue_type_script_lang_default as default };
|
|
@@ -1,174 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
import { isBoolean, isFunction, isString } from '../../../../utils/is.mjs';
|
|
8
|
-
import './TableActionAuto.css';import './TableAction.css';/* empty css */
|
|
9
|
-
/* empty css */
|
|
10
|
-
import { PopConfirmButton } from '../../../v-ben-button/index.mjs';
|
|
11
|
-
import { Dropdown } from '../../../v-ben-dropdown/index.mjs';
|
|
12
|
-
|
|
13
|
-
const _hoisted_1 = {
|
|
14
|
-
key: 0,
|
|
15
|
-
class: "text-14px"
|
|
16
|
-
};
|
|
17
|
-
const _hoisted_2 = {
|
|
18
|
-
key: 0,
|
|
19
|
-
class: "text-14px"
|
|
20
|
-
};
|
|
21
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
22
|
-
__name: "TableAction",
|
|
23
|
-
props: {
|
|
24
|
-
actions: {
|
|
25
|
-
type: Array,
|
|
26
|
-
default: null
|
|
27
|
-
},
|
|
28
|
-
dropDownActions: {
|
|
29
|
-
type: Array,
|
|
30
|
-
default: null
|
|
31
|
-
},
|
|
32
|
-
divider: {
|
|
33
|
-
type: Boolean,
|
|
34
|
-
default: true
|
|
35
|
-
},
|
|
36
|
-
outside: Boolean,
|
|
37
|
-
stopButtonPropagation: {
|
|
38
|
-
type: Boolean,
|
|
39
|
-
default: false
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
setup(__props) {
|
|
43
|
-
const props = __props;
|
|
44
|
-
const { prefixCls } = useDesign("basic-table-action");
|
|
45
|
-
const hasPermission = permission.has;
|
|
46
|
-
function isIfShow(action) {
|
|
47
|
-
const ifShow = action.ifShow;
|
|
48
|
-
let isIfShow2 = true;
|
|
49
|
-
if (isBoolean(ifShow)) {
|
|
50
|
-
isIfShow2 = ifShow;
|
|
51
|
-
}
|
|
52
|
-
if (isFunction(ifShow)) {
|
|
53
|
-
isIfShow2 = ifShow(action);
|
|
54
|
-
}
|
|
55
|
-
return isIfShow2;
|
|
56
|
-
}
|
|
57
|
-
const getActions = computed(() => {
|
|
58
|
-
return (toRaw(props.actions) || []).filter((action) => {
|
|
59
|
-
return hasPermission(action.auth) && isIfShow(action);
|
|
60
|
-
}).map((action) => {
|
|
61
|
-
const { popConfirm } = action;
|
|
62
|
-
return {
|
|
63
|
-
getPopupContainer: () => document.body,
|
|
64
|
-
type: "link",
|
|
65
|
-
size: "small",
|
|
66
|
-
...action,
|
|
67
|
-
...popConfirm || {},
|
|
68
|
-
onConfirm: popConfirm?.confirm,
|
|
69
|
-
onCancel: popConfirm?.cancel,
|
|
70
|
-
enable: !!popConfirm
|
|
71
|
-
};
|
|
72
|
-
});
|
|
73
|
-
});
|
|
74
|
-
const getDropdownList = computed(() => {
|
|
75
|
-
const list = (toRaw(props.dropDownActions) || []).filter(
|
|
76
|
-
(action) => {
|
|
77
|
-
return hasPermission(action.auth) && isIfShow(action);
|
|
78
|
-
}
|
|
79
|
-
);
|
|
80
|
-
return list.map((action, index) => {
|
|
81
|
-
const { label, popConfirm } = action;
|
|
82
|
-
return {
|
|
83
|
-
...action,
|
|
84
|
-
...popConfirm,
|
|
85
|
-
onConfirm: popConfirm?.confirm,
|
|
86
|
-
onCancel: popConfirm?.cancel,
|
|
87
|
-
text: label,
|
|
88
|
-
divider: index < list.length - 1 ? props.divider : false
|
|
89
|
-
};
|
|
90
|
-
});
|
|
91
|
-
});
|
|
92
|
-
const getAlign = computed(() => {
|
|
93
|
-
return "left";
|
|
94
|
-
});
|
|
95
|
-
function getTooltip(data) {
|
|
96
|
-
return {
|
|
97
|
-
getPopupContainer: () => document.body,
|
|
98
|
-
...isString(data) ? { title: data } : data
|
|
99
|
-
};
|
|
100
|
-
}
|
|
101
|
-
function onCellClick(e) {
|
|
102
|
-
if (!props.stopButtonPropagation) return;
|
|
103
|
-
const path = e.composedPath();
|
|
104
|
-
const isInButton = path.find((ele) => {
|
|
105
|
-
return ele.tagName?.toUpperCase() === "BUTTON";
|
|
106
|
-
});
|
|
107
|
-
isInButton && e.stopPropagation();
|
|
108
|
-
}
|
|
109
|
-
return (_ctx, _cache) => {
|
|
110
|
-
const _component_a_button = resolveComponent("a-button");
|
|
111
|
-
return openBlock(), createElementBlock("div", {
|
|
112
|
-
class: normalizeClass([unref(prefixCls), getAlign.value]),
|
|
113
|
-
onClick: onCellClick
|
|
114
|
-
}, [
|
|
115
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(getActions.value, (action, index) => {
|
|
116
|
-
return openBlock(), createElementBlock(Fragment, {
|
|
117
|
-
key: `${index}-${action.label}`
|
|
118
|
-
}, [
|
|
119
|
-
action.tooltip ? (openBlock(), createBlock(unref(Tooltip), mergeProps({
|
|
120
|
-
key: 0,
|
|
121
|
-
placement: "bottom"
|
|
122
|
-
}, { ref_for: true }, getTooltip(action.tooltip)), {
|
|
123
|
-
default: withCtx(() => [
|
|
124
|
-
createVNode(unref(PopConfirmButton), mergeProps({ ref_for: true }, action), {
|
|
125
|
-
default: withCtx(() => [
|
|
126
|
-
action.label ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(action.label), 1)) : createCommentVNode("", true)
|
|
127
|
-
]),
|
|
128
|
-
_: 2
|
|
129
|
-
}, 1040)
|
|
130
|
-
]),
|
|
131
|
-
_: 2
|
|
132
|
-
}, 1040)) : (openBlock(), createBlock(unref(PopConfirmButton), mergeProps({
|
|
133
|
-
key: 1,
|
|
134
|
-
ref_for: true
|
|
135
|
-
}, action), {
|
|
136
|
-
default: withCtx(() => [
|
|
137
|
-
action.label ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(action.label), 1)) : createCommentVNode("", true)
|
|
138
|
-
]),
|
|
139
|
-
_: 2
|
|
140
|
-
}, 1040)),
|
|
141
|
-
__props.divider && index < getActions.value.length - 1 ? (openBlock(), createBlock(unref(Divider), {
|
|
142
|
-
key: 2,
|
|
143
|
-
type: "vertical",
|
|
144
|
-
class: "action-divider"
|
|
145
|
-
})) : createCommentVNode("", true)
|
|
146
|
-
], 64);
|
|
147
|
-
}), 128)),
|
|
148
|
-
__props.dropDownActions && getDropdownList.value.length > 0 ? (openBlock(), createBlock(unref(Dropdown), {
|
|
149
|
-
key: 0,
|
|
150
|
-
trigger: ["hover"],
|
|
151
|
-
"drop-menu-list": getDropdownList.value,
|
|
152
|
-
popconfirm: ""
|
|
153
|
-
}, {
|
|
154
|
-
default: withCtx(() => [
|
|
155
|
-
renderSlot(_ctx.$slots, "more"),
|
|
156
|
-
!_ctx.$slots.more ? (openBlock(), createBlock(_component_a_button, {
|
|
157
|
-
key: 0,
|
|
158
|
-
type: "link",
|
|
159
|
-
size: "small"
|
|
160
|
-
}, {
|
|
161
|
-
default: withCtx(() => [
|
|
162
|
-
createVNode(unref(MoreOutlined), { class: "icon-more" })
|
|
163
|
-
]),
|
|
164
|
-
_: 1
|
|
165
|
-
})) : createCommentVNode("", true)
|
|
166
|
-
]),
|
|
167
|
-
_: 3
|
|
168
|
-
}, 8, ["drop-menu-list"])) : createCommentVNode("", true)
|
|
169
|
-
], 2);
|
|
170
|
-
};
|
|
171
|
-
}
|
|
172
|
-
});
|
|
173
|
-
|
|
174
|
-
export { _sfc_main as default };
|
|
1
|
+
import TableAction_vue_vue_type_script_setup_true_lang_default from "./TableAction.vue_vue_type_script_setup_true_lang.mjs";
|
|
2
|
+
import './TableAction.vue_vue_type_style_index_0_lang.css';/* empty css */
|
|
3
|
+
//#region src/components/v-ben-table/src/components/TableAction.vue
|
|
4
|
+
var TableAction_default = TableAction_vue_vue_type_script_setup_true_lang_default;
|
|
5
|
+
//#endregion
|
|
6
|
+
export { TableAction_default as default };
|
package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_script_setup_true_lang.mjs
ADDED
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
import { isBoolean, isFunction, isString } from "../../../../utils/is.mjs";
|
|
2
|
+
import { useDesign } from "../../../../hooks/useDesign.mjs";
|
|
3
|
+
import { PopConfirmButton } from "../../../v-ben-button/index.mjs";
|
|
4
|
+
import { Dropdown as Dropdown$1 } from "../../../v-ben-dropdown/index.mjs";
|
|
5
|
+
import "../../../index.mjs";
|
|
6
|
+
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderList, renderSlot, resolveComponent, toDisplayString, toRaw, unref, withCtx } from "vue";
|
|
7
|
+
import { MoreOutlined } from "@ant-design/icons-vue";
|
|
8
|
+
import { Divider, Tooltip } from "ant-design-vue";
|
|
9
|
+
import { permission } from "@gct-paas/core";
|
|
10
|
+
//#region src/components/v-ben-table/src/components/TableAction.vue?vue&type=script&setup=true&lang.ts
|
|
11
|
+
var _hoisted_1 = {
|
|
12
|
+
key: 0,
|
|
13
|
+
class: "text-14px"
|
|
14
|
+
};
|
|
15
|
+
var _hoisted_2 = {
|
|
16
|
+
key: 0,
|
|
17
|
+
class: "text-14px"
|
|
18
|
+
};
|
|
19
|
+
var TableAction_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
20
|
+
__name: "TableAction",
|
|
21
|
+
props: {
|
|
22
|
+
actions: {
|
|
23
|
+
type: Array,
|
|
24
|
+
default: null
|
|
25
|
+
},
|
|
26
|
+
dropDownActions: {
|
|
27
|
+
type: Array,
|
|
28
|
+
default: null
|
|
29
|
+
},
|
|
30
|
+
divider: {
|
|
31
|
+
type: Boolean,
|
|
32
|
+
default: true
|
|
33
|
+
},
|
|
34
|
+
outside: Boolean,
|
|
35
|
+
stopButtonPropagation: {
|
|
36
|
+
type: Boolean,
|
|
37
|
+
default: false
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
setup(__props) {
|
|
41
|
+
const props = __props;
|
|
42
|
+
const { prefixCls } = useDesign("basic-table-action");
|
|
43
|
+
const hasPermission = permission.has;
|
|
44
|
+
function isIfShow(action) {
|
|
45
|
+
const ifShow = action.ifShow;
|
|
46
|
+
let isIfShow = true;
|
|
47
|
+
if (isBoolean(ifShow)) isIfShow = ifShow;
|
|
48
|
+
if (isFunction(ifShow)) isIfShow = ifShow(action);
|
|
49
|
+
return isIfShow;
|
|
50
|
+
}
|
|
51
|
+
const getActions = computed(() => {
|
|
52
|
+
return (toRaw(props.actions) || []).filter((action) => {
|
|
53
|
+
return hasPermission(action.auth) && isIfShow(action);
|
|
54
|
+
}).map((action) => {
|
|
55
|
+
const { popConfirm } = action;
|
|
56
|
+
return {
|
|
57
|
+
getPopupContainer: () => document.body,
|
|
58
|
+
type: "link",
|
|
59
|
+
size: "small",
|
|
60
|
+
...action,
|
|
61
|
+
...popConfirm || {},
|
|
62
|
+
onConfirm: popConfirm?.confirm,
|
|
63
|
+
onCancel: popConfirm?.cancel,
|
|
64
|
+
enable: !!popConfirm
|
|
65
|
+
};
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
const getDropdownList = computed(() => {
|
|
69
|
+
const list = (toRaw(props.dropDownActions) || []).filter((action) => {
|
|
70
|
+
return hasPermission(action.auth) && isIfShow(action);
|
|
71
|
+
});
|
|
72
|
+
return list.map((action, index) => {
|
|
73
|
+
const { label, popConfirm } = action;
|
|
74
|
+
return {
|
|
75
|
+
...action,
|
|
76
|
+
...popConfirm,
|
|
77
|
+
onConfirm: popConfirm?.confirm,
|
|
78
|
+
onCancel: popConfirm?.cancel,
|
|
79
|
+
text: label,
|
|
80
|
+
divider: index < list.length - 1 ? props.divider : false
|
|
81
|
+
};
|
|
82
|
+
});
|
|
83
|
+
});
|
|
84
|
+
const getAlign = computed(() => {
|
|
85
|
+
return "left";
|
|
86
|
+
});
|
|
87
|
+
function getTooltip(data) {
|
|
88
|
+
return {
|
|
89
|
+
getPopupContainer: () => document.body,
|
|
90
|
+
...isString(data) ? { title: data } : data
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
function onCellClick(e) {
|
|
94
|
+
if (!props.stopButtonPropagation) return;
|
|
95
|
+
e.composedPath().find((ele) => {
|
|
96
|
+
return ele.tagName?.toUpperCase() === "BUTTON";
|
|
97
|
+
}) && e.stopPropagation();
|
|
98
|
+
}
|
|
99
|
+
return (_ctx, _cache) => {
|
|
100
|
+
const _component_a_button = resolveComponent("a-button");
|
|
101
|
+
return openBlock(), createElementBlock("div", {
|
|
102
|
+
class: normalizeClass([unref(prefixCls), getAlign.value]),
|
|
103
|
+
onClick: onCellClick
|
|
104
|
+
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(getActions.value, (action, index) => {
|
|
105
|
+
return openBlock(), createElementBlock(Fragment, { key: `${index}-${action.label}` }, [action.tooltip ? (openBlock(), createBlock(unref(Tooltip), mergeProps({
|
|
106
|
+
key: 0,
|
|
107
|
+
placement: "bottom"
|
|
108
|
+
}, { ref_for: true }, getTooltip(action.tooltip)), {
|
|
109
|
+
default: withCtx(() => [createVNode(unref(PopConfirmButton), mergeProps({ ref_for: true }, action), {
|
|
110
|
+
default: withCtx(() => [action.label ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(action.label), 1)) : createCommentVNode("", true)]),
|
|
111
|
+
_: 2
|
|
112
|
+
}, 1040)]),
|
|
113
|
+
_: 2
|
|
114
|
+
}, 1040)) : (openBlock(), createBlock(unref(PopConfirmButton), mergeProps({
|
|
115
|
+
key: 1,
|
|
116
|
+
ref_for: true
|
|
117
|
+
}, action), {
|
|
118
|
+
default: withCtx(() => [action.label ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(action.label), 1)) : createCommentVNode("", true)]),
|
|
119
|
+
_: 2
|
|
120
|
+
}, 1040)), __props.divider && index < getActions.value.length - 1 ? (openBlock(), createBlock(unref(Divider), {
|
|
121
|
+
key: 2,
|
|
122
|
+
type: "vertical",
|
|
123
|
+
class: "action-divider"
|
|
124
|
+
})) : createCommentVNode("", true)], 64);
|
|
125
|
+
}), 128)), __props.dropDownActions && getDropdownList.value.length > 0 ? (openBlock(), createBlock(unref(Dropdown$1), {
|
|
126
|
+
key: 0,
|
|
127
|
+
trigger: ["hover"],
|
|
128
|
+
"drop-menu-list": getDropdownList.value,
|
|
129
|
+
popconfirm: ""
|
|
130
|
+
}, {
|
|
131
|
+
default: withCtx(() => [renderSlot(_ctx.$slots, "more"), !_ctx.$slots.more ? (openBlock(), createBlock(_component_a_button, {
|
|
132
|
+
key: 0,
|
|
133
|
+
type: "link",
|
|
134
|
+
size: "small"
|
|
135
|
+
}, {
|
|
136
|
+
default: withCtx(() => [createVNode(unref(MoreOutlined), { class: "icon-more" })]),
|
|
137
|
+
_: 1
|
|
138
|
+
})) : createCommentVNode("", true)]),
|
|
139
|
+
_: 3
|
|
140
|
+
}, 8, ["drop-menu-list"])) : createCommentVNode("", true)], 2);
|
|
141
|
+
};
|
|
142
|
+
}
|
|
143
|
+
});
|
|
144
|
+
//#endregion
|
|
145
|
+
export { TableAction_vue_vue_type_script_setup_true_lang_default as default };
|
package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_style_index_0_lang.css
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
.vben-basic-table-action {
|
|
2
|
+
display: flex;
|
|
3
|
+
align-items: center;
|
|
4
|
+
}
|
|
5
|
+
.vben-basic-table-action .action-divider {
|
|
6
|
+
display: table;
|
|
7
|
+
}
|
|
8
|
+
.vben-basic-table-action.left {
|
|
9
|
+
justify-content: flex-start;
|
|
10
|
+
}
|
|
11
|
+
.vben-basic-table-action.center {
|
|
12
|
+
justify-content: center;
|
|
13
|
+
}
|
|
14
|
+
.vben-basic-table-action.right {
|
|
15
|
+
justify-content: flex-end;
|
|
16
|
+
}
|
|
17
|
+
.vben-basic-table-action button {
|
|
18
|
+
display: flex;
|
|
19
|
+
align-items: center;
|
|
20
|
+
}
|
|
21
|
+
.vben-basic-table-action button span {
|
|
22
|
+
margin-left: 0 !important;
|
|
23
|
+
}
|
|
24
|
+
.vben-basic-table-action button.ant-btn-circle span {
|
|
25
|
+
margin: auto !important;
|
|
26
|
+
}
|
|
27
|
+
.vben-basic-table-action .ant-divider,
|
|
28
|
+
.vben-basic-table-action .ant-divider-vertical {
|
|
29
|
+
margin: 0 2px;
|
|
30
|
+
}
|
|
31
|
+
.vben-basic-table-action .icon-more {
|
|
32
|
+
transform: rotate(90deg);
|
|
33
|
+
}
|
|
34
|
+
.vben-basic-table-action .icon-more svg {
|
|
35
|
+
font-size: 1.1em;
|
|
36
|
+
font-weight: 700;
|
|
37
|
+
}
|