@qin-ui/antd-vue-pro 2.2.0 → 2.2.2
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/api.json +3 -3
- package/es/components/form/components/ProForm/index.vue.d.ts +4 -4
- package/es/components/table/components/ProTable.vue.d.ts +4 -4
- package/es/components/table/components/ProTable.vue.d.ts.map +1 -1
- package/es/index.js +1310 -11
- package/es/index.js.map +1 -1
- package/package.json +14 -10
- package/src/components/component-provider/components/index.vue +1 -1
- package/src/components/form/components/ProForm/index.vue +3 -3
- package/es/component-provider/index-PHCLwRXW.js +0 -175
- package/es/component-provider/index-PHCLwRXW.js.map +0 -1
- package/es/component-provider/index.js +0 -5
- package/es/component-provider/index.js.map +0 -1
- package/es/form/index.js +0 -457
- package/es/form/index.js.map +0 -1
- package/es/table/index.js +0 -705
- package/es/table/index.js.map +0 -1
package/es/table/index.js
DELETED
|
@@ -1,705 +0,0 @@
|
|
|
1
|
-
import { createElementBlock, openBlock, createElementVNode, defineComponent, ref, computed, watch, watchEffect, createBlock, unref, mergeProps, withCtx, createVNode, renderSlot, createCommentVNode, Fragment, resolveDynamicComponent, createTextVNode, toDisplayString, normalizeStyle, useModel, renderList, withModifiers, mergeModels, inject, useAttrs, useSlots, onMounted, normalizeClass, createSlots, normalizeProps, guardReactiveProps, nextTick } from "vue";
|
|
2
|
-
import { I as INJECT_CONFIG } from "../component-provider/index-PHCLwRXW.js";
|
|
3
|
-
import _sfc_main$9, { ContainerFragment as _sfc_main$a } from "../form/index.js";
|
|
4
|
-
import { Space, Button, theme, Dropdown, Menu, MenuItem, Checkbox, MenuDivider, Table } from "ant-design-vue";
|
|
5
|
-
import { useConfigContextInject } from "ant-design-vue/es/config-provider/context";
|
|
6
|
-
import { tableProps } from "ant-design-vue/es/table";
|
|
7
|
-
import { pick, getObject, camelizeProperties, useTable as useTable$1 } from "@qin-ui/pro-components-core";
|
|
8
|
-
const _export_sfc = (sfc, props) => {
|
|
9
|
-
const target = sfc.__vccOpts || sfc;
|
|
10
|
-
for (const [key, val] of props) {
|
|
11
|
-
target[key] = val;
|
|
12
|
-
}
|
|
13
|
-
return target;
|
|
14
|
-
};
|
|
15
|
-
const _sfc_main$8 = {};
|
|
16
|
-
const _hoisted_1$3 = {
|
|
17
|
-
focusable: "false",
|
|
18
|
-
"data-icon": "down",
|
|
19
|
-
width: "1em",
|
|
20
|
-
height: "1em",
|
|
21
|
-
fill: "currentColor",
|
|
22
|
-
"aria-hidden": "true",
|
|
23
|
-
viewBox: "64 64 896 896"
|
|
24
|
-
};
|
|
25
|
-
function _sfc_render$2(_ctx, _cache) {
|
|
26
|
-
return openBlock(), createElementBlock("svg", _hoisted_1$3, [..._cache[0] || (_cache[0] = [
|
|
27
|
-
createElementVNode("path", { d: "M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" }, null, -1)
|
|
28
|
-
])]);
|
|
29
|
-
}
|
|
30
|
-
const DownOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$2]]);
|
|
31
|
-
const _sfc_main$7 = /* @__PURE__ */ defineComponent({
|
|
32
|
-
...{ name: "SearchForm" },
|
|
33
|
-
__name: "SearchForm",
|
|
34
|
-
props: {
|
|
35
|
-
form: {},
|
|
36
|
-
layout: { default: "grid" },
|
|
37
|
-
expand: { type: [Boolean, Object], default: true },
|
|
38
|
-
searchButton: { type: [Object, Function, Boolean], default: void 0 },
|
|
39
|
-
resetButton: { type: [Object, Function, Boolean], default: void 0 },
|
|
40
|
-
expandButton: { type: [Object, Function, Boolean], default: void 0 },
|
|
41
|
-
rowGap: { default: 16 },
|
|
42
|
-
columnGap: { default: 24 },
|
|
43
|
-
class: {},
|
|
44
|
-
style: {}
|
|
45
|
-
},
|
|
46
|
-
emits: ["search", "reset"],
|
|
47
|
-
setup(__props, { emit: __emit }) {
|
|
48
|
-
const emit = __emit;
|
|
49
|
-
const proFormHeight = ref("unset");
|
|
50
|
-
const collapseHeight = ref(0);
|
|
51
|
-
let rowHeight = 32;
|
|
52
|
-
const computedExpand = computed(() => {
|
|
53
|
-
if (!__props.expand) return false;
|
|
54
|
-
if (__props.expand === true) return { minExpandRows: 2, expandStatus: false };
|
|
55
|
-
return {
|
|
56
|
-
minExpandRows: Math.max(Math.floor(__props.expand.minExpandRows ?? 2), 1),
|
|
57
|
-
expandStatus: __props.expand.expandStatus ?? false
|
|
58
|
-
};
|
|
59
|
-
});
|
|
60
|
-
const showExpandToggle = ref(false);
|
|
61
|
-
const expandStatus = ref(true);
|
|
62
|
-
const changeExpandStatus = () => {
|
|
63
|
-
expandStatus.value = !expandStatus.value;
|
|
64
|
-
};
|
|
65
|
-
const { formRef, getFormData } = __props.form;
|
|
66
|
-
const setInitExpandStatus = () => {
|
|
67
|
-
expandStatus.value = false;
|
|
68
|
-
if (formRef.value && __props.expand) {
|
|
69
|
-
const formEl = formRef.value.$el;
|
|
70
|
-
const formItemsEl = formEl.querySelectorAll(
|
|
71
|
-
"[class*='-form-item'] > [path]"
|
|
72
|
-
);
|
|
73
|
-
const observer = new IntersectionObserver(
|
|
74
|
-
(entries) => {
|
|
75
|
-
expandStatus.value = entries.some((e) => {
|
|
76
|
-
if (e.intersectionRatio === 0) {
|
|
77
|
-
const path = e.target.getAttribute("path");
|
|
78
|
-
const searchFieldValue = path ? getFormData == null ? void 0 : getFormData(path) : void 0;
|
|
79
|
-
return ![null, void 0].includes(searchFieldValue);
|
|
80
|
-
}
|
|
81
|
-
return __props.expand.expandStatus;
|
|
82
|
-
});
|
|
83
|
-
observer.disconnect();
|
|
84
|
-
},
|
|
85
|
-
{ root: formEl }
|
|
86
|
-
);
|
|
87
|
-
formItemsEl.forEach((element) => {
|
|
88
|
-
observer.observe(element);
|
|
89
|
-
});
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
watch(
|
|
93
|
-
[
|
|
94
|
-
() => {
|
|
95
|
-
var _a, _b, _c;
|
|
96
|
-
return (_c = (_b = (_a = __props.form) == null ? void 0 : _a.fields.value) == null ? void 0 : _b.filter((f) => !f.hidden)) == null ? void 0 : _c.length;
|
|
97
|
-
},
|
|
98
|
-
() => formRef.value,
|
|
99
|
-
() => __props.expand
|
|
100
|
-
],
|
|
101
|
-
() => {
|
|
102
|
-
var _a, _b, _c, _d, _e;
|
|
103
|
-
if (!__props.expand || !expandStatus.value || !formRef.value) return;
|
|
104
|
-
const proFormEl = (_a = formRef.value) == null ? void 0 : _a.$el;
|
|
105
|
-
const { height = 0 } = ((_b = proFormEl == null ? void 0 : proFormEl.getBoundingClientRect) == null ? void 0 : _b.call(proFormEl)) || {};
|
|
106
|
-
proFormHeight.value = height;
|
|
107
|
-
rowHeight = (_e = (_d = (_c = proFormEl == null ? void 0 : proFormEl.querySelector("[class*='-form-item']")) == null ? void 0 : _c.getBoundingClientRect) == null ? void 0 : _d.call(_c)) == null ? void 0 : _e.height;
|
|
108
|
-
},
|
|
109
|
-
{ flush: "post", immediate: true }
|
|
110
|
-
);
|
|
111
|
-
watchEffect(
|
|
112
|
-
() => {
|
|
113
|
-
if (typeof proFormHeight.value !== "number") return;
|
|
114
|
-
if (__props.layout === "grid" && computedExpand.value) {
|
|
115
|
-
const { minExpandRows } = computedExpand.value;
|
|
116
|
-
collapseHeight.value = Math.min(
|
|
117
|
-
minExpandRows * rowHeight + (minExpandRows - 1) * __props.rowGap,
|
|
118
|
-
+proFormHeight.value
|
|
119
|
-
);
|
|
120
|
-
showExpandToggle.value = +proFormHeight.value - collapseHeight.value > 1;
|
|
121
|
-
if (showExpandToggle.value) {
|
|
122
|
-
setInitExpandStatus();
|
|
123
|
-
}
|
|
124
|
-
} else {
|
|
125
|
-
showExpandToggle.value = false;
|
|
126
|
-
}
|
|
127
|
-
},
|
|
128
|
-
{ flush: "post" }
|
|
129
|
-
);
|
|
130
|
-
const layoutProps = computed(
|
|
131
|
-
() => __props.layout === "grid" ? {
|
|
132
|
-
grid: {
|
|
133
|
-
gutter: [__props.columnGap, __props.rowGap],
|
|
134
|
-
style: { flex: 1, marginRight: "12px" }
|
|
135
|
-
},
|
|
136
|
-
style: {
|
|
137
|
-
display: "flex",
|
|
138
|
-
overflow: "hidden",
|
|
139
|
-
height: `${expandStatus.value ? proFormHeight.value : collapseHeight.value}px`
|
|
140
|
-
}
|
|
141
|
-
} : {
|
|
142
|
-
layout: "inline",
|
|
143
|
-
style: { gap: `${__props.rowGap}px ${__props.columnGap}px` },
|
|
144
|
-
grid: false
|
|
145
|
-
}
|
|
146
|
-
);
|
|
147
|
-
const onReset = () => {
|
|
148
|
-
emit("reset");
|
|
149
|
-
};
|
|
150
|
-
const onSearch = () => {
|
|
151
|
-
emit("search");
|
|
152
|
-
};
|
|
153
|
-
return (_ctx, _cache) => {
|
|
154
|
-
return openBlock(), createBlock(unref(_sfc_main$9), mergeProps(layoutProps.value, {
|
|
155
|
-
form: __props.form,
|
|
156
|
-
class: "pro-table_search-form transition"
|
|
157
|
-
}), {
|
|
158
|
-
default: withCtx(() => [
|
|
159
|
-
createVNode(unref(Space), {
|
|
160
|
-
align: "start",
|
|
161
|
-
class: "pro-table_search-form_button-group"
|
|
162
|
-
}, {
|
|
163
|
-
default: withCtx(() => [
|
|
164
|
-
renderSlot(_ctx.$slots, "reset-button", { onClick: onReset }, () => [
|
|
165
|
-
__props.resetButton !== false ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
166
|
-
__props.resetButton ? (openBlock(), createBlock(resolveDynamicComponent(__props.resetButton), {
|
|
167
|
-
key: 0,
|
|
168
|
-
onClick: onReset
|
|
169
|
-
})) : (openBlock(), createBlock(unref(Button), {
|
|
170
|
-
key: 1,
|
|
171
|
-
class: "pro-table_search-form_reset-button",
|
|
172
|
-
onClick: onReset
|
|
173
|
-
}, {
|
|
174
|
-
default: withCtx(() => [..._cache[0] || (_cache[0] = [
|
|
175
|
-
createTextVNode("重置", -1)
|
|
176
|
-
])]),
|
|
177
|
-
_: 1
|
|
178
|
-
}))
|
|
179
|
-
], 64)) : createCommentVNode("", true)
|
|
180
|
-
], true),
|
|
181
|
-
renderSlot(_ctx.$slots, "search-button", { onClick: onSearch }, () => [
|
|
182
|
-
__props.searchButton !== false ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
183
|
-
__props.searchButton ? (openBlock(), createBlock(resolveDynamicComponent(__props.searchButton), {
|
|
184
|
-
key: 0,
|
|
185
|
-
onClick: onSearch
|
|
186
|
-
})) : (openBlock(), createBlock(unref(Button), {
|
|
187
|
-
key: 1,
|
|
188
|
-
class: "pro-table_search-form_search-button",
|
|
189
|
-
type: "primary",
|
|
190
|
-
"html-type": "submit",
|
|
191
|
-
onClick: onSearch
|
|
192
|
-
}, {
|
|
193
|
-
default: withCtx(() => [..._cache[1] || (_cache[1] = [
|
|
194
|
-
createTextVNode("查询 ", -1)
|
|
195
|
-
])]),
|
|
196
|
-
_: 1
|
|
197
|
-
}))
|
|
198
|
-
], 64)) : createCommentVNode("", true)
|
|
199
|
-
], true),
|
|
200
|
-
renderSlot(_ctx.$slots, "expand-button", { onClick: changeExpandStatus }, () => [
|
|
201
|
-
__props.expandButton !== false && showExpandToggle.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
202
|
-
__props.expandButton ? (openBlock(), createBlock(resolveDynamicComponent(__props.expandButton), {
|
|
203
|
-
key: 0,
|
|
204
|
-
"expand-status": expandStatus.value,
|
|
205
|
-
onClick: changeExpandStatus
|
|
206
|
-
}, null, 8, ["expand-status"])) : (openBlock(), createBlock(unref(Button), {
|
|
207
|
-
key: 1,
|
|
208
|
-
type: "link",
|
|
209
|
-
class: "pro-table_search-form_expand-toggle-button",
|
|
210
|
-
onClick: changeExpandStatus
|
|
211
|
-
}, {
|
|
212
|
-
default: withCtx(() => [
|
|
213
|
-
createTextVNode(toDisplayString(expandStatus.value ? "收起" : "展开") + " ", 1),
|
|
214
|
-
createVNode(DownOutlined, {
|
|
215
|
-
class: "transition",
|
|
216
|
-
style: normalizeStyle([{ "margin-left": "4px" }, { transform: `rotate(${expandStatus.value ? -180 : 0}deg)` }])
|
|
217
|
-
}, null, 8, ["style"])
|
|
218
|
-
]),
|
|
219
|
-
_: 1
|
|
220
|
-
}))
|
|
221
|
-
], 64)) : createCommentVNode("", true)
|
|
222
|
-
], true)
|
|
223
|
-
]),
|
|
224
|
-
_: 3
|
|
225
|
-
})
|
|
226
|
-
]),
|
|
227
|
-
_: 3
|
|
228
|
-
}, 16, ["form"]);
|
|
229
|
-
};
|
|
230
|
-
}
|
|
231
|
-
});
|
|
232
|
-
const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-aee49e85"]]);
|
|
233
|
-
const _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
234
|
-
__name: "DefaultSearchFormContainer",
|
|
235
|
-
setup(__props) {
|
|
236
|
-
const { token } = theme.useToken();
|
|
237
|
-
return (_ctx, _cache) => {
|
|
238
|
-
return openBlock(), createElementBlock("div", {
|
|
239
|
-
class: "pro-table_search-form-container",
|
|
240
|
-
style: normalizeStyle({ backgroundColor: unref(token).colorBgContainer })
|
|
241
|
-
}, [
|
|
242
|
-
renderSlot(_ctx.$slots, "default", {}, void 0, true)
|
|
243
|
-
], 4);
|
|
244
|
-
};
|
|
245
|
-
}
|
|
246
|
-
});
|
|
247
|
-
const DefaultSearchFormContainer = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-c385cd54"]]);
|
|
248
|
-
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
249
|
-
__name: "DefaultTableContainer",
|
|
250
|
-
setup(__props) {
|
|
251
|
-
const { token } = theme.useToken();
|
|
252
|
-
return (_ctx, _cache) => {
|
|
253
|
-
return openBlock(), createElementBlock("div", {
|
|
254
|
-
class: "pro-table_table-container",
|
|
255
|
-
style: normalizeStyle({ backgroundColor: unref(token).colorBgContainer })
|
|
256
|
-
}, [
|
|
257
|
-
renderSlot(_ctx.$slots, "default", {}, void 0, true)
|
|
258
|
-
], 4);
|
|
259
|
-
};
|
|
260
|
-
}
|
|
261
|
-
});
|
|
262
|
-
const DefaultTableContainer = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-ac3cdb51"]]);
|
|
263
|
-
const _sfc_main$4 = {};
|
|
264
|
-
const _hoisted_1$2 = {
|
|
265
|
-
focusable: "false",
|
|
266
|
-
"data-icon": "column-height",
|
|
267
|
-
width: "1em",
|
|
268
|
-
height: "1em",
|
|
269
|
-
fill: "currentColor",
|
|
270
|
-
"aria-hidden": "true",
|
|
271
|
-
viewBox: "64 64 896 896"
|
|
272
|
-
};
|
|
273
|
-
function _sfc_render$1(_ctx, _cache) {
|
|
274
|
-
return openBlock(), createElementBlock("svg", _hoisted_1$2, [..._cache[0] || (_cache[0] = [
|
|
275
|
-
createElementVNode("path", { d: "M840 836H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zm0-724H184c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h656c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8zM610.8 378c6 0 9.4-7 5.7-11.7L515.7 238.7a7.14 7.14 0 00-11.3 0L403.6 366.3a7.23 7.23 0 005.7 11.7H476v268h-62.8c-6 0-9.4 7-5.7 11.7l100.8 127.5c2.9 3.7 8.5 3.7 11.3 0l100.8-127.5c3.7-4.7.4-11.7-5.7-11.7H548V378h62.8z" }, null, -1)
|
|
276
|
-
])]);
|
|
277
|
-
}
|
|
278
|
-
const ColumnHeightOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$1]]);
|
|
279
|
-
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
280
|
-
__name: "SizeControl",
|
|
281
|
-
props: {
|
|
282
|
-
"size": {},
|
|
283
|
-
"sizeModifiers": {}
|
|
284
|
-
},
|
|
285
|
-
emits: ["update:size"],
|
|
286
|
-
setup(__props) {
|
|
287
|
-
var _a;
|
|
288
|
-
const configContext = useConfigContextInject();
|
|
289
|
-
const size = useModel(__props, "size");
|
|
290
|
-
size.value = size.value ?? ((_a = configContext.componentSize) == null ? void 0 : _a.value) ?? "large";
|
|
291
|
-
const onSizeChange = (val) => {
|
|
292
|
-
size.value = val.key;
|
|
293
|
-
};
|
|
294
|
-
const sizeOptions = [
|
|
295
|
-
{ label: "默认", key: "large" },
|
|
296
|
-
{ label: "中等", key: "middle" },
|
|
297
|
-
{ label: "紧凑", key: "small" }
|
|
298
|
-
];
|
|
299
|
-
return (_ctx, _cache) => {
|
|
300
|
-
return openBlock(), createBlock(unref(Dropdown), {
|
|
301
|
-
arrow: "",
|
|
302
|
-
placement: "bottomRight"
|
|
303
|
-
}, {
|
|
304
|
-
overlay: withCtx(() => [
|
|
305
|
-
createVNode(unref(Menu), {
|
|
306
|
-
style: { "width": "100px", "text-align": "center" },
|
|
307
|
-
"selected-keys": size.value ? [size.value] : [],
|
|
308
|
-
items: sizeOptions,
|
|
309
|
-
onClick: onSizeChange
|
|
310
|
-
}, null, 8, ["selected-keys"])
|
|
311
|
-
]),
|
|
312
|
-
default: withCtx(() => [
|
|
313
|
-
createVNode(unref(Button), {
|
|
314
|
-
type: "text",
|
|
315
|
-
class: "pro-table_size-control_button"
|
|
316
|
-
}, {
|
|
317
|
-
default: withCtx(() => [
|
|
318
|
-
createVNode(ColumnHeightOutlined)
|
|
319
|
-
]),
|
|
320
|
-
_: 1
|
|
321
|
-
})
|
|
322
|
-
]),
|
|
323
|
-
_: 1
|
|
324
|
-
});
|
|
325
|
-
};
|
|
326
|
-
}
|
|
327
|
-
});
|
|
328
|
-
const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-db17998d"]]);
|
|
329
|
-
const _sfc_main$2 = {};
|
|
330
|
-
const _hoisted_1$1 = {
|
|
331
|
-
focusable: "false",
|
|
332
|
-
"data-icon": "filter",
|
|
333
|
-
width: "1em",
|
|
334
|
-
height: "1em",
|
|
335
|
-
fill: "currentColor",
|
|
336
|
-
"aria-hidden": "true",
|
|
337
|
-
viewBox: "64 64 896 896"
|
|
338
|
-
};
|
|
339
|
-
function _sfc_render(_ctx, _cache) {
|
|
340
|
-
return openBlock(), createElementBlock("svg", _hoisted_1$1, [..._cache[0] || (_cache[0] = [
|
|
341
|
-
createElementVNode("path", { d: "M880.1 154H143.9c-24.5 0-39.8 26.7-27.5 48L349 597.4V838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3 31.8-32V597.4L907.7 202c12.2-21.3-3.1-48-27.6-48zM603.4 798H420.6V642h182.9v156zm9.6-236.6l-9.5 16.6h-183l-9.5-16.6L212.7 226h598.6L613 561.4z" }, null, -1)
|
|
342
|
-
])]);
|
|
343
|
-
}
|
|
344
|
-
const FilterOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render]]);
|
|
345
|
-
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
346
|
-
__name: "ColumnControl",
|
|
347
|
-
props: {
|
|
348
|
-
columns: {},
|
|
349
|
-
table: { default: () => void 0 }
|
|
350
|
-
},
|
|
351
|
-
setup(__props) {
|
|
352
|
-
const open = ref(false);
|
|
353
|
-
const checkAll = ref(false);
|
|
354
|
-
const indeterminate = ref(false);
|
|
355
|
-
const checkedColumnsOptions = computed(
|
|
356
|
-
() => __props.columns.flatMap(
|
|
357
|
-
(item) => item.key && item.title ? {
|
|
358
|
-
label: item.title,
|
|
359
|
-
value: item.key,
|
|
360
|
-
checked: !item.hidden
|
|
361
|
-
} : []
|
|
362
|
-
)
|
|
363
|
-
);
|
|
364
|
-
const checkedColumnKeys = computed({
|
|
365
|
-
get() {
|
|
366
|
-
return checkedColumnsOptions.value.flatMap(
|
|
367
|
-
(item) => item.checked ? item.value : []
|
|
368
|
-
) || [];
|
|
369
|
-
},
|
|
370
|
-
set(val) {
|
|
371
|
-
var _a;
|
|
372
|
-
(_a = checkedColumnsOptions.value) == null ? void 0 : _a.forEach((item) => {
|
|
373
|
-
var _a2, _b;
|
|
374
|
-
(_b = (_a2 = __props.table) == null ? void 0 : _a2.setColumn) == null ? void 0 : _b.call(_a2, item.value, {
|
|
375
|
-
hidden: !val.includes(item.value)
|
|
376
|
-
});
|
|
377
|
-
});
|
|
378
|
-
}
|
|
379
|
-
});
|
|
380
|
-
const onCheckAllChange = (e) => {
|
|
381
|
-
checkedColumnKeys.value = e.target.checked ? checkedColumnsOptions.value.map((item) => item.value) : [];
|
|
382
|
-
indeterminate.value = false;
|
|
383
|
-
};
|
|
384
|
-
const checkColumnsMenuItemClick = (val) => {
|
|
385
|
-
if (checkedColumnKeys.value.includes(val)) {
|
|
386
|
-
checkedColumnKeys.value = checkedColumnKeys.value.filter(
|
|
387
|
-
(item) => item !== val
|
|
388
|
-
);
|
|
389
|
-
} else {
|
|
390
|
-
checkedColumnKeys.value = [...checkedColumnKeys.value, val];
|
|
391
|
-
}
|
|
392
|
-
};
|
|
393
|
-
watch(
|
|
394
|
-
checkedColumnKeys,
|
|
395
|
-
(val) => {
|
|
396
|
-
indeterminate.value = !!val.length && val.length < checkedColumnsOptions.value.length;
|
|
397
|
-
checkAll.value = val.length === checkedColumnsOptions.value.length;
|
|
398
|
-
},
|
|
399
|
-
{ immediate: true }
|
|
400
|
-
);
|
|
401
|
-
return (_ctx, _cache) => {
|
|
402
|
-
return openBlock(), createBlock(unref(Dropdown), {
|
|
403
|
-
open: open.value,
|
|
404
|
-
"onUpdate:open": _cache[1] || (_cache[1] = ($event) => open.value = $event),
|
|
405
|
-
arrow: "",
|
|
406
|
-
placement: "bottomRight"
|
|
407
|
-
}, {
|
|
408
|
-
overlay: withCtx(() => [
|
|
409
|
-
createVNode(unref(Menu), {
|
|
410
|
-
style: { "min-width": "100px", "max-height": "500px", "overflow-y": "scroll" },
|
|
411
|
-
selectable: false
|
|
412
|
-
}, {
|
|
413
|
-
default: withCtx(() => [
|
|
414
|
-
(openBlock(), createBlock(unref(MenuItem), { key: 0 }, {
|
|
415
|
-
default: withCtx(() => [
|
|
416
|
-
createElementVNode("div", null, [
|
|
417
|
-
createVNode(unref(Checkbox), {
|
|
418
|
-
checked: checkAll.value,
|
|
419
|
-
indeterminate: indeterminate.value,
|
|
420
|
-
onChange: onCheckAllChange
|
|
421
|
-
}, {
|
|
422
|
-
default: withCtx(() => [..._cache[2] || (_cache[2] = [
|
|
423
|
-
createTextVNode(" 全选 ", -1)
|
|
424
|
-
])]),
|
|
425
|
-
_: 1
|
|
426
|
-
}, 8, ["checked", "indeterminate"])
|
|
427
|
-
])
|
|
428
|
-
]),
|
|
429
|
-
_: 1
|
|
430
|
-
})),
|
|
431
|
-
createVNode(unref(MenuDivider)),
|
|
432
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(checkedColumnsOptions.value, (item) => {
|
|
433
|
-
return openBlock(), createBlock(unref(MenuItem), {
|
|
434
|
-
key: item.value,
|
|
435
|
-
onClick: ($event) => checkColumnsMenuItemClick(item.value)
|
|
436
|
-
}, {
|
|
437
|
-
default: withCtx(() => [
|
|
438
|
-
createVNode(unref(Checkbox), {
|
|
439
|
-
checked: checkedColumnKeys.value.includes(item.value)
|
|
440
|
-
}, {
|
|
441
|
-
default: withCtx(() => [
|
|
442
|
-
createElementVNode("div", {
|
|
443
|
-
onClick: _cache[0] || (_cache[0] = withModifiers(() => {
|
|
444
|
-
}, ["stop"]))
|
|
445
|
-
}, toDisplayString(item.label), 1)
|
|
446
|
-
]),
|
|
447
|
-
_: 2
|
|
448
|
-
}, 1032, ["checked"])
|
|
449
|
-
]),
|
|
450
|
-
_: 2
|
|
451
|
-
}, 1032, ["onClick"]);
|
|
452
|
-
}), 128))
|
|
453
|
-
]),
|
|
454
|
-
_: 1
|
|
455
|
-
})
|
|
456
|
-
]),
|
|
457
|
-
default: withCtx(() => [
|
|
458
|
-
createVNode(unref(Button), {
|
|
459
|
-
type: "text",
|
|
460
|
-
class: "pro-table_column-control_button"
|
|
461
|
-
}, {
|
|
462
|
-
default: withCtx(() => [
|
|
463
|
-
createVNode(FilterOutlined)
|
|
464
|
-
]),
|
|
465
|
-
_: 1
|
|
466
|
-
})
|
|
467
|
-
]),
|
|
468
|
-
_: 1
|
|
469
|
-
}, 8, ["open"]);
|
|
470
|
-
};
|
|
471
|
-
}
|
|
472
|
-
});
|
|
473
|
-
const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d503f78a"]]);
|
|
474
|
-
const _hoisted_1 = { class: "pro-table_header" };
|
|
475
|
-
const _hoisted_2 = {
|
|
476
|
-
key: 0,
|
|
477
|
-
class: "pro-table_header_button-bar"
|
|
478
|
-
};
|
|
479
|
-
const _hoisted_3 = {
|
|
480
|
-
key: 1,
|
|
481
|
-
class: "pro-table_header_toolbar"
|
|
482
|
-
};
|
|
483
|
-
const _hoisted_4 = {
|
|
484
|
-
key: 2,
|
|
485
|
-
class: "pro-table_header_size-control"
|
|
486
|
-
};
|
|
487
|
-
const _hoisted_5 = {
|
|
488
|
-
key: 3,
|
|
489
|
-
class: "pro-table_header_column-control"
|
|
490
|
-
};
|
|
491
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
492
|
-
...{ name: "ProTable", inheritAttrs: false },
|
|
493
|
-
__name: "ProTable",
|
|
494
|
-
props: /* @__PURE__ */ mergeModels({
|
|
495
|
-
table: { default: () => void 0 },
|
|
496
|
-
search: { type: Function, default: void 0 },
|
|
497
|
-
addIndexColumn: { type: Boolean, default: () => void 0 },
|
|
498
|
-
immediateSearch: { type: Boolean, default: () => void 0 },
|
|
499
|
-
control: { type: [Boolean, Object], default: () => void 0 },
|
|
500
|
-
searchFormConfig: { default: () => void 0 },
|
|
501
|
-
tableContainer: { type: [Object, Function, Boolean], default: void 0 }
|
|
502
|
-
}, {
|
|
503
|
-
"size": {},
|
|
504
|
-
"sizeModifiers": {},
|
|
505
|
-
"loading": { type: Boolean },
|
|
506
|
-
"loadingModifiers": {}
|
|
507
|
-
}),
|
|
508
|
-
emits: ["update:size", "update:loading"],
|
|
509
|
-
setup(__props) {
|
|
510
|
-
const config = INJECT_CONFIG["pro-table"];
|
|
511
|
-
const injectProps = inject(config.injectionKey, config.default);
|
|
512
|
-
const tableProperties = Object.keys(tableProps());
|
|
513
|
-
const injectAttrs = pick(injectProps, tableProperties);
|
|
514
|
-
const computedSearchFormConfig = computed(() => {
|
|
515
|
-
var _a, _b;
|
|
516
|
-
const container = ((_a = __props.searchFormConfig) == null ? void 0 : _a.container) ?? ((_b = injectProps.searchFormConfig) == null ? void 0 : _b.container) ?? DefaultSearchFormContainer;
|
|
517
|
-
return {
|
|
518
|
-
...injectProps.searchFormConfig,
|
|
519
|
-
...getObject(__props.searchFormConfig),
|
|
520
|
-
container: container ? container : void 0
|
|
521
|
-
};
|
|
522
|
-
});
|
|
523
|
-
const attrs = useAttrs();
|
|
524
|
-
const tableAttrs = computed(() => {
|
|
525
|
-
return pick(camelizeProperties(attrs), tableProperties);
|
|
526
|
-
});
|
|
527
|
-
const { columns, dataSource, searchForm, pageParam, setPageParam } = __props.table || {};
|
|
528
|
-
const size = useModel(__props, "size");
|
|
529
|
-
const loading = useModel(__props, "loading");
|
|
530
|
-
const _search = async () => {
|
|
531
|
-
var _a;
|
|
532
|
-
try {
|
|
533
|
-
loading.value = true;
|
|
534
|
-
await ((_a = __props.search) == null ? void 0 : _a.call(__props));
|
|
535
|
-
} finally {
|
|
536
|
-
loading.value = false;
|
|
537
|
-
}
|
|
538
|
-
};
|
|
539
|
-
const reset = () => {
|
|
540
|
-
var _a;
|
|
541
|
-
(_a = __props.table) == null ? void 0 : _a.resetQueryParams();
|
|
542
|
-
nextTick(() => {
|
|
543
|
-
_search();
|
|
544
|
-
});
|
|
545
|
-
};
|
|
546
|
-
const slots = useSlots();
|
|
547
|
-
const {
|
|
548
|
-
"search-form": searchFormSlot,
|
|
549
|
-
"button-bar": buttonBarSlot,
|
|
550
|
-
toolbar: toolbarSlot,
|
|
551
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
552
|
-
table: tableSlot,
|
|
553
|
-
...tableSlots
|
|
554
|
-
} = slots;
|
|
555
|
-
const searchPage1st = () => {
|
|
556
|
-
setPageParam == null ? void 0 : setPageParam({ current: 1 });
|
|
557
|
-
_search();
|
|
558
|
-
};
|
|
559
|
-
const computedTableProps = computed(() => {
|
|
560
|
-
return {
|
|
561
|
-
...injectAttrs,
|
|
562
|
-
...tableAttrs.value,
|
|
563
|
-
pagination: void 0,
|
|
564
|
-
onChange: void 0
|
|
565
|
-
};
|
|
566
|
-
});
|
|
567
|
-
const computedTableContainer = computed(() => {
|
|
568
|
-
const container = __props.tableContainer ?? injectProps.tableContainer ?? DefaultTableContainer;
|
|
569
|
-
return container ? container : void 0;
|
|
570
|
-
});
|
|
571
|
-
const indexColumn = {
|
|
572
|
-
title: "序号",
|
|
573
|
-
dataIndex: "_index",
|
|
574
|
-
width: 80,
|
|
575
|
-
customRender: ({ index }) => index + 1
|
|
576
|
-
};
|
|
577
|
-
const computedColumns = computed(
|
|
578
|
-
() => [
|
|
579
|
-
...__props.addIndexColumn ?? injectProps.addIndexColumn ? [indexColumn] : [],
|
|
580
|
-
...(tableAttrs.value.columns ?? (columns == null ? void 0 : columns.value) ?? []).flatMap(
|
|
581
|
-
(item, index) => {
|
|
582
|
-
if (item.key) return [{ ...item, key: item.key }];
|
|
583
|
-
if (item.dataIndex) {
|
|
584
|
-
const dataIndexKey = Array.isArray(item.dataIndex) ? item.dataIndex.join(".") : item.dataIndex;
|
|
585
|
-
return [{ ...item, key: dataIndexKey }];
|
|
586
|
-
}
|
|
587
|
-
return [{ ...item, key: index }];
|
|
588
|
-
}
|
|
589
|
-
)
|
|
590
|
-
]
|
|
591
|
-
);
|
|
592
|
-
const visibleComputedColumns = computed(() => {
|
|
593
|
-
return computedColumns.value.filter((item) => !item.hidden);
|
|
594
|
-
});
|
|
595
|
-
const computedDataSource = computed(() => {
|
|
596
|
-
return tableAttrs.value.dataSource ?? (dataSource == null ? void 0 : dataSource.value);
|
|
597
|
-
});
|
|
598
|
-
const computedPagination = computed(() => {
|
|
599
|
-
if (tableAttrs.value.pagination === false) return false;
|
|
600
|
-
return {
|
|
601
|
-
...injectAttrs.pagination,
|
|
602
|
-
...pageParam,
|
|
603
|
-
...tableAttrs.value.pagination
|
|
604
|
-
};
|
|
605
|
-
});
|
|
606
|
-
const onTableChange = (...args) => {
|
|
607
|
-
var _a;
|
|
608
|
-
setPageParam == null ? void 0 : setPageParam(args[0]);
|
|
609
|
-
(_a = attrs.onChange) == null ? void 0 : _a.call(attrs, ...args);
|
|
610
|
-
_search();
|
|
611
|
-
};
|
|
612
|
-
const showSearch = computed(() => {
|
|
613
|
-
var _a, _b;
|
|
614
|
-
return !!(searchFormSlot || ((_a = computedSearchFormConfig.value) == null ? void 0 : _a.hidden) !== true && searchForm && ((_b = searchForm.fields.value.filter((item) => !item.hidden)) == null ? void 0 : _b.length) > 0);
|
|
615
|
-
});
|
|
616
|
-
const computedControl = computed(() => {
|
|
617
|
-
const mergedControl = __props.control ?? injectProps.control;
|
|
618
|
-
const sizeControl = (mergedControl == null ? void 0 : mergedControl.sizeControl) ?? mergedControl;
|
|
619
|
-
const columnControl = (mergedControl == null ? void 0 : mergedControl.columnControl) ?? mergedControl;
|
|
620
|
-
return { sizeControl, columnControl };
|
|
621
|
-
});
|
|
622
|
-
onMounted(() => {
|
|
623
|
-
if (__props.immediateSearch ?? injectProps.immediateSearch) {
|
|
624
|
-
_search();
|
|
625
|
-
}
|
|
626
|
-
});
|
|
627
|
-
return (_ctx, _cache) => {
|
|
628
|
-
return openBlock(), createElementBlock("div", {
|
|
629
|
-
class: normalizeClass(["pro-table", _ctx.$attrs.class]),
|
|
630
|
-
style: normalizeStyle(_ctx.$attrs.style)
|
|
631
|
-
}, [
|
|
632
|
-
showSearch.value ? (openBlock(), createBlock(unref(_sfc_main$a), {
|
|
633
|
-
key: 0,
|
|
634
|
-
component: computedSearchFormConfig.value.container
|
|
635
|
-
}, {
|
|
636
|
-
default: withCtx(() => [
|
|
637
|
-
renderSlot(_ctx.$slots, "search-form", {}, () => [
|
|
638
|
-
unref(searchForm) ? (openBlock(), createBlock(SearchForm, mergeProps({
|
|
639
|
-
key: 0,
|
|
640
|
-
form: unref(searchForm)
|
|
641
|
-
}, computedSearchFormConfig.value, {
|
|
642
|
-
onSearch: searchPage1st,
|
|
643
|
-
onReset: reset
|
|
644
|
-
}), null, 16, ["form"])) : createCommentVNode("", true)
|
|
645
|
-
], true)
|
|
646
|
-
]),
|
|
647
|
-
_: 3
|
|
648
|
-
}, 8, ["component"])) : createCommentVNode("", true),
|
|
649
|
-
createVNode(unref(_sfc_main$a), { component: computedTableContainer.value }, {
|
|
650
|
-
default: withCtx(() => [
|
|
651
|
-
createElementVNode("div", _hoisted_1, [
|
|
652
|
-
unref(buttonBarSlot) ? (openBlock(), createElementBlock("div", _hoisted_2, [
|
|
653
|
-
renderSlot(_ctx.$slots, "button-bar", {}, void 0, true)
|
|
654
|
-
])) : createCommentVNode("", true),
|
|
655
|
-
unref(toolbarSlot) ? (openBlock(), createElementBlock("div", _hoisted_3, [
|
|
656
|
-
renderSlot(_ctx.$slots, "toolbar", {}, void 0, true)
|
|
657
|
-
])) : createCommentVNode("", true),
|
|
658
|
-
computedControl.value.sizeControl ? (openBlock(), createElementBlock("div", _hoisted_4, [
|
|
659
|
-
createVNode(unref(SizeControl), {
|
|
660
|
-
size: size.value,
|
|
661
|
-
"onUpdate:size": _cache[0] || (_cache[0] = ($event) => size.value = $event)
|
|
662
|
-
}, null, 8, ["size"])
|
|
663
|
-
])) : createCommentVNode("", true),
|
|
664
|
-
computedControl.value.columnControl ? (openBlock(), createElementBlock("div", _hoisted_5, [
|
|
665
|
-
createVNode(unref(ColumnControl), {
|
|
666
|
-
columns: computedColumns.value,
|
|
667
|
-
table: __props.table
|
|
668
|
-
}, null, 8, ["columns", "table"])
|
|
669
|
-
])) : createCommentVNode("", true)
|
|
670
|
-
]),
|
|
671
|
-
renderSlot(_ctx.$slots, "table", {}, () => [
|
|
672
|
-
createVNode(unref(Table), mergeProps({ class: "pro-table_content" }, computedTableProps.value, {
|
|
673
|
-
size: size.value,
|
|
674
|
-
loading: loading.value,
|
|
675
|
-
columns: visibleComputedColumns.value,
|
|
676
|
-
"data-source": computedDataSource.value,
|
|
677
|
-
pagination: computedPagination.value,
|
|
678
|
-
onChange: onTableChange
|
|
679
|
-
}), createSlots({ _: 2 }, [
|
|
680
|
-
renderList(tableSlots, (_, name) => {
|
|
681
|
-
return {
|
|
682
|
-
name,
|
|
683
|
-
fn: withCtx((scoped) => [
|
|
684
|
-
renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(scoped)), void 0, true)
|
|
685
|
-
])
|
|
686
|
-
};
|
|
687
|
-
})
|
|
688
|
-
]), 1040, ["size", "loading", "columns", "data-source", "pagination"])
|
|
689
|
-
], true)
|
|
690
|
-
]),
|
|
691
|
-
_: 3
|
|
692
|
-
}, 8, ["component"])
|
|
693
|
-
], 6);
|
|
694
|
-
};
|
|
695
|
-
}
|
|
696
|
-
});
|
|
697
|
-
const ProTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-856c096b"]]);
|
|
698
|
-
function useTable(params) {
|
|
699
|
-
return useTable$1(params);
|
|
700
|
-
}
|
|
701
|
-
export {
|
|
702
|
-
ProTable as default,
|
|
703
|
-
useTable
|
|
704
|
-
};
|
|
705
|
-
//# sourceMappingURL=index.js.map
|