@qin-ui/antdv-next-pro 1.1.15 → 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 +35 -24
- package/LICENSE +9 -0
- package/README.md +61 -61
- package/api.json +42 -28
- package/es/antdv-next-pro.css +9 -9
- package/es/component-provider/{index-Daiw7IxY.js → index-Tesc9NuK.js} +2 -1
- package/es/component-provider/index-Tesc9NuK.js.map +1 -0
- package/es/component-provider/index.js +2 -1
- package/es/component-provider/index.js.map +1 -0
- package/es/components/component-provider/components/index.vue.d.ts +27 -0
- package/es/components/component-provider/components/index.vue.d.ts.map +1 -0
- package/es/components/component-provider/constants/index.d.ts +16 -0
- package/es/components/component-provider/constants/index.d.ts.map +1 -0
- package/es/components/component-provider/index.d.ts +4 -0
- package/es/components/component-provider/index.d.ts.map +1 -0
- package/es/components/component-provider/types/index.d.ts +26 -0
- package/es/components/component-provider/types/index.d.ts.map +1 -0
- package/es/components/form/components/BaseField/index.vue.d.ts +13 -0
- package/es/components/form/components/BaseField/index.vue.d.ts.map +1 -0
- package/es/components/form/components/BaseField/utils/index.d.ts +3 -0
- package/es/components/form/components/BaseField/utils/index.d.ts.map +1 -0
- package/es/components/form/components/BaseFormItem/index.vue.d.ts +9 -0
- package/es/components/form/components/BaseFormItem/index.vue.d.ts.map +1 -0
- package/es/components/form/components/ContainerFragment/index.vue.d.ts +23 -0
- package/es/components/form/components/ContainerFragment/index.vue.d.ts.map +1 -0
- package/es/components/form/components/GroupedFieldAttrs/index.vue.d.ts +31 -0
- package/es/components/form/components/GroupedFieldAttrs/index.vue.d.ts.map +1 -0
- package/es/components/form/components/PathProvider/index.vue.d.ts +24 -0
- package/es/components/form/components/PathProvider/index.vue.d.ts.map +1 -0
- package/es/components/form/components/ProForm/index.vue.d.ts +36 -0
- package/es/components/form/components/ProForm/index.vue.d.ts.map +1 -0
- package/es/components/form/components/SlotComponent/index.vue.d.ts +7 -0
- package/es/components/form/components/SlotComponent/index.vue.d.ts.map +1 -0
- package/es/components/form/components/index.d.ts +12 -0
- package/es/components/form/components/index.d.ts.map +1 -0
- package/es/components/form/constants/index.d.ts +81 -0
- package/es/components/form/constants/index.d.ts.map +1 -0
- package/es/components/form/hooks/index.d.ts +5 -0
- package/es/components/form/hooks/index.d.ts.map +1 -0
- package/es/components/form/hooks/useFields.d.ts +57 -0
- package/es/components/form/hooks/useFields.d.ts.map +1 -0
- package/es/components/form/hooks/useForm.d.ts +93 -0
- package/es/components/form/hooks/useForm.d.ts.map +1 -0
- package/es/components/form/hooks/useFormRef.d.ts +30 -0
- package/es/components/form/hooks/useFormRef.d.ts.map +1 -0
- package/es/components/form/index.d.ts +7 -0
- package/es/components/form/index.d.ts.map +1 -0
- package/es/components/form/types/index.d.ts +251 -0
- package/es/components/form/types/index.d.ts.map +1 -0
- package/es/components/table/components/ColumnControl.vue.d.ts +9 -0
- package/es/components/table/components/ColumnControl.vue.d.ts.map +1 -0
- package/es/components/table/components/DefaultSearchFormContainer.vue.d.ts +18 -0
- package/es/components/table/components/DefaultSearchFormContainer.vue.d.ts.map +1 -0
- package/es/components/table/components/DefaultTableContainer.vue.d.ts +18 -0
- package/es/components/table/components/DefaultTableContainer.vue.d.ts.map +1 -0
- package/es/components/table/components/ProTable.vue.d.ts +118 -0
- package/es/components/table/components/ProTable.vue.d.ts.map +1 -0
- package/es/components/table/components/SearchForm.vue.d.ts +48 -0
- package/es/components/table/components/SearchForm.vue.d.ts.map +1 -0
- package/es/components/table/components/SizeControl.vue.d.ts +12 -0
- package/es/components/table/components/SizeControl.vue.d.ts.map +1 -0
- package/es/components/table/components/icons/ColumnHeightOutlined.vue.d.ts +3 -0
- package/es/components/table/components/icons/ColumnHeightOutlined.vue.d.ts.map +1 -0
- package/es/components/table/components/icons/DownOutlined.vue.d.ts +3 -0
- package/es/components/table/components/icons/DownOutlined.vue.d.ts.map +1 -0
- package/es/components/table/components/icons/FilterOutlined.vue.d.ts +3 -0
- package/es/components/table/components/icons/FilterOutlined.vue.d.ts.map +1 -0
- package/es/components/table/components/index.d.ts +5 -0
- package/es/components/table/components/index.d.ts.map +1 -0
- package/es/components/table/index.d.ts +8 -0
- package/es/components/table/index.d.ts.map +1 -0
- package/es/components/table/types/index.d.ts +48 -0
- package/es/components/table/types/index.d.ts.map +1 -0
- package/es/components/table/useTable.d.ts +111 -0
- package/es/components/table/useTable.d.ts.map +1 -0
- package/es/form/{index-7clzY8ZD.js → index-CcP5OaUd.js} +12 -6
- package/es/form/index-CcP5OaUd.js.map +1 -0
- package/es/form/index.js +4 -3
- package/es/form/index.js.map +1 -0
- package/es/index.d.ts +76 -1543
- package/es/index.d.ts.map +1 -0
- package/es/index.js +14 -23
- package/es/index.js.map +1 -0
- package/es/shared/core/index.d.ts +6 -0
- package/es/shared/core/index.d.ts.map +1 -0
- package/es/shared/ui/index.d.ts +9 -0
- package/es/shared/ui/index.d.ts.map +1 -0
- package/es/table/index.js +11 -9
- package/es/table/index.js.map +1 -0
- package/package.json +10 -11
- package/src/components/component-provider/components/index.vue +67 -0
- package/src/components/component-provider/constants/index.ts +177 -0
- package/src/components/component-provider/index.ts +6 -0
- package/src/components/component-provider/types/index.ts +59 -0
- package/src/components/form/components/BaseField/index.vue +181 -0
- package/src/components/form/components/BaseField/utils/index.ts +16 -0
- package/src/components/form/components/BaseFormItem/index.vue +158 -0
- package/src/components/form/components/ContainerFragment/index.vue +24 -0
- package/src/components/form/components/GroupedFieldAttrs/index.vue +119 -0
- package/src/components/form/components/PathProvider/index.vue +19 -0
- package/src/components/form/components/ProForm/index.vue +104 -0
- package/src/components/form/components/SlotComponent/index.vue +26 -0
- package/src/components/form/components/index.ts +15 -0
- package/src/components/form/constants/index.ts +140 -0
- package/src/components/form/hooks/index.ts +5 -0
- package/src/components/form/hooks/useFields.ts +67 -0
- package/src/components/form/hooks/useForm.ts +110 -0
- package/src/components/form/hooks/useFormRef.ts +35 -0
- package/src/components/form/index.ts +29 -0
- package/src/components/form/types/index.ts +317 -0
- package/src/components/table/components/ColumnControl.vue +142 -0
- package/src/components/table/components/DefaultSearchFormContainer.vue +22 -0
- package/src/components/table/components/DefaultTableContainer.vue +19 -0
- package/src/components/table/components/ProTable.vue +372 -0
- package/src/components/table/components/SearchForm.vue +296 -0
- package/src/components/table/components/SizeControl.vue +54 -0
- package/src/components/table/components/icons/ColumnHeightOutlined.vue +4 -0
- package/src/components/table/components/icons/DownOutlined.vue +4 -0
- package/src/components/table/components/icons/FilterOutlined.vue +4 -0
- package/src/components/table/components/index.ts +4 -0
- package/src/components/table/index.ts +14 -0
- package/src/components/table/types/index.ts +52 -0
- package/src/components/table/useTable.ts +129 -0
- package/src/index.ts +81 -0
- package/src/shared/core/index.ts +37 -0
- package/src/shared/ui/index.ts +55 -0
- package/es/core/index-ghYuQ3Sy.js +0 -360
- package/es/vendor/utils/lodash-es-p6jau26B.js +0 -1120
package/AI-CONTEXT.md
CHANGED
|
@@ -36,28 +36,28 @@ Field.component → componentMap[component] → antdv-next 组件
|
|
|
36
36
|
|
|
37
37
|
### 1.3 内置组件映射表
|
|
38
38
|
|
|
39
|
-
| component | antdv-next 组件 | 常用输入控件层透传 Props
|
|
40
|
-
| :------------------ | :-------------- |
|
|
39
|
+
| component | antdv-next 组件 | 常用输入控件层透传 Props |
|
|
40
|
+
| :------------------ | :-------------- | :--------------------------------------------------------------------- |
|
|
41
41
|
| `input` | Input | placeholder, maxlength, allowClear, addonBefore, addonAfter, showCount |
|
|
42
|
-
| `textarea` | TextArea | rows, maxlength, showCount, autoSize
|
|
43
|
-
| `input-password` | InputPassword | placeholder, maxlength, visibilityToggle
|
|
44
|
-
| `input-otp` | InputOTP | length, mask, separator
|
|
45
|
-
| `input-search` | InputSearch | placeholder, loading, onSearch
|
|
46
|
-
| `input-number` | InputNumber | min, max, step, precision, formatter, parser
|
|
47
|
-
| `select` | Select | **options**, mode, showSearch, allowClear, maxTagCount, loading
|
|
48
|
-
| `auto-complete` | AutoComplete | **options**, filterOption, allowClear
|
|
49
|
-
| `cascader` | Cascader | **options**, fieldNames, showSearch, expandTrigger
|
|
50
|
-
| `date-picker` | DatePicker | picker, format, showTime, disabledDate, allowClear
|
|
51
|
-
| `range-picker` | RangePicker | format, showTime, disabledDate, allowClear
|
|
52
|
-
| `time-picker` | TimePicker | format, showSecond, allowClear, hourStep
|
|
53
|
-
| `time-range-picker` | TimeRangePicker | format, allowClear
|
|
54
|
-
| `checkbox-group` | CheckboxGroup | **options**, direction
|
|
55
|
-
| `radio-group` | RadioGroup | **options**, direction, buttonStyle
|
|
56
|
-
| `switch` | Switch | checkedChildren, unCheckedChildren, loading
|
|
57
|
-
| `slider` | Slider | min, max, step, marks, range, tooltip
|
|
58
|
-
| `tree-select` | TreeSelect | **treeData**, showSearch, treeCheckable
|
|
59
|
-
| `transfer` | Transfer | **dataSource**, **titles**, **targetKeys**, showSearch
|
|
60
|
-
| `custom` | 自定义 | component 传入 Vue 组件或 h() 渲染函数
|
|
42
|
+
| `textarea` | TextArea | rows, maxlength, showCount, autoSize |
|
|
43
|
+
| `input-password` | InputPassword | placeholder, maxlength, visibilityToggle |
|
|
44
|
+
| `input-otp` | InputOTP | length, mask, separator |
|
|
45
|
+
| `input-search` | InputSearch | placeholder, loading, onSearch |
|
|
46
|
+
| `input-number` | InputNumber | min, max, step, precision, formatter, parser |
|
|
47
|
+
| `select` | Select | **options**, mode, showSearch, allowClear, maxTagCount, loading |
|
|
48
|
+
| `auto-complete` | AutoComplete | **options**, filterOption, allowClear |
|
|
49
|
+
| `cascader` | Cascader | **options**, fieldNames, showSearch, expandTrigger |
|
|
50
|
+
| `date-picker` | DatePicker | picker, format, showTime, disabledDate, allowClear |
|
|
51
|
+
| `range-picker` | RangePicker | format, showTime, disabledDate, allowClear |
|
|
52
|
+
| `time-picker` | TimePicker | format, showSecond, allowClear, hourStep |
|
|
53
|
+
| `time-range-picker` | TimeRangePicker | format, allowClear |
|
|
54
|
+
| `checkbox-group` | CheckboxGroup | **options**, direction |
|
|
55
|
+
| `radio-group` | RadioGroup | **options**, direction, buttonStyle |
|
|
56
|
+
| `switch` | Switch | checkedChildren, unCheckedChildren, loading |
|
|
57
|
+
| `slider` | Slider | min, max, step, marks, range, tooltip |
|
|
58
|
+
| `tree-select` | TreeSelect | **treeData**, showSearch, treeCheckable |
|
|
59
|
+
| `transfer` | Transfer | **dataSource**, **titles**, **targetKeys**, showSearch |
|
|
60
|
+
| `custom` | 自定义 | component 传入 Vue 组件或 h() 渲染函数 |
|
|
61
61
|
|
|
62
62
|
> **写任何输入控件属性前,必须查阅 [antdv-next 文档](https://antdv-next.com/llms-full-cn.txt) 确认属性名和类型。**
|
|
63
63
|
|
|
@@ -91,6 +91,7 @@ Field 属性逐层剥离,分发到渲染树的不同目标:
|
|
|
91
91
|
### modelProp
|
|
92
92
|
|
|
93
93
|
决定 `v-model:xxx` 绑定变量名:
|
|
94
|
+
|
|
94
95
|
- 默认 `'value'` → `v-model:value`
|
|
95
96
|
- Switch/Checkbox 使用 `'checked'`
|
|
96
97
|
- **ProComponentProvider 已为 `switch` 预设 `modelProp: 'checked'`**,通常无需手动指定
|
|
@@ -170,7 +171,12 @@ const form = useForm({ agreement: false }, [
|
|
|
170
171
|
path: 'agreement',
|
|
171
172
|
component: (p, ctx) => h(MyCheckbox, { ...p, ...ctx.attrs }),
|
|
172
173
|
modelProp: 'checked',
|
|
173
|
-
rules: [
|
|
174
|
+
rules: [
|
|
175
|
+
{
|
|
176
|
+
validator: (_, val) =>
|
|
177
|
+
val ? Promise.resolve() : Promise.reject('请同意'),
|
|
178
|
+
},
|
|
179
|
+
],
|
|
174
180
|
},
|
|
175
181
|
]);
|
|
176
182
|
```
|
|
@@ -208,7 +214,7 @@ const form = useForm({ agreement: false }, [
|
|
|
208
214
|
|
|
209
215
|
| 组件 | 预设默认值 |
|
|
210
216
|
| :---------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------- |
|
|
211
|
-
| `switch` | `{ modelProp: 'checked' }`
|
|
217
|
+
| `switch` | `{ modelProp: 'checked' }` |
|
|
212
218
|
| `input` | `{ maxlength: 100, allowClear: true, placeholder: '请输入' }` |
|
|
213
219
|
| `textarea` | `{ maxlength: 200, autoSize: {minRows:3,maxRows:6}, showCount: true, allowClear: true, placeholder: '请输入' }` |
|
|
214
220
|
| `select` / `cascader` / `auto-complete` | `{ allowClear: true, placeholder: '请选择', getPopupContainer }` |
|
|
@@ -268,7 +274,12 @@ table.searchForm.setField('name', { placeholder: '请输入' });
|
|
|
268
274
|
</script>
|
|
269
275
|
|
|
270
276
|
<template>
|
|
271
|
-
<ProTable
|
|
277
|
+
<ProTable
|
|
278
|
+
:table="table"
|
|
279
|
+
:search="() => fetchData()"
|
|
280
|
+
addIndexColumn
|
|
281
|
+
immediateSearch
|
|
282
|
+
/>
|
|
272
283
|
</template>
|
|
273
284
|
```
|
|
274
285
|
|
package/LICENSE
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2023-present pro-components
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
6
|
+
|
|
7
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
8
|
+
|
|
9
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.md
CHANGED
|
@@ -63,23 +63,23 @@ const form = useForm<FormData>({}, [
|
|
|
63
63
|
|
|
64
64
|
### `useForm` 返回值 (Form 实例)
|
|
65
65
|
|
|
66
|
-
| 属性/方法 | 类型 | 说明
|
|
67
|
-
| :------------------------- | :------------------------------- |
|
|
66
|
+
| 属性/方法 | 类型 | 说明 |
|
|
67
|
+
| :------------------------- | :------------------------------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
68
68
|
| `formRef` | `Ref<FormInstance \| undefined>` | **antdv-next 原生 [FormInstance](https://antdv-next.com/components/form-cn#api)** 引用,可直接调用 `validate()`、`resetFields()`、`validateFields([paths])`、`clearValidate([paths])` 等原生方法 |
|
|
69
|
-
| `formData` | `Reactive<D>` | 响应式表单数据对象
|
|
70
|
-
| `fields` | `Ref<Field<D>[]>` | 响应式字段配置数组
|
|
71
|
-
| `getFormData(path?)` | `(path?) => any` | 读取表单字段或整个表单的值(支持深层路径)
|
|
72
|
-
| `setFormData(path, value)` | `-` | 安全更新指定路径的值,支持批量设置与函数式更新
|
|
73
|
-
| `setField(path, patch)` | `-` | 动态增量更新某一个字段的 Schema 配置参数
|
|
74
|
-
| `resetFormData()` | `-` | 重置表单数据为初始值
|
|
69
|
+
| `formData` | `Reactive<D>` | 响应式表单数据对象 |
|
|
70
|
+
| `fields` | `Ref<Field<D>[]>` | 响应式字段配置数组 |
|
|
71
|
+
| `getFormData(path?)` | `(path?) => any` | 读取表单字段或整个表单的值(支持深层路径) |
|
|
72
|
+
| `setFormData(path, value)` | `-` | 安全更新指定路径的值,支持批量设置与函数式更新 |
|
|
73
|
+
| `setField(path, patch)` | `-` | 动态增量更新某一个字段的 Schema 配置参数 |
|
|
74
|
+
| `resetFormData()` | `-` | 重置表单数据为初始值 |
|
|
75
75
|
|
|
76
76
|
### `ProForm` Props
|
|
77
77
|
|
|
78
|
-
| 属性 | 类型
|
|
79
|
-
| :--------- |
|
|
80
|
-
| `form` | `Form<D>`
|
|
81
|
-
| `grid` | `boolean \| GridProps`
|
|
82
|
-
| `disabled` | `boolean`
|
|
78
|
+
| 属性 | 类型 | 默认值 | 说明 |
|
|
79
|
+
| :--------- | :--------------------------------------------------------------------------- | :------ | :--------------------------------------------------------------------------------------- |
|
|
80
|
+
| `form` | `Form<D>` | - | `useForm` 返回的实例 |
|
|
81
|
+
| `grid` | `boolean \| GridProps` | `false` | 是否启用 Grid 网格布局 |
|
|
82
|
+
| `disabled` | `boolean` | `false` | 是否全局禁用整个表单 |
|
|
83
83
|
| 其余属性 | 继承 antdv-next [`FormProps`](https://antdv-next.com/components/form-cn#api) | - | 如 `labelCol`、`wrapperCol`、`labelAlign`、`colon` 等,直接透传至 antdv-next `Form` 组件 |
|
|
84
84
|
|
|
85
85
|
---
|
|
@@ -90,27 +90,27 @@ const form = useForm<FormData>({}, [
|
|
|
90
90
|
|
|
91
91
|
### 公共基础属性(`Base`)
|
|
92
92
|
|
|
93
|
-
| 属性 | 类型 | 说明
|
|
94
|
-
| :------------------- | :---------------------------------- |
|
|
95
|
-
| `path` | `Path<D>` | 字段标识,需对应 `formData` 中的 key
|
|
96
|
-
| `label` | `string \| Component` | 字段标签名称,支持直接传入 Vue 组件渲染
|
|
97
|
-
| `component` | 见下方内置组件列表 | 使用的内置组件名或自定义组件
|
|
98
|
-
| `hidden` | `MaybeRef<boolean>` | 字段是否隐藏,支持 Ref / Computed 响应式
|
|
99
|
-
| `disabled` | `MaybeRef<boolean>` | 组件是否禁用,支持 Ref / Computed 响应式
|
|
100
|
-
| `rules` | `FormItemRule[]` | 字段数据校验规则
|
|
101
|
-
| `span` | `number` | Grid 占位列宽(仅在开启 `grid` 模式下有效)
|
|
102
|
-
| `slots` | `Partial<ComponentSlots<FormItem>>` | FormItem 插槽(包含 `label`/`extra`/`help`/`tooltip` 等)
|
|
103
|
-
| `grid` | `boolean \| GridProps` | 嵌套子字段的 Grid 配置
|
|
104
|
-
| `fields` | `Fields<D>` | 嵌套子字段配置数组(用于复杂分组)
|
|
105
|
-
| `formItemStyle` | `CSSProperties` | FormItem 样式属性
|
|
106
|
-
| `formItemClass` | `string` | FormItem 自定义类名
|
|
107
|
-
| `formItemContainer` | `Component` | FormItem 外层包裹容器组件
|
|
108
|
-
| `formItemDataAttrs` | `Record<string, string>` | 附加到 FormItem DOM 节点上的自定义 data 属性
|
|
109
|
-
| `componentStyle` | `CSSProperties` | 表单输入组件的样式属性
|
|
110
|
-
| `componentClass` | `string` | 表单输入组件的自定义类名
|
|
111
|
-
| `componentContainer` | `Component` | 表单输入组件的外层包裹容器组件
|
|
112
|
-
| `componentDataAttrs` | `Record<string, string>` | 附加到输入组件 DOM 节点上的自定义 data 属性
|
|
113
|
-
| `valueFormatter` | `ValueFormatter` | 字段值格式化与转换器(支持 get/set 双向处理器)
|
|
93
|
+
| 属性 | 类型 | 说明 |
|
|
94
|
+
| :------------------- | :---------------------------------- | :------------------------------------------------------------------------------------------------------------------ |
|
|
95
|
+
| `path` | `Path<D>` | 字段标识,需对应 `formData` 中的 key |
|
|
96
|
+
| `label` | `string \| Component` | 字段标签名称,支持直接传入 Vue 组件渲染 |
|
|
97
|
+
| `component` | 见下方内置组件列表 | 使用的内置组件名或自定义组件 |
|
|
98
|
+
| `hidden` | `MaybeRef<boolean>` | 字段是否隐藏,支持 Ref / Computed 响应式 |
|
|
99
|
+
| `disabled` | `MaybeRef<boolean>` | 组件是否禁用,支持 Ref / Computed 响应式 |
|
|
100
|
+
| `rules` | `FormItemRule[]` | 字段数据校验规则 |
|
|
101
|
+
| `span` | `number` | Grid 占位列宽(仅在开启 `grid` 模式下有效) |
|
|
102
|
+
| `slots` | `Partial<ComponentSlots<FormItem>>` | FormItem 插槽(包含 `label`/`extra`/`help`/`tooltip` 等) |
|
|
103
|
+
| `grid` | `boolean \| GridProps` | 嵌套子字段的 Grid 配置 |
|
|
104
|
+
| `fields` | `Fields<D>` | 嵌套子字段配置数组(用于复杂分组) |
|
|
105
|
+
| `formItemStyle` | `CSSProperties` | FormItem 样式属性 |
|
|
106
|
+
| `formItemClass` | `string` | FormItem 自定义类名 |
|
|
107
|
+
| `formItemContainer` | `Component` | FormItem 外层包裹容器组件 |
|
|
108
|
+
| `formItemDataAttrs` | `Record<string, string>` | 附加到 FormItem DOM 节点上的自定义 data 属性 |
|
|
109
|
+
| `componentStyle` | `CSSProperties` | 表单输入组件的样式属性 |
|
|
110
|
+
| `componentClass` | `string` | 表单输入组件的自定义类名 |
|
|
111
|
+
| `componentContainer` | `Component` | 表单输入组件的外层包裹容器组件 |
|
|
112
|
+
| `componentDataAttrs` | `Record<string, string>` | 附加到输入组件 DOM 节点上的自定义 data 属性 |
|
|
113
|
+
| `valueFormatter` | `ValueFormatter` | 字段值格式化与转换器(支持 get/set 双向处理器) |
|
|
114
114
|
| `modelProp` | `string` | 双向绑定的数据名,默认 `'value'`。Switch/Checkbox 使用 `'checked'`,**ProComponentProvider 已为 `switch` 预设此值** |
|
|
115
115
|
|
|
116
116
|
> [!NOTE]
|
|
@@ -216,40 +216,40 @@ const table = useTable<Row>({
|
|
|
216
216
|
|
|
217
217
|
### `useTable` 配置参数
|
|
218
218
|
|
|
219
|
-
| 参数名 | 类型 | 说明
|
|
220
|
-
| :------------- | :--------------- |
|
|
221
|
-
| `columns` | `Column<D>[]` | 表格列 Schema 配置,支持响应式 `hidden`
|
|
222
|
-
| `dataSource` | `T[]` | 静态初始数据源数组
|
|
223
|
-
| `pageParam` | `PageParam` | 初始分页参数(current, pageSize, total)
|
|
224
|
-
| `searchParam` | `DeepPartial<D>` | 搜索栏表单初始填充数据
|
|
219
|
+
| 参数名 | 类型 | 说明 |
|
|
220
|
+
| :------------- | :--------------- | :---------------------------------------------------------------------------------------------- |
|
|
221
|
+
| `columns` | `Column<D>[]` | 表格列 Schema 配置,支持响应式 `hidden` |
|
|
222
|
+
| `dataSource` | `T[]` | 静态初始数据源数组 |
|
|
223
|
+
| `pageParam` | `PageParam` | 初始分页参数(current, pageSize, total) |
|
|
224
|
+
| `searchParam` | `DeepPartial<D>` | 搜索栏表单初始填充数据 |
|
|
225
225
|
| `searchFields` | `Fields<D>` | 搜索栏字段 Schema 配置,**格式与 ProForm 的 `fields` 完全一致**,同样支持配置驱动渲染和属性透传 |
|
|
226
226
|
|
|
227
227
|
### `useTable` 返回值 (Table 实例)
|
|
228
228
|
|
|
229
|
-
| 属性/方法
|
|
230
|
-
|
|
|
231
|
-
| `columns`
|
|
232
|
-
| `dataSource`
|
|
233
|
-
| `pageParam`
|
|
234
|
-
| `searchForm`
|
|
235
|
-
| `setColumn`
|
|
236
|
-
| `deleteColumn`
|
|
237
|
-
| `appendColumn`
|
|
238
|
-
| `prependColumn`
|
|
239
|
-
| `setPageParam`
|
|
240
|
-
| `resetQueryParams`
|
|
229
|
+
| 属性/方法 | 类型 | 说明 |
|
|
230
|
+
| :----------------- | :-------------------- | :----------------------------------------------------------------------------------------- |
|
|
231
|
+
| `columns` | `Ref<Column<T>[]>` | 响应式表格列配置数组 |
|
|
232
|
+
| `dataSource` | `Ref<T[]>` | 响应式表格数据源 |
|
|
233
|
+
| `pageParam` | `Reactive<PageParam>` | 响应式分页参数:`{ current, pageSize, total }` |
|
|
234
|
+
| `searchForm` | `Form<D>` | 搜索栏 ProForm 实例,可通过 `searchForm.formData` 获取搜索条件,也可调用其所有字段操作方法 |
|
|
235
|
+
| `setColumn` | `(path, col, opts?)` | 动态合并/覆盖列配置(`opts.updateType: 'merge' \| 'rewrite'`) |
|
|
236
|
+
| `deleteColumn` | `(path, opts?)` | 根据 dataIndex 路径或查找函数删除列 |
|
|
237
|
+
| `appendColumn` | `(path, col, opts?)` | 在指定列后追加新列 |
|
|
238
|
+
| `prependColumn` | `(path, col, opts?)` | 在指定列前插入新列 |
|
|
239
|
+
| `setPageParam` | `(pageParam)` | 更新分页参数(支持局部属性或函数式更新) |
|
|
240
|
+
| `resetQueryParams` | `()` | 重置分页状态和搜索表单数据至初始值 |
|
|
241
241
|
|
|
242
242
|
### `ProTable` Props
|
|
243
243
|
|
|
244
|
-
| 属性 | 类型
|
|
245
|
-
| :----------------- |
|
|
246
|
-
| `table` | `Table<D>`
|
|
247
|
-
| `search` | `() => Promise<void>`
|
|
248
|
-
| `addIndexColumn` | `boolean`
|
|
249
|
-
| `immediateSearch` | `boolean`
|
|
250
|
-
| `control` | `boolean \| { sizeControl, columnControl }`
|
|
251
|
-
| `searchFormConfig` | `SearchFormConfig`
|
|
252
|
-
| `tableContainer` | `Component \| false`
|
|
244
|
+
| 属性 | 类型 | 默认值 | 说明 |
|
|
245
|
+
| :----------------- | :----------------------------------------------------------------------------- | :------ | :------------------------------------------------------------------------------------ |
|
|
246
|
+
| `table` | `Table<D>` | - | 由 `useTable` 返回的表格实例引用 |
|
|
247
|
+
| `search` | `() => Promise<void>` | - | 触发表格数据查询的异步回调函数 |
|
|
248
|
+
| `addIndexColumn` | `boolean` | `false` | 是否自动在表格首列插入序号列 |
|
|
249
|
+
| `immediateSearch` | `boolean` | `false` | 表格挂载完毕(onMounted)是否立即触发一次查询回调 |
|
|
250
|
+
| `control` | `boolean \| { sizeControl, columnControl }` | `true` | 是否展示表格右上角尺寸调节和列显示控制条 |
|
|
251
|
+
| `searchFormConfig` | `SearchFormConfig` | - | 搜索栏表单的排版布局及展开/收起配置参数 |
|
|
252
|
+
| `tableContainer` | `Component \| false` | - | 表格区域外层自定义包裹组件 |
|
|
253
253
|
| 其余属性 | 继承 antdv-next [`TableProps`](https://antdv-next.com/components/table-cn#api) | - | 如 `bordered`、`loading`、`size`、`pagination` 等,直接透传至 antdv-next `Table` 组件 |
|
|
254
254
|
|
|
255
255
|
---
|
package/api.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"generatedAt": "2026-07-
|
|
2
|
+
"generatedAt": "2026-07-09T04:30:33.730Z",
|
|
3
3
|
"name": "@qin-ui/antdv-next-pro",
|
|
4
4
|
"api": [
|
|
5
5
|
{
|
|
@@ -12,25 +12,25 @@
|
|
|
12
12
|
"```vue\n<ProComponentProvider\n:componentVars=\"{ 'input': { placeholder: '请输入' } }\"\n>\n<ProForm :form=\"form\" :fields=\"fields\" />\n</ProComponentProvider>\n```"
|
|
13
13
|
]
|
|
14
14
|
},
|
|
15
|
+
{
|
|
16
|
+
"name": "ContainerFragment",
|
|
17
|
+
"type": "component",
|
|
18
|
+
"package": "@qin-ui/antdv-next-pro",
|
|
19
|
+
"signature": "<ContainerFragment>",
|
|
20
|
+
"description": "容器分片渲染组件。用于动态渲染表单行或表单项的外部包裹容器(例如 Grid 行、Col 列等布局容器)。"
|
|
21
|
+
},
|
|
15
22
|
{
|
|
16
23
|
"name": "ProForm",
|
|
17
24
|
"type": "component",
|
|
18
25
|
"package": "@qin-ui/antdv-next-pro",
|
|
19
26
|
"signature": "<ProForm>",
|
|
20
|
-
"description": "@qin-ui/antdv-next-pro 配置驱动表单组件\n通过配置驱动的方式快速构建表单,支持:\n- 字段联动(通过 setField、watch 等实现)\n- 嵌套字段(通过 fields 递归配置)\n- 自定义组件(通过 component 属性和 custom 类型)\n- 网格布局(通过 grid 属性)\n- 动态插槽(以字段 path 命名的插槽)",
|
|
27
|
+
"description": "@qin-ui/antdv-next-pro 配置驱动表单组件\n架构设计说明 (Architecture Overview)\n[ 数据层 (Core) ] => [ 绑定层 (ProForm) ] => [ 渲染层 (BaseFormItem / BaseField) ]\n1. 数据隔离:ProForm 本身不负责存储和管理表单状态,所有核心状态(formData, fields, 校验规则)\n均交由底层的 `useForm`(@qin-ui/pro-components-core)驱动。\n2. 上下文透传:通过 `provide` 将核心状态下发给子组件,避免了深层嵌套的 Props 传递。\n3. 递归渲染:网格布局和具体字段的解析交由 `<BaseFormItem>` 递归完成,实现了 UI 布局与表单逻辑的解耦。\n通过配置驱动的方式快速构建表单,支持:\n- 字段联动(通过 setField、watch 等实现)\n- 嵌套字段(通过 fields 递归配置)\n- 自定义组件(通过 component 属性和 custom 类型)\n- 网格布局(通过 grid 属性)\n- 动态插槽(以字段 path 命名的插槽)",
|
|
21
28
|
"typeParams": [
|
|
22
29
|
{
|
|
23
30
|
"name": "F"
|
|
24
31
|
}
|
|
25
32
|
]
|
|
26
33
|
},
|
|
27
|
-
{
|
|
28
|
-
"name": "ContainerFragment",
|
|
29
|
-
"type": "component",
|
|
30
|
-
"package": "@qin-ui/antdv-next-pro",
|
|
31
|
-
"signature": "<ContainerFragment>",
|
|
32
|
-
"description": "容器分片渲染组件。用于动态渲染表单行或表单项的外部包裹容器(例如 Grid 行、Col 列等布局容器)。"
|
|
33
|
-
},
|
|
34
34
|
{
|
|
35
35
|
"name": "SlotComponent",
|
|
36
36
|
"type": "component",
|
|
@@ -73,9 +73,9 @@
|
|
|
73
73
|
"name": "useFormData",
|
|
74
74
|
"type": "function",
|
|
75
75
|
"package": "@qin-ui/antdv-next-pro",
|
|
76
|
-
"signature": "export const useFormData = <D extends Data = Data>(\n initFormData?: ExtendWithAny<DeepPartial<D>>\n) =>",
|
|
76
|
+
"signature": "export const useFormData = <D extends Data = Data>(\n initFormData?: ExtendWithAny<DeepPartial<D>>\n): UseFormDataReturn<D> =>",
|
|
77
77
|
"description": "表单数据处理 Hook\n提供响应式表单数据的管理能力,支持:\n- 响应式数据存储(基于 Vue reactive)\n- 深层路径读写(支持点号分隔,如 'address.city')\n- 类型安全的路径提示(传入泛型 D 后,path 参数可获得类型推导)\n- 父子表单自动注入(非根表单会从注入中获取数据)",
|
|
78
|
-
"returns": "{
|
|
78
|
+
"returns": "{UseFormDataReturn<D>} 表单数据操作对象",
|
|
79
79
|
"typeParams": [
|
|
80
80
|
{
|
|
81
81
|
"name": "D"
|
|
@@ -89,15 +89,16 @@
|
|
|
89
89
|
"name": "useFields",
|
|
90
90
|
"type": "function",
|
|
91
91
|
"package": "@qin-ui/antdv-next-pro",
|
|
92
|
-
"signature": "export
|
|
93
|
-
"description": "
|
|
92
|
+
"signature": "export function useFields<D extends Data = Data>(\n initFields?: Fields<D>\n): UseFieldsReturn<D, Field<ComponentName, D>, FormItemInstance>;",
|
|
93
|
+
"description": "字段配置管理 Hook\n基于 `@qin-ui/pro-components-core` 的 `useFields`,将泛型参数绑定为 antdv-next 的本地类型:\n- 字段类型 F → `Field<ComponentName, D>`(支持 antdv-next 组件类型推导)\n- FormItem 实例 → antdv-next 的 `FormItemInstance`\n提供对字段配置数组的增删改查操作,支持:\n- 通过路径字符串或查找函数定位字段\n- 深层嵌套字段的遍历和匹配\n- 字段配置的合并/覆盖更新\n- 字段的添加、插入、删除\n- 父级字段查找\n- `fields` — 字段配置数组(响应式 Ref\\<F[]\\>)\n- `getField(path)` — 获取字段配置,支持路径字符串或查找函数\n- `setField(path, field, options?)` — 更新字段配置,默认合并模式\n- `deleteField(path, options?)` — 删除字段配置\n- `appendField(path, field, options?)` — 在指定字段后追加\n- `prependField(path, field, options?)` — 在指定字段前插入\n- `getParentField(path, options?)` — 获取父级字段配置",
|
|
94
|
+
"returns": "字段操作对象,包含以下属性:",
|
|
94
95
|
"typeParams": [
|
|
95
96
|
{
|
|
96
97
|
"name": "D"
|
|
97
98
|
}
|
|
98
99
|
],
|
|
99
100
|
"examples": [
|
|
100
|
-
"```ts\ninterface User { name: string; age: number }\n\nconst { fields, getField, setField } = useFields<User>([\n{ path: 'name', label: '姓名', component: 'input' },\n{ path: 'age', label: '年龄', component: 'input-number' },\n])\n```"
|
|
101
|
+
"```ts\ninterface User { name: string; age: number }\n\nconst { fields, getField, setField } = useFields<User>([\n{ path: 'name', label: '姓名', component: 'input' },\n{ path: 'age', label: '年龄', component: 'input-number' },\n])\n\n// 通过路径获取\ngetField('name')\n// 通过查找函数获取\ngetField(f => f.label === '姓名')\n// 更新字段(合并模式)\nsetField('name', { label: '用户名', disabled: true })\n```"
|
|
101
102
|
]
|
|
102
103
|
},
|
|
103
104
|
{
|
|
@@ -105,14 +106,14 @@
|
|
|
105
106
|
"type": "type",
|
|
106
107
|
"package": "@qin-ui/antdv-next-pro",
|
|
107
108
|
"signature": "export type UseFields<D extends Data = Data> = ReturnType<typeof useFields<D>>;",
|
|
108
|
-
"description": "useFields
|
|
109
|
+
"description": "useFields 返回值类型"
|
|
109
110
|
},
|
|
110
111
|
{
|
|
111
112
|
"name": "Form",
|
|
112
113
|
"type": "type",
|
|
113
114
|
"package": "@qin-ui/antdv-next-pro",
|
|
114
115
|
"signature": "export type Form<\n D extends Data = Data,\n F extends Field<ComponentName, D> = Field<ComponentName, D>,\n> = _Form<D, F, FormInstance>;",
|
|
115
|
-
"description": "在 core Form
|
|
116
|
+
"description": "表单实例类型\n在 core Form 类型的基础上,将字段类型 F 绑定为本地 Field<ComponentName, D>,\n将底层表单实例 I 绑定为 antdv-next 的 FormInstance,使 formRef 获得完整的类型提示。\n1. `setFormData(path, value)` — 设置指定路径的值<br>\n2. `setFormData(path, prev => newVal)` — 函数式更新<br>\n3. `setFormData({ ... })` — 批量覆盖整个表单",
|
|
116
117
|
"typeParams": [
|
|
117
118
|
{
|
|
118
119
|
"name": "D"
|
|
@@ -122,33 +123,34 @@
|
|
|
122
123
|
}
|
|
123
124
|
],
|
|
124
125
|
"examples": [
|
|
125
|
-
"```ts\ninterface User { name: string; age: number }\nconst form: Form<User> = useForm({ name: '张三', age: 25 })\nform.formRef.value?.validate()
|
|
126
|
+
"```ts\ninterface User { name: string; age: number }\nconst form: Form<User> = useForm({ name: '张三', age: 25 })\n\nform.formData.name // 直接读写响应式数据\nform.getFormData('name') // 通过路径读取\nform.setFormData('name', '李四') // 更新数据\nform.formRef.value?.validate() // 访问底层 Form 实例\n```"
|
|
126
127
|
]
|
|
127
128
|
},
|
|
128
129
|
{
|
|
129
130
|
"name": "useForm",
|
|
130
131
|
"type": "function",
|
|
131
132
|
"package": "@qin-ui/antdv-next-pro",
|
|
132
|
-
"signature": "export
|
|
133
|
-
"description": "
|
|
133
|
+
"signature": "export function useForm<D extends Data = Data>(\n initFormData?: ExtendWithAny<DeepPartial<D>>,\n initFields?: Field<ComponentName, D>[],\n root?: boolean\n): Form<D, Field<ComponentName, D>>;",
|
|
134
|
+
"description": "创建表单实例的 Hook\n基于 `@qin-ui/pro-components-core` 的 `useForm`,将泛型参数绑定为 antdv-next 的本地类型:\n- 字段类型 F → `Field<ComponentName, D>`(支持 antdv-next 所有内置组件类型推导)\n- 表单实例 → antdv-next 的 `FormInstance`(使 formRef 获得完整的类型提示)\n表单实例组合了三个子模块的能力:\n- **useFormData**:表单数据管理(响应式数据、读写、批量更新)\n- **useFields**:字段配置管理(增删改查字段配置,支持嵌套)\n- **useFormRef**:底层 Form 组件实例引用",
|
|
135
|
+
"returns": "{Form<D>} 表单实例,包含数据操作、字段操作和 ref 操作",
|
|
134
136
|
"typeParams": [
|
|
135
137
|
{
|
|
136
138
|
"name": "D"
|
|
137
139
|
}
|
|
138
140
|
],
|
|
139
141
|
"examples": [
|
|
140
|
-
"```ts\ninterface User { name: string; age: number }\n\nconst form = useForm<User>(\n{ name: '张三', age: 25 },\n[\n{ path: 'name', label: '姓名', component: 'input' },\n{ path: 'age', label: '年龄', component: 'input-number' },\n],\ntrue\n)\n```"
|
|
142
|
+
"```ts\ninterface User { name: string; age: number }\n\n// 方式一:同时传入初始数据和字段\nconst form = useForm<User>(\n{ name: '张三', age: 25 },\n[\n{ path: 'name', label: '姓名', component: 'input' },\n{ path: 'age', label: '年龄', component: 'input-number' },\n],\ntrue\n)\n\n// 方式二:仅设置 root 标识\nconst form = useForm<User>(true)\n\n// 使用\nconst { formData, formRef, fields, setFormData, getField } = form\nsetFormData('name', '李四')\nawait formRef.value?.validate()\n```"
|
|
141
143
|
]
|
|
142
144
|
},
|
|
143
145
|
{
|
|
144
146
|
"name": "useFormRef",
|
|
145
147
|
"type": "function",
|
|
146
148
|
"package": "@qin-ui/antdv-next-pro",
|
|
147
|
-
"signature": "export
|
|
148
|
-
"description": "
|
|
149
|
-
"returns": "
|
|
149
|
+
"signature": "export function useFormRef(): UseFormRefReturn<FormInstance>",
|
|
150
|
+
"description": "表单组件实例引用 Hook\n基于 `@qin-ui/pro-components-core` 的 `useFormRef`,将泛型参数绑定为 antdv-next 的 `FormInstance`,\n使 formRef 获取到完整的 antdv-next Form 组件 API 类型提示(如 `validate()`、`resetFields()` 等)。\n`formRef` 由 ProForm 组件内部自动通过 `setFormRef` 绑定,无需手动调用。\n- `formRef` — antdv-next Form 组件实例的响应式引用(`Ref<FormInstance | undefined>`)\n- `setFormRef(inst)` — 设置 Form 组件实例,由 ProForm 内部自动调用",
|
|
151
|
+
"returns": "表单组件实例引用管理对象:",
|
|
150
152
|
"examples": [
|
|
151
|
-
"```ts\nconst { formRef, setFormRef } = useFormRef()\nawait formRef.value?.validate()\nformRef.value?.resetFields()\n```"
|
|
153
|
+
"```ts\nconst { formRef, setFormRef } = useFormRef()\n\n// formRef 由 ProForm 自动绑定,可直接使用\nawait formRef.value?.validate()\nformRef.value?.resetFields()\nformRef.value?.scrollToField('username')\n```"
|
|
152
154
|
]
|
|
153
155
|
},
|
|
154
156
|
{
|
|
@@ -209,7 +211,7 @@
|
|
|
209
211
|
"type": "type",
|
|
210
212
|
"package": "@qin-ui/antdv-next-pro",
|
|
211
213
|
"signature": "export type Table<\n D extends Data = Data,\n T extends Data = ExtendWithAny<D>,\n> = _Table<D, T, Column<T>>;",
|
|
212
|
-
"description": "在 core Table 类型的基础上,将列类型 C 绑定为本地 Column
|
|
214
|
+
"description": "表格实例类型\n在 core Table 类型的基础上,将列类型 C 绑定为本地 Column\\<T\\>,\n使 columns 操作获得 antdv-next 表格列的完整属性类型提示。",
|
|
213
215
|
"typeParams": [
|
|
214
216
|
{
|
|
215
217
|
"name": "D"
|
|
@@ -217,14 +219,26 @@
|
|
|
217
219
|
{
|
|
218
220
|
"name": "T"
|
|
219
221
|
}
|
|
222
|
+
],
|
|
223
|
+
"examples": [
|
|
224
|
+
"```ts\ninterface User { name: string; age: number; email: string }\n\nconst table: Table<{}, User> = useTable({\ncolumns: [{ dataIndex: 'name', title: '姓名' }],\n})\n\ntable.columns.value // 访问列配置\ntable.setColumn('name', { width: 150 }) // 更新列\ntable.setPageParam({ current: 2 }) // 切换页码\ntable.searchForm.setFormData('keyword', '搜索词') // 操作搜索表单\n```"
|
|
220
225
|
]
|
|
221
226
|
},
|
|
222
227
|
{
|
|
223
228
|
"name": "useTable",
|
|
224
229
|
"type": "function",
|
|
225
230
|
"package": "@qin-ui/antdv-next-pro",
|
|
226
|
-
"signature": "export
|
|
227
|
-
"description": "
|
|
231
|
+
"signature": "export function useTable<\n D extends Data = Data,\n T extends Data = ExtendWithAny<D>,\n>(params:",
|
|
232
|
+
"description": "创建表格实例的 Hook\n基于 `@qin-ui/pro-components-core` 的 `useTable`,将列类型绑定为本地 `Column<T>`。\n是 ProTable 组件的核心 Hook,提供了:\n- 列配置管理(增删改查)\n- 数据源管理\n- 分页管理\n- 搜索表单集成(内部使用 useForm)\n- 查询参数重置",
|
|
233
|
+
"params": [
|
|
234
|
+
{
|
|
235
|
+
"name": "params",
|
|
236
|
+
"type": "object",
|
|
237
|
+
"optional": false,
|
|
238
|
+
"description": "表格配置参数"
|
|
239
|
+
}
|
|
240
|
+
],
|
|
241
|
+
"returns": "{Table<D, T>} 表格实例",
|
|
228
242
|
"typeParams": [
|
|
229
243
|
{
|
|
230
244
|
"name": "D"
|
|
@@ -234,7 +248,7 @@
|
|
|
234
248
|
}
|
|
235
249
|
],
|
|
236
250
|
"examples": [
|
|
237
|
-
"```ts\ninterface User { name: string; age: number; email: string }\n\nconst table = useTable<User>({\ncolumns: [\n{ dataIndex: 'name', title: '姓名', width: 120 },\n{ dataIndex: 'age', title: '年龄', width: 80 },\n],\ndataSource: [],\npageParam: { current: 1, pageSize: 20, total: 0 },\n})\n```"
|
|
251
|
+
"```ts\ninterface SearchParams { keyword: string; status: string }\ninterface User { name: string; age: number; email: string }\n\nconst table = useTable<SearchParams, User>({\ncolumns: [\n{ dataIndex: 'name', title: '姓名', width: 120 },\n{ dataIndex: 'age', title: '年龄', width: 80 },\n],\ndataSource: [],\npageParam: { current: 1, pageSize: 20, total: 0 },\nsearchParam: { keyword: '', status: '' },\nsearchFields: [\n{ path: 'keyword', label: '关键词', component: 'input' },\n{ path: 'status', label: '状态', component: 'select' },\n],\n})\n\n// 查询\nconst handleSearch = async () => {\nconst res = await fetchUserList({\n...table.searchForm.formData,\n...table.pageParam,\n})\ntable.dataSource.value = res.data\ntable.setPageParam({ total: res.total })\n}\n\n// 重置\nconst handleReset = () => {\ntable.resetQueryParams()\nhandleSearch()\n}\n```"
|
|
238
252
|
]
|
|
239
253
|
}
|
|
240
254
|
]
|
package/es/antdv-next-pro.css
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
.pro-table_search-form[data-v-
|
|
1
|
+
.pro-table_search-form[data-v-46276239] [class*='-form-item'] {
|
|
2
2
|
margin: 0;
|
|
3
3
|
}
|
|
4
|
-
.pro-table_search-form_expand-toggle-button[data-v-
|
|
4
|
+
.pro-table_search-form_expand-toggle-button[data-v-46276239] {
|
|
5
5
|
display: flex;
|
|
6
6
|
align-items: center;
|
|
7
7
|
padding: 0;
|
|
8
8
|
padding-left: 4px;
|
|
9
9
|
}
|
|
10
|
-
.pro-table_search-form .transition[data-v-
|
|
10
|
+
.pro-table_search-form .transition[data-v-46276239] {
|
|
11
11
|
transition: all 0.25s;
|
|
12
12
|
}
|
|
13
13
|
.pro-table_search-form-container[data-v-f115fbbe] {
|
|
@@ -36,23 +36,23 @@
|
|
|
36
36
|
.pro-table_column-control_button[data-v-246b0faf] svg {
|
|
37
37
|
transform: scale(1.2, 1.4);
|
|
38
38
|
}
|
|
39
|
-
.pro-table_header[data-v-
|
|
39
|
+
.pro-table_header[data-v-2f644dd7] {
|
|
40
40
|
display: flex;
|
|
41
41
|
align-items: center;
|
|
42
42
|
justify-content: flex-end;
|
|
43
43
|
}
|
|
44
|
-
.pro-table_header[data-v-
|
|
44
|
+
.pro-table_header[data-v-2f644dd7]:empty {
|
|
45
45
|
display: none;
|
|
46
46
|
}
|
|
47
|
-
.pro-table_header + .pro-table_header_content[data-v-
|
|
47
|
+
.pro-table_header + .pro-table_header_content[data-v-2f644dd7] {
|
|
48
48
|
margin-top: 16px;
|
|
49
49
|
}
|
|
50
|
-
.pro-table_header_button-bar[data-v-
|
|
50
|
+
.pro-table_header_button-bar[data-v-2f644dd7] {
|
|
51
51
|
flex: 1;
|
|
52
52
|
}
|
|
53
|
-
.pro-table_header_toolbar[data-v-
|
|
53
|
+
.pro-table_header_toolbar[data-v-2f644dd7] {
|
|
54
54
|
margin-left: 12px;
|
|
55
55
|
}
|
|
56
|
-
.pro-table[data-v-
|
|
56
|
+
.pro-table[data-v-2f644dd7] [class*='-pagination'] [class*='-pagination-total-text'] {
|
|
57
57
|
flex: 1;
|
|
58
58
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { getObject } from "@qin-ui/pro-components-core";
|
|
1
2
|
import { defineComponent, provide, renderSlot } from "vue";
|
|
2
|
-
import { g as getObject } from "../core/index-ghYuQ3Sy.js";
|
|
3
3
|
const getPopupContainer = (triggerNode) => triggerNode.closest("form[class*='-form']");
|
|
4
4
|
const INJECT_CONFIG = {
|
|
5
5
|
"pro-table": {
|
|
@@ -184,3 +184,4 @@ export {
|
|
|
184
184
|
INJECT_COMPONENTS as a,
|
|
185
185
|
getInjectConfig as g
|
|
186
186
|
};
|
|
187
|
+
//# sourceMappingURL=index-Tesc9NuK.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-Tesc9NuK.js","sources":["../../src/components/component-provider/constants/index.ts","../../src/components/component-provider/components/index.vue"],"sourcesContent":["import { RequiredComponentVars } from '../types';\nimport { InjectionKey, Component } from 'vue';\n\nconst getPopupContainer = (triggerNode: any) =>\n triggerNode.closest(\"form[class*='-form']\");\n\nexport type InjectConfigEntry<T = any> = {\n injectionKey: InjectionKey<T>;\n default: T;\n};\n\nexport const INJECT_CONFIG: {\n [key in keyof RequiredComponentVars]: {\n injectionKey: InjectionKey<RequiredComponentVars[key]>;\n default: RequiredComponentVars[key];\n };\n} = {\n 'pro-table': {\n injectionKey: Symbol(''),\n default: {\n pagination: {\n showTotal: total => `共 ${total} 条`,\n showSizeChanger: true,\n pageSizeOptions: ['10', '20', '30', '40', '50', '100'],\n showQuickJumper: true,\n },\n searchFormConfig: {\n layout: 'grid',\n expand: { minExpandRows: 2, expandStatus: false },\n },\n control: true,\n addIndexColumn: true,\n },\n },\n 'pro-form': {\n injectionKey: Symbol(''),\n default: { grid: { gutter: { xs: 8, sm: 16, md: 16, lg: 24 } } },\n },\n 'pro-form-item': {\n injectionKey: Symbol(''),\n default: { validateFirst: true, span: 8 },\n },\n // field\n input: {\n injectionKey: Symbol(''),\n default: { maxlength: 100, allowClear: true, placeholder: '请输入' },\n },\n textarea: {\n injectionKey: Symbol(''),\n default: {\n maxlength: 200,\n autoSize: { minRows: 3, maxRows: 6 },\n showCount: true,\n allowClear: true,\n placeholder: '请输入',\n },\n },\n 'input-password': {\n injectionKey: Symbol(''),\n default: { maxlength: 100, allowClear: true, placeholder: '请输入' },\n },\n 'input-search': {\n injectionKey: Symbol(''),\n default: {},\n },\n 'input-number': {\n injectionKey: Symbol(''),\n default: {\n max: 10 ** 15 - 1,\n min: -(10 ** 15 + 1),\n controls: false,\n placeholder: '请输入',\n style: { width: '100%' },\n } as any,\n },\n 'input-otp': {\n injectionKey: Symbol(''),\n default: {},\n },\n 'auto-complete': {\n injectionKey: Symbol(''),\n default: { allowClear: true, placeholder: '请选择', getPopupContainer },\n },\n select: {\n injectionKey: Symbol(''),\n default: { allowClear: true, placeholder: '请选择', getPopupContainer },\n },\n cascader: {\n injectionKey: Symbol(''),\n default: { allowClear: true, placeholder: '请选择', getPopupContainer },\n },\n 'date-picker': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'date-picker.date': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'date-picker.week': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'date-picker.month': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'date-picker.year': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'date-picker.quarter': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'range-picker': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'time-picker': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'time-range-picker': {\n injectionKey: Symbol(''),\n default: { allowClear: true, getPopupContainer, style: { width: '100%' } },\n },\n 'checkbox-group': {\n injectionKey: Symbol(''),\n default: {},\n },\n 'radio-group': {\n injectionKey: Symbol(''),\n default: {},\n },\n switch: {\n injectionKey: Symbol(''),\n default: { modelProp: 'checked' },\n },\n slider: {\n injectionKey: Symbol(''),\n default: {},\n },\n 'tree-select': {\n injectionKey: Symbol(''),\n default: {},\n },\n transfer: {\n injectionKey: Symbol(''),\n default: {},\n },\n};\n\nexport const INJECT_COMPONENTS: InjectionKey<\n Partial<Record<string, Component>>\n> = Symbol('INJECT_COMPONENTS');\n\nconst DYNAMIC_INJECT_CONFIG: Record<string, InjectConfigEntry> =\n Object.create(null);\n\nexport const getInjectConfig = (key: string): InjectConfigEntry | undefined => {\n return (\n (INJECT_CONFIG as Record<string, InjectConfigEntry>)[key] ||\n DYNAMIC_INJECT_CONFIG[key]\n );\n};\n\nexport const ensureInjectConfig = (key: string): InjectConfigEntry => {\n const existing = getInjectConfig(key);\n if (existing) return existing;\n const created: InjectConfigEntry = {\n injectionKey: Symbol(`dynamic:${key}`),\n default: {},\n };\n DYNAMIC_INJECT_CONFIG[key] = created;\n return created;\n};\n","<script lang=\"ts\" setup>\n/**\n * @component ProComponentProvider\n * @description @qin-ui/antdv-next-pro 全局配置提供者组件\n *\n * 用于在组件树的顶层配置所有子组件的全局默认属性。\n *\n * @param {ComponentVars} [componentVars] - 组件全局配置变量\n * @param {Record<ComponentName, any>} [componentMap] - 自定义组件映射\n *\n * @slot default - 子组件内容\n *\n * @example\n * ```vue\n * <ProComponentProvider\n * :componentVars=\"{ 'input': { placeholder: '请输入' } }\"\n * >\n * <ProForm :form=\"form\" :fields=\"fields\" />\n * </ProComponentProvider>\n * ```\n \n * @public\n */\nimport { ComponentVars } from '../types';\nimport { INJECT_COMPONENTS, ensureInjectConfig } from '../constants';\nimport { provide } from 'vue';\nimport { getObject } from '../../../shared/core';\nimport { ComponentName } from '../../form/constants';\n\ntype ComponentMap = Partial<Record<ComponentName, any>>;\n\ndefineOptions({\n name: 'ProComponentProvider',\n inheritAttrs: false,\n});\n\ntype Props = {\n /** 组件全局配置,可配置所有内置组件的默认属性 */\n componentVars?: ComponentVars;\n /** 自定义组件映射,用于替换或扩展内置组件 */\n componentMap?: ComponentMap;\n};\n\nconst props = defineProps<Props>();\n\n/*\n * 遍历 componentVars 的每个 key,获取或创建对应的 inject 配置\n * 将用户提供的值合并到默认值上,通过 provide 注入到子组件树\n * 子组件通过 inject(config.injectionKey) 获取合并后的配置\n */\nif (props.componentVars) {\n Object.entries(props.componentVars).forEach(([key, val]) => {\n const config = ensureInjectConfig(key);\n // 用户配置覆盖默认值\n provide(config.injectionKey, { ...config.default, ...getObject(val) });\n });\n}\n\n// 注入自定义组件映射,BaseField 在解析组件时会优先使用此映射\nif (props.componentMap) {\n provide(INJECT_COMPONENTS, props.componentMap);\n}\n</script>\n\n<template>\n <slot />\n</template>\n"],"names":["_renderSlot"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { ComponentVars } from '../types';
|
|
2
|
+
import { ComponentName } from '../../form/constants';
|
|
3
|
+
type ComponentMap = Partial<Record<ComponentName, any>>;
|
|
4
|
+
type Props = {
|
|
5
|
+
/** 组件全局配置,可配置所有内置组件的默认属性 */
|
|
6
|
+
componentVars?: ComponentVars;
|
|
7
|
+
/** 自定义组件映射,用于替换或扩展内置组件 */
|
|
8
|
+
componentMap?: ComponentMap;
|
|
9
|
+
};
|
|
10
|
+
declare function __VLS_template(): {
|
|
11
|
+
attrs: Partial<{}>;
|
|
12
|
+
slots: {
|
|
13
|
+
default?(_: {}): any;
|
|
14
|
+
};
|
|
15
|
+
refs: {};
|
|
16
|
+
rootEl: any;
|
|
17
|
+
};
|
|
18
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
19
|
+
declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
20
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
21
|
+
export default _default;
|
|
22
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
23
|
+
new (): {
|
|
24
|
+
$slots: S;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=index.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/component-provider/components/index.vue"],"names":[],"mappings":"AAqEA;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAIzC,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAErD,KAAK,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC,CAAC;AAOxD,KAAK,KAAK,GAAG;IACX,4BAA4B;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,0BAA0B;IAC1B,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAyBF,iBAAS,cAAc;WAoBT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAQD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe,sRAMnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|