@qin-ui/antd-vue-pro 2.1.10 → 2.1.12
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 +123 -0
- package/README.md +312 -67
- package/api.json +229 -0
- package/es/antd-vue-pro.css +9 -9
- package/es/component-provider/index-Dmz32tSB.js +174 -0
- package/es/component-provider/index.js +2 -172
- package/es/core/{index-C98RSrpN.js → index-ghYuQ3Sy.js} +29 -29
- package/es/form/index.js +65 -74
- package/es/index.d.ts +759 -134
- package/es/index.js +18 -17
- package/es/table/index.js +7 -6
- package/package.json +5 -2
package/api.json
ADDED
|
@@ -0,0 +1,229 @@
|
|
|
1
|
+
{
|
|
2
|
+
"generatedAt": "2026-06-04T09:03:23.488Z",
|
|
3
|
+
"name": "@qin-ui/antd-vue-pro",
|
|
4
|
+
"api": [
|
|
5
|
+
{
|
|
6
|
+
"name": "ProComponentProvider",
|
|
7
|
+
"type": "component",
|
|
8
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
9
|
+
"signature": "<ProComponentProvider>",
|
|
10
|
+
"description": "@qin-ui/antd-vue-pro 全局配置提供者组件\n用于在组件树的顶层配置所有子组件的全局默认属性。\n支持配置 ProForm、ProTable、ProFormItem 以及所有内置组件的默认属性。",
|
|
11
|
+
"examples": [
|
|
12
|
+
"```vue\n<template>\n<ProComponentProvider\n:componentVars=\"{\n'pro-form': { labelCol: { span: 4 } },\n'input': { placeholder: '请输入', maxlength: 200 },\n'select': { placeholder: '请选择' },\n}\"\n>\n<ProForm :form=\"form\" :fields=\"fields\" />\n</ProComponentProvider>\n</template>\n```"
|
|
13
|
+
]
|
|
14
|
+
},
|
|
15
|
+
{
|
|
16
|
+
"name": "ComponentVars",
|
|
17
|
+
"type": "type",
|
|
18
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
19
|
+
"signature": "export type ComponentVars = Partial<RequiredComponentVars>;",
|
|
20
|
+
"description": "组件全局配置\nRequiredComponentVars 的 Partial 版本，用于 ProComponentProvider 的 props"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"name": "ProForm",
|
|
24
|
+
"type": "component",
|
|
25
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
26
|
+
"signature": "<ProForm>",
|
|
27
|
+
"description": "@qin-ui/antd-vue-pro 配置驱动表单组件\n通过配置驱动的方式快速构建表单，支持：\n- 字段联动（通过 setField、watch 等实现）\n- 嵌套字段（通过 fields 递归配置）\n- 自定义组件（通过 component 属性和 custom 类型）\n- 网格布局（通过 grid 属性）\n- 动态插槽（以字段 path 命名的插槽）\n- 全局配置注入（通过 ProComponentProvider）",
|
|
28
|
+
"typeParams": [
|
|
29
|
+
{
|
|
30
|
+
"name": "F"
|
|
31
|
+
}
|
|
32
|
+
],
|
|
33
|
+
"examples": [
|
|
34
|
+
"```vue\n<template>\n<ProForm :form=\"form\" :fields=\"fields\" @submit=\"handleSubmit\">\n<template #name=\"{ value, disabled }\">\n<a-input :value=\"value\" :disabled=\"disabled\" />\n</template>\n</ProForm>\n</template>\n```"
|
|
35
|
+
]
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"name": "ContainerFragment",
|
|
39
|
+
"type": "component",
|
|
40
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
41
|
+
"signature": "<ContainerFragment>",
|
|
42
|
+
"description": "容器分片渲染组件。用于动态渲染表单行或表单项的外部包裹容器（例如 Grid 行、Col 列等布局容器）。"
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
"name": "SlotComponent",
|
|
46
|
+
"type": "component",
|
|
47
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
48
|
+
"signature": "<SlotComponent>",
|
|
49
|
+
"description": "插槽渲染辅助组件。用于在表单或表格的自定义插槽中动态渲染外部传入的 VNode、渲染函数或静态字符串。"
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
"name": "ComponentMap",
|
|
53
|
+
"type": "interface",
|
|
54
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
55
|
+
"signature": "export interface ComponentMap {}",
|
|
56
|
+
"description": "组件映射扩展接口\n暴露给外部扩充自定义组件类型的接口。\n用户可通过 TypeScript 的声明合并（module augmentation）添加自定义组件。",
|
|
57
|
+
"examples": [
|
|
58
|
+
"```ts\n// 在项目中任意 .d.ts 文件中\ndeclare module '@qin-ui/antd-vue-pro' {\ninterface ComponentMap {\n'my-custom-input': typeof MyCustomInput;\n'my-editor': typeof MyRichTextEditor;\n}\n}\n```"
|
|
59
|
+
]
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
"name": "ComponentName",
|
|
63
|
+
"type": "type",
|
|
64
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
65
|
+
"signature": "export type ComponentName =\n | keyof BaseComponentMap\n | keyof ComponentMap\n | 'custom';",
|
|
66
|
+
"description": "组件名称联合类型\n所有支持的组件名称，包括内置组件、用户扩展组件和自定义组件 'custom'\n- 内置组件：'input' | 'select' | 'date-picker' 等\n- 扩展组件：通过 ComponentMap 声明的自定义组件名\n- 'custom'：完全自定义渲染组件",
|
|
67
|
+
"examples": [
|
|
68
|
+
"```ts\ntype Name = ComponentName\n// 'input' | 'select' | 'date-picker' | ... | 'custom'\n```"
|
|
69
|
+
]
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
"name": "useFormData",
|
|
73
|
+
"type": "function",
|
|
74
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
75
|
+
"signature": "export const useFormData = <D extends Data = Data>(\n initFormData?: ExtendWithAny<DeepPartial<D>>\n) =>",
|
|
76
|
+
"description": "表单数据处理 Hook\n提供响应式表单数据的管理能力，支持：\n- 响应式数据存储（基于 Vue reactive）\n- 深层路径读写（支持点号分隔，如 'address.city'）\n- 类型安全的路径提示（传入泛型 D 后，path 参数可获得类型推导）\n- 父子表单自动注入（非根表单会从注入中获取数据）",
|
|
77
|
+
"returns": "{Function} .setFormData(path, value) - 设置指定路径的数据",
|
|
78
|
+
"typeParams": [
|
|
79
|
+
{
|
|
80
|
+
"name": "D"
|
|
81
|
+
}
|
|
82
|
+
],
|
|
83
|
+
"examples": [
|
|
84
|
+
"```ts\ninterface User { name: string; age: number; address: { city: string } }\n\nconst { formData, getFormData, setFormData } = useFormData<User>({\nname: '张三',\naddress: { city: '北京' }\n})\n\n// 读取\ngetFormData('name') // '张三'\ngetFormData('address.city') // '北京'\nformData.name // '张三'（响应式）\n\n// 设置\nsetFormData('name', '李四')\nsetFormData('address.city', '上海')\nsetFormData({ name: '王五', age: 30 }) // 批量覆盖\nsetFormData(prev => ({ ...prev, name: '赵六' })) // 函数式更新\n```"
|
|
85
|
+
]
|
|
86
|
+
},
|
|
87
|
+
{
|
|
88
|
+
"name": "useFields",
|
|
89
|
+
"type": "function",
|
|
90
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
91
|
+
"signature": "export const useFields = _useFields as",
|
|
92
|
+
"description": "类型安全的 re-export。将 core useFields 的泛型参数绑定为本地类型：\n- 字段类型 F → Field<ComponentName, D>（支持 Ant Design Vue 组件类型推导）\n- FormItem 实例 → Ant Design Vue 的 FormItemInstance\n提供对字段配置数组的增删改查操作，详见 `@qin-ui/core` 的 useFields 文档。",
|
|
93
|
+
"typeParams": [
|
|
94
|
+
{
|
|
95
|
+
"name": "D"
|
|
96
|
+
}
|
|
97
|
+
],
|
|
98
|
+
"examples": [
|
|
99
|
+
"```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// 获取字段（类型安全，包含 Ant Design Vue 组件属性）\ngetField('name') // 返回值包含 input 组件的所有可选属性\n```"
|
|
100
|
+
]
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
"name": "UseFields",
|
|
104
|
+
"type": "type",
|
|
105
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
106
|
+
"signature": "export type UseFields<D extends Data = Data> = ReturnType<typeof useFields<D>>;",
|
|
107
|
+
"description": "useFields 返回值类型，固定为本地 Fields<D>"
|
|
108
|
+
},
|
|
109
|
+
{
|
|
110
|
+
"name": "Form",
|
|
111
|
+
"type": "type",
|
|
112
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
113
|
+
"signature": "export type Form<\n D extends Data = Data,\n F extends Field<ComponentName, D> = Field<ComponentName, D>,\n> = _Form<D, F, FormInstance>;",
|
|
114
|
+
"description": "在 core Form 类型的基础上：\n1. 将字段类型 F 默认绑定为本地 Field<ComponentName, D>，支持 Ant Design Vue 所有内置组件类型\n2. 将底层表单实例 I 绑定为 Ant Design Vue 的 FormInstance，使 formRef 获得完整的类型提示",
|
|
115
|
+
"typeParams": [
|
|
116
|
+
{
|
|
117
|
+
"name": "D"
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
"name": "F"
|
|
121
|
+
}
|
|
122
|
+
],
|
|
123
|
+
"examples": [
|
|
124
|
+
"```ts\ninterface User { name: string; age: number }\nconst form: Form<User> = useForm({ name: '张三', age: 25 })\nform.formRef.value?.validate() // 类型安全地访问 Ant Design Vue 的 Form validate 方法\n```"
|
|
125
|
+
]
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
"name": "useForm",
|
|
129
|
+
"type": "function",
|
|
130
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
131
|
+
"signature": "export const useForm = _useForm as",
|
|
132
|
+
"description": "创建 @qin-ui/antd-vue-pro 表单实例的 Hook\n类型安全的 re-export。将 core useForm 的泛型参数绑定为本地类型：\n- 字段类型 F → Field<ComponentName, D>（支持 Ant Design Vue 组件类型推导）\n- 表单实例 → Ant Design Vue 的 FormInstance\n使用方式与 core useForm 完全一致，详见 {@link @qin-ui/core} 的 useForm 文档。",
|
|
133
|
+
"typeParams": [
|
|
134
|
+
{
|
|
135
|
+
"name": "D"
|
|
136
|
+
}
|
|
137
|
+
],
|
|
138
|
+
"examples": [
|
|
139
|
+
"```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\n// 类型已绑定 Ant Design Vue\nawait form.formRef.value?.validate() // ✅ 类型正确\n```"
|
|
140
|
+
]
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
"name": "useFormRef",
|
|
144
|
+
"type": "function",
|
|
145
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
146
|
+
"signature": "export const useFormRef = _useFormRef as",
|
|
147
|
+
"description": "类型安全的 re-export。将 core useFormRef 的泛型参数绑定为 Ant Design Vue 的 FormInstance，\n使 formRef 获取到完整的 Ant Design Vue Form 组件 API 类型提示。",
|
|
148
|
+
"returns": "{Function} .setFormRef(inst) - 设置表单组件实例",
|
|
149
|
+
"examples": [
|
|
150
|
+
"```ts\nconst { formRef, setFormRef } = useFormRef()\n// formRef.value 的类型为 FormInstance | undefined\n// 可安全调用 Ant Design Vue 的 Form API\nawait formRef.value?.validate()\nformRef.value?.resetFields()\n```"
|
|
151
|
+
]
|
|
152
|
+
},
|
|
153
|
+
{
|
|
154
|
+
"name": "Field",
|
|
155
|
+
"type": "type",
|
|
156
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
157
|
+
"signature": "export type Field<\n C extends ComponentName = ComponentName,\n D extends Data = Data,\n> = FieldTypeMap<D>[C] | WithFields<D>;",
|
|
158
|
+
"description": "字段配置类型，包含所有字段属性和响应式支持",
|
|
159
|
+
"typeParams": [
|
|
160
|
+
{
|
|
161
|
+
"name": "D"
|
|
162
|
+
}
|
|
163
|
+
]
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
"name": "Fields",
|
|
167
|
+
"type": "type",
|
|
168
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
169
|
+
"signature": "export type Fields<D extends Data = Data> = Array<Field<ComponentName, D>>;",
|
|
170
|
+
"description": "字段数组类型",
|
|
171
|
+
"typeParams": [
|
|
172
|
+
{
|
|
173
|
+
"name": "D"
|
|
174
|
+
}
|
|
175
|
+
]
|
|
176
|
+
},
|
|
177
|
+
{
|
|
178
|
+
"name": "Table",
|
|
179
|
+
"type": "type",
|
|
180
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
181
|
+
"signature": "export type Table<\n D extends Data = Data,\n T extends Data = ExtendWithAny<D>,\n> = _Table<D, T, Column<T>>;",
|
|
182
|
+
"description": "在 core Table 类型的基础上，将列类型 C 绑定为本地 Column<T>，\n使 columns 操作获得 Ant Design Vue 表格列的完整属性类型提示（如 title、width、fixed 等）。",
|
|
183
|
+
"typeParams": [
|
|
184
|
+
{
|
|
185
|
+
"name": "D"
|
|
186
|
+
},
|
|
187
|
+
{
|
|
188
|
+
"name": "T"
|
|
189
|
+
}
|
|
190
|
+
],
|
|
191
|
+
"examples": [
|
|
192
|
+
"```ts\ninterface SearchParams { keyword: string }\ninterface User { name: string; age: number }\n\nconst table: Table<SearchParams, User> = useTable({...})\ntable.columns.value[0].title // 类型为 string | undefined\ntable.columns.value[0].width // 类型为 number | undefined（Ant Design Vue 属性）\n```"
|
|
193
|
+
]
|
|
194
|
+
},
|
|
195
|
+
{
|
|
196
|
+
"name": "useTable",
|
|
197
|
+
"type": "function",
|
|
198
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
199
|
+
"signature": "export const useTable: <\n D extends Data = Data,\n T extends Data = ExtendWithAny<D>,\n>(params:",
|
|
200
|
+
"description": "创建 @qin-ui/antd-vue-pro 表格实例 of Hook\n类型安全的 re-export。将 core useTable 的列类型绑定为本地 Column<T>，\n使 columns 操作获得 Ant Design Vue 表格列的完整类型提示。\n使用方式与 core useTable 完全一致，详见 `@qin-ui/core` 的 useTable 文档。",
|
|
201
|
+
"typeParams": [
|
|
202
|
+
{
|
|
203
|
+
"name": "D"
|
|
204
|
+
},
|
|
205
|
+
{
|
|
206
|
+
"name": "T"
|
|
207
|
+
}
|
|
208
|
+
],
|
|
209
|
+
"examples": [
|
|
210
|
+
"```ts\ninterface SearchParams { keyword: string }\ninterface User { name: string; age: number; email: string }\n\nconst table = useTable<SearchParams, User>({\ncolumns: [\n{ key: 'name', title: '姓名', width: 120 },\n{ key: 'age', title: '年龄', width: 80 },\n{ key: 'email', title: '邮箱' },\n],\ndataSource: [],\npageParam: { current: 1, pageSize: 20, total: 0 },\nsearchParam: { keyword: '' },\nsearchFields: [\n{ path: 'keyword', label: '关键词', component: 'input' },\n],\n})\n```"
|
|
211
|
+
]
|
|
212
|
+
},
|
|
213
|
+
{
|
|
214
|
+
"name": "Column",
|
|
215
|
+
"type": "type",
|
|
216
|
+
"package": "@qin-ui/antd-vue-pro",
|
|
217
|
+
"signature": "export type Column<D extends Data = Data> = Omit<\n ColumnType,\n 'dataIndex' | 'key'\n> &",
|
|
218
|
+
"description": "继承 Ant Design Vue 的 ColumnType 列类型，并添加：\n- 类型安全的 dataIndex（基于泛型 D 推导路径），优先使用\n- key 作为辅助标识，当 dataIndex 不满足需求时使用\n- hidden 属性用于控制列显隐\n- 所有 Ant Design Vue 原生的列属性依然可用（title、width、fixed、align 等）",
|
|
219
|
+
"typeParams": [
|
|
220
|
+
{
|
|
221
|
+
"name": "D"
|
|
222
|
+
}
|
|
223
|
+
],
|
|
224
|
+
"examples": [
|
|
225
|
+
"```ts\ninterface User { name: string; age: number }\n\nconst columns: Columns<User> = [\n{\n// dataIndex 是主要字段，关联数据源中对应字段路径\ndataIndex: 'name',\ntitle: '姓名',\nwidth: 120,\n},\n{\ndataIndex: 'age',\ntitle: '年龄',\nwidth: 80,\n},\n]\n```"
|
|
226
|
+
]
|
|
227
|
+
}
|
|
228
|
+
]
|
|
229
|
+
}
|
package/es/antd-vue-pro.css
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
.pro-table_search-form[data-v-
|
|
1
|
+
.pro-table_search-form[data-v-b6a08ff0] [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-b6a08ff0] {
|
|
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-b6a08ff0] {
|
|
11
11
|
transition: all 0.25s;
|
|
12
12
|
}
|
|
13
13
|
.pro-table_search-form-container[data-v-c385cd54] {
|
|
@@ -36,23 +36,23 @@
|
|
|
36
36
|
.pro-table_column-control_button[data-v-d503f78a] svg {
|
|
37
37
|
transform: scale(1.2, 1.4);
|
|
38
38
|
}
|
|
39
|
-
.pro-table_header[data-v-
|
|
39
|
+
.pro-table_header[data-v-c4d455c8] {
|
|
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-c4d455c8]: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-c4d455c8] {
|
|
48
48
|
margin-top: 16px;
|
|
49
49
|
}
|
|
50
|
-
.pro-table_header_button-bar[data-v-
|
|
50
|
+
.pro-table_header_button-bar[data-v-c4d455c8] {
|
|
51
51
|
flex: 1;
|
|
52
52
|
}
|
|
53
|
-
.pro-table_header_toolbar[data-v-
|
|
53
|
+
.pro-table_header_toolbar[data-v-c4d455c8] {
|
|
54
54
|
margin-left: 12px;
|
|
55
55
|
}
|
|
56
|
-
.pro-table[data-v-
|
|
56
|
+
.pro-table[data-v-c4d455c8] [class*='-pagination'] [class*='-pagination-total-text'] {
|
|
57
57
|
flex: 1;
|
|
58
58
|
}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import { defineComponent, provide, renderSlot } from "vue";
|
|
2
|
+
import { g as getObject } from "../core/index-ghYuQ3Sy.js";
|
|
3
|
+
const getPopupContainer = (triggerNode) => triggerNode.closest("form[class*='-form']");
|
|
4
|
+
const INJECT_COMPONENTS = Symbol("INJECT_COMPONENTS");
|
|
5
|
+
const INJECT_CONFIG = {
|
|
6
|
+
"pro-table": {
|
|
7
|
+
injectionKey: Symbol(""),
|
|
8
|
+
default: {
|
|
9
|
+
pagination: {
|
|
10
|
+
showTotal: (total) => `共 ${total} 条`,
|
|
11
|
+
showSizeChanger: true,
|
|
12
|
+
pageSizeOptions: ["10", "20", "30", "40", "50", "100"],
|
|
13
|
+
showQuickJumper: true
|
|
14
|
+
},
|
|
15
|
+
searchFormConfig: {
|
|
16
|
+
layout: "grid",
|
|
17
|
+
expand: { minExpandRows: 2, expandStatus: false }
|
|
18
|
+
},
|
|
19
|
+
control: true,
|
|
20
|
+
addIndexColumn: true
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"pro-form": {
|
|
24
|
+
injectionKey: Symbol(""),
|
|
25
|
+
default: { grid: { gutter: { xs: 8, sm: 16, md: 16, lg: 24 } } }
|
|
26
|
+
},
|
|
27
|
+
"pro-form-item": {
|
|
28
|
+
injectionKey: Symbol(""),
|
|
29
|
+
default: { validateFirst: true, span: 8 }
|
|
30
|
+
},
|
|
31
|
+
// field
|
|
32
|
+
input: {
|
|
33
|
+
injectionKey: Symbol(""),
|
|
34
|
+
default: { maxlength: 100, allowClear: true, placeholder: "请输入" }
|
|
35
|
+
},
|
|
36
|
+
textarea: {
|
|
37
|
+
injectionKey: Symbol(""),
|
|
38
|
+
default: {
|
|
39
|
+
maxlength: 200,
|
|
40
|
+
autoSize: { minRows: 3, maxRows: 6 },
|
|
41
|
+
showCount: true,
|
|
42
|
+
allowClear: true,
|
|
43
|
+
placeholder: "请输入"
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
"input-password": {
|
|
47
|
+
injectionKey: Symbol(""),
|
|
48
|
+
default: { maxlength: 100, allowClear: true, placeholder: "请输入" }
|
|
49
|
+
},
|
|
50
|
+
"input-search": {
|
|
51
|
+
injectionKey: Symbol(""),
|
|
52
|
+
default: {}
|
|
53
|
+
},
|
|
54
|
+
"input-number": {
|
|
55
|
+
injectionKey: Symbol(""),
|
|
56
|
+
default: {
|
|
57
|
+
max: 10 ** 15 - 1,
|
|
58
|
+
min: -1000000000000001,
|
|
59
|
+
controls: false,
|
|
60
|
+
placeholder: "请输入",
|
|
61
|
+
style: { width: "100%" }
|
|
62
|
+
}
|
|
63
|
+
},
|
|
64
|
+
select: {
|
|
65
|
+
injectionKey: Symbol(""),
|
|
66
|
+
default: { allowClear: true, placeholder: "请选择", getPopupContainer }
|
|
67
|
+
},
|
|
68
|
+
cascader: {
|
|
69
|
+
injectionKey: Symbol(""),
|
|
70
|
+
default: { allowClear: true, placeholder: "请选择", getPopupContainer }
|
|
71
|
+
},
|
|
72
|
+
"date-picker": {
|
|
73
|
+
injectionKey: Symbol(""),
|
|
74
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
75
|
+
},
|
|
76
|
+
"date-picker.date": {
|
|
77
|
+
injectionKey: Symbol(""),
|
|
78
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
79
|
+
},
|
|
80
|
+
"date-picker.week": {
|
|
81
|
+
injectionKey: Symbol(""),
|
|
82
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
83
|
+
},
|
|
84
|
+
"date-picker.month": {
|
|
85
|
+
injectionKey: Symbol(""),
|
|
86
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
87
|
+
},
|
|
88
|
+
"date-picker.year": {
|
|
89
|
+
injectionKey: Symbol(""),
|
|
90
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
91
|
+
},
|
|
92
|
+
"date-picker.quarter": {
|
|
93
|
+
injectionKey: Symbol(""),
|
|
94
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
95
|
+
},
|
|
96
|
+
"range-picker": {
|
|
97
|
+
injectionKey: Symbol(""),
|
|
98
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
99
|
+
},
|
|
100
|
+
"time-picker": {
|
|
101
|
+
injectionKey: Symbol(""),
|
|
102
|
+
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
103
|
+
},
|
|
104
|
+
"checkbox-group": {
|
|
105
|
+
injectionKey: Symbol(""),
|
|
106
|
+
default: {}
|
|
107
|
+
},
|
|
108
|
+
"radio-group": {
|
|
109
|
+
injectionKey: Symbol(""),
|
|
110
|
+
default: {}
|
|
111
|
+
},
|
|
112
|
+
switch: {
|
|
113
|
+
injectionKey: Symbol(""),
|
|
114
|
+
default: { modelProp: "checked" }
|
|
115
|
+
},
|
|
116
|
+
slider: {
|
|
117
|
+
injectionKey: Symbol(""),
|
|
118
|
+
default: {}
|
|
119
|
+
},
|
|
120
|
+
"tree-select": {
|
|
121
|
+
injectionKey: Symbol(""),
|
|
122
|
+
default: {}
|
|
123
|
+
},
|
|
124
|
+
transfer: {
|
|
125
|
+
injectionKey: Symbol(""),
|
|
126
|
+
default: {}
|
|
127
|
+
}
|
|
128
|
+
};
|
|
129
|
+
const DYNAMIC_INJECT_CONFIG = /* @__PURE__ */ Object.create(null);
|
|
130
|
+
const getInjectConfig = (key) => {
|
|
131
|
+
return INJECT_CONFIG[key] || DYNAMIC_INJECT_CONFIG[key];
|
|
132
|
+
};
|
|
133
|
+
const ensureInjectConfig = (key) => {
|
|
134
|
+
const existing = getInjectConfig(key);
|
|
135
|
+
if (existing) return existing;
|
|
136
|
+
const created = {
|
|
137
|
+
injectionKey: Symbol(`dynamic:${key}`),
|
|
138
|
+
default: {}
|
|
139
|
+
};
|
|
140
|
+
DYNAMIC_INJECT_CONFIG[key] = created;
|
|
141
|
+
return created;
|
|
142
|
+
};
|
|
143
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
144
|
+
...{
|
|
145
|
+
name: "ProComponentProvider",
|
|
146
|
+
inheritAttrs: false
|
|
147
|
+
},
|
|
148
|
+
__name: "index",
|
|
149
|
+
props: {
|
|
150
|
+
componentVars: {},
|
|
151
|
+
componentMap: {}
|
|
152
|
+
},
|
|
153
|
+
setup(__props) {
|
|
154
|
+
const props = __props;
|
|
155
|
+
if (props.componentMap) {
|
|
156
|
+
provide(INJECT_COMPONENTS, props.componentMap);
|
|
157
|
+
}
|
|
158
|
+
if (props.componentVars) {
|
|
159
|
+
Object.entries(props.componentVars).forEach(([key, val]) => {
|
|
160
|
+
const config = ensureInjectConfig(key);
|
|
161
|
+
provide(config.injectionKey, { ...config.default, ...getObject(val) });
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
return (_ctx, _cache) => {
|
|
165
|
+
return renderSlot(_ctx.$slots, "default");
|
|
166
|
+
};
|
|
167
|
+
}
|
|
168
|
+
});
|
|
169
|
+
export {
|
|
170
|
+
INJECT_CONFIG as I,
|
|
171
|
+
_sfc_main as _,
|
|
172
|
+
INJECT_COMPONENTS as a,
|
|
173
|
+
getInjectConfig as g
|
|
174
|
+
};
|
|
@@ -1,174 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { g as getObject } from "../core/index-C98RSrpN.js";
|
|
3
|
-
const getPopupContainer = (triggerNode) => triggerNode.closest("form[class*='-form']");
|
|
4
|
-
const INJECT_COMPONENTS = Symbol("INJECT_COMPONENTS");
|
|
5
|
-
const INJECT_CONFIG = {
|
|
6
|
-
"pro-table": {
|
|
7
|
-
injectionKey: Symbol(""),
|
|
8
|
-
default: {
|
|
9
|
-
pagination: {
|
|
10
|
-
showTotal: (total) => `共 ${total} 条`,
|
|
11
|
-
showSizeChanger: true,
|
|
12
|
-
pageSizeOptions: ["10", "20", "30", "40", "50", "100"],
|
|
13
|
-
showQuickJumper: true
|
|
14
|
-
},
|
|
15
|
-
searchFormConfig: {
|
|
16
|
-
layout: "grid",
|
|
17
|
-
expand: { minExpandRows: 2, expandStatus: false }
|
|
18
|
-
},
|
|
19
|
-
control: true,
|
|
20
|
-
addIndexColumn: true
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
"pro-form": {
|
|
24
|
-
injectionKey: Symbol(""),
|
|
25
|
-
default: { grid: { gutter: { xs: 8, sm: 16, md: 16, lg: 24 } } }
|
|
26
|
-
},
|
|
27
|
-
"pro-form-item": {
|
|
28
|
-
injectionKey: Symbol(""),
|
|
29
|
-
default: { validateFirst: true, span: 8 }
|
|
30
|
-
},
|
|
31
|
-
// field
|
|
32
|
-
input: {
|
|
33
|
-
injectionKey: Symbol(""),
|
|
34
|
-
default: { maxlength: 100, allowClear: true, placeholder: "请输入" }
|
|
35
|
-
},
|
|
36
|
-
textarea: {
|
|
37
|
-
injectionKey: Symbol(""),
|
|
38
|
-
default: {
|
|
39
|
-
maxlength: 200,
|
|
40
|
-
autoSize: { minRows: 3, maxRows: 6 },
|
|
41
|
-
showCount: true,
|
|
42
|
-
allowClear: true,
|
|
43
|
-
placeholder: "请输入"
|
|
44
|
-
}
|
|
45
|
-
},
|
|
46
|
-
"input-password": {
|
|
47
|
-
injectionKey: Symbol(""),
|
|
48
|
-
default: { maxlength: 100, allowClear: true, placeholder: "请输入" }
|
|
49
|
-
},
|
|
50
|
-
"input-search": {
|
|
51
|
-
injectionKey: Symbol(""),
|
|
52
|
-
default: {}
|
|
53
|
-
},
|
|
54
|
-
"input-number": {
|
|
55
|
-
injectionKey: Symbol(""),
|
|
56
|
-
default: {
|
|
57
|
-
max: 10 ** 15 - 1,
|
|
58
|
-
min: -1000000000000001,
|
|
59
|
-
controls: false,
|
|
60
|
-
placeholder: "请输入",
|
|
61
|
-
style: { width: "100%" }
|
|
62
|
-
}
|
|
63
|
-
},
|
|
64
|
-
select: {
|
|
65
|
-
injectionKey: Symbol(""),
|
|
66
|
-
default: { allowClear: true, placeholder: "请选择", getPopupContainer }
|
|
67
|
-
},
|
|
68
|
-
cascader: {
|
|
69
|
-
injectionKey: Symbol(""),
|
|
70
|
-
default: { allowClear: true, placeholder: "请选择", getPopupContainer }
|
|
71
|
-
},
|
|
72
|
-
"date-picker": {
|
|
73
|
-
injectionKey: Symbol(""),
|
|
74
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
75
|
-
},
|
|
76
|
-
"date-picker.date": {
|
|
77
|
-
injectionKey: Symbol(""),
|
|
78
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
79
|
-
},
|
|
80
|
-
"date-picker.week": {
|
|
81
|
-
injectionKey: Symbol(""),
|
|
82
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
83
|
-
},
|
|
84
|
-
"date-picker.month": {
|
|
85
|
-
injectionKey: Symbol(""),
|
|
86
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
87
|
-
},
|
|
88
|
-
"date-picker.year": {
|
|
89
|
-
injectionKey: Symbol(""),
|
|
90
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
91
|
-
},
|
|
92
|
-
"date-picker.quarter": {
|
|
93
|
-
injectionKey: Symbol(""),
|
|
94
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
95
|
-
},
|
|
96
|
-
"range-picker": {
|
|
97
|
-
injectionKey: Symbol(""),
|
|
98
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
99
|
-
},
|
|
100
|
-
"time-picker": {
|
|
101
|
-
injectionKey: Symbol(""),
|
|
102
|
-
default: { allowClear: true, getPopupContainer, style: { width: "100%" } }
|
|
103
|
-
},
|
|
104
|
-
"checkbox-group": {
|
|
105
|
-
injectionKey: Symbol(""),
|
|
106
|
-
default: {}
|
|
107
|
-
},
|
|
108
|
-
"radio-group": {
|
|
109
|
-
injectionKey: Symbol(""),
|
|
110
|
-
default: {}
|
|
111
|
-
},
|
|
112
|
-
switch: {
|
|
113
|
-
injectionKey: Symbol(""),
|
|
114
|
-
default: { modelProp: "checked" }
|
|
115
|
-
},
|
|
116
|
-
slider: {
|
|
117
|
-
injectionKey: Symbol(""),
|
|
118
|
-
default: {}
|
|
119
|
-
},
|
|
120
|
-
"tree-select": {
|
|
121
|
-
injectionKey: Symbol(""),
|
|
122
|
-
default: {}
|
|
123
|
-
},
|
|
124
|
-
transfer: {
|
|
125
|
-
injectionKey: Symbol(""),
|
|
126
|
-
default: {}
|
|
127
|
-
}
|
|
128
|
-
};
|
|
129
|
-
const DYNAMIC_INJECT_CONFIG = /* @__PURE__ */ Object.create(null);
|
|
130
|
-
const getInjectConfig = (key) => {
|
|
131
|
-
return INJECT_CONFIG[key] || DYNAMIC_INJECT_CONFIG[key];
|
|
132
|
-
};
|
|
133
|
-
const ensureInjectConfig = (key) => {
|
|
134
|
-
const existing = getInjectConfig(key);
|
|
135
|
-
if (existing) return existing;
|
|
136
|
-
const created = {
|
|
137
|
-
injectionKey: Symbol(`dynamic:${key}`),
|
|
138
|
-
default: {}
|
|
139
|
-
};
|
|
140
|
-
DYNAMIC_INJECT_CONFIG[key] = created;
|
|
141
|
-
return created;
|
|
142
|
-
};
|
|
143
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
144
|
-
...{
|
|
145
|
-
inheritAttrs: false
|
|
146
|
-
},
|
|
147
|
-
__name: "index",
|
|
148
|
-
props: {
|
|
149
|
-
componentVars: {},
|
|
150
|
-
componentMap: {}
|
|
151
|
-
},
|
|
152
|
-
setup(__props) {
|
|
153
|
-
const props = __props;
|
|
154
|
-
if (props.componentMap) {
|
|
155
|
-
provide(INJECT_COMPONENTS, props.componentMap);
|
|
156
|
-
}
|
|
157
|
-
if (props.componentVars) {
|
|
158
|
-
Object.entries(props.componentVars).forEach(([key, val]) => {
|
|
159
|
-
const config = ensureInjectConfig(key);
|
|
160
|
-
provide(config.injectionKey, { ...config.default, ...getObject(val) });
|
|
161
|
-
});
|
|
162
|
-
}
|
|
163
|
-
return (_ctx, _cache) => {
|
|
164
|
-
return renderSlot(_ctx.$slots, "default");
|
|
165
|
-
};
|
|
166
|
-
}
|
|
167
|
-
});
|
|
1
|
+
import { _ } from "./index-Dmz32tSB.js";
|
|
168
2
|
export {
|
|
169
|
-
|
|
170
|
-
INJECT_CONFIG,
|
|
171
|
-
_sfc_main as default,
|
|
172
|
-
ensureInjectConfig,
|
|
173
|
-
getInjectConfig
|
|
3
|
+
_ as default
|
|
174
4
|
};
|