@qin-ui/element-plus-pro 1.3.2 → 1.3.4
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 +4 -4
- package/README.md +3 -2
- package/api.json +3 -3
- package/es/components/component-provider/constants/index.d.ts.map +1 -1
- package/es/components/component-provider/types/index.d.ts +2 -1
- package/es/components/component-provider/types/index.d.ts.map +1 -1
- package/es/components/form/components/BaseField/index.vue.d.ts.map +1 -1
- package/es/components/form/components/BaseFormItem/index.vue.d.ts +1 -1
- package/es/components/form/components/BaseFormItem/index.vue.d.ts.map +1 -1
- package/es/components/form/components/ProForm/index.vue.d.ts.map +1 -1
- package/es/components/form/components/SlotComponent/index.vue.d.ts.map +1 -1
- package/es/components/form/hooks/useForm.d.ts +3 -2
- package/es/components/form/hooks/useForm.d.ts.map +1 -1
- package/es/components/form/hooks/useGroupFieldAttrs.d.ts.map +1 -1
- package/es/components/form/types/index.d.ts +2 -2
- package/es/components/form/types/index.d.ts.map +1 -1
- package/es/components/table/components/ColumnControl.vue.d.ts.map +1 -1
- package/es/components/table/components/ProTable.vue.d.ts +30 -4
- package/es/components/table/components/ProTable.vue.d.ts.map +1 -1
- package/es/components/table/components/SizeControl.vue.d.ts +2 -2
- package/es/components/table/index.d.ts +4 -28
- package/es/components/table/index.d.ts.map +1 -1
- package/es/components/table/useTable.d.ts +1 -1
- package/es/element-plus-pro.css +12 -12
- package/es/index.js +84 -67
- package/es/index.js.map +1 -1
- package/es/shared/core/index.d.ts +1 -2
- package/es/shared/core/index.d.ts.map +1 -1
- package/es/shared/ui/index.d.ts +2 -2
- package/es/shared/ui/index.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/components/component-provider/constants/index.ts +12 -0
- package/src/components/component-provider/types/index.ts +7 -1
- package/src/components/form/components/BaseField/index.vue +14 -2
- package/src/components/form/components/BaseField/utils/index.ts +1 -1
- package/src/components/form/components/BaseFormItem/index.vue +4 -0
- package/src/components/form/components/ProForm/index.vue +7 -2
- package/src/components/form/components/SlotComponent/index.vue +4 -3
- package/src/components/form/hooks/useForm.ts +3 -2
- package/src/components/form/hooks/useGroupFieldAttrs.ts +2 -1
- package/src/components/form/types/index.ts +2 -8
- package/src/components/table/components/ColumnControl.vue +36 -35
- package/src/components/table/components/ProTable.vue +50 -2
- package/src/components/table/components/SearchForm.vue +1 -1
- package/src/components/table/index.ts +10 -30
- package/src/components/table/useTable.ts +1 -1
- package/src/shared/core/index.ts +1 -2
- package/src/shared/ui/index.ts +2 -0
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* 统一 re-export @qin-ui/pro-components-core,包内所有文件通过此文件引入 core
|
|
3
|
-
* 避免直接散列依赖 @qin-ui/pro-components-core,便于将来统一维护。
|
|
2
|
+
* 统一 re-export @qin-ui/pro-components-core,包内所有文件通过此文件引入 core 内容。
|
|
4
3
|
*/
|
|
5
4
|
export { useForm, createFormProxy, useTable, useSearchFormExpand, useFields, useFormData, useFormRef, InjectionFormKey, InjectionFormSlotsKey, getObject, get, set, normalizePathKey, toPath, camelizeProperties, cloneDeep, pick, isPlainObject, isPromise, zhCN, zhTW, enUS, format, resolveLocaleName, type ProLocale, type ProLocaleName, type ProLocaleKey, type Data, type Path, type Paths, type KeyExpandString, type ExtendWithAny, type DeepPartial, type PageParam, type Fields, type Form, type Table, type UseFieldsReturn, type UseFormDataReturn, type UseFormRefReturn, } from '@qin-ui/pro-components-core';
|
|
6
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/core/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/core/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAEL,OAAO,EACP,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,WAAW,EACX,UAAU,EAEV,gBAAgB,EAChB,qBAAqB,EAErB,SAAS,EACT,GAAG,EACH,GAAG,EACH,gBAAgB,EAChB,MAAM,EACN,kBAAkB,EAClB,SAAS,EACT,IAAI,EACJ,aAAa,EACb,SAAS,EAET,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,iBAAiB,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,YAAY,EAEjB,KAAK,IAAI,EACT,KAAK,IAAI,EACT,KAAK,KAAK,EACV,KAAK,eAAe,EACpB,KAAK,aAAa,EAClB,KAAK,WAAW,EAChB,KAAK,SAAS,EACd,KAAK,MAAM,EACX,KAAK,IAAI,EACT,KAAK,KAAK,EACV,KAAK,eAAe,EACpB,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,6BAA6B,CAAC"}
|
package/es/shared/ui/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { ElForm as Form, ElFormItem as FormItem, ElRow as Grid, ElCol as GridItem, ElTable as Table, ElTableColumn as TableColumn, ElSpace as Space, ElDropdown as Dropdown, ElDropdownMenu as DropdownMenu, ElDropdownItem as DropdownItem, ElCheckbox as Checkbox, ElCheckboxGroup as CheckboxGroup, ElButton as Button, ElAutocomplete as AutoComplete, ElCascader as Cascader, ElDatePicker as DatePicker, ElInput as Input, ElInputNumber as InputNumber, ElSelect as Select, ElSlider as Slider, ElSwitch as Switch, ElTransfer as Transfer, ElTreeSelect as TreeSelect, ElRadioGroup as RadioGroup, ElTimePicker as TimePicker, ElTimeSelect as TimeSelect, ElPagination as Pagination, FormItemInstance, FormInstance, FormProps, FormItemProps, TableProps as _TableProps, TableColumnCtx as ColumnType, PaginationProps, RowProps as GridProps, ColProps as GridItemProps } from 'element-plus';
|
|
1
|
+
import { ElForm as Form, ElFormItem as FormItem, ElRow as Grid, ElCol as GridItem, ElTable as Table, ElTableColumn as TableColumn, ElSpace as Space, ElDropdown as Dropdown, ElDropdownMenu as DropdownMenu, ElDropdownItem as DropdownItem, ElCheckbox as Checkbox, ElCheckboxGroup as CheckboxGroup, ElButton as Button, ElAutocomplete as AutoComplete, ElCascader as Cascader, ElDatePicker as DatePicker, ElInput as Input, ElInputNumber as InputNumber, ElSelect as Select, ElSlider as Slider, ElSwitch as Switch, ElTransfer as Transfer, ElTreeSelect as TreeSelect, ElRadioGroup as RadioGroup, ElTimePicker as TimePicker, ElTimeSelect as TimeSelect, ElPagination as Pagination, FormItemInstance, FormInstance, FormProps, FormItemProps, TableProps as _TableProps, TableEmits, TableColumnCtx as ColumnType, PaginationProps, RowProps as GridProps, ColProps as GridItemProps } from 'element-plus';
|
|
2
2
|
import { MaybeRefOrGetter } from 'vue';
|
|
3
|
-
export { Form, FormItem, Grid, GridItem, Table, TableColumn, Space, Dropdown, DropdownMenu, DropdownItem, Checkbox, CheckboxGroup, Button, AutoComplete, Cascader, DatePicker, Input, InputNumber, Select, Slider, Switch, Transfer, TreeSelect, RadioGroup, TimePicker, TimeSelect, Pagination, type FormItemInstance, type FormInstance, type FormProps, type FormItemProps, type PaginationProps, type GridProps, type GridItemProps, type ColumnType, };
|
|
3
|
+
export { Form, FormItem, Grid, GridItem, Table, TableColumn, Space, Dropdown, DropdownMenu, DropdownItem, Checkbox, CheckboxGroup, Button, AutoComplete, Cascader, DatePicker, Input, InputNumber, Select, Slider, Switch, Transfer, TreeSelect, RadioGroup, TimePicker, TimeSelect, Pagination, type FormItemInstance, type FormInstance, type FormProps, type FormItemProps, type PaginationProps, type GridProps, type GridItemProps, type ColumnType, type TableEmits, };
|
|
4
4
|
export type TableProps = _TableProps<any>;
|
|
5
5
|
export declare const tableProps: () => any;
|
|
6
6
|
export declare const paginationProps: () => any;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,IAAI,IAAI,EACd,UAAU,IAAI,QAAQ,EACtB,KAAK,IAAI,IAAI,EACb,KAAK,IAAI,QAAQ,EACjB,OAAO,IAAI,KAAK,EAChB,aAAa,IAAI,WAAW,EAC5B,OAAO,IAAI,KAAK,EAChB,UAAU,IAAI,QAAQ,EACtB,cAAc,IAAI,YAAY,EAC9B,cAAc,IAAI,YAAY,EAC9B,UAAU,IAAI,QAAQ,EACtB,eAAe,IAAI,aAAa,EAChC,QAAQ,IAAI,MAAM,EAClB,cAAc,IAAI,YAAY,EAC9B,UAAU,IAAI,QAAQ,EACtB,YAAY,IAAI,UAAU,EAC1B,OAAO,IAAI,KAAK,EAChB,aAAa,IAAI,WAAW,EAC5B,QAAQ,IAAI,MAAM,EAClB,QAAQ,IAAI,MAAM,EAClB,QAAQ,IAAI,MAAM,EAClB,UAAU,IAAI,QAAQ,EACtB,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAE1B,KAAK,gBAAgB,EACrB,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,UAAU,IAAI,WAAW,EAC9B,KAAK,cAAc,IAAI,UAAU,EACjC,KAAK,eAAe,EACpB,KAAK,QAAQ,IAAI,SAAS,EAC1B,KAAK,QAAQ,IAAI,aAAa,EAC/B,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,KAAK,gBAAgB,EAAsC,MAAM,KAAK,CAAC;AAEhF,OAAO,EACL,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,KAAK,EACL,WAAW,EACX,MAAM,EACN,MAAM,EACN,MAAM,EACN,QAAQ,EACR,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,KAAK,gBAAgB,EACrB,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,eAAe,EACpB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,UAAU,GAChB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;AAO1C,eAAO,MAAM,UAAU,WAAoB,CAAC;AAC5C,eAAO,MAAM,eAAe,WAAyB,CAAC;AACtD,eAAO,MAAM,aAAa,WAAuB,CAAC;AAClD,eAAO,MAAM,aAAa,WAAuB,CAAC;AAIlD,eAAO,MAAM,kBAAkB,0CAS9B,CAAC;AAEF,eAAO,MAAM,0BAA0B,GACrC,UAAU,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,SAMhD,CAAC;AAEF,eAAO,MAAM,iBAAiB,0CAAqB,CAAC;AACpD,eAAO,MAAM,mBAAmB,aATpB,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,SASY,CAAC;AAE9D,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/shared/ui/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,IAAI,IAAI,EACd,UAAU,IAAI,QAAQ,EACtB,KAAK,IAAI,IAAI,EACb,KAAK,IAAI,QAAQ,EACjB,OAAO,IAAI,KAAK,EAChB,aAAa,IAAI,WAAW,EAC5B,OAAO,IAAI,KAAK,EAChB,UAAU,IAAI,QAAQ,EACtB,cAAc,IAAI,YAAY,EAC9B,cAAc,IAAI,YAAY,EAC9B,UAAU,IAAI,QAAQ,EACtB,eAAe,IAAI,aAAa,EAChC,QAAQ,IAAI,MAAM,EAClB,cAAc,IAAI,YAAY,EAC9B,UAAU,IAAI,QAAQ,EACtB,YAAY,IAAI,UAAU,EAC1B,OAAO,IAAI,KAAK,EAChB,aAAa,IAAI,WAAW,EAC5B,QAAQ,IAAI,MAAM,EAClB,QAAQ,IAAI,MAAM,EAClB,QAAQ,IAAI,MAAM,EAClB,UAAU,IAAI,QAAQ,EACtB,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAC1B,YAAY,IAAI,UAAU,EAE1B,KAAK,gBAAgB,EACrB,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,UAAU,IAAI,WAAW,EAC9B,KAAK,UAAU,EACf,KAAK,cAAc,IAAI,UAAU,EACjC,KAAK,eAAe,EACpB,KAAK,QAAQ,IAAI,SAAS,EAC1B,KAAK,QAAQ,IAAI,aAAa,EAC/B,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,KAAK,gBAAgB,EAAsC,MAAM,KAAK,CAAC;AAEhF,OAAO,EACL,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,MAAM,EACN,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,KAAK,EACL,WAAW,EACX,MAAM,EACN,MAAM,EACN,MAAM,EACN,QAAQ,EACR,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,KAAK,gBAAgB,EACrB,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,eAAe,EACpB,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,UAAU,EACf,KAAK,UAAU,GAChB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC;AAO1C,eAAO,MAAM,UAAU,WAAoB,CAAC;AAC5C,eAAO,MAAM,eAAe,WAAyB,CAAC;AACtD,eAAO,MAAM,aAAa,WAAuB,CAAC;AAClD,eAAO,MAAM,aAAa,WAAuB,CAAC;AAIlD,eAAO,MAAM,kBAAkB,0CAS9B,CAAC;AAEF,eAAO,MAAM,0BAA0B,GACrC,UAAU,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,SAMhD,CAAC;AAEF,eAAO,MAAM,iBAAiB,0CAAqB,CAAC;AACpD,eAAO,MAAM,mBAAmB,aATpB,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,SASY,CAAC;AAE9D,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@qin-ui/element-plus-pro",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.4",
|
|
4
4
|
"description": "基于 element-plus 的二次封装组件",
|
|
5
5
|
"bin": {
|
|
6
6
|
"element-plus-pro": "./bin/init-ai.mjs"
|
|
@@ -39,11 +39,11 @@
|
|
|
39
39
|
},
|
|
40
40
|
"dependencies": {
|
|
41
41
|
"vue-component-type-helpers": "^3.2.5",
|
|
42
|
-
"@qin-ui/pro-components-core": "^2.0.
|
|
42
|
+
"@qin-ui/pro-components-core": "^2.0.3"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"@vue/test-utils": "^2.4.11",
|
|
46
|
-
"element-plus": "^2.
|
|
46
|
+
"element-plus": "^2.14.5",
|
|
47
47
|
"happy-dom": "^20.11.6",
|
|
48
48
|
"vitest": "^4.1.11"
|
|
49
49
|
},
|
|
@@ -122,6 +122,18 @@ export const INJECT_CONFIG: {
|
|
|
122
122
|
injectionKey: Symbol(''),
|
|
123
123
|
default: { style: { width: '100%' } },
|
|
124
124
|
},
|
|
125
|
+
'date-picker.quarter': {
|
|
126
|
+
injectionKey: Symbol(''),
|
|
127
|
+
default: { style: { width: '100%' } },
|
|
128
|
+
},
|
|
129
|
+
'date-picker.quarters': {
|
|
130
|
+
injectionKey: Symbol(''),
|
|
131
|
+
default: { style: { width: '100%' } },
|
|
132
|
+
},
|
|
133
|
+
'date-picker.quarterrange': {
|
|
134
|
+
injectionKey: Symbol(''),
|
|
135
|
+
default: { style: { width: '100%' } },
|
|
136
|
+
},
|
|
125
137
|
'date-picker.datetime': {
|
|
126
138
|
injectionKey: Symbol(''),
|
|
127
139
|
default: { style: { width: '100%' } },
|
|
@@ -11,6 +11,7 @@ import { ProFormProps } from '../../form';
|
|
|
11
11
|
import type { SearchFormProps } from '../../table/components/SearchForm.vue';
|
|
12
12
|
import { AllowedComponentProps } from 'vue';
|
|
13
13
|
import type { ComponentProps } from 'vue-component-type-helpers';
|
|
14
|
+
import { ColumnControlConfig } from 'src/components/table/types';
|
|
14
15
|
|
|
15
16
|
type PP<T extends Record<string, any>> = Partial<T & AllowedComponentProps>;
|
|
16
17
|
|
|
@@ -33,7 +34,12 @@ export type RequiredComponentVars = {
|
|
|
33
34
|
'pro-table': PP<
|
|
34
35
|
TableProps & {
|
|
35
36
|
pagination?: false | Partial<PaginationProps>;
|
|
36
|
-
control?:
|
|
37
|
+
control?:
|
|
38
|
+
| boolean
|
|
39
|
+
| {
|
|
40
|
+
sizeControl?: boolean;
|
|
41
|
+
columnControl?: boolean | ColumnControlConfig;
|
|
42
|
+
};
|
|
37
43
|
searchFormConfig?: Partial<Omit<SearchFormProps, 'form'>> & {
|
|
38
44
|
hidden?: boolean;
|
|
39
45
|
container?: ContainerComponent | false;
|
|
@@ -68,7 +68,11 @@ const componentRef = ref<any>();
|
|
|
68
68
|
|
|
69
69
|
const attrs: any = useAttrs();
|
|
70
70
|
|
|
71
|
-
|
|
71
|
+
/**
|
|
72
|
+
* 全局默认配置注入:key = 组件名 + type 修饰段,inject 须在 setup 同步期调用。
|
|
73
|
+
* 组件名与 `type` 仅取 setup 期初始值——运行期变更不会切换 Provider 的默认值预设
|
|
74
|
+
* (`date-picker.month` 等子类型预设需在初始渲染前确定)。
|
|
75
|
+
*/
|
|
72
76
|
const typeVal = attrs.type;
|
|
73
77
|
const injectConfigKey =
|
|
74
78
|
typeof props.component === 'string'
|
|
@@ -114,6 +118,13 @@ const value = computed({
|
|
|
114
118
|
newVal = setFormatter(val, oldVal);
|
|
115
119
|
}
|
|
116
120
|
form.setFormData?.(props.path, newVal);
|
|
121
|
+
// 字段配置/attrs 传入的 onUpdate:* 监听器与内部写值组合回放,参数为组件原始 emit 值
|
|
122
|
+
const { onUpdateValue } = groupedAttrs.value;
|
|
123
|
+
if (typeof onUpdateValue === 'function') {
|
|
124
|
+
onUpdateValue(val);
|
|
125
|
+
} else if (Array.isArray(onUpdateValue)) {
|
|
126
|
+
onUpdateValue.forEach(listener => listener(val));
|
|
127
|
+
}
|
|
117
128
|
},
|
|
118
129
|
});
|
|
119
130
|
|
|
@@ -148,7 +159,7 @@ const groupedAttrs = computed(() => {
|
|
|
148
159
|
|
|
149
160
|
// prettier-ignore
|
|
150
161
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
151
|
-
const { valueFormatter, modelProp, slots, componentClass, componentStyle, componentContainer, [modelPropName]: _modelVal, [`onUpdate:${modelPropName}`]:
|
|
162
|
+
const { valueFormatter, modelProp, slots, componentClass, componentStyle, componentContainer, [modelPropName]: _modelVal, [`onUpdate:${modelPropName}`]: onUpdateValue, ...bindAttrs } = mergedProps as any;
|
|
152
163
|
|
|
153
164
|
return {
|
|
154
165
|
attrs: bindAttrs,
|
|
@@ -156,6 +167,7 @@ const groupedAttrs = computed(() => {
|
|
|
156
167
|
componentContainer,
|
|
157
168
|
modelProp: modelPropName,
|
|
158
169
|
valueFormatter,
|
|
170
|
+
onUpdateValue,
|
|
159
171
|
};
|
|
160
172
|
});
|
|
161
173
|
|
|
@@ -82,6 +82,8 @@ const setFormItemRef = (field: any, el: any, formItemProps?: any) => {
|
|
|
82
82
|
raw.getFormItemComputedProps = () => formItemProps;
|
|
83
83
|
} else {
|
|
84
84
|
formItemInstanceMap.delete(raw);
|
|
85
|
+
delete raw.getFormItemRef;
|
|
86
|
+
delete raw.getFormItemComputedProps;
|
|
85
87
|
}
|
|
86
88
|
};
|
|
87
89
|
|
|
@@ -96,6 +98,8 @@ const setComponentRef = (field: any, el: any) => {
|
|
|
96
98
|
componentInstanceMap.get(raw)?.getComponentComputedProps();
|
|
97
99
|
} else {
|
|
98
100
|
componentInstanceMap.delete(raw);
|
|
101
|
+
delete raw.getComponentRef;
|
|
102
|
+
delete raw.getComponentComputedProps;
|
|
99
103
|
}
|
|
100
104
|
};
|
|
101
105
|
|
|
@@ -9,8 +9,8 @@
|
|
|
9
9
|
*
|
|
10
10
|
* 1. 数据隔离:ProForm 本身不负责存储和管理表单状态,所有核心状态(formData, fields, 校验规则)
|
|
11
11
|
* 均交由底层的 `useForm`(@qin-ui/pro-components-core)驱动。
|
|
12
|
-
* 2. 上下文透传:通过 `provide`
|
|
13
|
-
* 3. 递归渲染:网格布局和具体字段的解析交由 `<BaseFormItem>`
|
|
12
|
+
* 2. 上下文透传:通过 `provide` 将核心状态下发给子组件。
|
|
13
|
+
* 3. 递归渲染:网格布局和具体字段的解析交由 `<BaseFormItem>` 递归完成。
|
|
14
14
|
*
|
|
15
15
|
* 通过配置驱动的方式快速构建表单,支持:
|
|
16
16
|
* - 字段联动、嵌套字段、自定义组件、网格布局
|
|
@@ -86,6 +86,10 @@ const fields = computed(() => {
|
|
|
86
86
|
const formData = computed(() => currentForm.value?.formData);
|
|
87
87
|
const setFormRef = (el: any) => currentForm.value?.setFormRef?.(el);
|
|
88
88
|
|
|
89
|
+
/*
|
|
90
|
+
* formKey 子树重挂载契约:以 WeakMap 为每个 form 实例生成自增 key,绑定到原生 Form 的 :key
|
|
91
|
+
* :form 运行期替换为全新实例时强制整棵表单子树重新挂载,重置宿主校验状态与深层字段非受控状态
|
|
92
|
+
*/
|
|
89
93
|
let formInstanceCounter = 0;
|
|
90
94
|
const formInstanceKeyMap = new WeakMap<object, number>();
|
|
91
95
|
const getFormKey = (f: object) => {
|
|
@@ -129,6 +133,7 @@ provide(InjectionFormSlotsKey, slots);
|
|
|
129
133
|
</script>
|
|
130
134
|
|
|
131
135
|
<template>
|
|
136
|
+
<!-- el-form 渲染原生 form 元素,拦截回车触发的默认提交 -->
|
|
132
137
|
<ElForm
|
|
133
138
|
:key="formKey"
|
|
134
139
|
:ref="setFormRef"
|
|
@@ -14,9 +14,10 @@ type Props = {
|
|
|
14
14
|
};
|
|
15
15
|
defineProps<Props>();
|
|
16
16
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
17
|
+
/*
|
|
18
|
+
* 可组件化渲染判定:VNode / 函数(含函数式组件)/ 组件定义对象
|
|
19
|
+
* 其余(string/number/boolean/null/undefined)一律按文本渲染,不作为 <component :is> 的标签名解析
|
|
20
|
+
*/
|
|
20
21
|
const isRenderable = (c: Props['component']) =>
|
|
21
22
|
c !== null &&
|
|
22
23
|
c !== undefined &&
|
|
@@ -18,10 +18,11 @@ import type { FormInstance } from '../../../shared/ui';
|
|
|
18
18
|
*
|
|
19
19
|
* @property formData - 响应式表单数据对象,可直接读写,支持深层路径如 `formData.address.city`
|
|
20
20
|
* @property getFormData - 获取指定路径的表单数据,支持点号分隔的深层路径,如 `getFormData('address.city')`
|
|
21
|
-
* @property setFormData -
|
|
21
|
+
* @property setFormData - 设置表单数据,支持四种调用方式:<br>
|
|
22
22
|
* 1. `setFormData(path, value)` - 设置指定路径的值<br>
|
|
23
23
|
* 2. `setFormData(path, prev => newVal)` - 函数式更新<br>
|
|
24
|
-
* 3. `setFormData({ ... })` -
|
|
24
|
+
* 3. `setFormData({ ... })` - 批量覆盖整个表单<br>
|
|
25
|
+
* 4. `setFormData(prev => ({ ...prev, name: '新' }))` - 基于当前数据函数式批量更新
|
|
25
26
|
* @property fields - 字段配置数组(响应式 Ref),ProForm 根据此数组渲染表单字段
|
|
26
27
|
* @property getField - 获取字段配置,支持路径字符串(如 `'name'`)或查找函数(如 `f => f.label === '姓名'`)
|
|
27
28
|
* @property setField - 更新字段配置,默认合并模式(Object.assign),可通过 `{ updateType: 'rewrite' }` 覆盖
|
|
@@ -17,6 +17,7 @@ const gridItemPropKeys = Object.keys(gridItemProps());
|
|
|
17
17
|
// 模块级 Set:字段循环内 O(1) 命中,替代数组 includes 线性扫描
|
|
18
18
|
const gridItemPropKeySet = new Set<string>(gridItemPropKeys);
|
|
19
19
|
const formItemPropKeySet = new Set<string>(formItemPropKeys);
|
|
20
|
+
const formItemSlotKeySet = new Set<string>(FORM_ITEM_SLOT_KEYS);
|
|
20
21
|
|
|
21
22
|
export interface GroupedField {
|
|
22
23
|
path: string;
|
|
@@ -89,7 +90,7 @@ export function useGroupFieldAttrs(validFields: ComputedRef<Field[]>) {
|
|
|
89
90
|
|
|
90
91
|
Object.assign(componentProps, componentDataAttrs);
|
|
91
92
|
Object.keys(slots).forEach(k => {
|
|
92
|
-
if (
|
|
93
|
+
if (formItemSlotKeySet.has(k)) {
|
|
93
94
|
formItemSlots[k] = slots[k];
|
|
94
95
|
} else {
|
|
95
96
|
componentProps.slots[k] = slots[k];
|
|
@@ -290,10 +290,7 @@ type WithFields<D extends Data = Data> = WithRef<
|
|
|
290
290
|
/**
|
|
291
291
|
* @description 合并 FormItem 插槽与组件插槽
|
|
292
292
|
*/
|
|
293
|
-
export type MergeSlots<
|
|
294
|
-
T extends abstract new (...args: any) => any,
|
|
295
|
-
CS = ComponentSlots<T>,
|
|
296
|
-
> = Partial<{
|
|
293
|
+
export type MergeSlots<T, CS = ComponentSlots<T>> = Partial<{
|
|
297
294
|
[K in keyof FormItemSlots | keyof CS]: K extends keyof FormItemSlots
|
|
298
295
|
? FormItemSlots[K]
|
|
299
296
|
: K extends keyof CS
|
|
@@ -306,10 +303,7 @@ export type MergeSlots<
|
|
|
306
303
|
* @template T - Vue 组件类型
|
|
307
304
|
* @template D - 数据对象类型
|
|
308
305
|
*/
|
|
309
|
-
type WithComponent<
|
|
310
|
-
T extends abstract new (...args: any) => any,
|
|
311
|
-
D extends Data = Data,
|
|
312
|
-
> = Omit<
|
|
306
|
+
type WithComponent<T, D extends Data = Data> = Omit<
|
|
313
307
|
WithCommon<Partial<ComponentProps<T>>, D>,
|
|
314
308
|
keyof VNodeProps | 'slots'
|
|
315
309
|
> & {
|
|
@@ -28,9 +28,10 @@ const { t } = useLocale();
|
|
|
28
28
|
const checkAll = ref(false);
|
|
29
29
|
const indeterminate = ref(false);
|
|
30
30
|
|
|
31
|
-
const getColumnKey = (column: Column
|
|
31
|
+
const getColumnKey = (column: Column) => {
|
|
32
32
|
const rawKey = column.key ?? column.prop;
|
|
33
|
-
if (rawKey === undefined || rawKey === null
|
|
33
|
+
if (rawKey === undefined || rawKey === null || rawKey === '')
|
|
34
|
+
return undefined;
|
|
34
35
|
return normalizePathKey(rawKey);
|
|
35
36
|
};
|
|
36
37
|
|
|
@@ -43,39 +44,39 @@ const checkedColumnsOptions = computed<
|
|
|
43
44
|
column: Column;
|
|
44
45
|
}>
|
|
45
46
|
>(() =>
|
|
46
|
-
props.columns
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
(
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
}
|
|
78
|
-
|
|
47
|
+
props.columns.flatMap(item => {
|
|
48
|
+
const key = getColumnKey(item);
|
|
49
|
+
// 无 key/prop 列不进入列控面板
|
|
50
|
+
if (key === undefined) return [];
|
|
51
|
+
// 默认排除内部序号列 __INDEX__ 及显式指定的 excludedKeys
|
|
52
|
+
if (
|
|
53
|
+
key === '__INDEX__' ||
|
|
54
|
+
(item as any).type === 'index' ||
|
|
55
|
+
props.columnControl?.excludedKeys?.some(ek => String(ek) === key)
|
|
56
|
+
)
|
|
57
|
+
return [];
|
|
58
|
+
const disabled =
|
|
59
|
+
props.columnControl?.disabledKeys?.some(dk => String(dk) === key) ??
|
|
60
|
+
false;
|
|
61
|
+
const rawTitle = item.label ?? (item as any).title;
|
|
62
|
+
const titleLabel = typeof rawTitle === 'string' ? rawTitle : undefined;
|
|
63
|
+
const propLabel =
|
|
64
|
+
item.prop !== undefined && item.prop !== null
|
|
65
|
+
? String(item.prop)
|
|
66
|
+
: undefined;
|
|
67
|
+
const label =
|
|
68
|
+
(props.columnControl?.labels?.[key] as string) ??
|
|
69
|
+
titleLabel ??
|
|
70
|
+
propLabel ??
|
|
71
|
+
key;
|
|
72
|
+
return {
|
|
73
|
+
label,
|
|
74
|
+
value: key,
|
|
75
|
+
checked: !item.hidden || !!disabled,
|
|
76
|
+
disabled: !!disabled,
|
|
77
|
+
column: item,
|
|
78
|
+
};
|
|
79
|
+
})
|
|
79
80
|
);
|
|
80
81
|
|
|
81
82
|
/** 可被用户勾选/取消的列(非 disabled) */
|
|
@@ -37,6 +37,7 @@ import {
|
|
|
37
37
|
type PaginationProps,
|
|
38
38
|
Table as ElTable,
|
|
39
39
|
type TableProps,
|
|
40
|
+
type TableEmits,
|
|
40
41
|
tableProps,
|
|
41
42
|
paginationProps,
|
|
42
43
|
} from '../../../shared/ui';
|
|
@@ -119,7 +120,11 @@ type Props = {
|
|
|
119
120
|
columns?: Columns<RecordType>;
|
|
120
121
|
data?: RecordType[];
|
|
121
122
|
pagination?: false | Partial<PaginationProps>;
|
|
122
|
-
} & Omit<TableProps, 'data'>;
|
|
123
|
+
} & /* @vue-ignore */ Omit<TableProps, 'data'>;
|
|
124
|
+
|
|
125
|
+
type Emits = {} & /* @vue-ignore */ TableEmits<RecordType>;
|
|
126
|
+
|
|
127
|
+
defineEmits<Emits>();
|
|
123
128
|
|
|
124
129
|
const props = withDefaults(defineProps<Props>(), {
|
|
125
130
|
table: undefined,
|
|
@@ -142,8 +147,36 @@ const injectProps = computed(() => toValue(injectPropsRaw) || {});
|
|
|
142
147
|
|
|
143
148
|
const attrs = useAttrs() as Record<string, any>;
|
|
144
149
|
|
|
150
|
+
const PRO_TABLE_EXCLUDED_ATTR_KEYS = new Set([
|
|
151
|
+
'class',
|
|
152
|
+
'style',
|
|
153
|
+
'onSearch',
|
|
154
|
+
'onChange',
|
|
155
|
+
'onUpdate:size',
|
|
156
|
+
'onUpdate:loading',
|
|
157
|
+
'data',
|
|
158
|
+
'columns',
|
|
159
|
+
'size',
|
|
160
|
+
'pagination',
|
|
161
|
+
]);
|
|
162
|
+
|
|
163
|
+
const PRO_TABLE_PROVIDER_KEYS = new Set([
|
|
164
|
+
'pagination',
|
|
165
|
+
'searchFormConfig',
|
|
166
|
+
'control',
|
|
167
|
+
'immediateSearch',
|
|
168
|
+
'addIndexColumn',
|
|
169
|
+
'tableContainer',
|
|
170
|
+
]);
|
|
171
|
+
|
|
145
172
|
const injectTableAttrs = computed(() => {
|
|
146
|
-
|
|
173
|
+
const tableConfig: Record<string, any> = {};
|
|
174
|
+
for (const [key, value] of Object.entries(injectProps.value)) {
|
|
175
|
+
if (!PRO_TABLE_PROVIDER_KEYS.has(key)) {
|
|
176
|
+
tableConfig[key] = value;
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
return tableConfig as Partial<TableProps>;
|
|
147
180
|
});
|
|
148
181
|
|
|
149
182
|
const attrsTableProps = computed(() => {
|
|
@@ -153,6 +186,16 @@ const attrsTableProps = computed(() => {
|
|
|
153
186
|
) as Partial<TableProps>;
|
|
154
187
|
});
|
|
155
188
|
|
|
189
|
+
const restTableAttrs = computed(() => {
|
|
190
|
+
const rest: Record<string, any> = {};
|
|
191
|
+
for (const [key, value] of Object.entries(attrs)) {
|
|
192
|
+
if (!PRO_TABLE_EXCLUDED_ATTR_KEYS.has(key)) {
|
|
193
|
+
rest[key] = value;
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
return rest;
|
|
197
|
+
});
|
|
198
|
+
|
|
156
199
|
const size = defineModel<TableProps['size']>('size');
|
|
157
200
|
const loading = defineModel<boolean>('loading', { default: false });
|
|
158
201
|
|
|
@@ -263,9 +306,13 @@ const computedDataSource = computed<any[]>(() => {
|
|
|
263
306
|
const computedTableProps = computed<TableProps>(() => {
|
|
264
307
|
const merged = {
|
|
265
308
|
...injectTableAttrs.value,
|
|
309
|
+
...restTableAttrs.value,
|
|
266
310
|
...attrsTableProps.value,
|
|
267
311
|
} as TableProps;
|
|
268
312
|
delete (merged as any).data;
|
|
313
|
+
delete (merged as any).columns;
|
|
314
|
+
delete (merged as any).size;
|
|
315
|
+
delete (merged as any).pagination;
|
|
269
316
|
return merged;
|
|
270
317
|
});
|
|
271
318
|
|
|
@@ -313,6 +360,7 @@ const onCurrentChange = (current: number) => {
|
|
|
313
360
|
_search();
|
|
314
361
|
};
|
|
315
362
|
|
|
363
|
+
// 改变 pageSize 时重置回第 1 页并重新查询
|
|
316
364
|
const onSizeChange = (pageSize: number) => {
|
|
317
365
|
props.table?.setPageParam?.({ pageSize, current: 1 });
|
|
318
366
|
_search();
|
|
@@ -46,7 +46,7 @@ export type SearchFormProps = {
|
|
|
46
46
|
*
|
|
47
47
|
* 1. 内部渲染 ProForm,使用 table.searchForm 管理搜索条件
|
|
48
48
|
* 2. 支持 grid(网格)和 inline(行内)两种布局
|
|
49
|
-
* 3.
|
|
49
|
+
* 3. 网格布局下支持展开/折叠(溢出检测与初值自动展开见下方机制说明)
|
|
50
50
|
* 4. 提供搜索、重置、展开/折叠按钮(支持自定义)
|
|
51
51
|
*
|
|
52
52
|
* ## 展开/折叠机制
|
|
@@ -1,38 +1,18 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
import type { SearchFormProps } from './components/SearchForm.vue';
|
|
6
|
-
import type { Table } from './useTable';
|
|
1
|
+
import type {
|
|
2
|
+
ComponentExposed,
|
|
3
|
+
ComponentProps,
|
|
4
|
+
} from 'vue-component-type-helpers';
|
|
7
5
|
import ProTable from './components/ProTable.vue';
|
|
8
6
|
|
|
9
|
-
|
|
10
|
-
type
|
|
11
|
-
|
|
12
|
-
container?: ContainerComponent | false;
|
|
13
|
-
};
|
|
7
|
+
// 仅导出组件 Props 与实例类型,不导出裸组件
|
|
8
|
+
export type ProTableProps = ComponentProps<typeof ProTable>;
|
|
9
|
+
export type ProTableInstance = ComponentExposed<typeof ProTable>;
|
|
14
10
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
// instance
|
|
18
|
-
export type ProTableProps<T extends Table<any> = Table> = {
|
|
19
|
-
table?: T;
|
|
20
|
-
search?: () => Promise<unknown>;
|
|
21
|
-
addIndexColumn?: boolean;
|
|
22
|
-
immediateSearch?: boolean;
|
|
23
|
-
control?: boolean | Partial<Control>;
|
|
24
|
-
searchFormConfig?: SearchFormConfig;
|
|
25
|
-
tableContainer?: ContainerComponent | false;
|
|
26
|
-
columns?: Columns<ReturnTableRecord<T>>;
|
|
27
|
-
data?: ReturnTableRecord<T>[];
|
|
28
|
-
pagination?: false | Partial<PaginationProps>;
|
|
29
|
-
} & Omit<TableProps, 'data'>;
|
|
30
|
-
export type ProTableInstance = ComponentPublicInstance;
|
|
31
|
-
|
|
32
|
-
// types
|
|
11
|
+
// 仅导出核心列配置类型
|
|
33
12
|
export { type Column, type Columns } from './types';
|
|
13
|
+
export { type TableEmits } from '../../shared/ui';
|
|
34
14
|
|
|
35
|
-
//
|
|
15
|
+
// 仅导出核心表格 Hook 与类型
|
|
36
16
|
export { useTable, type Table } from './useTable';
|
|
37
17
|
|
|
38
18
|
export default ProTable;
|
|
@@ -31,7 +31,7 @@ import type { Ref } from 'vue';
|
|
|
31
31
|
* @property appendColumn - 在指定列后追加新列,传 undefined 在末尾追加
|
|
32
32
|
* @property prependColumn - 在指定列前插入新列,传 undefined 在开头插入
|
|
33
33
|
* @property setPageParam - 设置分页参数,支持部分更新和函数式更新
|
|
34
|
-
* @property resetQueryParams -
|
|
34
|
+
* @property resetQueryParams - 恢复分页与搜索条件到初始化时的快照(含自定义分页键,非固定回到第一页)
|
|
35
35
|
*
|
|
36
36
|
* @example
|
|
37
37
|
* ```ts
|
package/src/shared/core/index.ts
CHANGED
package/src/shared/ui/index.ts
CHANGED
|
@@ -32,6 +32,7 @@ import {
|
|
|
32
32
|
type FormProps,
|
|
33
33
|
type FormItemProps,
|
|
34
34
|
type TableProps as _TableProps,
|
|
35
|
+
type TableEmits,
|
|
35
36
|
type TableColumnCtx as ColumnType,
|
|
36
37
|
type PaginationProps,
|
|
37
38
|
type RowProps as GridProps,
|
|
@@ -75,6 +76,7 @@ export {
|
|
|
75
76
|
type GridProps,
|
|
76
77
|
type GridItemProps,
|
|
77
78
|
type ColumnType,
|
|
79
|
+
type TableEmits,
|
|
78
80
|
};
|
|
79
81
|
|
|
80
82
|
export type TableProps = _TableProps<any>;
|