@hbdlzy/ui-core 0.1.6 → 0.1.8
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/README.md +34 -2
- package/components.manifest.json +31 -2
- package/dist/components/BaseTable/BaseTable.types.d.ts +17 -2
- package/dist/components/BaseTable/BaseTable.vue.d.ts +4 -4
- package/dist/components/BaseTable/index.d.ts +1 -1
- package/dist/components/OutlinedTreeSelect/OutlinedTreeSelect.vue.d.ts +1 -1
- package/dist/components/SvgIcon/SvgIcon.types.d.ts +6 -0
- package/dist/components/SvgIcon/SvgIcon.vue.d.ts +32 -0
- package/dist/components/SvgIcon/index.d.ts +3 -0
- package/dist/index.cjs +5 -5
- package/dist/index.d.ts +51 -12
- package/dist/index.js +1014 -147
- package/dist/ripple/index.cjs +42 -0
- package/dist/ripple/index.d.ts +8 -1
- package/dist/ripple/index.js +171 -0
- package/dist/style.css +1 -1
- package/package.json +17 -2
- package/src/components/BaseCard/BaseCard.types.d.ts +36 -0
- package/src/components/BaseCard/BaseCard.vue.d.ts +122 -0
- package/src/components/BaseCard/README.md +33 -0
- package/src/components/BaseCard/index.d.ts +3 -0
- package/src/components/BaseEChart/BaseEChart.types.d.ts +26 -0
- package/src/components/BaseEChart/BaseEChart.vue.d.ts +66 -0
- package/src/components/BaseEChart/README.md +33 -0
- package/src/components/BaseEChart/index.d.ts +3 -0
- package/src/components/BaseExportButton/BaseExportButton.types.d.ts +21 -0
- package/src/components/BaseExportButton/BaseExportButton.utils.d.ts +4 -0
- package/src/components/BaseExportButton/BaseExportButton.vue.d.ts +128 -0
- package/src/components/BaseExportButton/README.md +34 -0
- package/src/components/BaseExportButton/index.d.ts +5 -0
- package/src/components/BaseTable/BaseTable.types.d.ts +178 -0
- package/src/components/BaseTable/BaseTable.types.ts +19 -2
- package/src/components/BaseTable/BaseTable.vue +1105 -118
- package/src/components/BaseTable/BaseTable.vue.d.ts +157 -0
- package/src/components/BaseTable/README.md +133 -5
- package/src/components/BaseTable/index.d.ts +3 -0
- package/src/components/BaseTable/index.ts +5 -0
- package/src/components/OutlinedCascader/OutlinedCascader.types.d.ts +28 -0
- package/src/components/OutlinedCascader/OutlinedCascader.vue.d.ts +94 -0
- package/src/components/OutlinedCascader/README.md +34 -0
- package/src/components/OutlinedCascader/index.d.ts +3 -0
- package/src/components/OutlinedDatePicker/OutlinedDatePicker.types.d.ts +30 -0
- package/src/components/OutlinedDatePicker/OutlinedDatePicker.vue.d.ts +97 -0
- package/src/components/OutlinedDatePicker/README.md +34 -0
- package/src/components/OutlinedDatePicker/index.d.ts +3 -0
- package/src/components/OutlinedDateTimePicker/OutlinedDateTimePicker.types.d.ts +29 -0
- package/src/components/OutlinedDateTimePicker/OutlinedDateTimePicker.vue.d.ts +106 -0
- package/src/components/OutlinedDateTimePicker/README.md +33 -0
- package/src/components/OutlinedDateTimePicker/index.d.ts +3 -0
- package/src/components/OutlinedInput/OutlinedInput.types.d.ts +32 -0
- package/src/components/OutlinedInput/OutlinedInput.vue.d.ts +106 -0
- package/src/components/OutlinedInput/README.md +34 -0
- package/src/components/OutlinedInput/index.d.ts +3 -0
- package/src/components/OutlinedSelect/OutlinedSelect.types.d.ts +41 -0
- package/src/components/OutlinedSelect/OutlinedSelect.vue.d.ts +125 -0
- package/src/components/OutlinedSelect/README.md +34 -0
- package/src/components/OutlinedSelect/index.d.ts +3 -0
- package/src/components/OutlinedTimePicker/OutlinedTimePicker.types.d.ts +31 -0
- package/src/components/OutlinedTimePicker/OutlinedTimePicker.vue.d.ts +103 -0
- package/src/components/OutlinedTimePicker/README.md +33 -0
- package/src/components/OutlinedTimePicker/index.d.ts +3 -0
- package/src/components/OutlinedTreeSelect/OutlinedTreeSelect.types.d.ts +49 -0
- package/src/components/OutlinedTreeSelect/OutlinedTreeSelect.vue.d.ts +146 -0
- package/src/components/OutlinedTreeSelect/README.md +34 -0
- package/src/components/OutlinedTreeSelect/index.d.ts +3 -0
- package/src/components/SvgIcon/README.md +86 -0
- package/src/components/SvgIcon/SvgIcon.types.d.ts +6 -0
- package/src/components/SvgIcon/SvgIcon.types.ts +6 -0
- package/src/components/SvgIcon/SvgIcon.vue +68 -0
- package/src/components/SvgIcon/SvgIcon.vue.d.ts +32 -0
- package/src/components/SvgIcon/index.d.ts +3 -0
- package/src/components/SvgIcon/index.ts +5 -0
- package/src/echarts/index.d.ts +9 -0
- package/src/excel/exportExcel.d.ts +18 -0
- package/src/index.d.ts +30 -0
- package/src/index.ts +79 -12
- package/src/ripple/README.md +160 -0
- package/src/ripple/index.d.ts +9 -0
- package/src/ripple/index.ts +15 -1
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
import type { BaseTableCellPayload, BaseTableColumn, BaseTableCssValue, BaseTableHeaderSearchValue, BaseTableLoadedPayload, BaseTablePagination, BaseTableProps, BaseTableRowActionPayload, BaseTableSortPayload } from './BaseTable.types';
|
|
2
|
+
type BaseTableRow = Record<string, any>;
|
|
3
|
+
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BaseTableProps<Record<string, any>>>, {
|
|
4
|
+
data: () => never[];
|
|
5
|
+
requestParams: () => {};
|
|
6
|
+
autoLoad: boolean;
|
|
7
|
+
reloadOnParamsChange: boolean;
|
|
8
|
+
reloadOnSortChange: boolean;
|
|
9
|
+
rowKey: string;
|
|
10
|
+
height: string;
|
|
11
|
+
border: boolean;
|
|
12
|
+
stripe: boolean;
|
|
13
|
+
showToolbar: boolean;
|
|
14
|
+
showPagination: boolean;
|
|
15
|
+
hasSelection: boolean;
|
|
16
|
+
hasIndex: boolean;
|
|
17
|
+
indexLabel: string;
|
|
18
|
+
indexWidth: number;
|
|
19
|
+
selectionWidth: number;
|
|
20
|
+
pagination: () => {};
|
|
21
|
+
currentPageKey: string;
|
|
22
|
+
pageSizeKey: string;
|
|
23
|
+
defaultSort: () => {
|
|
24
|
+
prop: undefined;
|
|
25
|
+
order: null;
|
|
26
|
+
};
|
|
27
|
+
sortFieldKey: string;
|
|
28
|
+
sortOrderKey: string;
|
|
29
|
+
sortOrderMap: () => {
|
|
30
|
+
ascending: string;
|
|
31
|
+
descending: string;
|
|
32
|
+
};
|
|
33
|
+
emptyText: string;
|
|
34
|
+
loadingText: string;
|
|
35
|
+
}>>, {
|
|
36
|
+
load: (data?: Record<string, any>[] | undefined) => Promise<void>;
|
|
37
|
+
refresh: () => Promise<void>;
|
|
38
|
+
setData: (data: Record<string, any>[]) => void;
|
|
39
|
+
resetPage: () => Promise<void>;
|
|
40
|
+
setHeaderSearchValue: (key: string, value: BaseTableHeaderSearchValue, shouldReload?: boolean | undefined) => Promise<void>;
|
|
41
|
+
resetHeaderSearch: (key?: string | undefined) => Promise<void>;
|
|
42
|
+
getHeaderSearchValues: () => Record<string, BaseTableHeaderSearchValue>;
|
|
43
|
+
clearSelection: () => void;
|
|
44
|
+
toggleRowSelection: (row: Record<string, any>, selected?: boolean | undefined) => void;
|
|
45
|
+
getSelectionRows: () => Record<string, any>[];
|
|
46
|
+
getRows: () => Record<string, any>[];
|
|
47
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
48
|
+
"selection-change": (rows: BaseTableRow[]) => void;
|
|
49
|
+
"sort-change": (payload: BaseTableSortPayload<Record<string, any>>) => void;
|
|
50
|
+
"row-action": (payload: BaseTableRowActionPayload<Record<string, any>>) => void;
|
|
51
|
+
"cell-click": (payload: BaseTableCellPayload<Record<string, any>>) => void;
|
|
52
|
+
"cell-input": (payload: BaseTableCellPayload<Record<string, any>>) => void;
|
|
53
|
+
"page-change": (currentPage: number) => void;
|
|
54
|
+
"size-change": (pageSize: number) => void;
|
|
55
|
+
"update:pagination": (pagination: BaseTablePagination) => void;
|
|
56
|
+
loaded: (payload: BaseTableLoadedPayload<Record<string, any>>) => void;
|
|
57
|
+
"request-error": (error: unknown) => void;
|
|
58
|
+
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BaseTableProps<Record<string, any>>>, {
|
|
59
|
+
data: () => never[];
|
|
60
|
+
requestParams: () => {};
|
|
61
|
+
autoLoad: boolean;
|
|
62
|
+
reloadOnParamsChange: boolean;
|
|
63
|
+
reloadOnSortChange: boolean;
|
|
64
|
+
rowKey: string;
|
|
65
|
+
height: string;
|
|
66
|
+
border: boolean;
|
|
67
|
+
stripe: boolean;
|
|
68
|
+
showToolbar: boolean;
|
|
69
|
+
showPagination: boolean;
|
|
70
|
+
hasSelection: boolean;
|
|
71
|
+
hasIndex: boolean;
|
|
72
|
+
indexLabel: string;
|
|
73
|
+
indexWidth: number;
|
|
74
|
+
selectionWidth: number;
|
|
75
|
+
pagination: () => {};
|
|
76
|
+
currentPageKey: string;
|
|
77
|
+
pageSizeKey: string;
|
|
78
|
+
defaultSort: () => {
|
|
79
|
+
prop: undefined;
|
|
80
|
+
order: null;
|
|
81
|
+
};
|
|
82
|
+
sortFieldKey: string;
|
|
83
|
+
sortOrderKey: string;
|
|
84
|
+
sortOrderMap: () => {
|
|
85
|
+
ascending: string;
|
|
86
|
+
descending: string;
|
|
87
|
+
};
|
|
88
|
+
emptyText: string;
|
|
89
|
+
loadingText: string;
|
|
90
|
+
}>>> & Readonly<{
|
|
91
|
+
"onSelection-change"?: ((rows: BaseTableRow[]) => any) | undefined;
|
|
92
|
+
"onSort-change"?: ((payload: BaseTableSortPayload<Record<string, any>>) => any) | undefined;
|
|
93
|
+
"onRow-action"?: ((payload: BaseTableRowActionPayload<Record<string, any>>) => any) | undefined;
|
|
94
|
+
"onCell-click"?: ((payload: BaseTableCellPayload<Record<string, any>>) => any) | undefined;
|
|
95
|
+
"onCell-input"?: ((payload: BaseTableCellPayload<Record<string, any>>) => any) | undefined;
|
|
96
|
+
"onPage-change"?: ((currentPage: number) => any) | undefined;
|
|
97
|
+
"onSize-change"?: ((pageSize: number) => any) | undefined;
|
|
98
|
+
"onUpdate:pagination"?: ((pagination: BaseTablePagination) => any) | undefined;
|
|
99
|
+
onLoaded?: ((payload: BaseTableLoadedPayload<Record<string, any>>) => any) | undefined;
|
|
100
|
+
"onRequest-error"?: ((error: unknown) => any) | undefined;
|
|
101
|
+
}>, {
|
|
102
|
+
data: Record<string, any>[];
|
|
103
|
+
border: boolean;
|
|
104
|
+
requestParams: Record<string, unknown>;
|
|
105
|
+
autoLoad: boolean;
|
|
106
|
+
reloadOnParamsChange: boolean;
|
|
107
|
+
reloadOnSortChange: boolean;
|
|
108
|
+
rowKey: string;
|
|
109
|
+
height: BaseTableCssValue;
|
|
110
|
+
stripe: boolean;
|
|
111
|
+
showToolbar: boolean;
|
|
112
|
+
showPagination: boolean;
|
|
113
|
+
hasSelection: boolean;
|
|
114
|
+
hasIndex: boolean;
|
|
115
|
+
indexLabel: string;
|
|
116
|
+
indexWidth: BaseTableCssValue;
|
|
117
|
+
selectionWidth: BaseTableCssValue;
|
|
118
|
+
pagination: Partial<BaseTablePagination>;
|
|
119
|
+
currentPageKey: string;
|
|
120
|
+
pageSizeKey: string;
|
|
121
|
+
defaultSort: import("./BaseTable.types").BaseTableSortState;
|
|
122
|
+
sortFieldKey: string;
|
|
123
|
+
sortOrderKey: string;
|
|
124
|
+
sortOrderMap: import("./BaseTable.types").BaseTableSortOrderMap;
|
|
125
|
+
emptyText: string;
|
|
126
|
+
loadingText: string;
|
|
127
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, Partial<Record<string, (_: any) => any>> & Partial<Record<string, (_: {
|
|
128
|
+
row: any;
|
|
129
|
+
columnConfig: BaseTableColumn<Record<string, any>>;
|
|
130
|
+
columnIndex: any;
|
|
131
|
+
value: any;
|
|
132
|
+
}) => any>> & {
|
|
133
|
+
toolbar?(_: {}): any;
|
|
134
|
+
}>;
|
|
135
|
+
export default _default;
|
|
136
|
+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
137
|
+
type __VLS_TypePropsToRuntimeProps<T> = {
|
|
138
|
+
[K in keyof T]-?: {} extends Pick<T, K> ? {
|
|
139
|
+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
|
|
140
|
+
} : {
|
|
141
|
+
type: import('vue').PropType<T[K]>;
|
|
142
|
+
required: true;
|
|
143
|
+
};
|
|
144
|
+
};
|
|
145
|
+
type __VLS_WithDefaults<P, D> = {
|
|
146
|
+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
|
|
147
|
+
default: D[K];
|
|
148
|
+
}> : P[K];
|
|
149
|
+
};
|
|
150
|
+
type __VLS_Prettify<T> = {
|
|
151
|
+
[K in keyof T]: T[K];
|
|
152
|
+
} & {};
|
|
153
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
154
|
+
new (): {
|
|
155
|
+
$slots: S;
|
|
156
|
+
};
|
|
157
|
+
};
|
|
@@ -199,9 +199,9 @@ const resultAdapter = (result: any) => {
|
|
|
199
199
|
|
|
200
200
|
如果接口参数结构更特殊,可以改用 `sortMapper`。
|
|
201
201
|
|
|
202
|
-
## 表头列搜索
|
|
202
|
+
## 表头列搜索 / 筛选
|
|
203
203
|
|
|
204
|
-
`BaseTable`
|
|
204
|
+
`BaseTable` 现在支持列头输入搜索、下拉筛选、多选下拉和级联筛选能力,用法和旧 `TableComponent.vue` 里的 `isSearch` 很接近,但配置方式更收敛。
|
|
205
205
|
|
|
206
206
|
### 基础写法
|
|
207
207
|
|
|
@@ -217,7 +217,7 @@ const columns = [
|
|
|
217
217
|
|
|
218
218
|
开启后,这一列的表头会出现搜索图标,点击后会弹出输入框,并提供“搜索 / 重置”操作。
|
|
219
219
|
|
|
220
|
-
###
|
|
220
|
+
### 输入框高级写法
|
|
221
221
|
|
|
222
222
|
```ts
|
|
223
223
|
const columns = [
|
|
@@ -235,13 +235,94 @@ const columns = [
|
|
|
235
235
|
]
|
|
236
236
|
```
|
|
237
237
|
|
|
238
|
+
### 下拉筛选写法
|
|
239
|
+
|
|
240
|
+
```ts
|
|
241
|
+
const columns = [
|
|
242
|
+
{
|
|
243
|
+
label: '状态',
|
|
244
|
+
prop: 'status',
|
|
245
|
+
kind: 'tag',
|
|
246
|
+
options: [
|
|
247
|
+
{ label: '启用', value: 'enabled', tagType: 'success' },
|
|
248
|
+
{ label: '停用', value: 'disabled', tagType: 'info' }
|
|
249
|
+
],
|
|
250
|
+
headerSearch: {
|
|
251
|
+
type: 'select',
|
|
252
|
+
placeholder: '请选择状态',
|
|
253
|
+
width: 220,
|
|
254
|
+
searchText: '筛选'
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
]
|
|
258
|
+
```
|
|
259
|
+
|
|
260
|
+
下拉筛选默认复用当前列的 `options`,也可以在 `headerSearch.options` 中单独传入选项。需要多选时可以配置 `multiple: true`,请求参数会以数组形式传出。
|
|
261
|
+
|
|
262
|
+
### 多选下拉筛选写法
|
|
263
|
+
|
|
264
|
+
```ts
|
|
265
|
+
const columns = [
|
|
266
|
+
{
|
|
267
|
+
label: '资讯分类',
|
|
268
|
+
prop: 'categories',
|
|
269
|
+
kind: 'tag',
|
|
270
|
+
options: [
|
|
271
|
+
{ label: '市场资讯', value: 'market', tagType: 'primary' },
|
|
272
|
+
{ label: '运行日报', value: 'operation', tagType: 'success' }
|
|
273
|
+
],
|
|
274
|
+
headerSearch: {
|
|
275
|
+
type: 'select',
|
|
276
|
+
multiple: true,
|
|
277
|
+
placeholder: '请选择分类',
|
|
278
|
+
searchText: '筛选'
|
|
279
|
+
}
|
|
280
|
+
}
|
|
281
|
+
]
|
|
282
|
+
```
|
|
283
|
+
|
|
284
|
+
多选下拉会在面板里保留展开状态,方便连续选择多个选项;点击“筛选”后请求参数形如 `{ categories: ['market', 'operation'] }`。
|
|
285
|
+
|
|
286
|
+
### 级联下拉筛选写法
|
|
287
|
+
|
|
288
|
+
```ts
|
|
289
|
+
const columns = [
|
|
290
|
+
{
|
|
291
|
+
label: '所在区域',
|
|
292
|
+
prop: 'regionPath',
|
|
293
|
+
headerSearch: {
|
|
294
|
+
type: 'cascader',
|
|
295
|
+
placeholder: '请选择区域',
|
|
296
|
+
width: 420,
|
|
297
|
+
options: [
|
|
298
|
+
{
|
|
299
|
+
label: '华北',
|
|
300
|
+
value: 'north',
|
|
301
|
+
children: [
|
|
302
|
+
{
|
|
303
|
+
label: '北京',
|
|
304
|
+
value: 'beijing',
|
|
305
|
+
children: [
|
|
306
|
+
{ label: '朝阳区', value: 'chaoyang' }
|
|
307
|
+
]
|
|
308
|
+
}
|
|
309
|
+
]
|
|
310
|
+
}
|
|
311
|
+
]
|
|
312
|
+
}
|
|
313
|
+
}
|
|
314
|
+
]
|
|
315
|
+
```
|
|
316
|
+
|
|
317
|
+
级联筛选默认使用 `children` 作为子级字段,可以通过 `optionChildrenKey` 改写;请求参数会以完整路径数组传出,例如 `{ regionPath: ['north', 'beijing', 'chaoyang'] }`。
|
|
318
|
+
|
|
238
319
|
### 行为说明
|
|
239
320
|
|
|
240
321
|
- 远程模式下,列头搜索值会自动合并到 `request(params)` 的参数里
|
|
241
322
|
- 触发搜索或重置时,会自动把页码重置到第一页
|
|
242
323
|
- 如果配置了 `paramKey`,请求参数会优先使用它
|
|
243
324
|
- 如果没有配置 `paramKey`,默认使用当前列的 `prop`
|
|
244
|
-
-
|
|
325
|
+
- 本地数据模式下,输入搜索会对当前 `data` 做简单文本包含过滤,下拉筛选会按选项值精确匹配,级联筛选会按路径前缀匹配
|
|
245
326
|
- 多个开启搜索的列会按“同时满足”处理
|
|
246
327
|
|
|
247
328
|
示例请求参数:
|
|
@@ -250,7 +331,8 @@ const columns = [
|
|
|
250
331
|
{
|
|
251
332
|
currentPage: 1,
|
|
252
333
|
pageSize: 20,
|
|
253
|
-
owner: '张三'
|
|
334
|
+
owner: '张三',
|
|
335
|
+
status: 'enabled'
|
|
254
336
|
}
|
|
255
337
|
```
|
|
256
338
|
|
|
@@ -362,6 +444,7 @@ const columns = [
|
|
|
362
444
|
|
|
363
445
|
```ts
|
|
364
446
|
tableRef.value?.setHeaderSearchValue('owner', '张三')
|
|
447
|
+
tableRef.value?.setHeaderSearchValue('status', 'enabled')
|
|
365
448
|
tableRef.value?.resetHeaderSearch()
|
|
366
449
|
```
|
|
367
450
|
|
|
@@ -382,3 +465,48 @@ tableRef.value?.resetHeaderSearch()
|
|
|
382
465
|
- 默认优先使用列配置驱动,只有复杂单元格才使用插槽
|
|
383
466
|
- 通用操作列尽量统一收敛到 `row-action`
|
|
384
467
|
- 复杂筛选表单不要内置到表格组件里,统一通过 `toolbar` 扩展
|
|
468
|
+
|
|
469
|
+
## AI 使用指引
|
|
470
|
+
|
|
471
|
+
AI 在生成列表页、管理页、日志页、明细页时,应优先使用 `BaseTable`,不要在页面里重复封装 `el-table + el-pagination + loading + request + sort + selection`。
|
|
472
|
+
|
|
473
|
+
推荐优先从统一入口导入:
|
|
474
|
+
|
|
475
|
+
```ts
|
|
476
|
+
import { BaseTable, type BaseTableColumn, type BaseTableExpose } from '@hbdlzy/ui'
|
|
477
|
+
```
|
|
478
|
+
|
|
479
|
+
如果当前只安装了核心包,也可以从 `@hbdlzy/ui-core` 导入。
|
|
480
|
+
|
|
481
|
+
AI 生成代码时按下面顺序判断:
|
|
482
|
+
|
|
483
|
+
1. 先定义业务行类型 `RowItem`
|
|
484
|
+
2. 再定义 `BaseTableColumn<RowItem>[]`
|
|
485
|
+
3. 本地静态数据用 `data`
|
|
486
|
+
4. 远程分页数据用 `request`,不要把 `listUrl` 字符串直接塞给组件
|
|
487
|
+
5. 接口返回结构不统一时,用 `resultAdapter` 映射成 `{ rows, total }`
|
|
488
|
+
6. 顶部筛选表单放进 `toolbar` 插槽
|
|
489
|
+
7. 行操作统一配置 `kind: 'actions'`,通过 `@row-action` 承接
|
|
490
|
+
8. 复杂单元格才使用 `cell-${prop}` 插槽
|
|
491
|
+
|
|
492
|
+
AI 不应该做这些事:
|
|
493
|
+
|
|
494
|
+
- 不要在页面里重新写分页状态、页码变化、每页条数变化和远程加载逻辑
|
|
495
|
+
- 不要在页面里重复写通用排序参数映射,优先使用 `sortFieldKey`、`sortOrderKey`、`sortMapper`
|
|
496
|
+
- 不要为常见状态标签、图片、链接、操作列重复写模板,优先使用 `kind`
|
|
497
|
+
- 不要把复杂业务筛选塞进列头搜索,复杂筛选应放在 `toolbar`
|
|
498
|
+
- 不要绕过 `BaseTableExpose` 直接操作内部 `el-table`
|
|
499
|
+
|
|
500
|
+
旧项目迁移时,AI 可以按这个映射处理:
|
|
501
|
+
|
|
502
|
+
- `columnsList` 迁移为 `columns`
|
|
503
|
+
- `listUrl + paramsData` 迁移为 `request + requestParams`
|
|
504
|
+
- `isSearch / isFilter / isCity` 迁移为 `headerSearch`
|
|
505
|
+
- `actions` 迁移为 `kind: 'actions'`
|
|
506
|
+
- `@handleAction` 迁移为 `@row-action`
|
|
507
|
+
|
|
508
|
+
生成代码前建议同时读取:
|
|
509
|
+
|
|
510
|
+
- `packages/ui-core/components.manifest.json`
|
|
511
|
+
- `packages/ui-core/src/components/BaseTable/BaseTable.types.ts`
|
|
512
|
+
- 本 README 的 `Props / Column 能力 / Events / Expose` 部分
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import BaseTable from './BaseTable.vue';
|
|
2
|
+
export default BaseTable;
|
|
3
|
+
export type { BaseTableAction, BaseTableAlign, BaseTableCellPayload, BaseTableColumn, BaseTableColumnKind, BaseTableCssValue, BaseTableExpose, BaseTableHeaderSearchConfig, BaseTableHeaderSearchPathValue, BaseTableHeaderSearchPrimitiveValue, BaseTableHeaderSearchType, BaseTableHeaderSearchValue, BaseTableLoadedPayload, BaseTableNormalizedResult, BaseTableOption, BaseTablePagination, BaseTableProps, BaseTableResultAdapter, BaseTableRequestHandler, BaseTableRequestParams, BaseTableRequestResult, BaseTableRowActionPayload, BaseTableSortOrder, BaseTableSortPayload } from './BaseTable.types';
|
|
@@ -10,6 +10,11 @@ export type {
|
|
|
10
10
|
BaseTableColumnKind,
|
|
11
11
|
BaseTableCssValue,
|
|
12
12
|
BaseTableExpose,
|
|
13
|
+
BaseTableHeaderSearchConfig,
|
|
14
|
+
BaseTableHeaderSearchPathValue,
|
|
15
|
+
BaseTableHeaderSearchPrimitiveValue,
|
|
16
|
+
BaseTableHeaderSearchType,
|
|
17
|
+
BaseTableHeaderSearchValue,
|
|
13
18
|
BaseTableLoadedPayload,
|
|
14
19
|
BaseTableNormalizedResult,
|
|
15
20
|
BaseTableOption,
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
export type OutlinedCascaderCssValue = string | number;
|
|
2
|
+
export type OutlinedCascaderValue = Array<string | number>;
|
|
3
|
+
export interface OutlinedCascaderProps {
|
|
4
|
+
value?: OutlinedCascaderValue;
|
|
5
|
+
options?: Record<string, unknown>[];
|
|
6
|
+
clearable?: boolean;
|
|
7
|
+
propsValue?: Record<string, unknown>;
|
|
8
|
+
placeholder?: string;
|
|
9
|
+
label?: string;
|
|
10
|
+
popperClass?: string;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
inputHeight?: number;
|
|
13
|
+
isBorder?: boolean;
|
|
14
|
+
filterable?: boolean;
|
|
15
|
+
levels?: boolean;
|
|
16
|
+
marginBottom?: OutlinedCascaderCssValue;
|
|
17
|
+
paddingTop?: OutlinedCascaderCssValue;
|
|
18
|
+
required?: boolean;
|
|
19
|
+
error?: boolean;
|
|
20
|
+
errorMessage?: string;
|
|
21
|
+
}
|
|
22
|
+
export interface OutlinedCascaderExpose {
|
|
23
|
+
focus: () => void;
|
|
24
|
+
blur: () => void;
|
|
25
|
+
togglePopperVisible: () => void;
|
|
26
|
+
clear: () => void;
|
|
27
|
+
getCascaderRef: () => unknown | null;
|
|
28
|
+
}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import type { OutlinedCascaderCssValue, OutlinedCascaderProps, OutlinedCascaderValue } from './OutlinedCascader.types';
|
|
2
|
+
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OutlinedCascaderProps>, {
|
|
3
|
+
value: () => never[];
|
|
4
|
+
options: () => never[];
|
|
5
|
+
clearable: boolean;
|
|
6
|
+
propsValue: undefined;
|
|
7
|
+
placeholder: string;
|
|
8
|
+
label: string;
|
|
9
|
+
popperClass: string;
|
|
10
|
+
disabled: boolean;
|
|
11
|
+
inputHeight: number;
|
|
12
|
+
isBorder: boolean;
|
|
13
|
+
filterable: boolean;
|
|
14
|
+
levels: boolean;
|
|
15
|
+
marginBottom: number;
|
|
16
|
+
paddingTop: number;
|
|
17
|
+
required: boolean;
|
|
18
|
+
error: boolean;
|
|
19
|
+
errorMessage: string;
|
|
20
|
+
}>>, {
|
|
21
|
+
focus: () => void;
|
|
22
|
+
blur: () => void;
|
|
23
|
+
togglePopperVisible: () => void;
|
|
24
|
+
clear: () => void;
|
|
25
|
+
getCascaderRef: () => unknown;
|
|
26
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
27
|
+
input: (value: OutlinedCascaderValue) => void;
|
|
28
|
+
"update:value": (value: OutlinedCascaderValue) => void;
|
|
29
|
+
change: (value: OutlinedCascaderValue) => void;
|
|
30
|
+
focus: (value: FocusEvent) => void;
|
|
31
|
+
blur: (value: FocusEvent) => void;
|
|
32
|
+
"visible-change": (value: boolean) => void;
|
|
33
|
+
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OutlinedCascaderProps>, {
|
|
34
|
+
value: () => never[];
|
|
35
|
+
options: () => never[];
|
|
36
|
+
clearable: boolean;
|
|
37
|
+
propsValue: undefined;
|
|
38
|
+
placeholder: string;
|
|
39
|
+
label: string;
|
|
40
|
+
popperClass: string;
|
|
41
|
+
disabled: boolean;
|
|
42
|
+
inputHeight: number;
|
|
43
|
+
isBorder: boolean;
|
|
44
|
+
filterable: boolean;
|
|
45
|
+
levels: boolean;
|
|
46
|
+
marginBottom: number;
|
|
47
|
+
paddingTop: number;
|
|
48
|
+
required: boolean;
|
|
49
|
+
error: boolean;
|
|
50
|
+
errorMessage: string;
|
|
51
|
+
}>>> & Readonly<{
|
|
52
|
+
onBlur?: ((value: FocusEvent) => any) | undefined;
|
|
53
|
+
onChange?: ((value: OutlinedCascaderValue) => any) | undefined;
|
|
54
|
+
onFocus?: ((value: FocusEvent) => any) | undefined;
|
|
55
|
+
onInput?: ((value: OutlinedCascaderValue) => any) | undefined;
|
|
56
|
+
"onUpdate:value"?: ((value: OutlinedCascaderValue) => any) | undefined;
|
|
57
|
+
"onVisible-change"?: ((value: boolean) => any) | undefined;
|
|
58
|
+
}>, {
|
|
59
|
+
error: boolean;
|
|
60
|
+
label: string;
|
|
61
|
+
disabled: boolean;
|
|
62
|
+
required: boolean;
|
|
63
|
+
popperClass: string;
|
|
64
|
+
value: OutlinedCascaderValue;
|
|
65
|
+
placeholder: string;
|
|
66
|
+
options: Record<string, unknown>[];
|
|
67
|
+
errorMessage: string;
|
|
68
|
+
inputHeight: number;
|
|
69
|
+
isBorder: boolean;
|
|
70
|
+
clearable: boolean;
|
|
71
|
+
marginBottom: OutlinedCascaderCssValue;
|
|
72
|
+
paddingTop: OutlinedCascaderCssValue;
|
|
73
|
+
filterable: boolean;
|
|
74
|
+
propsValue: Record<string, unknown>;
|
|
75
|
+
levels: boolean;
|
|
76
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
77
|
+
export default _default;
|
|
78
|
+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
79
|
+
type __VLS_TypePropsToRuntimeProps<T> = {
|
|
80
|
+
[K in keyof T]-?: {} extends Pick<T, K> ? {
|
|
81
|
+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
|
|
82
|
+
} : {
|
|
83
|
+
type: import('vue').PropType<T[K]>;
|
|
84
|
+
required: true;
|
|
85
|
+
};
|
|
86
|
+
};
|
|
87
|
+
type __VLS_WithDefaults<P, D> = {
|
|
88
|
+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
|
|
89
|
+
default: D[K];
|
|
90
|
+
}> : P[K];
|
|
91
|
+
};
|
|
92
|
+
type __VLS_Prettify<T> = {
|
|
93
|
+
[K in keyof T]: T[K];
|
|
94
|
+
} & {};
|
|
@@ -92,3 +92,37 @@ const areaOptions = [
|
|
|
92
92
|
- 组件只负责通用级联选择壳子和交互状态,不直接耦合区域接口、组织树接口等业务数据源
|
|
93
93
|
- 页面层如果需要多选级联、懒加载或复杂回填逻辑,优先先通过 `propsValue` 和插值配置解决
|
|
94
94
|
- 如果业务需要固定某种树结构,可以在业务包里再封一层领域组件,而不是反向污染 `ui-core`
|
|
95
|
+
|
|
96
|
+
## AI 使用指引
|
|
97
|
+
|
|
98
|
+
AI 在生成区域、组织、站点、分类等级联选择项时,应优先使用 `OutlinedCascader`,不要重复封装 `el-cascader` 的浮动标签、面板显隐和清空逻辑。
|
|
99
|
+
|
|
100
|
+
推荐优先从统一入口导入:
|
|
101
|
+
|
|
102
|
+
```ts
|
|
103
|
+
import { OutlinedCascader, type OutlinedCascaderExpose } from '@hbdlzy/ui'
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
如果当前只安装了核心包,也可以从 `@hbdlzy/ui-core` 导入。
|
|
107
|
+
|
|
108
|
+
AI 生成代码时按下面顺序判断:
|
|
109
|
+
|
|
110
|
+
1. 选项为标准 `label/value/children` 时直接传 `options`
|
|
111
|
+
2. 后端字段不同,优先通过 `propsValue` 映射,不要先复制转换一份树
|
|
112
|
+
3. 需要搜索时传 `filterable`
|
|
113
|
+
4. 需要展示完整路径时保持 `levels` 为 `true`
|
|
114
|
+
5. 需要下边框风格,传 `:is-border="true"`
|
|
115
|
+
6. 需要手动打开、关闭、清空时,使用 `ref<OutlinedCascaderExpose>`
|
|
116
|
+
|
|
117
|
+
AI 不应该做这些事:
|
|
118
|
+
|
|
119
|
+
- 不要为普通级联选择重复写 `el-cascader` 外壳
|
|
120
|
+
- 不要把区域接口、组织接口请求逻辑写进基础组件
|
|
121
|
+
- 不要为了字段映射在页面层重复转换大树,优先使用 `propsValue`
|
|
122
|
+
- 不要把业务固定层级、路径拼接规则塞回 `ui-core`
|
|
123
|
+
|
|
124
|
+
生成代码前建议同时读取:
|
|
125
|
+
|
|
126
|
+
- `packages/ui-core/components.manifest.json`
|
|
127
|
+
- `packages/ui-core/src/components/OutlinedCascader/OutlinedCascader.types.ts`
|
|
128
|
+
- 本 README 的 `Props / Emits / Expose` 部分
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
export type OutlinedDatePickerCssValue = string | number;
|
|
2
|
+
export type OutlinedDatePickerValue = string | number | Date | Array<string | number | Date> | null;
|
|
3
|
+
export type OutlinedDatePickerDisabledDate = string | number | Date | ((date: Date) => boolean);
|
|
4
|
+
export interface OutlinedDatePickerProps {
|
|
5
|
+
value?: OutlinedDatePickerValue;
|
|
6
|
+
placeholder?: string;
|
|
7
|
+
label?: string;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
timeValue?: boolean;
|
|
10
|
+
typeDate?: string;
|
|
11
|
+
format?: string;
|
|
12
|
+
valueFormat?: string;
|
|
13
|
+
showPassword?: boolean;
|
|
14
|
+
multiple?: boolean;
|
|
15
|
+
inputHeight?: number;
|
|
16
|
+
isBorder?: boolean;
|
|
17
|
+
disabledDate?: OutlinedDatePickerDisabledDate;
|
|
18
|
+
marginBottom?: OutlinedDatePickerCssValue;
|
|
19
|
+
paddingTop?: OutlinedDatePickerCssValue;
|
|
20
|
+
required?: boolean;
|
|
21
|
+
error?: boolean;
|
|
22
|
+
errorMessage?: string;
|
|
23
|
+
}
|
|
24
|
+
export interface OutlinedDatePickerExpose {
|
|
25
|
+
focus: () => void;
|
|
26
|
+
blur: () => void;
|
|
27
|
+
handleOpen: () => void;
|
|
28
|
+
handleClose: () => void;
|
|
29
|
+
getPickerRef: () => unknown | null;
|
|
30
|
+
}
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import type { OutlinedDatePickerCssValue, OutlinedDatePickerDisabledDate, OutlinedDatePickerProps, OutlinedDatePickerValue } from './OutlinedDatePicker.types';
|
|
2
|
+
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OutlinedDatePickerProps>, {
|
|
3
|
+
value: string;
|
|
4
|
+
placeholder: string;
|
|
5
|
+
label: string;
|
|
6
|
+
disabled: boolean;
|
|
7
|
+
timeValue: boolean;
|
|
8
|
+
typeDate: string;
|
|
9
|
+
format: string;
|
|
10
|
+
valueFormat: string;
|
|
11
|
+
showPassword: boolean;
|
|
12
|
+
multiple: boolean;
|
|
13
|
+
inputHeight: number;
|
|
14
|
+
isBorder: boolean;
|
|
15
|
+
disabledDate: undefined;
|
|
16
|
+
marginBottom: number;
|
|
17
|
+
paddingTop: number;
|
|
18
|
+
required: boolean;
|
|
19
|
+
error: boolean;
|
|
20
|
+
errorMessage: string;
|
|
21
|
+
}>>, {
|
|
22
|
+
focus: () => void;
|
|
23
|
+
blur: () => void;
|
|
24
|
+
handleOpen: () => void;
|
|
25
|
+
handleClose: () => void;
|
|
26
|
+
getPickerRef: () => unknown;
|
|
27
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
28
|
+
input: (value: OutlinedDatePickerValue) => void;
|
|
29
|
+
"update:value": (value: OutlinedDatePickerValue) => void;
|
|
30
|
+
change: (value: OutlinedDatePickerValue) => void;
|
|
31
|
+
focus: (value: FocusEvent) => void;
|
|
32
|
+
blur: (value: FocusEvent) => void;
|
|
33
|
+
"visible-change": (value: boolean) => void;
|
|
34
|
+
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OutlinedDatePickerProps>, {
|
|
35
|
+
value: string;
|
|
36
|
+
placeholder: string;
|
|
37
|
+
label: string;
|
|
38
|
+
disabled: boolean;
|
|
39
|
+
timeValue: boolean;
|
|
40
|
+
typeDate: string;
|
|
41
|
+
format: string;
|
|
42
|
+
valueFormat: string;
|
|
43
|
+
showPassword: boolean;
|
|
44
|
+
multiple: boolean;
|
|
45
|
+
inputHeight: number;
|
|
46
|
+
isBorder: boolean;
|
|
47
|
+
disabledDate: undefined;
|
|
48
|
+
marginBottom: number;
|
|
49
|
+
paddingTop: number;
|
|
50
|
+
required: boolean;
|
|
51
|
+
error: boolean;
|
|
52
|
+
errorMessage: string;
|
|
53
|
+
}>>> & Readonly<{
|
|
54
|
+
onBlur?: ((value: FocusEvent) => any) | undefined;
|
|
55
|
+
onChange?: ((value: OutlinedDatePickerValue) => any) | undefined;
|
|
56
|
+
onFocus?: ((value: FocusEvent) => any) | undefined;
|
|
57
|
+
onInput?: ((value: OutlinedDatePickerValue) => any) | undefined;
|
|
58
|
+
"onUpdate:value"?: ((value: OutlinedDatePickerValue) => any) | undefined;
|
|
59
|
+
"onVisible-change"?: ((value: boolean) => any) | undefined;
|
|
60
|
+
}>, {
|
|
61
|
+
error: boolean;
|
|
62
|
+
label: string;
|
|
63
|
+
disabled: boolean;
|
|
64
|
+
required: boolean;
|
|
65
|
+
value: OutlinedDatePickerValue;
|
|
66
|
+
placeholder: string;
|
|
67
|
+
errorMessage: string;
|
|
68
|
+
showPassword: boolean;
|
|
69
|
+
inputHeight: number;
|
|
70
|
+
isBorder: boolean;
|
|
71
|
+
marginBottom: OutlinedDatePickerCssValue;
|
|
72
|
+
paddingTop: OutlinedDatePickerCssValue;
|
|
73
|
+
multiple: boolean;
|
|
74
|
+
timeValue: boolean;
|
|
75
|
+
typeDate: string;
|
|
76
|
+
format: string;
|
|
77
|
+
valueFormat: string;
|
|
78
|
+
disabledDate: OutlinedDatePickerDisabledDate;
|
|
79
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
80
|
+
export default _default;
|
|
81
|
+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
82
|
+
type __VLS_TypePropsToRuntimeProps<T> = {
|
|
83
|
+
[K in keyof T]-?: {} extends Pick<T, K> ? {
|
|
84
|
+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
|
|
85
|
+
} : {
|
|
86
|
+
type: import('vue').PropType<T[K]>;
|
|
87
|
+
required: true;
|
|
88
|
+
};
|
|
89
|
+
};
|
|
90
|
+
type __VLS_WithDefaults<P, D> = {
|
|
91
|
+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
|
|
92
|
+
default: D[K];
|
|
93
|
+
}> : P[K];
|
|
94
|
+
};
|
|
95
|
+
type __VLS_Prettify<T> = {
|
|
96
|
+
[K in keyof T]: T[K];
|
|
97
|
+
} & {};
|