@qin-ui/element-plus-pro 1.1.4 → 1.2.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.
- package/AI-CONTEXT.md +19 -8
- package/api.json +7 -1
- package/es/components/component-provider/components/index.vue.d.ts +6 -0
- package/es/components/component-provider/components/index.vue.d.ts.map +1 -1
- package/es/components/component-provider/constants/index.d.ts.map +1 -1
- package/es/components/form/components/BaseField/index.vue.d.ts.map +1 -1
- package/es/components/form/components/BaseField/utils/index.d.ts +3 -1
- package/es/components/form/components/BaseField/utils/index.d.ts.map +1 -1
- package/es/components/table/components/ColumnControl.vue.d.ts +2 -1
- package/es/components/table/components/ColumnControl.vue.d.ts.map +1 -1
- package/es/components/table/components/ProTable.vue.d.ts +3 -2
- package/es/components/table/components/ProTable.vue.d.ts.map +1 -1
- package/es/components/table/components/SearchForm.vue.d.ts.map +1 -1
- package/es/components/table/components/SizeControl.vue.d.ts.map +1 -1
- package/es/components/table/types/index.d.ts +22 -0
- package/es/components/table/types/index.d.ts.map +1 -1
- package/es/components/table/useTable.d.ts.map +1 -1
- package/es/element-plus-pro.css +13 -13
- package/es/index.d.ts +1 -0
- package/es/index.d.ts.map +1 -1
- package/es/index.js +285 -125
- package/es/index.js.map +1 -1
- package/es/locale/en-US.d.ts +26 -0
- package/es/locale/en-US.d.ts.map +1 -0
- package/es/locale/index.d.ts +31 -0
- package/es/locale/index.d.ts.map +1 -0
- package/es/locale/zh-CN.d.ts +26 -0
- package/es/locale/zh-CN.d.ts.map +1 -0
- package/es/locale/zh-TW.d.ts +26 -0
- package/es/locale/zh-TW.d.ts.map +1 -0
- package/package.json +2 -2
- package/src/components/component-provider/components/index.vue +14 -1
- package/src/components/component-provider/constants/index.ts +20 -39
- package/src/components/form/components/BaseField/index.vue +10 -4
- package/src/components/form/components/BaseField/utils/index.ts +66 -3
- package/src/components/table/components/ColumnControl.vue +83 -20
- package/src/components/table/components/ProTable.vue +36 -10
- package/src/components/table/components/SearchForm.vue +6 -3
- package/src/components/table/components/SizeControl.vue +9 -5
- package/src/components/table/types/index.ts +23 -0
- package/src/components/table/useTable.ts +13 -1
- package/src/index.ts +1 -0
- package/src/locale/en-US.ts +21 -0
- package/src/locale/index.ts +68 -0
- package/src/locale/zh-CN.ts +21 -0
- package/src/locale/zh-TW.ts +21 -0
package/es/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "./element-plus-pro.css";
|
|
2
|
-
import { inject, computed, provide, toValue, defineComponent, renderSlot, mergeProps, normalizeProps, guardReactiveProps, resolveComponent, createBlock, openBlock, unref, withCtx, createElementBlock, Fragment, renderList, createVNode, createSlots, ref, useAttrs, createCommentVNode, resolveDynamicComponent, isVNode, createTextVNode, toDisplayString, useSlots, watchEffect, withModifiers, createElementVNode, watch, withKeys, normalizeStyle, useModel,
|
|
3
|
-
import { ElFormItem, ElCol, ElTable, ElPagination, useFormDisabled, ElTransfer, ElTreeSelect, ElSlider, ElSwitch, ElRadioGroup, ElCheckboxGroup, ElTimeSelect, ElTimePicker, ElDatePicker, ElCascader, ElSelect, ElAutocomplete, ElInputNumber, ElInput, ElRow, ElForm, ElSpace, ElButton, ElDropdown, ElDropdownMenu, ElDropdownItem, ElCheckbox, ElTableColumn } from "element-plus";
|
|
4
|
-
import { InjectionPathKey, isPlainObject, getObject, toPath, useForm as useForm$1, omit, cloneDeep, InjectionFormKey, camelizeProperties, useFields as useFields$1, useFormRef as useFormRef$1, get, pick, useTable as useTable$1 } from "@qin-ui/pro-components-core";
|
|
2
|
+
import { inject, computed, provide, toValue, defineComponent, renderSlot, mergeProps, normalizeProps, guardReactiveProps, resolveComponent, createBlock, openBlock, unref, withCtx, createElementBlock, Fragment, renderList, createVNode, createSlots, ref, useAttrs, createCommentVNode, resolveDynamicComponent, isVNode, createTextVNode, toDisplayString, useSlots, watchEffect, withModifiers, createElementVNode, watch, withKeys, normalizeStyle, useModel, onMounted, mergeModels, resolveDirective, normalizeClass, withDirectives, nextTick } from "vue";
|
|
3
|
+
import { ElFormItem, ElCol, ElTable, ElPagination, useFormDisabled, ElTransfer, ElTreeSelect, ElSlider, ElSwitch, ElRadioGroup, ElCheckboxGroup, ElTimeSelect, ElTimePicker, ElDatePicker, ElCascader, ElSelect, ElAutocomplete, ElInputNumber, ElInput, ElRow, useLocale as useLocale$1, ElForm, ElSpace, ElButton, ElDropdown, ElDropdownMenu, ElDropdownItem, ElCheckbox, ElTableColumn } from "element-plus";
|
|
4
|
+
import { InjectionPathKey, isPlainObject, getObject, toPath, useForm as useForm$1, zhCN as zhCN$1, zhTW as zhTW$1, enUS as enUS$1, resolveLocaleName, format, omit, cloneDeep, InjectionFormKey, camelizeProperties, useFields as useFields$1, useFormRef as useFormRef$1, get, pick, useTable as useTable$1 } from "@qin-ui/pro-components-core";
|
|
5
5
|
import { useFormData } from "@qin-ui/pro-components-core";
|
|
6
6
|
const tableProps = () => ElTable.props || {};
|
|
7
7
|
const paginationProps = () => ElPagination.props || {};
|
|
@@ -48,7 +48,7 @@ const INJECT_CONFIG = {
|
|
|
48
48
|
},
|
|
49
49
|
input: {
|
|
50
50
|
injectionKey: Symbol(""),
|
|
51
|
-
default: { maxlength: 100, clearable: true
|
|
51
|
+
default: { maxlength: 100, clearable: true }
|
|
52
52
|
},
|
|
53
53
|
"input.textarea": {
|
|
54
54
|
injectionKey: Symbol(""),
|
|
@@ -56,8 +56,7 @@ const INJECT_CONFIG = {
|
|
|
56
56
|
maxlength: 200,
|
|
57
57
|
autosize: { minRows: 3, maxRows: 6 },
|
|
58
58
|
showWordLimit: true,
|
|
59
|
-
clearable: true
|
|
60
|
-
placeholder: "请输入"
|
|
59
|
+
clearable: true
|
|
61
60
|
}
|
|
62
61
|
},
|
|
63
62
|
"input.password": {
|
|
@@ -65,8 +64,7 @@ const INJECT_CONFIG = {
|
|
|
65
64
|
default: {
|
|
66
65
|
showPassword: true,
|
|
67
66
|
maxlength: 100,
|
|
68
|
-
clearable: true
|
|
69
|
-
placeholder: "请输入"
|
|
67
|
+
clearable: true
|
|
70
68
|
}
|
|
71
69
|
},
|
|
72
70
|
"input-number": {
|
|
@@ -75,97 +73,80 @@ const INJECT_CONFIG = {
|
|
|
75
73
|
max: 10 ** 15 - 1,
|
|
76
74
|
min: -1000000000000001,
|
|
77
75
|
controls: false,
|
|
78
|
-
placeholder: "请输入",
|
|
79
76
|
style: { width: "100%" }
|
|
80
77
|
}
|
|
81
78
|
},
|
|
82
79
|
autocomplete: {
|
|
83
80
|
injectionKey: Symbol(""),
|
|
84
|
-
default: { clearable: true
|
|
81
|
+
default: { clearable: true }
|
|
85
82
|
},
|
|
86
83
|
select: {
|
|
87
84
|
injectionKey: Symbol(""),
|
|
88
|
-
default: { clearable: true
|
|
85
|
+
default: { clearable: true }
|
|
89
86
|
},
|
|
90
87
|
cascader: {
|
|
91
88
|
injectionKey: Symbol(""),
|
|
92
|
-
default: { clearable: true
|
|
89
|
+
default: { clearable: true }
|
|
93
90
|
},
|
|
94
91
|
"date-picker": {
|
|
95
92
|
injectionKey: Symbol(""),
|
|
96
|
-
default: { style: { width: "100%" }
|
|
93
|
+
default: { style: { width: "100%" } }
|
|
97
94
|
},
|
|
98
95
|
"date-picker.date": {
|
|
99
96
|
injectionKey: Symbol(""),
|
|
100
|
-
default: { style: { width: "100%" }
|
|
97
|
+
default: { style: { width: "100%" } }
|
|
101
98
|
},
|
|
102
99
|
"date-picker.dates": {
|
|
103
100
|
injectionKey: Symbol(""),
|
|
104
|
-
default: { style: { width: "100%" }
|
|
101
|
+
default: { style: { width: "100%" } }
|
|
105
102
|
},
|
|
106
103
|
"date-picker.daterange": {
|
|
107
104
|
injectionKey: Symbol(""),
|
|
108
|
-
default: {
|
|
109
|
-
style: { width: "100%" },
|
|
110
|
-
startPlaceholder: "开始日期",
|
|
111
|
-
endPlaceholder: "结束日期"
|
|
112
|
-
}
|
|
105
|
+
default: { style: { width: "100%" } }
|
|
113
106
|
},
|
|
114
107
|
"date-picker.week": {
|
|
115
108
|
injectionKey: Symbol(""),
|
|
116
|
-
default: { style: { width: "100%" }
|
|
109
|
+
default: { style: { width: "100%" } }
|
|
117
110
|
},
|
|
118
111
|
"date-picker.month": {
|
|
119
112
|
injectionKey: Symbol(""),
|
|
120
|
-
default: { style: { width: "100%" }
|
|
113
|
+
default: { style: { width: "100%" } }
|
|
121
114
|
},
|
|
122
115
|
"date-picker.monthrange": {
|
|
123
116
|
injectionKey: Symbol(""),
|
|
124
|
-
default: {
|
|
125
|
-
style: { width: "100%" },
|
|
126
|
-
startPlaceholder: "开始月份",
|
|
127
|
-
endPlaceholder: "结束月份"
|
|
128
|
-
}
|
|
117
|
+
default: { style: { width: "100%" } }
|
|
129
118
|
},
|
|
130
119
|
"date-picker.months": {
|
|
131
120
|
injectionKey: Symbol(""),
|
|
132
|
-
default: { style: { width: "100%" }
|
|
121
|
+
default: { style: { width: "100%" } }
|
|
133
122
|
},
|
|
134
123
|
"date-picker.yearrange": {
|
|
135
124
|
injectionKey: Symbol(""),
|
|
136
|
-
default: {
|
|
137
|
-
style: { width: "100%" },
|
|
138
|
-
startPlaceholder: "开始年份",
|
|
139
|
-
endPlaceholder: "结束年份"
|
|
140
|
-
}
|
|
125
|
+
default: { style: { width: "100%" } }
|
|
141
126
|
},
|
|
142
127
|
"date-picker.year": {
|
|
143
128
|
injectionKey: Symbol(""),
|
|
144
|
-
default: { style: { width: "100%" }
|
|
129
|
+
default: { style: { width: "100%" } }
|
|
145
130
|
},
|
|
146
131
|
"date-picker.years": {
|
|
147
132
|
injectionKey: Symbol(""),
|
|
148
|
-
default: { style: { width: "100%" }
|
|
133
|
+
default: { style: { width: "100%" } }
|
|
149
134
|
},
|
|
150
135
|
"date-picker.datetime": {
|
|
151
136
|
injectionKey: Symbol(""),
|
|
152
|
-
default: { style: { width: "100%" }
|
|
137
|
+
default: { style: { width: "100%" } }
|
|
153
138
|
},
|
|
154
139
|
"date-picker.datetimerange": {
|
|
155
140
|
injectionKey: Symbol(""),
|
|
156
|
-
default: {
|
|
157
|
-
style: { width: "100%" },
|
|
158
|
-
startPlaceholder: "开始时间",
|
|
159
|
-
endPlaceholder: "结束时间"
|
|
160
|
-
}
|
|
141
|
+
default: { style: { width: "100%" } }
|
|
161
142
|
},
|
|
162
143
|
"time-picker": {
|
|
163
144
|
injectionKey: Symbol(""),
|
|
164
|
-
default: { style: { width: "100%" }
|
|
145
|
+
default: { style: { width: "100%" } }
|
|
165
146
|
},
|
|
166
147
|
"time-select": {
|
|
167
148
|
injectionKey: Symbol(""),
|
|
168
|
-
default: { style: { width: "100%" }
|
|
149
|
+
default: { style: { width: "100%" } }
|
|
169
150
|
},
|
|
170
151
|
"checkbox-group": {
|
|
171
152
|
injectionKey: Symbol(""),
|
|
@@ -185,7 +166,7 @@ const INJECT_CONFIG = {
|
|
|
185
166
|
},
|
|
186
167
|
"tree-select": {
|
|
187
168
|
injectionKey: Symbol(""),
|
|
188
|
-
default: { clearable: true
|
|
169
|
+
default: { clearable: true }
|
|
189
170
|
},
|
|
190
171
|
transfer: {
|
|
191
172
|
injectionKey: Symbol(""),
|
|
@@ -443,17 +424,112 @@ const BaseFormItem = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "da
|
|
|
443
424
|
function useForm(...args) {
|
|
444
425
|
return useForm$1(...args);
|
|
445
426
|
}
|
|
446
|
-
const
|
|
427
|
+
const PLACEHOLDER_KEYS = {
|
|
428
|
+
input: "input.placeholder",
|
|
429
|
+
"input.textarea": "input.placeholder",
|
|
430
|
+
"input.password": "input.placeholder",
|
|
431
|
+
"input-number": "input.placeholder",
|
|
432
|
+
autocomplete: "input.placeholder",
|
|
433
|
+
select: "select.placeholder",
|
|
434
|
+
cascader: "select.placeholder",
|
|
435
|
+
"tree-select": "select.placeholder",
|
|
436
|
+
"date-picker": "date-picker.placeholder",
|
|
437
|
+
"date-picker.date": "date-picker.placeholder",
|
|
438
|
+
"date-picker.dates": "date-picker.placeholder",
|
|
439
|
+
"date-picker.week": "date-picker.placeholder",
|
|
440
|
+
"date-picker.month": "date-picker.placeholder",
|
|
441
|
+
"date-picker.months": "date-picker.placeholder",
|
|
442
|
+
"date-picker.year": "date-picker.placeholder",
|
|
443
|
+
"date-picker.years": "date-picker.placeholder",
|
|
444
|
+
"date-picker.datetime": "date-picker.placeholder",
|
|
445
|
+
"time-picker": "date-picker.placeholder",
|
|
446
|
+
"time-select": "date-picker.placeholder"
|
|
447
|
+
};
|
|
448
|
+
const RANGE_PLACEHOLDER_KEYS = {
|
|
449
|
+
"date-picker.daterange": ["date-picker.start", "date-picker.end"],
|
|
450
|
+
"date-picker.monthrange": ["date-picker.startMonth", "date-picker.endMonth"],
|
|
451
|
+
"date-picker.yearrange": ["date-picker.startYear", "date-picker.endYear"],
|
|
452
|
+
"date-picker.datetimerange": ["date-picker.startTime", "date-picker.endTime"]
|
|
453
|
+
};
|
|
454
|
+
const getPlaceholderProps = (key, injectProps, t) => {
|
|
455
|
+
const rangeKeys = RANGE_PLACEHOLDER_KEYS[key];
|
|
456
|
+
if (rangeKeys) {
|
|
457
|
+
if (injectProps.startPlaceholder !== void 0 || injectProps.placeholder !== void 0)
|
|
458
|
+
return {};
|
|
459
|
+
return {
|
|
460
|
+
startPlaceholder: t(rangeKeys[0]),
|
|
461
|
+
endPlaceholder: t(rangeKeys[1])
|
|
462
|
+
};
|
|
463
|
+
}
|
|
464
|
+
const placeholderKey = PLACEHOLDER_KEYS[key];
|
|
465
|
+
if (!placeholderKey || injectProps.placeholder !== void 0) return {};
|
|
466
|
+
return { placeholder: t(placeholderKey) };
|
|
467
|
+
};
|
|
468
|
+
const getInitProps = (field, t) => {
|
|
447
469
|
const { component, type } = field;
|
|
448
470
|
if (typeof component === "string") {
|
|
449
471
|
const k = [component, type].filter(Boolean).join(".");
|
|
450
472
|
const config = getInjectConfig(k);
|
|
451
|
-
if (!config) return {};
|
|
473
|
+
if (!config) return getPlaceholderProps(k, {}, t);
|
|
452
474
|
const injectProps = inject(config.injectionKey, config.default);
|
|
453
|
-
return injectProps;
|
|
475
|
+
return { ...injectProps, ...getPlaceholderProps(k, injectProps, t) };
|
|
454
476
|
}
|
|
455
477
|
return {};
|
|
456
478
|
};
|
|
479
|
+
const zhCN = {
|
|
480
|
+
...zhCN$1,
|
|
481
|
+
// 日期/时间选择器占位符(对应 INJECT_CONFIG 中 date-picker.* 的占位默认值)
|
|
482
|
+
"date-picker.placeholder": "请选择",
|
|
483
|
+
"date-picker.start": "开始日期",
|
|
484
|
+
"date-picker.end": "结束日期",
|
|
485
|
+
"date-picker.startMonth": "开始月份",
|
|
486
|
+
"date-picker.endMonth": "结束月份",
|
|
487
|
+
"date-picker.startYear": "开始年份",
|
|
488
|
+
"date-picker.endYear": "结束年份",
|
|
489
|
+
"date-picker.startTime": "开始时间",
|
|
490
|
+
"date-picker.endTime": "结束时间"
|
|
491
|
+
};
|
|
492
|
+
const zhTW = {
|
|
493
|
+
...zhTW$1,
|
|
494
|
+
// 日期/時間選擇器佔位符(對應 INJECT_CONFIG 中 date-picker.* 的佔位預設值)
|
|
495
|
+
"date-picker.placeholder": "請選擇",
|
|
496
|
+
"date-picker.start": "開始日期",
|
|
497
|
+
"date-picker.end": "結束日期",
|
|
498
|
+
"date-picker.startMonth": "開始月份",
|
|
499
|
+
"date-picker.endMonth": "結束月份",
|
|
500
|
+
"date-picker.startYear": "開始年份",
|
|
501
|
+
"date-picker.endYear": "結束年份",
|
|
502
|
+
"date-picker.startTime": "開始時間",
|
|
503
|
+
"date-picker.endTime": "結束時間"
|
|
504
|
+
};
|
|
505
|
+
const enUS = {
|
|
506
|
+
...enUS$1,
|
|
507
|
+
// Date/time picker placeholders (defaults of date-picker.* in INJECT_CONFIG)
|
|
508
|
+
"date-picker.placeholder": "Please select",
|
|
509
|
+
"date-picker.start": "Start date",
|
|
510
|
+
"date-picker.end": "End date",
|
|
511
|
+
"date-picker.startMonth": "Start month",
|
|
512
|
+
"date-picker.endMonth": "End month",
|
|
513
|
+
"date-picker.startYear": "Start year",
|
|
514
|
+
"date-picker.endYear": "End year",
|
|
515
|
+
"date-picker.startTime": "Start time",
|
|
516
|
+
"date-picker.endTime": "End time"
|
|
517
|
+
};
|
|
518
|
+
const LOCALE_INJECT_KEY = Symbol("pro-locale");
|
|
519
|
+
const useLocale = () => {
|
|
520
|
+
const { lang: elLang } = useLocale$1();
|
|
521
|
+
const override = inject(LOCALE_INJECT_KEY, void 0);
|
|
522
|
+
const lang = computed(() => resolveLocaleName(elLang.value));
|
|
523
|
+
const pack = computed(
|
|
524
|
+
() => lang.value === "zh-TW" ? zhTW : lang.value === "en-US" ? enUS : zhCN
|
|
525
|
+
);
|
|
526
|
+
const t = (key, params) => {
|
|
527
|
+
const overrides = toValue(override);
|
|
528
|
+
const text = (overrides == null ? void 0 : overrides[key]) ?? pack.value[key] ?? key;
|
|
529
|
+
return format(text, params);
|
|
530
|
+
};
|
|
531
|
+
return { t, lang };
|
|
532
|
+
};
|
|
457
533
|
const _sfc_main$e = /* @__PURE__ */ defineComponent({
|
|
458
534
|
...{ name: "BaseField", inheritAttrs: false },
|
|
459
535
|
__name: "index",
|
|
@@ -462,6 +538,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
|
|
|
462
538
|
path: { default: "" }
|
|
463
539
|
},
|
|
464
540
|
setup(__props, { expose: __expose }) {
|
|
541
|
+
const { t } = useLocale();
|
|
465
542
|
const form = useForm(false);
|
|
466
543
|
const { getFormData, setFormData } = form;
|
|
467
544
|
const componentRef = ref();
|
|
@@ -493,10 +570,13 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
|
|
|
493
570
|
});
|
|
494
571
|
const parentDisabled = useDisabledContext();
|
|
495
572
|
const groupedAttrs = computed(() => {
|
|
496
|
-
const initProps = getInitProps(
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
573
|
+
const initProps = getInitProps(
|
|
574
|
+
{
|
|
575
|
+
component: __props.component,
|
|
576
|
+
type: attrs.type
|
|
577
|
+
},
|
|
578
|
+
t
|
|
579
|
+
);
|
|
500
580
|
const modelPropName = attrs.modelProp ?? initProps.modelProp ?? "modelValue";
|
|
501
581
|
const mergedProps = mergeProps(
|
|
502
582
|
initProps,
|
|
@@ -682,6 +762,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
|
682
762
|
},
|
|
683
763
|
emits: ["search", "reset"],
|
|
684
764
|
setup(__props, { emit: __emit }) {
|
|
765
|
+
const { t } = useLocale();
|
|
685
766
|
const emit = __emit;
|
|
686
767
|
const proFormHeight = ref("unset");
|
|
687
768
|
const collapseHeight = ref(0);
|
|
@@ -814,9 +895,9 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
|
814
895
|
class: "pro-table_search-form_reset-button",
|
|
815
896
|
onClick: onReset
|
|
816
897
|
}, {
|
|
817
|
-
default: withCtx(() => [
|
|
818
|
-
createTextVNode("
|
|
819
|
-
])
|
|
898
|
+
default: withCtx(() => [
|
|
899
|
+
createTextVNode(toDisplayString(unref(t)("table.reset")), 1)
|
|
900
|
+
]),
|
|
820
901
|
_: 1
|
|
821
902
|
}))
|
|
822
903
|
], 64)) : createCommentVNode("", true)
|
|
@@ -833,9 +914,9 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
|
833
914
|
"native-type": "submit",
|
|
834
915
|
onClick: onSearch
|
|
835
916
|
}, {
|
|
836
|
-
default: withCtx(() => [
|
|
837
|
-
createTextVNode("
|
|
838
|
-
])
|
|
917
|
+
default: withCtx(() => [
|
|
918
|
+
createTextVNode(toDisplayString(unref(t)("table.query")), 1)
|
|
919
|
+
]),
|
|
839
920
|
_: 1
|
|
840
921
|
}))
|
|
841
922
|
], 64)) : createCommentVNode("", true)
|
|
@@ -853,7 +934,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
|
853
934
|
onClick: changeExpandStatus
|
|
854
935
|
}, {
|
|
855
936
|
default: withCtx(() => [
|
|
856
|
-
createTextVNode(toDisplayString(expandStatus.value ? "
|
|
937
|
+
createTextVNode(toDisplayString(expandStatus.value ? unref(t)("table.collapse") : unref(t)("table.expand")) + " ", 1),
|
|
857
938
|
createVNode(DownOutlined, {
|
|
858
939
|
class: "transition",
|
|
859
940
|
style: normalizeStyle([{ "margin-left": "4px" }, { transform: `rotate(${expandStatus.value ? -180 : 0}deg)` }])
|
|
@@ -872,7 +953,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
|
872
953
|
};
|
|
873
954
|
}
|
|
874
955
|
});
|
|
875
|
-
const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-
|
|
956
|
+
const SearchForm = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-5db62420"]]);
|
|
876
957
|
const _sfc_main$8 = {};
|
|
877
958
|
const _hoisted_1$4 = { class: "pro-table_search-form-container" };
|
|
878
959
|
function _sfc_render$3(_ctx, _cache) {
|
|
@@ -913,13 +994,14 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
|
913
994
|
},
|
|
914
995
|
emits: ["update:size"],
|
|
915
996
|
setup(__props) {
|
|
997
|
+
const { t } = useLocale();
|
|
916
998
|
const size = useModel(__props, "size");
|
|
917
999
|
size.value = size.value ?? "default";
|
|
918
|
-
const items = [
|
|
919
|
-
{ label: "
|
|
920
|
-
{ label: "
|
|
921
|
-
{ label: "
|
|
922
|
-
];
|
|
1000
|
+
const items = computed(() => [
|
|
1001
|
+
{ label: t("table.sizeDefault"), key: "default" },
|
|
1002
|
+
{ label: t("table.sizeMiddle"), key: "large" },
|
|
1003
|
+
{ label: t("table.sizeCompact"), key: "small" }
|
|
1004
|
+
]);
|
|
923
1005
|
return (_ctx, _cache) => {
|
|
924
1006
|
return openBlock(), createBlock(unref(ElDropdown), {
|
|
925
1007
|
trigger: "click",
|
|
@@ -928,8 +1010,8 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
|
928
1010
|
dropdown: withCtx(() => [
|
|
929
1011
|
createVNode(unref(ElDropdownMenu), null, {
|
|
930
1012
|
default: withCtx(() => [
|
|
931
|
-
(openBlock(), createElementBlock(Fragment, null, renderList(items, (item) => {
|
|
932
|
-
return
|
|
1013
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(items.value, (item) => {
|
|
1014
|
+
return openBlock(), createBlock(unref(ElDropdownItem), {
|
|
933
1015
|
key: item.key,
|
|
934
1016
|
command: item.key,
|
|
935
1017
|
disabled: item.key === size.value
|
|
@@ -939,7 +1021,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
|
939
1021
|
]),
|
|
940
1022
|
_: 2
|
|
941
1023
|
}, 1032, ["command", "disabled"]);
|
|
942
|
-
}),
|
|
1024
|
+
}), 128))
|
|
943
1025
|
]),
|
|
944
1026
|
_: 1
|
|
945
1027
|
})
|
|
@@ -960,7 +1042,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
|
960
1042
|
};
|
|
961
1043
|
}
|
|
962
1044
|
});
|
|
963
|
-
const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-
|
|
1045
|
+
const SizeControl = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-b114045c"]]);
|
|
964
1046
|
const _sfc_main$4 = {};
|
|
965
1047
|
const _hoisted_1$1 = {
|
|
966
1048
|
focusable: "false",
|
|
@@ -981,9 +1063,11 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
981
1063
|
__name: "ColumnControl",
|
|
982
1064
|
props: {
|
|
983
1065
|
columns: {},
|
|
984
|
-
table: { default: () => void 0 }
|
|
1066
|
+
table: { default: () => void 0 },
|
|
1067
|
+
columnControl: { default: () => void 0 }
|
|
985
1068
|
},
|
|
986
1069
|
setup(__props) {
|
|
1070
|
+
const { t } = useLocale();
|
|
987
1071
|
const open = ref(false);
|
|
988
1072
|
const checkAll = ref(false);
|
|
989
1073
|
const indeterminate = ref(false);
|
|
@@ -993,12 +1077,30 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
993
1077
|
return Array.isArray(key) ? key.join(".") : String(key);
|
|
994
1078
|
};
|
|
995
1079
|
const checkedColumnsOptions = computed(
|
|
996
|
-
() => __props.columns.map((item, index2) =>
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1080
|
+
() => __props.columns.map((item, index2) => {
|
|
1081
|
+
var _a, _b, _c, _d;
|
|
1082
|
+
const key = getColumnKey(item, index2);
|
|
1083
|
+
const excluded = (_b = (_a = __props.columnControl) == null ? void 0 : _a.excludedKeys) == null ? void 0 : _b.some(
|
|
1084
|
+
(ek) => String(ek) === key
|
|
1085
|
+
);
|
|
1086
|
+
const disabled = (_d = (_c = __props.columnControl) == null ? void 0 : _c.disabledKeys) == null ? void 0 : _d.some(
|
|
1087
|
+
(dk) => String(dk) === key
|
|
1088
|
+
);
|
|
1089
|
+
const label = String(
|
|
1090
|
+
item.label ?? item.prop ?? t("table.columnFallback", { index: index2 + 1 })
|
|
1091
|
+
);
|
|
1092
|
+
return {
|
|
1093
|
+
label,
|
|
1094
|
+
value: key,
|
|
1095
|
+
checked: !item.hidden || !!disabled,
|
|
1096
|
+
disabled: !!disabled,
|
|
1097
|
+
column: item,
|
|
1098
|
+
excluded
|
|
1099
|
+
};
|
|
1100
|
+
}).filter((item) => !item.excluded)
|
|
1101
|
+
);
|
|
1102
|
+
const controllableOptions = computed(
|
|
1103
|
+
() => checkedColumnsOptions.value.filter((item) => !item.disabled)
|
|
1002
1104
|
);
|
|
1003
1105
|
const checkedColumnKeys = computed({
|
|
1004
1106
|
get() {
|
|
@@ -1009,6 +1111,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
1009
1111
|
set(val) {
|
|
1010
1112
|
checkedColumnsOptions.value.forEach((item) => {
|
|
1011
1113
|
var _a;
|
|
1114
|
+
if (item.disabled) return;
|
|
1012
1115
|
(_a = __props.table) == null ? void 0 : _a.setColumn(item.value, {
|
|
1013
1116
|
hidden: !val.includes(item.value)
|
|
1014
1117
|
});
|
|
@@ -1018,13 +1121,15 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
1018
1121
|
const onCheckAllChange = (value) => {
|
|
1019
1122
|
var _a;
|
|
1020
1123
|
const checked = !!(((_a = value == null ? void 0 : value.target) == null ? void 0 : _a.checked) ?? value);
|
|
1021
|
-
checkedColumnKeys.value = checked ?
|
|
1124
|
+
checkedColumnKeys.value = checked ? controllableOptions.value.map((item) => item.value) : [];
|
|
1022
1125
|
indeterminate.value = false;
|
|
1023
1126
|
};
|
|
1024
1127
|
const toggleColumnsItem = (val) => {
|
|
1128
|
+
const item = checkedColumnsOptions.value.find((o) => o.value === val);
|
|
1129
|
+
if (item == null ? void 0 : item.disabled) return;
|
|
1025
1130
|
if (checkedColumnKeys.value.includes(val)) {
|
|
1026
1131
|
checkedColumnKeys.value = checkedColumnKeys.value.filter(
|
|
1027
|
-
(
|
|
1132
|
+
(item2) => item2 !== val
|
|
1028
1133
|
);
|
|
1029
1134
|
} else {
|
|
1030
1135
|
checkedColumnKeys.value = [...checkedColumnKeys.value, val];
|
|
@@ -1032,12 +1137,35 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
1032
1137
|
};
|
|
1033
1138
|
watch(
|
|
1034
1139
|
checkedColumnKeys,
|
|
1035
|
-
(
|
|
1036
|
-
|
|
1037
|
-
|
|
1140
|
+
() => {
|
|
1141
|
+
const controllableChecked = controllableOptions.value.filter(
|
|
1142
|
+
(item) => item.checked
|
|
1143
|
+
);
|
|
1144
|
+
indeterminate.value = !!controllableChecked.length && controllableChecked.length < controllableOptions.value.length;
|
|
1145
|
+
checkAll.value = controllableChecked.length === controllableOptions.value.length && controllableOptions.value.length > 0;
|
|
1038
1146
|
},
|
|
1039
1147
|
{ immediate: true }
|
|
1040
1148
|
);
|
|
1149
|
+
onMounted(() => {
|
|
1150
|
+
var _a, _b;
|
|
1151
|
+
(_b = (_a = __props.columnControl) == null ? void 0 : _a.disabledKeys) == null ? void 0 : _b.forEach((key) => {
|
|
1152
|
+
var _a2;
|
|
1153
|
+
(_a2 = __props.table) == null ? void 0 : _a2.setColumn(String(key), { hidden: false });
|
|
1154
|
+
});
|
|
1155
|
+
});
|
|
1156
|
+
watch(
|
|
1157
|
+
() => {
|
|
1158
|
+
var _a;
|
|
1159
|
+
return (_a = __props.columnControl) == null ? void 0 : _a.disabledKeys;
|
|
1160
|
+
},
|
|
1161
|
+
(keys) => {
|
|
1162
|
+
keys == null ? void 0 : keys.forEach((key) => {
|
|
1163
|
+
var _a;
|
|
1164
|
+
(_a = __props.table) == null ? void 0 : _a.setColumn(String(key), { hidden: false });
|
|
1165
|
+
});
|
|
1166
|
+
},
|
|
1167
|
+
{ deep: true }
|
|
1168
|
+
);
|
|
1041
1169
|
return (_ctx, _cache) => {
|
|
1042
1170
|
return openBlock(), createBlock(unref(ElDropdown), {
|
|
1043
1171
|
trigger: "click",
|
|
@@ -1047,46 +1175,50 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
1047
1175
|
}, {
|
|
1048
1176
|
dropdown: withCtx(() => [
|
|
1049
1177
|
createVNode(unref(ElDropdownMenu), null, {
|
|
1050
|
-
default: withCtx(() =>
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
"model-value": checkAll.value,
|
|
1058
|
-
indeterminate: indeterminate.value,
|
|
1059
|
-
onChange: onCheckAllChange
|
|
1060
|
-
}, {
|
|
1061
|
-
default: withCtx(() => [..._cache[1] || (_cache[1] = [
|
|
1062
|
-
createTextVNode(" 全选 ", -1)
|
|
1063
|
-
])]),
|
|
1064
|
-
_: 1
|
|
1065
|
-
}, 8, ["model-value", "indeterminate"])
|
|
1066
|
-
]),
|
|
1067
|
-
_: 1
|
|
1068
|
-
}),
|
|
1069
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(checkedColumnsOptions.value, (item) => {
|
|
1070
|
-
return openBlock(), createBlock(unref(ElDropdownItem), {
|
|
1071
|
-
key: item.value,
|
|
1072
|
-
command: item.value,
|
|
1073
|
-
onClick: withModifiers(($event) => toggleColumnsItem(item.value), ["stop"])
|
|
1178
|
+
default: withCtx(() => {
|
|
1179
|
+
var _a;
|
|
1180
|
+
return [
|
|
1181
|
+
!((_a = __props.columnControl) == null ? void 0 : _a.disableCheckAll) ? (openBlock(), createBlock(unref(ElDropdownItem), {
|
|
1182
|
+
key: 0,
|
|
1183
|
+
disabled: true,
|
|
1184
|
+
divided: false
|
|
1074
1185
|
}, {
|
|
1075
1186
|
default: withCtx(() => [
|
|
1076
1187
|
createVNode(unref(ElCheckbox), {
|
|
1077
|
-
"model-value":
|
|
1078
|
-
|
|
1188
|
+
"model-value": checkAll.value,
|
|
1189
|
+
indeterminate: indeterminate.value,
|
|
1190
|
+
onChange: onCheckAllChange
|
|
1079
1191
|
}, {
|
|
1080
1192
|
default: withCtx(() => [
|
|
1081
|
-
createTextVNode(toDisplayString(
|
|
1193
|
+
createTextVNode(toDisplayString(unref(t)("table.selectAll")), 1)
|
|
1082
1194
|
]),
|
|
1083
|
-
_:
|
|
1084
|
-
},
|
|
1195
|
+
_: 1
|
|
1196
|
+
}, 8, ["model-value", "indeterminate"])
|
|
1085
1197
|
]),
|
|
1086
|
-
_:
|
|
1087
|
-
}
|
|
1088
|
-
|
|
1089
|
-
|
|
1198
|
+
_: 1
|
|
1199
|
+
})) : createCommentVNode("", true),
|
|
1200
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(checkedColumnsOptions.value, (item) => {
|
|
1201
|
+
return openBlock(), createBlock(unref(ElDropdownItem), {
|
|
1202
|
+
key: item.value,
|
|
1203
|
+
command: item.value,
|
|
1204
|
+
onClick: withModifiers(($event) => toggleColumnsItem(item.value), ["stop"])
|
|
1205
|
+
}, {
|
|
1206
|
+
default: withCtx(() => [
|
|
1207
|
+
createVNode(unref(ElCheckbox), {
|
|
1208
|
+
"model-value": item.checked,
|
|
1209
|
+
disabled: item.disabled
|
|
1210
|
+
}, {
|
|
1211
|
+
default: withCtx(() => [
|
|
1212
|
+
createTextVNode(toDisplayString(item.label), 1)
|
|
1213
|
+
]),
|
|
1214
|
+
_: 2
|
|
1215
|
+
}, 1032, ["model-value", "disabled"])
|
|
1216
|
+
]),
|
|
1217
|
+
_: 2
|
|
1218
|
+
}, 1032, ["command", "onClick"]);
|
|
1219
|
+
}), 128))
|
|
1220
|
+
];
|
|
1221
|
+
}),
|
|
1090
1222
|
_: 1
|
|
1091
1223
|
})
|
|
1092
1224
|
]),
|
|
@@ -1106,7 +1238,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
|
1106
1238
|
};
|
|
1107
1239
|
}
|
|
1108
1240
|
});
|
|
1109
|
-
const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-
|
|
1241
|
+
const ColumnControl = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-58a57bcb"]]);
|
|
1110
1242
|
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
1111
1243
|
...{ name: "TableColumnRenderer" },
|
|
1112
1244
|
__name: "TableColumnRenderer",
|
|
@@ -1245,6 +1377,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
1245
1377
|
}),
|
|
1246
1378
|
emits: ["update:size", "update:loading"],
|
|
1247
1379
|
setup(__props) {
|
|
1380
|
+
const { t } = useLocale();
|
|
1248
1381
|
const config = INJECT_CONFIG["pro-table"];
|
|
1249
1382
|
const injectProps = inject(config.injectionKey, config.default);
|
|
1250
1383
|
const tableProperties = Object.keys(tableProps());
|
|
@@ -1337,7 +1470,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
1337
1470
|
{
|
|
1338
1471
|
key: "_index",
|
|
1339
1472
|
type: "index",
|
|
1340
|
-
label: "
|
|
1473
|
+
label: t("table.index"),
|
|
1341
1474
|
width: 80
|
|
1342
1475
|
},
|
|
1343
1476
|
...normalized
|
|
@@ -1387,9 +1520,17 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
1387
1520
|
});
|
|
1388
1521
|
const computedControl = computed(() => {
|
|
1389
1522
|
const mergedControl = __props.control ?? injectProps.control;
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1523
|
+
if (typeof mergedControl === "boolean") {
|
|
1524
|
+
return { sizeControl: mergedControl, columnControl: mergedControl };
|
|
1525
|
+
}
|
|
1526
|
+
const c = mergedControl;
|
|
1527
|
+
const sizeControl = c.sizeControl ?? true;
|
|
1528
|
+
const columnControl = c.columnControl ?? true;
|
|
1529
|
+
return { sizeControl: !!sizeControl, columnControl };
|
|
1530
|
+
});
|
|
1531
|
+
const columnControlConfig = computed(() => {
|
|
1532
|
+
const cc = computedControl.value.columnControl;
|
|
1533
|
+
return typeof cc === "object" ? cc : void 0;
|
|
1393
1534
|
});
|
|
1394
1535
|
const resolvedSize = computed(() => {
|
|
1395
1536
|
return size.value ?? attrsTableProps.value.size ?? injectTableAttrs.value.size;
|
|
@@ -1440,8 +1581,9 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
1440
1581
|
computedControl.value.columnControl ? (openBlock(), createElementBlock("div", _hoisted_5, [
|
|
1441
1582
|
createVNode(unref(ColumnControl), {
|
|
1442
1583
|
columns: normalizedRawColumns.value,
|
|
1443
|
-
table: __props.table
|
|
1444
|
-
|
|
1584
|
+
table: __props.table,
|
|
1585
|
+
"column-control": columnControlConfig.value
|
|
1586
|
+
}, null, 8, ["columns", "table", "column-control"])
|
|
1445
1587
|
])) : createCommentVNode("", true)
|
|
1446
1588
|
]),
|
|
1447
1589
|
renderSlot(_ctx.$slots, "table", {}, () => [
|
|
@@ -1481,12 +1623,20 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
1481
1623
|
};
|
|
1482
1624
|
}
|
|
1483
1625
|
});
|
|
1484
|
-
const ProTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-
|
|
1626
|
+
const ProTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-5dd36c64"]]);
|
|
1485
1627
|
function useTable(params = {}) {
|
|
1486
|
-
const { data, ...rest } = params;
|
|
1628
|
+
const { data, columns, ...rest } = params;
|
|
1487
1629
|
const coreTable = useTable$1({
|
|
1488
1630
|
...rest,
|
|
1489
|
-
dataSource: data
|
|
1631
|
+
dataSource: data,
|
|
1632
|
+
// 补齐列 key(key ?? prop ?? columnKey),
|
|
1633
|
+
// 使 setColumn 等按 key 匹配的 API 对 Element Plus 的 prop 列生效
|
|
1634
|
+
columns: columns == null ? void 0 : columns.map((column) => {
|
|
1635
|
+
if (column.key !== void 0 && column.key !== null) return column;
|
|
1636
|
+
const prop = Array.isArray(column.prop) ? column.prop.join(".") : column.prop;
|
|
1637
|
+
const fallback = prop ?? (typeof column.columnKey === "string" ? column.columnKey : void 0);
|
|
1638
|
+
return { ...column, key: fallback };
|
|
1639
|
+
})
|
|
1490
1640
|
});
|
|
1491
1641
|
const { dataSource, ...tableWithoutDataSource } = coreTable;
|
|
1492
1642
|
const table = {
|
|
@@ -1503,7 +1653,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1503
1653
|
__name: "index",
|
|
1504
1654
|
props: {
|
|
1505
1655
|
componentVars: {},
|
|
1506
|
-
componentMap: {}
|
|
1656
|
+
componentMap: {},
|
|
1657
|
+
locale: {}
|
|
1507
1658
|
},
|
|
1508
1659
|
setup(__props) {
|
|
1509
1660
|
const props = __props;
|
|
@@ -1516,6 +1667,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
1516
1667
|
if (props.componentMap) {
|
|
1517
1668
|
provide(INJECT_COMPONENTS, props.componentMap);
|
|
1518
1669
|
}
|
|
1670
|
+
provide(
|
|
1671
|
+
LOCALE_INJECT_KEY,
|
|
1672
|
+
computed(() => props.locale)
|
|
1673
|
+
);
|
|
1519
1674
|
return (_ctx, _cache) => {
|
|
1520
1675
|
return renderSlot(_ctx.$slots, "default");
|
|
1521
1676
|
};
|
|
@@ -1544,15 +1699,20 @@ const index = {
|
|
|
1544
1699
|
};
|
|
1545
1700
|
export {
|
|
1546
1701
|
_sfc_main$d as ContainerFragment,
|
|
1702
|
+
LOCALE_INJECT_KEY,
|
|
1547
1703
|
_sfc_main as ProComponentProvider,
|
|
1548
1704
|
_sfc_main$b as ProForm,
|
|
1549
1705
|
ProTable,
|
|
1550
1706
|
_sfc_main$c as SlotComponent,
|
|
1551
1707
|
index as default,
|
|
1708
|
+
enUS,
|
|
1552
1709
|
useFields,
|
|
1553
1710
|
useForm,
|
|
1554
1711
|
useFormData,
|
|
1555
1712
|
useFormRef,
|
|
1556
|
-
|
|
1713
|
+
useLocale,
|
|
1714
|
+
useTable,
|
|
1715
|
+
zhCN,
|
|
1716
|
+
zhTW
|
|
1557
1717
|
};
|
|
1558
1718
|
//# sourceMappingURL=index.js.map
|