@qin-ui/element-plus-pro 1.0.0

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.
@@ -0,0 +1,880 @@
1
+ import { createElementBlock, openBlock, createElementVNode, defineComponent, ref, computed, watch, watchEffect, createBlock, unref, mergeProps, withKeys, withCtx, createVNode, renderSlot, resolveDynamicComponent, createTextVNode, createCommentVNode, Fragment, toDisplayString, normalizeStyle, useModel, renderList, withModifiers, resolveComponent, mergeModels, inject, useAttrs, useSlots, onMounted, resolveDirective, normalizeClass, withDirectives, createSlots, normalizeProps, guardReactiveProps, nextTick } from "vue";
2
+ import { ElSpace, ElButton, ElDropdown, ElDropdownMenu, ElDropdownItem, ElCheckbox, ElTableColumn, ElTable, ElPagination } from "element-plus";
3
+ import { _ as _export_sfc, a as _sfc_main$a, t as tableProps, p as paginationProps, b as _sfc_main$b } from "../form/index-BvqMIOZ8.js";
4
+ import { INJECT_CONFIG } from "../component-provider/index.js";
5
+ import { c as camelizeProperties, g as getObject, f as useTable$1 } from "../core/index-VQxpXgLX.js";
6
+ import { g as get, t as toPath, p as pick } from "../vendor/utils/lodash-es-p6jau26B.js";
7
+ const _sfc_main$9 = {};
8
+ const _hoisted_1$5 = {
9
+ focusable: "false",
10
+ "data-icon": "down",
11
+ width: "1em",
12
+ height: "1em",
13
+ fill: "currentColor",
14
+ "aria-hidden": "true",
15
+ viewBox: "64 64 896 896"
16
+ };
17
+ function _sfc_render$4(_ctx, _cache) {
18
+ return openBlock(), createElementBlock("svg", _hoisted_1$5, [..._cache[0] || (_cache[0] = [
19
+ 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)
20
+ ])]);
21
+ }
22
+ const DownOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$4]]);
23
+ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
24
+ ...{ name: "SearchForm" },
25
+ __name: "SearchForm",
26
+ props: {
27
+ form: {},
28
+ layout: { default: "grid" },
29
+ expand: { type: [Boolean, Object], default: true },
30
+ searchButton: { type: [Object, Function], default: void 0 },
31
+ resetButton: { type: [Object, Function], default: void 0 },
32
+ expandButton: { type: [Object, Function], default: void 0 },
33
+ class: {},
34
+ style: {}
35
+ },
36
+ emits: ["search", "reset"],
37
+ setup(__props, { emit: __emit }) {
38
+ const emit = __emit;
39
+ const proFormHeight = ref("unset");
40
+ const collapseHeight = ref(0);
41
+ let rowHeight = 32;
42
+ const rowGap = 16;
43
+ const columnGap = 24;
44
+ const computedExpand = computed(() => {
45
+ if (!__props.expand) return false;
46
+ if (__props.expand === true) return { minExpandRows: 2, expandStatus: false };
47
+ return {
48
+ minExpandRows: Math.max(Math.floor(__props.expand.minExpandRows ?? 2), 1),
49
+ expandStatus: __props.expand.expandStatus ?? false
50
+ };
51
+ });
52
+ const showExpandToggle = ref(false);
53
+ const expandStatus = ref(true);
54
+ const changeExpandStatus = () => {
55
+ expandStatus.value = !expandStatus.value;
56
+ };
57
+ const { formRef, getFormData } = __props.form;
58
+ const setInitExpandStatus = () => {
59
+ expandStatus.value = false;
60
+ if (formRef.value && __props.expand) {
61
+ const formEl = formRef.value.$el;
62
+ const formItemsEl = formEl.querySelectorAll(
63
+ "[class*='-form-item'] > [path]"
64
+ );
65
+ const observer = new IntersectionObserver(
66
+ (entries) => {
67
+ expandStatus.value = entries.some((e) => {
68
+ if (e.intersectionRatio === 0) {
69
+ const path = e.target.getAttribute("path");
70
+ const searchFieldValue = path ? getFormData == null ? void 0 : getFormData(path) : void 0;
71
+ return ![null, void 0].includes(searchFieldValue);
72
+ }
73
+ return __props.expand.expandStatus;
74
+ });
75
+ observer.disconnect();
76
+ },
77
+ { root: formEl }
78
+ );
79
+ formItemsEl.forEach((element) => {
80
+ observer.observe(element);
81
+ });
82
+ }
83
+ };
84
+ watch(
85
+ [
86
+ () => {
87
+ var _a, _b, _c;
88
+ 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;
89
+ },
90
+ () => formRef.value
91
+ ],
92
+ () => {
93
+ var _a, _b, _c, _d, _e;
94
+ if (!expandStatus.value || !formRef.value) return;
95
+ const proFormEl = (_a = formRef.value) == null ? void 0 : _a.$el;
96
+ const { height = 0 } = ((_b = proFormEl == null ? void 0 : proFormEl.getBoundingClientRect) == null ? void 0 : _b.call(proFormEl)) || {};
97
+ proFormHeight.value = height;
98
+ 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;
99
+ },
100
+ { flush: "post", immediate: true }
101
+ );
102
+ watchEffect(
103
+ () => {
104
+ if (typeof proFormHeight.value !== "number") return;
105
+ if (__props.layout === "grid" && computedExpand.value) {
106
+ const { minExpandRows } = computedExpand.value;
107
+ collapseHeight.value = Math.min(
108
+ minExpandRows * rowHeight + (minExpandRows - 1) * rowGap,
109
+ +proFormHeight.value
110
+ );
111
+ showExpandToggle.value = +proFormHeight.value - collapseHeight.value > 1;
112
+ if (showExpandToggle.value) {
113
+ setInitExpandStatus();
114
+ }
115
+ } else {
116
+ showExpandToggle.value = false;
117
+ }
118
+ },
119
+ { flush: "post" }
120
+ );
121
+ const layoutProps = computed(
122
+ () => __props.layout === "grid" ? {
123
+ grid: {
124
+ gutter: columnGap,
125
+ style: { rowGap: `${rowGap}px` }
126
+ },
127
+ style: {
128
+ display: "flex",
129
+ overflow: "hidden",
130
+ columnGap: `${columnGap}px`,
131
+ height: `${expandStatus.value ? proFormHeight.value : collapseHeight.value}px`
132
+ }
133
+ } : {
134
+ inline: true,
135
+ style: {
136
+ display: "flex",
137
+ flexWrap: "wrap",
138
+ gap: `${rowGap}px ${columnGap}px`
139
+ },
140
+ grid: false
141
+ }
142
+ );
143
+ const onReset = () => {
144
+ emit("reset");
145
+ };
146
+ const onSearch = () => {
147
+ emit("search");
148
+ };
149
+ return (_ctx, _cache) => {
150
+ return openBlock(), createBlock(unref(_sfc_main$a), mergeProps(layoutProps.value, {
151
+ form: __props.form,
152
+ class: "pro-table_search-form transition",
153
+ onKeyup: withKeys(onSearch, ["enter"])
154
+ }), {
155
+ default: withCtx(() => [
156
+ createVNode(unref(ElSpace), {
157
+ alignment: "start",
158
+ class: "pro-table_search-form_button-group"
159
+ }, {
160
+ default: withCtx(() => [
161
+ renderSlot(_ctx.$slots, "reset-button", { onClick: onReset }, () => [
162
+ __props.resetButton ? (openBlock(), createBlock(resolveDynamicComponent(__props.resetButton), {
163
+ key: 0,
164
+ onClick: onReset
165
+ })) : (openBlock(), createBlock(unref(ElButton), {
166
+ key: 1,
167
+ class: "pro-table_search-form_reset-button",
168
+ onClick: onReset
169
+ }, {
170
+ default: withCtx(() => [..._cache[0] || (_cache[0] = [
171
+ createTextVNode("重置", -1)
172
+ ])]),
173
+ _: 1
174
+ }))
175
+ ], true),
176
+ renderSlot(_ctx.$slots, "search-button", { onClick: onSearch }, () => [
177
+ __props.searchButton ? (openBlock(), createBlock(resolveDynamicComponent(__props.searchButton), {
178
+ key: 0,
179
+ onClick: onSearch
180
+ })) : (openBlock(), createBlock(unref(ElButton), {
181
+ key: 1,
182
+ class: "pro-table_search-form_search-button",
183
+ type: "primary",
184
+ "native-type": "submit",
185
+ onClick: onSearch
186
+ }, {
187
+ default: withCtx(() => [..._cache[1] || (_cache[1] = [
188
+ createTextVNode(" 查询 ", -1)
189
+ ])]),
190
+ _: 1
191
+ }))
192
+ ], true),
193
+ renderSlot(_ctx.$slots, "expand-button", { onClick: changeExpandStatus }, () => [
194
+ showExpandToggle.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
195
+ __props.expandButton ? (openBlock(), createBlock(resolveDynamicComponent(__props.expandButton), {
196
+ key: 0,
197
+ "expand-status": expandStatus.value,
198
+ onClick: changeExpandStatus
199
+ }, null, 8, ["expand-status"])) : (openBlock(), createBlock(unref(ElButton), {
200
+ key: 1,
201
+ text: "",
202
+ class: "pro-table_search-form_expand-toggle-button",
203
+ onClick: changeExpandStatus
204
+ }, {
205
+ default: withCtx(() => [
206
+ createTextVNode(toDisplayString(expandStatus.value ? "收起" : "展开") + " ", 1),
207
+ createVNode(DownOutlined, {
208
+ class: "transition",
209
+ style: normalizeStyle([{ "margin-left": "4px" }, { transform: `rotate(${expandStatus.value ? -180 : 0}deg)` }])
210
+ }, null, 8, ["style"])
211
+ ]),
212
+ _: 1
213
+ }))
214
+ ], 64)) : createCommentVNode("", true)
215
+ ], true)
216
+ ]),
217
+ _: 3
218
+ })
219
+ ]),
220
+ _: 3
221
+ }, 16, ["form"]);
222
+ };
223
+ }
224
+ });
225
+ const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-f615ff61"]]);
226
+ const _sfc_main$7 = {};
227
+ const _hoisted_1$4 = { class: "pro-table_search-form-container" };
228
+ function _sfc_render$3(_ctx, _cache) {
229
+ return openBlock(), createElementBlock("div", _hoisted_1$4, [
230
+ renderSlot(_ctx.$slots, "default", {}, void 0, true)
231
+ ]);
232
+ }
233
+ const DefaultSearchFormContainer = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$3], ["__scopeId", "data-v-45e627f4"]]);
234
+ const _sfc_main$6 = {};
235
+ const _hoisted_1$3 = { class: "pro-table_table-container" };
236
+ function _sfc_render$2(_ctx, _cache) {
237
+ return openBlock(), createElementBlock("div", _hoisted_1$3, [
238
+ renderSlot(_ctx.$slots, "default", {}, void 0, true)
239
+ ]);
240
+ }
241
+ const DefaultTableContainer = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$2], ["__scopeId", "data-v-55d01897"]]);
242
+ const _sfc_main$5 = {};
243
+ const _hoisted_1$2 = {
244
+ focusable: "false",
245
+ "data-icon": "column-height",
246
+ width: "1em",
247
+ height: "1em",
248
+ fill: "currentColor",
249
+ "aria-hidden": "true",
250
+ viewBox: "64 64 896 896"
251
+ };
252
+ function _sfc_render$1(_ctx, _cache) {
253
+ return openBlock(), createElementBlock("svg", _hoisted_1$2, [..._cache[0] || (_cache[0] = [
254
+ 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)
255
+ ])]);
256
+ }
257
+ const ColumnHeightOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$1]]);
258
+ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
259
+ __name: "SizeControl",
260
+ props: {
261
+ "size": {},
262
+ "sizeModifiers": {}
263
+ },
264
+ emits: ["update:size"],
265
+ setup(__props) {
266
+ const size = useModel(__props, "size");
267
+ size.value = size.value ?? "default";
268
+ const items = [
269
+ { label: "默认", key: "default" },
270
+ { label: "中等", key: "large" },
271
+ { label: "紧凑", key: "small" }
272
+ ];
273
+ return (_ctx, _cache) => {
274
+ return openBlock(), createBlock(unref(ElDropdown), {
275
+ trigger: "click",
276
+ onCommand: _cache[0] || (_cache[0] = (val) => size.value = val)
277
+ }, {
278
+ dropdown: withCtx(() => [
279
+ createVNode(unref(ElDropdownMenu), null, {
280
+ default: withCtx(() => [
281
+ (openBlock(), createElementBlock(Fragment, null, renderList(items, (item) => {
282
+ return createVNode(unref(ElDropdownItem), {
283
+ key: item.key,
284
+ command: item.key,
285
+ disabled: item.key === size.value
286
+ }, {
287
+ default: withCtx(() => [
288
+ createTextVNode(toDisplayString(item.label), 1)
289
+ ]),
290
+ _: 2
291
+ }, 1032, ["command", "disabled"]);
292
+ }), 64))
293
+ ]),
294
+ _: 1
295
+ })
296
+ ]),
297
+ default: withCtx(() => [
298
+ createVNode(unref(ElButton), {
299
+ text: "",
300
+ class: "pro-table_size-control_button"
301
+ }, {
302
+ default: withCtx(() => [
303
+ createVNode(ColumnHeightOutlined)
304
+ ]),
305
+ _: 1
306
+ })
307
+ ]),
308
+ _: 1
309
+ });
310
+ };
311
+ }
312
+ });
313
+ const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-7af52d04"]]);
314
+ const _sfc_main$3 = {};
315
+ const _hoisted_1$1 = {
316
+ focusable: "false",
317
+ "data-icon": "filter",
318
+ width: "1em",
319
+ height: "1em",
320
+ fill: "currentColor",
321
+ "aria-hidden": "true",
322
+ viewBox: "64 64 896 896"
323
+ };
324
+ function _sfc_render(_ctx, _cache) {
325
+ return openBlock(), createElementBlock("svg", _hoisted_1$1, [..._cache[0] || (_cache[0] = [
326
+ 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)
327
+ ])]);
328
+ }
329
+ const FilterOutlined = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render]]);
330
+ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
331
+ __name: "ColumnControl",
332
+ props: {
333
+ columns: {},
334
+ table: { default: () => void 0 }
335
+ },
336
+ setup(__props) {
337
+ const open = ref(false);
338
+ const checkAll = ref(false);
339
+ const indeterminate = ref(false);
340
+ const flattenColumns = (cols) => {
341
+ return cols.flatMap((item) => {
342
+ var _a;
343
+ if ((_a = item.children) == null ? void 0 : _a.length) {
344
+ return flattenColumns(item.children);
345
+ }
346
+ return item;
347
+ });
348
+ };
349
+ const getColumnKey = (column, index) => {
350
+ const key = column.key ?? column.prop;
351
+ if (key === void 0 || key === null) return `__idx_${index}`;
352
+ return Array.isArray(key) ? key.join(".") : String(key);
353
+ };
354
+ const checkedColumnsOptions = computed(
355
+ () => flattenColumns(__props.columns).map((item, index) => ({
356
+ label: String(item.label ?? item.prop ?? `列${index + 1}`),
357
+ value: getColumnKey(item, index),
358
+ checked: !item.hidden,
359
+ column: item
360
+ }))
361
+ );
362
+ const checkedColumnKeys = computed({
363
+ get() {
364
+ return checkedColumnsOptions.value.flatMap(
365
+ (item) => item.checked ? item.value : []
366
+ );
367
+ },
368
+ set(val) {
369
+ checkedColumnsOptions.value.forEach((item) => {
370
+ var _a;
371
+ (_a = __props.table) == null ? void 0 : _a.setColumn(
372
+ item.value,
373
+ {
374
+ hidden: !val.includes(item.value)
375
+ }
376
+ );
377
+ });
378
+ }
379
+ });
380
+ const onCheckAllChange = (value) => {
381
+ var _a;
382
+ const checked = !!(((_a = value == null ? void 0 : value.target) == null ? void 0 : _a.checked) ?? value);
383
+ checkedColumnKeys.value = checked ? checkedColumnsOptions.value.map((item) => item.value) : [];
384
+ indeterminate.value = false;
385
+ };
386
+ const toggleColumnsItem = (val) => {
387
+ if (checkedColumnKeys.value.includes(val)) {
388
+ checkedColumnKeys.value = checkedColumnKeys.value.filter((item) => item !== val);
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 > 0 && val.length === checkedColumnsOptions.value.length;
398
+ },
399
+ { immediate: true }
400
+ );
401
+ return (_ctx, _cache) => {
402
+ return openBlock(), createBlock(unref(ElDropdown), {
403
+ trigger: "click",
404
+ "hide-on-click": false,
405
+ visible: open.value,
406
+ onVisibleChange: _cache[0] || (_cache[0] = (val) => open.value = val)
407
+ }, {
408
+ dropdown: withCtx(() => [
409
+ createVNode(unref(ElDropdownMenu), null, {
410
+ default: withCtx(() => [
411
+ createVNode(unref(ElDropdownItem), {
412
+ disabled: true,
413
+ divided: false
414
+ }, {
415
+ default: withCtx(() => [
416
+ createVNode(unref(ElCheckbox), {
417
+ "model-value": checkAll.value,
418
+ indeterminate: indeterminate.value,
419
+ onChange: onCheckAllChange
420
+ }, {
421
+ default: withCtx(() => [..._cache[1] || (_cache[1] = [
422
+ createTextVNode(" 全选 ", -1)
423
+ ])]),
424
+ _: 1
425
+ }, 8, ["model-value", "indeterminate"])
426
+ ]),
427
+ _: 1
428
+ }),
429
+ (openBlock(true), createElementBlock(Fragment, null, renderList(checkedColumnsOptions.value, (item) => {
430
+ return openBlock(), createBlock(unref(ElDropdownItem), {
431
+ key: item.value,
432
+ command: item.value,
433
+ onClick: withModifiers(($event) => toggleColumnsItem(item.value), ["stop"])
434
+ }, {
435
+ default: withCtx(() => [
436
+ createVNode(unref(ElCheckbox), {
437
+ "model-value": item.checked,
438
+ onChange: () => toggleColumnsItem(item.value)
439
+ }, {
440
+ default: withCtx(() => [
441
+ createTextVNode(toDisplayString(item.label), 1)
442
+ ]),
443
+ _: 2
444
+ }, 1032, ["model-value", "onChange"])
445
+ ]),
446
+ _: 2
447
+ }, 1032, ["command", "onClick"]);
448
+ }), 128))
449
+ ]),
450
+ _: 1
451
+ })
452
+ ]),
453
+ default: withCtx(() => [
454
+ createVNode(unref(ElButton), {
455
+ text: "",
456
+ class: "pro-table_column-control_button"
457
+ }, {
458
+ default: withCtx(() => [
459
+ createVNode(FilterOutlined)
460
+ ]),
461
+ _: 1
462
+ })
463
+ ]),
464
+ _: 1
465
+ }, 8, ["visible"]);
466
+ };
467
+ }
468
+ });
469
+ const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-e45d2d29"]]);
470
+ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
471
+ ...{ name: "TableColumnRenderer" },
472
+ __name: "TableColumnRenderer",
473
+ props: {
474
+ columns: {}
475
+ },
476
+ setup(__props) {
477
+ const getColumnKey = (column, index) => {
478
+ const key = column.key ?? column.prop;
479
+ if (key === void 0 || key === null) return `__idx_${index}`;
480
+ return Array.isArray(key) ? key.join(".") : String(key);
481
+ };
482
+ const getCellValue = (row, column) => {
483
+ const path = column.prop;
484
+ if (!path) return void 0;
485
+ return get(row, toPath(path));
486
+ };
487
+ const normalizedColumns = computed(() => {
488
+ const loop = (source) => {
489
+ return source.flatMap((column) => {
490
+ if (column.hidden) return [];
491
+ const children = column.children || [];
492
+ const visibleChildren = children.length > 0 ? loop(children) : [];
493
+ if (children.length > 0 && visibleChildren.length === 0) return [];
494
+ return [{ ...column, children: visibleChildren }];
495
+ });
496
+ };
497
+ return loop(__props.columns);
498
+ });
499
+ const getColumnProps = (column) => {
500
+ const { children, hidden, render, key, ...rest } = column;
501
+ const prop = Array.isArray(column.prop) ? column.prop.join(".") : column.prop ? String(column.prop) : void 0;
502
+ return {
503
+ ...rest,
504
+ prop,
505
+ columnKey: key ? String(key) : prop
506
+ };
507
+ };
508
+ return (_ctx, _cache) => {
509
+ const _component_TableColumnRenderer = resolveComponent("TableColumnRenderer", true);
510
+ return openBlock(true), createElementBlock(Fragment, null, renderList(normalizedColumns.value, (column, index) => {
511
+ return openBlock(), createBlock(unref(ElTableColumn), mergeProps({
512
+ key: getColumnKey(column, index),
513
+ ref_for: true
514
+ }, getColumnProps(column)), {
515
+ default: withCtx((scope) => {
516
+ var _a;
517
+ return [
518
+ (column.children || []).length > 0 ? (openBlock(), createBlock(_component_TableColumnRenderer, {
519
+ key: 0,
520
+ columns: column.children || []
521
+ }, null, 8, ["columns"])) : typeof column.render === "function" ? (openBlock(), createBlock(resolveDynamicComponent(
522
+ (_a = column.render) == null ? void 0 : _a.call(column, {
523
+ ...scope,
524
+ column,
525
+ cellValue: getCellValue(scope.row, column)
526
+ })
527
+ ), { key: 1 })) : createCommentVNode("", true)
528
+ ];
529
+ }),
530
+ _: 2
531
+ }, 1040);
532
+ }), 128);
533
+ };
534
+ }
535
+ });
536
+ const _hoisted_1 = { class: "pro-table_header" };
537
+ const _hoisted_2 = {
538
+ key: 0,
539
+ class: "pro-table_header_button-bar"
540
+ };
541
+ const _hoisted_3 = {
542
+ key: 1,
543
+ class: "pro-table_header_toolbar"
544
+ };
545
+ const _hoisted_4 = {
546
+ key: 2,
547
+ class: "pro-table_header_size-control"
548
+ };
549
+ const _hoisted_5 = {
550
+ key: 3,
551
+ class: "pro-table_header_column-control"
552
+ };
553
+ const _sfc_main = /* @__PURE__ */ defineComponent({
554
+ ...{ name: "ProTable", inheritAttrs: false },
555
+ __name: "BaseTable",
556
+ props: /* @__PURE__ */ mergeModels({
557
+ table: { default: () => void 0 },
558
+ search: { type: Function, default: void 0 },
559
+ addIndexColumn: { type: Boolean, default: () => void 0 },
560
+ immediateSearch: { type: Boolean, default: () => void 0 },
561
+ control: { type: [Boolean, Object], default: () => void 0 },
562
+ searchFormConfig: { default: () => void 0 },
563
+ tableContainer: { type: [Object, Function, Boolean], default: void 0 },
564
+ columns: { default: () => void 0 },
565
+ data: { default: () => void 0 },
566
+ pagination: { type: [Boolean, Object], default: () => void 0 },
567
+ size: {},
568
+ width: {},
569
+ height: {},
570
+ maxHeight: {},
571
+ fit: { type: Boolean },
572
+ stripe: { type: Boolean },
573
+ border: { type: Boolean },
574
+ rowKey: { type: [String, Function] },
575
+ context: {},
576
+ showHeader: { type: Boolean },
577
+ showSummary: { type: Boolean },
578
+ sumText: {},
579
+ summaryMethod: { type: Function },
580
+ rowClassName: { type: [String, Function] },
581
+ rowStyle: { type: [Object, Function] },
582
+ cellClassName: { type: [String, Function] },
583
+ cellStyle: { type: [Object, Function] },
584
+ headerRowClassName: { type: [String, Function] },
585
+ headerRowStyle: { type: [Object, Function] },
586
+ headerCellClassName: { type: [String, Function] },
587
+ headerCellStyle: { type: [Object, Function] },
588
+ highlightCurrentRow: { type: Boolean },
589
+ currentRowKey: {},
590
+ emptyText: {},
591
+ expandRowKeys: {},
592
+ defaultExpandAll: { type: Boolean },
593
+ rowExpandable: { type: Function },
594
+ defaultSort: {},
595
+ tooltipEffect: {},
596
+ tooltipOptions: {},
597
+ spanMethod: { type: Function },
598
+ selectOnIndeterminate: { type: Boolean },
599
+ indent: {},
600
+ treeProps: {},
601
+ lazy: { type: Boolean },
602
+ load: { type: Function },
603
+ className: {},
604
+ style: { type: [Boolean, null, String, Object, Array] },
605
+ tableLayout: {},
606
+ scrollbarAlwaysOn: { type: Boolean },
607
+ flexible: { type: Boolean },
608
+ showOverflowTooltip: { type: [Boolean, Object] },
609
+ tooltipFormatter: { type: Function },
610
+ appendFilterPanelTo: {},
611
+ scrollbarTabindex: {},
612
+ nativeScrollbar: { type: Boolean }
613
+ }, {
614
+ "size": {},
615
+ "sizeModifiers": {},
616
+ "loading": { type: Boolean },
617
+ "loadingModifiers": {}
618
+ }),
619
+ emits: ["update:size", "update:loading"],
620
+ setup(__props) {
621
+ const config = INJECT_CONFIG["pro-table"];
622
+ const injectProps = inject(config.injectionKey, config.default);
623
+ const tableProperties = Object.keys(tableProps());
624
+ const paginationProperties = Object.keys(paginationProps());
625
+ const attrs = useAttrs();
626
+ const injectTableAttrs = computed(() => {
627
+ return pick(injectProps, tableProperties);
628
+ });
629
+ const attrsTableProps = computed(() => {
630
+ return pick(
631
+ camelizeProperties(attrs),
632
+ tableProperties
633
+ );
634
+ });
635
+ const {
636
+ columns: tableColumns,
637
+ data: tableData,
638
+ searchForm,
639
+ pageParam,
640
+ setPageParam
641
+ } = __props.table || {};
642
+ const size = useModel(__props, "size");
643
+ const loading = useModel(__props, "loading");
644
+ const _search = async () => {
645
+ var _a;
646
+ try {
647
+ loading.value = true;
648
+ await ((_a = __props.search) == null ? void 0 : _a.call(__props));
649
+ } finally {
650
+ loading.value = false;
651
+ }
652
+ };
653
+ const reset = () => {
654
+ var _a;
655
+ (_a = __props.table) == null ? void 0 : _a.resetQueryParams();
656
+ nextTick(() => {
657
+ _search();
658
+ });
659
+ };
660
+ const slots = useSlots();
661
+ const searchFormSlot = slots["search-form"];
662
+ const buttonBarSlot = slots["button-bar"];
663
+ const toolbarSlot = slots["toolbar"];
664
+ const tableSlots = computed(() => {
665
+ const customNames = /* @__PURE__ */ new Set([
666
+ "search-form",
667
+ "button-bar",
668
+ "toolbar",
669
+ "table"
670
+ ]);
671
+ return Object.fromEntries(
672
+ Object.entries(slots).filter(([name]) => !customNames.has(name))
673
+ );
674
+ });
675
+ const tableSlotNames = computed(() => Object.keys(tableSlots.value));
676
+ const searchPage1st = () => {
677
+ setPageParam == null ? void 0 : setPageParam({ current: 1 });
678
+ _search();
679
+ };
680
+ const computedSearchFormConfig = computed(() => {
681
+ var _a, _b;
682
+ const container = ((_a = __props.searchFormConfig) == null ? void 0 : _a.container) ?? ((_b = injectProps.searchFormConfig) == null ? void 0 : _b.container) ?? DefaultSearchFormContainer;
683
+ return {
684
+ ...injectProps.searchFormConfig,
685
+ ...getObject(__props.searchFormConfig),
686
+ container: container ? container : void 0
687
+ };
688
+ });
689
+ const computedTableContainer = computed(() => {
690
+ const container = __props.tableContainer ?? injectProps.tableContainer ?? DefaultTableContainer;
691
+ return container ? container : void 0;
692
+ });
693
+ const normalizedRawColumns = computed(() => {
694
+ const source = __props.columns ?? (tableColumns == null ? void 0 : tableColumns.value) ?? [];
695
+ const normalize = (list, prefix = "col") => {
696
+ return list.map((item, index) => {
697
+ const current = { ...item };
698
+ if (current.label === void 0 && current.title !== void 0) {
699
+ current.label = current.title;
700
+ }
701
+ if (current.prop === void 0 && current.dataIndex !== void 0) {
702
+ current.prop = Array.isArray(current.dataIndex) ? current.dataIndex.join(".") : current.dataIndex;
703
+ }
704
+ if (current.key === void 0) {
705
+ current.key = current.prop ?? (typeof current.columnKey === "string" ? current.columnKey : void 0) ?? `${prefix}-${index}`;
706
+ }
707
+ if (Array.isArray(current.children)) {
708
+ current.children = normalize(current.children, `${prefix}-${index}`);
709
+ }
710
+ return current;
711
+ });
712
+ };
713
+ const normalized = normalize(source);
714
+ if (__props.addIndexColumn ?? injectProps.addIndexColumn) {
715
+ return [
716
+ {
717
+ key: "_index",
718
+ type: "index",
719
+ label: "序号",
720
+ width: 80
721
+ },
722
+ ...normalized
723
+ ];
724
+ }
725
+ return normalized;
726
+ });
727
+ const computedDataSource = computed(() => {
728
+ const attrsData = attrsTableProps.value.data;
729
+ return __props.data ?? attrsData ?? (tableData == null ? void 0 : tableData.value) ?? [];
730
+ });
731
+ const computedTableProps = computed(() => {
732
+ const merged = {
733
+ ...injectTableAttrs.value,
734
+ ...attrsTableProps.value
735
+ };
736
+ delete merged.data;
737
+ return merged;
738
+ });
739
+ const computedPagination = computed(() => {
740
+ if (__props.pagination === false) return false;
741
+ const pageConfig = __props.pagination ?? {};
742
+ return {
743
+ ...injectProps.pagination,
744
+ ...pick(pageConfig, paginationProperties),
745
+ currentPage: pageConfig.currentPage ?? (pageParam == null ? void 0 : pageParam.current) ?? 1,
746
+ pageSize: pageConfig.pageSize ?? (pageParam == null ? void 0 : pageParam.pageSize) ?? 10,
747
+ total: pageConfig.total ?? (pageParam == null ? void 0 : pageParam.total) ?? 0
748
+ };
749
+ });
750
+ const showPagination = computed(() => computedPagination.value !== false);
751
+ const onCurrentChange = (current) => {
752
+ setPageParam == null ? void 0 : setPageParam({ current });
753
+ _search();
754
+ };
755
+ const onSizeChange = (pageSize) => {
756
+ setPageParam == null ? void 0 : setPageParam({ pageSize, current: 1 });
757
+ _search();
758
+ };
759
+ const onPaginationChange = (currentPage, pageSize) => {
760
+ var _a;
761
+ (_a = attrs.onChange) == null ? void 0 : _a.call(attrs, currentPage, pageSize);
762
+ };
763
+ const showSearch = computed(() => {
764
+ var _a, _b;
765
+ 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);
766
+ });
767
+ const computedControl = computed(() => {
768
+ const mergedControl = __props.control ?? injectProps.control;
769
+ const sizeControl = (mergedControl == null ? void 0 : mergedControl.sizeControl) ?? mergedControl;
770
+ const columnControl = (mergedControl == null ? void 0 : mergedControl.columnControl) ?? mergedControl;
771
+ return { sizeControl: !!sizeControl, columnControl: !!columnControl };
772
+ });
773
+ const resolvedSize = computed(() => {
774
+ return size.value ?? attrsTableProps.value.size ?? injectTableAttrs.value.size;
775
+ });
776
+ onMounted(() => {
777
+ if (__props.immediateSearch ?? injectProps.immediateSearch) {
778
+ _search();
779
+ }
780
+ });
781
+ return (_ctx, _cache) => {
782
+ const _directive_loading = resolveDirective("loading");
783
+ return openBlock(), createElementBlock("div", {
784
+ class: normalizeClass(["pro-table", _ctx.$attrs.class]),
785
+ style: normalizeStyle(_ctx.$attrs.style)
786
+ }, [
787
+ showSearch.value ? (openBlock(), createBlock(unref(_sfc_main$b), {
788
+ key: 0,
789
+ component: computedSearchFormConfig.value.container
790
+ }, {
791
+ default: withCtx(() => [
792
+ renderSlot(_ctx.$slots, "search-form", {}, () => [
793
+ unref(searchForm) ? (openBlock(), createBlock(SearchForm, mergeProps({
794
+ key: 0,
795
+ form: unref(searchForm)
796
+ }, computedSearchFormConfig.value, {
797
+ onSearch: searchPage1st,
798
+ onReset: reset
799
+ }), null, 16, ["form"])) : createCommentVNode("", true)
800
+ ], true)
801
+ ]),
802
+ _: 3
803
+ }, 8, ["component"])) : createCommentVNode("", true),
804
+ createVNode(unref(_sfc_main$b), { component: computedTableContainer.value }, {
805
+ default: withCtx(() => [
806
+ createElementVNode("div", _hoisted_1, [
807
+ unref(buttonBarSlot) ? (openBlock(), createElementBlock("div", _hoisted_2, [
808
+ renderSlot(_ctx.$slots, "button-bar", {}, void 0, true)
809
+ ])) : createCommentVNode("", true),
810
+ unref(toolbarSlot) ? (openBlock(), createElementBlock("div", _hoisted_3, [
811
+ renderSlot(_ctx.$slots, "toolbar", {}, void 0, true)
812
+ ])) : createCommentVNode("", true),
813
+ computedControl.value.sizeControl ? (openBlock(), createElementBlock("div", _hoisted_4, [
814
+ createVNode(unref(SizeControl), {
815
+ size: size.value,
816
+ "onUpdate:size": _cache[0] || (_cache[0] = ($event) => size.value = $event)
817
+ }, null, 8, ["size"])
818
+ ])) : createCommentVNode("", true),
819
+ computedControl.value.columnControl ? (openBlock(), createElementBlock("div", _hoisted_5, [
820
+ createVNode(unref(ColumnControl), {
821
+ columns: normalizedRawColumns.value,
822
+ table: __props.table
823
+ }, null, 8, ["columns", "table"])
824
+ ])) : createCommentVNode("", true)
825
+ ]),
826
+ renderSlot(_ctx.$slots, "table", {}, () => [
827
+ withDirectives((openBlock(), createBlock(unref(ElTable), mergeProps({ class: "pro-table_content" }, computedTableProps.value, {
828
+ size: resolvedSize.value,
829
+ data: computedDataSource.value
830
+ }), createSlots({
831
+ default: withCtx(() => [
832
+ createVNode(_sfc_main$1, { columns: normalizedRawColumns.value }, null, 8, ["columns"])
833
+ ]),
834
+ _: 2
835
+ }, [
836
+ renderList(tableSlotNames.value, (name) => {
837
+ return {
838
+ name,
839
+ fn: withCtx((scoped) => [
840
+ renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(scoped)), void 0, true)
841
+ ])
842
+ };
843
+ })
844
+ ]), 1040, ["size", "data"])), [
845
+ [_directive_loading, loading.value]
846
+ ])
847
+ ], true),
848
+ showPagination.value ? (openBlock(), createBlock(unref(ElPagination), mergeProps({
849
+ key: 0,
850
+ class: "pro-table_pagination"
851
+ }, computedPagination.value, {
852
+ onCurrentChange,
853
+ onSizeChange,
854
+ onChange: onPaginationChange
855
+ }), null, 16)) : createCommentVNode("", true)
856
+ ]),
857
+ _: 3
858
+ }, 8, ["component"])
859
+ ], 6);
860
+ };
861
+ }
862
+ });
863
+ const BaseTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c5989f58"]]);
864
+ const useTable = (params = {}) => {
865
+ const { data, ...rest } = params;
866
+ const coreTable = useTable$1({
867
+ ...rest,
868
+ dataSource: data
869
+ });
870
+ const { dataSource, ...tableWithoutDataSource } = coreTable;
871
+ const table = {
872
+ ...tableWithoutDataSource,
873
+ data: dataSource
874
+ };
875
+ return table;
876
+ };
877
+ export {
878
+ BaseTable as default,
879
+ useTable
880
+ };