@xmszm/core 0.0.2 → 0.0.3
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 +10 -1
- package/dist/index.cjs +2 -2
- package/dist/index.mjs +1296 -1285
- package/dist/plugin/vite/initRouteMeta.cjs +1 -0
- package/dist/plugin/vite/initRouteMeta.mjs +13 -0
- package/dist/style.css +1 -1
- package/docs/.vitepress/config.mjs +10 -1
- package/docs/components/config-options.md +125 -0
- package/docs/components/dataform.md +175 -22
- package/docs/components/datatable.md +21 -39
- package/docs/components/dialog.md +155 -16
- package/docs/components/options.md +43 -14
- package/docs/components/query.md +20 -12
- package/docs/components/utils.md +118 -10
- package/docs/guide/changelog.md +81 -0
- package/docs/guide/config.md +241 -4
- package/docs/guide/quickstart.md +27 -2
- package/docs/index.md +1 -1
- package/docs/usage.md +16 -3
- package/examples/README.md +46 -0
- package/examples/index.html +14 -0
- package/examples/package.json +25 -0
- package/examples/pnpm-lock.yaml +1569 -0
- package/examples/pnpm-workspace.yaml +3 -0
- package/examples/src/AdminSystem.vue +870 -0
- package/examples/src/App.vue +330 -0
- package/examples/src/Introduction.vue +307 -0
- package/examples/src/main.js +22 -0
- package/examples/src/utils/permission.js +16 -0
- package/examples/src/utils/request.js +10 -0
- package/examples/vite.config.js +41 -0
- package/package.json +10 -4
- package/src/dialog/commonDialog.tsx +285 -0
- package/src/dialog/utils/{dialog.js → dialog.ts} +2 -0
- package/src/enum/sort.tsx +45 -0
- package/src/form/DataForm.vue +26 -52
- package/src/{index.js → index.ts} +7 -6
- package/src/list/{useList.jsx → useList.tsx} +49 -14
- package/src/options/{Options.jsx → Options.tsx} +37 -36
- package/src/options/defaultOptions.tsx +656 -0
- package/src/query/CommonQuery.vue +57 -89
- package/src/table/DataTable.vue +60 -94
- package/src/table/opr/{DataColumnCollet.jsx → DataColumnCollet.tsx} +18 -8
- package/src/table/opr/{useDataColumn.jsx → useDataColumn.tsx} +43 -48
- package/src/table/opr/{useDataColumnButton.jsx → useDataColumnButton.tsx} +13 -6
- package/src/table/opr/{useDataColumnPop.jsx → useDataColumnPop.tsx} +13 -5
- package/src/utils/{array.js → array.ts} +4 -6
- package/src/utils/{config.js → config.ts} +16 -2
- package/src/utils/{dialog.js → dialog.ts} +2 -2
- package/src/utils/{object.js → object.ts} +1 -0
- package/src/utils/{upload.js → upload.ts} +3 -3
- package/types/components.d.ts +402 -0
- package/types/index.d.ts +145 -7
- package/types/plugin/vite/initRouteMeta.d.ts +23 -0
- package/types/src.d.ts +55 -0
- package/types/vue-shim.d.ts +9 -0
- package/examples/demo.vue +0 -224
- package/src/dialog/commonDialog.jsx +0 -262
- package/src/enum/sort.jsx +0 -31
- package/src/options/defaultOptions.jsx +0 -580
- /package/src/dialog/{useCommonDialog.js → useCommonDialog.ts} +0 -0
- /package/src/directives/{auto-register.js → auto-register.ts} +0 -0
- /package/src/directives/{permission.js → permission.ts} +0 -0
- /package/src/enum/{options.js → options.ts} +0 -0
- /package/src/plugin/{index.js → index.ts} +0 -0
- /package/src/plugin/vite/{initRouteMeta.js → initRouteMeta.ts} +0 -0
- /package/src/store/utils/{index.js → index.ts} +0 -0
- /package/src/table/opr/{useQRCode.js → useQRCode.ts} +0 -0
- /package/src/table/utils/{ellipsis.js → ellipsis.ts} +0 -0
- /package/src/utils/{auth.js → auth.ts} +0 -0
- /package/src/utils/{time.js → time.ts} +0 -0
|
@@ -0,0 +1,402 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 组件类型定义
|
|
3
|
+
*
|
|
4
|
+
* 本文件包含所有组件的详细类型定义,包括 props、options 和 expose
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
import type { Component, VNode, Ref } from 'vue'
|
|
8
|
+
|
|
9
|
+
// Vue 组件类型声明
|
|
10
|
+
declare module '*.vue' {
|
|
11
|
+
import type { DefineComponent } from 'vue'
|
|
12
|
+
const component: DefineComponent<{}, {}, any>
|
|
13
|
+
export default component
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* 表单选项配置项
|
|
18
|
+
*
|
|
19
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
20
|
+
* |--------|------|------|------|
|
|
21
|
+
* | key | 是 | string \| string[] | 字段标识,支持数组用于日期范围等场景 |
|
|
22
|
+
* | label | 否 | string \| () => string | 字段标签 |
|
|
23
|
+
* | way | 否 | 'input' \| 'select' \| 'date' \| 'time' \| 'dateRange' \| 'dateRangeTime' \| 'textarea' \| 'number' \| 'switch' \| 'radio' \| 'checkbox' \| 'upload' \| 'uploadDragger' \| 'progress' \| 'render' | 表单控件类型,默认为 'input' |
|
|
24
|
+
* | required | 否 | boolean \| (model: any, formOpr: any) => boolean | 是否必填,支持函数动态判断 |
|
|
25
|
+
* | message | 否 | string | 验证失败时的提示信息 |
|
|
26
|
+
* | rule | 否 | object \| (model: any, formOpr: any) => object | 自定义验证规则 |
|
|
27
|
+
* | options | 否 | Array<any> \| (value: any) => Array<any> | 选项列表(用于 select、radio、checkbox) |
|
|
28
|
+
* | enum | 否 | Record<string, any> | 枚举对象,会自动转换为 options |
|
|
29
|
+
* | props | 否 | object \| (value: any, formOpr: any) => object | 传递给表单控件的属性 |
|
|
30
|
+
* | formItemProps | 否 | object \| (value: any, formOpr: any) => object | 传递给 NFormItem 的属性 |
|
|
31
|
+
* | read | 否 | boolean | 是否只读模式 |
|
|
32
|
+
* | readProps | 否 | object | 只读模式下传递给显示组件的属性 |
|
|
33
|
+
* | format | 否 | (value: any, options?: any) => any | 格式化显示值 |
|
|
34
|
+
* | formatTime | 否 | string | 日期时间格式化字符串 |
|
|
35
|
+
* | type | 否 | string | 日期选择器类型(date、datetime、daterange 等) |
|
|
36
|
+
* | loading | 否 | boolean \| Ref<boolean> | 加载状态(用于异步选项) |
|
|
37
|
+
* | permission | 否 | string | 权限标识,需要配合 corePermission 指令使用 |
|
|
38
|
+
* | isRender | 否 | boolean \| (value: any) => boolean | 是否渲染该字段 |
|
|
39
|
+
* | render | 否 | (value: any, index: number, formOpr: any) => VNode | 自定义渲染函数 |
|
|
40
|
+
* | default | 否 | FormOption \| FormOption[] | 默认子项(用于组合表单) |
|
|
41
|
+
* | prefix | 否 | FormOption \| FormOption[] | 前缀子项 |
|
|
42
|
+
* | suffix | 否 | FormOption \| FormOption[] | 后缀子项 |
|
|
43
|
+
* | isWrap | 否 | boolean | 是否换行(用于 NSpace) |
|
|
44
|
+
* | contentProps | 否 | object | 传递给 NSpace 的属性 |
|
|
45
|
+
* | labelField | 否 | string | 选项的标签字段名,默认为 'label' |
|
|
46
|
+
* | valueField | 否 | string | 选项的值字段名,默认为 'id' |
|
|
47
|
+
* | labelSuffix | 否 | string \| () => VNode | 标签后缀图标或组件 |
|
|
48
|
+
* | labelSuffixProps | 否 | object | 标签后缀的属性 |
|
|
49
|
+
* | labelClass | 否 | string | 标签的 CSS 类名 |
|
|
50
|
+
* | noLabel | 否 | boolean | 是否不显示标签 |
|
|
51
|
+
* | queryType | 否 | string | 查询类型(用于 CommonQuery,如 'likeQuery') |
|
|
52
|
+
* | fields | 否 | object | 字段验证规则(用于复杂验证) |
|
|
53
|
+
*/
|
|
54
|
+
export interface FormOption {
|
|
55
|
+
key: string | string[]
|
|
56
|
+
label?: string | (() => string)
|
|
57
|
+
way?: 'input' | 'select' | 'date' | 'time' | 'dateRange' | 'dateRangeTime' | 'textarea' | 'number' | 'switch' | 'radio' | 'checkbox' | 'upload' | 'uploadDragger' | 'progress' | 'render'
|
|
58
|
+
required?: boolean | ((model: any, formOpr: any) => boolean)
|
|
59
|
+
message?: string
|
|
60
|
+
rule?: object | ((model: any, formOpr: any) => object)
|
|
61
|
+
options?: Array<any> | ((value: any) => Array<any>)
|
|
62
|
+
enum?: Record<string, any>
|
|
63
|
+
props?: object | ((value: any, formOpr: { formRef: any; resetForm: () => void; close: () => void; setValue: (val: any) => void }) => object)
|
|
64
|
+
formItemProps?: object | ((value: any, formOpr: any) => object)
|
|
65
|
+
read?: boolean
|
|
66
|
+
readProps?: object
|
|
67
|
+
format?: (value: any, options?: any) => any
|
|
68
|
+
formatTime?: string
|
|
69
|
+
type?: string
|
|
70
|
+
loading?: boolean
|
|
71
|
+
permission?: string
|
|
72
|
+
isRender?: boolean | ((value: any) => boolean)
|
|
73
|
+
render?: (value: any, index: number, formOpr: { setValue: (val: any) => void; value: any }) => VNode
|
|
74
|
+
default?: FormOption | FormOption[]
|
|
75
|
+
prefix?: FormOption | FormOption[]
|
|
76
|
+
suffix?: FormOption | FormOption[]
|
|
77
|
+
isWrap?: boolean
|
|
78
|
+
contentProps?: object
|
|
79
|
+
labelField?: string
|
|
80
|
+
valueField?: string
|
|
81
|
+
labelSuffix?: string | (() => VNode)
|
|
82
|
+
labelSuffixProps?: object
|
|
83
|
+
labelClass?: string
|
|
84
|
+
noLabel?: boolean
|
|
85
|
+
queryType?: string
|
|
86
|
+
fields?: object
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* commonDialogMethod 函数参数
|
|
91
|
+
*
|
|
92
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
93
|
+
* |--------|------|------|------|
|
|
94
|
+
* | title | 否 | string | 弹窗标题 |
|
|
95
|
+
* | noTitle | 否 | boolean | 是否不显示标题,默认 false |
|
|
96
|
+
* | titleFull | 否 | string \| (sub: string) => VNode | 完整标题(会覆盖 title) |
|
|
97
|
+
* | options | 否 | FormOption[] | 表单配置项数组 |
|
|
98
|
+
* | mode | 否 | 'add' \| 'edit' \| 'view' \| 'create' \| 'export' \| 'import' \| 'delete' \| 'copy' \| 'none' | 弹窗模式,默认 'add' |
|
|
99
|
+
* | modeEnum | 否 | Record<string, { sub?: string; read?: boolean }> | 模式枚举配置 |
|
|
100
|
+
* | labelField | 否 | string | 标签字段名,默认 'label' |
|
|
101
|
+
* | isNo | 否 | boolean | 是否不设置最小高度,默认 true |
|
|
102
|
+
* | formProps | 否 | object | 传递给 NForm 的属性 |
|
|
103
|
+
* | interfaceFn | 否 | (data: any, { close, hideLoading }: { close: () => void; hideLoading: () => void }) => Promise<void> \| void | 提交回调函数 |
|
|
104
|
+
* | interfaceFnCancel | 否 | (data: any, { close }: { close: () => void }) => void | 取消回调函数 |
|
|
105
|
+
* | valueData | 否 | object | 初始表单数据 |
|
|
106
|
+
* | read | 否 | boolean | 是否只读模式 |
|
|
107
|
+
* | isRead | 否 | boolean | 是否只读模式(与 read 相同) |
|
|
108
|
+
* | action | 否 | Array<DialogAction> \| ({ formRef, data, d, close }) => VNode | 自定义操作按钮 |
|
|
109
|
+
* | contentStyle | 否 | object | 内容区域样式 |
|
|
110
|
+
* | actionProps | 否 | object | 操作按钮区域属性(NSpace 属性) |
|
|
111
|
+
*/
|
|
112
|
+
export interface CommonDialogOptions {
|
|
113
|
+
title?: string
|
|
114
|
+
noTitle?: boolean
|
|
115
|
+
titleFull?: string | ((sub: string) => VNode)
|
|
116
|
+
options?: FormOption[]
|
|
117
|
+
mode?: 'add' | 'edit' | 'view' | 'create' | 'export' | 'import' | 'delete' | 'copy' | 'none'
|
|
118
|
+
modeEnum?: Record<string, { sub?: string; read?: boolean }>
|
|
119
|
+
labelField?: string
|
|
120
|
+
isNo?: boolean
|
|
121
|
+
formProps?: object
|
|
122
|
+
interfaceFn?: (data: any, helpers: { close: () => void; hideLoading: () => void }) => Promise<void> | void
|
|
123
|
+
interfaceFnCancel?: (data: any, helpers: { close: () => void }) => void
|
|
124
|
+
valueData?: Record<string, any>
|
|
125
|
+
read?: boolean
|
|
126
|
+
isRead?: boolean
|
|
127
|
+
action?: DialogAction[] | ((helpers: { formRef: any; data: any; d: any; close: () => void }) => VNode)
|
|
128
|
+
contentStyle?: Record<string, any>
|
|
129
|
+
actionProps?: Record<string, any>,
|
|
130
|
+
render?: () => VNode
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
/**
|
|
134
|
+
* 弹窗操作按钮配置
|
|
135
|
+
*
|
|
136
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
137
|
+
* |--------|------|------|------|
|
|
138
|
+
* | label | 否 | string | 按钮文本 |
|
|
139
|
+
* | type | 否 | 'default' \| 'primary' \| 'success' \| 'info' \| 'warning' \| 'error' | 按钮类型 |
|
|
140
|
+
* | mode | 否 | 'cancel' | 按钮模式,'cancel' 表示取消按钮 |
|
|
141
|
+
* | valid | 否 | boolean | 是否在点击时验证表单 |
|
|
142
|
+
* | loading | 否 | boolean | 是否显示加载状态 |
|
|
143
|
+
* | onClick | 否 | ({ model, comfirm, cancel, validate, showLoading, hideLoading }) => Promise<void> \| void | 点击回调 |
|
|
144
|
+
* | props | 否 | object | 传递给 NButton 的属性 |
|
|
145
|
+
* | style | 否 | object | 按钮样式 |
|
|
146
|
+
* | render | 否 | () => VNode | 自定义渲染函数 |
|
|
147
|
+
*/
|
|
148
|
+
export interface DialogAction {
|
|
149
|
+
label?: string
|
|
150
|
+
type?: 'default' | 'primary' | 'success' | 'info' | 'warning' | 'error'
|
|
151
|
+
mode?: 'cancel'
|
|
152
|
+
valid?: boolean
|
|
153
|
+
loading?: boolean
|
|
154
|
+
onClick?: (helpers: {
|
|
155
|
+
model: any
|
|
156
|
+
comfirm: (fn?: () => any) => Promise<any>
|
|
157
|
+
cancel: () => void
|
|
158
|
+
validate: (arr?: string[]) => Promise<void>
|
|
159
|
+
showLoading: () => void
|
|
160
|
+
hideLoading: () => void
|
|
161
|
+
}) => Promise<void> | void
|
|
162
|
+
props?: Record<string, any>
|
|
163
|
+
style?: Record<string, any>
|
|
164
|
+
render?: () => VNode
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
/**
|
|
168
|
+
* DataForm 组件 Props
|
|
169
|
+
*
|
|
170
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
171
|
+
* |--------|------|------|------|
|
|
172
|
+
* | value / v-model:value | 否 | object | 表单数据对象 |
|
|
173
|
+
* | options | 否 | FormOption[] | 表单配置项数组 |
|
|
174
|
+
* | isNo | 否 | boolean | 是否不设置最小高度,默认 true |
|
|
175
|
+
* | read | 否 | boolean | 是否只读模式,默认 false |
|
|
176
|
+
* | labelField | 否 | string | 标签字段名,默认 'label' |
|
|
177
|
+
* | contentStyle | 否 | object | 内容区域样式 |
|
|
178
|
+
* | rules | 否 | object | 自定义验证规则(会覆盖自动生成的规则) |
|
|
179
|
+
* | formProps | 否 | object | 传递给 NForm 的属性 |
|
|
180
|
+
* | formItemProps | 否 | object | 传递给所有 NFormItem 的属性 |
|
|
181
|
+
* | dialog | 否 | boolean | 是否在弹窗中使用,默认 false |
|
|
182
|
+
*/
|
|
183
|
+
export interface DataFormProps {
|
|
184
|
+
value?: Record<string, any>
|
|
185
|
+
options?: FormOption[]
|
|
186
|
+
isNo?: boolean
|
|
187
|
+
read?: boolean
|
|
188
|
+
labelField?: string
|
|
189
|
+
contentStyle?: Record<string, any>
|
|
190
|
+
rules?: Record<string, any>
|
|
191
|
+
formProps?: Record<string, any>
|
|
192
|
+
formItemProps?: Record<string, any>
|
|
193
|
+
dialog?: boolean
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
/**
|
|
197
|
+
* DataForm 组件 Expose
|
|
198
|
+
*
|
|
199
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
200
|
+
* |--------|------|------|------|
|
|
201
|
+
* | formRef | 是 | Ref<any> | NForm 组件实例引用 |
|
|
202
|
+
* | getRule | 是 | () => object | 获取当前验证规则 |
|
|
203
|
+
* | valid | 是 | (keyCode?: string[]) => Promise<void> | 验证表单,keyCode 为需要验证的字段 key 数组 |
|
|
204
|
+
* | confirm | 是 | (fn?: (model: any) => void) => Promise<any> | 验证并确认,返回表单数据 |
|
|
205
|
+
*/
|
|
206
|
+
export interface DataFormExpose {
|
|
207
|
+
formRef: any
|
|
208
|
+
getRule: () => Record<string, any>
|
|
209
|
+
valid: (keyCode?: string[]) => Promise<void>
|
|
210
|
+
confirm: (fn?: (model: any) => void) => Promise<any>
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
/**
|
|
214
|
+
* CommonQuery 组件 Props
|
|
215
|
+
*
|
|
216
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
217
|
+
* |--------|------|------|------|
|
|
218
|
+
* | query / v-model:query | 否 | object | 查询条件对象 |
|
|
219
|
+
* | options | 否 | FormOption[] | 查询字段配置项数组 |
|
|
220
|
+
* | inlineText | 否 | boolean | 是否内联文本,默认 true |
|
|
221
|
+
* | selectCount | 否 | number | 每行显示的字段数量,默认 1 |
|
|
222
|
+
* | type | 否 | 'default' \| 'primary' \| 'success' \| 'info' \| 'warning' \| 'error' | 按钮类型,默认 'primary' |
|
|
223
|
+
* | noButton | 否 | boolean | 是否不显示按钮,默认 false |
|
|
224
|
+
* | isRead | 否 | boolean | 是否只读模式,默认 false |
|
|
225
|
+
* | btn | 否 | Array<'reset' \| 'search' \| string> | 按钮配置,默认 ['reset', 'search'] |
|
|
226
|
+
* | size | 否 | 'small' \| 'medium' \| 'large' | 表单控件尺寸,默认 'medium' |
|
|
227
|
+
*/
|
|
228
|
+
export interface CommonQueryProps {
|
|
229
|
+
query?: Record<string, any>
|
|
230
|
+
options?: FormOption[]
|
|
231
|
+
inlineText?: boolean
|
|
232
|
+
selectCount?: number
|
|
233
|
+
type?: 'default' | 'primary' | 'success' | 'info' | 'warning' | 'error'
|
|
234
|
+
noButton?: boolean
|
|
235
|
+
isRead?: boolean
|
|
236
|
+
btn?: Array<'reset' | 'search' | string>
|
|
237
|
+
size?: 'small' | 'medium' | 'large'
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
/**
|
|
241
|
+
* CommonQuery 组件 Events
|
|
242
|
+
*
|
|
243
|
+
* | 事件名 | 参数 | 说明 |
|
|
244
|
+
* |--------|------|------|
|
|
245
|
+
* | update:query | (query: object) => void | 查询条件更新事件 |
|
|
246
|
+
* | submit | () => void | 提交事件 |
|
|
247
|
+
* | reset | () => void | 重置事件 |
|
|
248
|
+
*/
|
|
249
|
+
export interface CommonQueryEmits {
|
|
250
|
+
'update:query': [query: Record<string, any>]
|
|
251
|
+
submit: []
|
|
252
|
+
reset: []
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
/**
|
|
256
|
+
* DataTable 组件 Props
|
|
257
|
+
*
|
|
258
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
259
|
+
* |--------|------|------|------|
|
|
260
|
+
* | data | 否 | Array<any> | 表格数据数组 |
|
|
261
|
+
* | pagination | 否 | object \| null | 分页配置对象 |
|
|
262
|
+
* | columns | 否 | Array<TableColumn> | 表格列配置数组 |
|
|
263
|
+
* | oprColumns | 否 | object \| null | 操作列配置 |
|
|
264
|
+
* | selectColumns | 否 | object \| null | 选择列配置 |
|
|
265
|
+
* | defaultColumns | 否 | Array<string> | 默认显示的列 key 数组 |
|
|
266
|
+
* | summaryColumns | 否 | (pageData: Array<any>) => Record<string, { value: any }> \| null | 汇总列配置函数 |
|
|
267
|
+
* | emptyText | 否 | string | 空数据提示文本,默认 '没有数据' |
|
|
268
|
+
* | emptyIcon | 否 | string | 空数据图标,默认 '' |
|
|
269
|
+
* | isFilter | 否 | boolean | 是否显示筛选按钮,默认 false |
|
|
270
|
+
* | isEllipsis | 否 | boolean | 是否启用文本省略,默认 true |
|
|
271
|
+
* | virtual | 否 | object \| boolean | 虚拟滚动配置,默认根据数据量自动判断 |
|
|
272
|
+
* | singleColumn | 否 | boolean | 是否单列模式,默认 false |
|
|
273
|
+
*/
|
|
274
|
+
export interface DataTableProps {
|
|
275
|
+
data?: Array<any>
|
|
276
|
+
pagination?: DataTablePagination | null
|
|
277
|
+
columns?: TableColumn[]
|
|
278
|
+
oprColumns?: TableColumn | null
|
|
279
|
+
selectColumns?: TableColumn | null
|
|
280
|
+
defaultColumns?: string[]
|
|
281
|
+
summaryColumns?: (pageData: Array<any>) => Record<string, { value: any }> | null
|
|
282
|
+
emptyText?: string
|
|
283
|
+
emptyIcon?: string
|
|
284
|
+
isFilter?: boolean
|
|
285
|
+
isEllipsis?: boolean
|
|
286
|
+
virtual?: object | boolean
|
|
287
|
+
singleColumn?: boolean
|
|
288
|
+
}
|
|
289
|
+
|
|
290
|
+
/**
|
|
291
|
+
* 表格列配置
|
|
292
|
+
*
|
|
293
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
294
|
+
* |--------|------|------|------|
|
|
295
|
+
* | key | 否 | string | 列标识 |
|
|
296
|
+
* | title / label | 否 | string \| () => VNode | 列标题 |
|
|
297
|
+
* | width | 否 | number \| string | 列宽度 |
|
|
298
|
+
* | align | 否 | 'left' \| 'center' \| 'right' | 对齐方式,默认 'center' |
|
|
299
|
+
* | ellipsis | 否 | boolean \| object | 文本省略配置 |
|
|
300
|
+
* | ellipsisProp | 否 | (ellipsis: any) => object | 自定义省略配置函数 |
|
|
301
|
+
* | sorter | 否 | object \| (listQuery: any, pageState: any, key: string) => void | 排序配置 |
|
|
302
|
+
* | display | 否 | boolean | 是否显示该列,默认 true |
|
|
303
|
+
* | render | 否 | (row: any, index: number) => VNode | 自定义渲染函数 |
|
|
304
|
+
*/
|
|
305
|
+
export interface TableColumn {
|
|
306
|
+
key?: string
|
|
307
|
+
title?: string | (() => VNode)
|
|
308
|
+
label?: string | (() => VNode)
|
|
309
|
+
width?: number | string
|
|
310
|
+
align?: 'left' | 'center' | 'right'
|
|
311
|
+
ellipsis?: boolean | object
|
|
312
|
+
ellipsisProp?: (ellipsis: any) => object
|
|
313
|
+
sorter?: object | ((listQuery: any, pageState: any, key: string) => void)
|
|
314
|
+
display?: boolean
|
|
315
|
+
render?: (row: any, index: number) => VNode
|
|
316
|
+
[key: string]: any
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
/**
|
|
320
|
+
* 分页配置
|
|
321
|
+
*
|
|
322
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
323
|
+
* |--------|------|------|------|
|
|
324
|
+
* | page | 是 | number | 当前页码 |
|
|
325
|
+
* | pageSize | 是 | number | 每页条数 |
|
|
326
|
+
* | itemCount | 是 | number | 总条数 |
|
|
327
|
+
* | showSizePicker | 否 | boolean | 是否显示每页条数选择器 |
|
|
328
|
+
* | pageSizes | 否 | number[] | 每页条数选项数组 |
|
|
329
|
+
* | onUpdatePage | 否 | (page: number) => void | 页码更新回调 |
|
|
330
|
+
* | onUpdatePageSize | 否 | (pageSize: number) => void | 每页条数更新回调 |
|
|
331
|
+
*/
|
|
332
|
+
export interface DataTablePagination {
|
|
333
|
+
page: number
|
|
334
|
+
pageSize: number
|
|
335
|
+
itemCount: number
|
|
336
|
+
showSizePicker?: boolean
|
|
337
|
+
pageSizes?: number[]
|
|
338
|
+
onUpdatePage?: (page: number) => void
|
|
339
|
+
onUpdatePageSize?: (pageSize: number) => void
|
|
340
|
+
[key: string]: any
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
/**
|
|
344
|
+
* DataTable 组件 Expose
|
|
345
|
+
*
|
|
346
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
347
|
+
* |--------|------|------|------|
|
|
348
|
+
* | filterHandle | 是 | () => void | 打开筛选弹窗 |
|
|
349
|
+
* | filterButton | 是 | () => VNode | 获取筛选按钮组件 |
|
|
350
|
+
* | initColumns | 是 | () => void | 初始化列配置 |
|
|
351
|
+
*/
|
|
352
|
+
export interface DataTableExpose {
|
|
353
|
+
filterHandle: () => void
|
|
354
|
+
filterButton: () => VNode
|
|
355
|
+
initColumns: () => void
|
|
356
|
+
}
|
|
357
|
+
|
|
358
|
+
/**
|
|
359
|
+
* createActionColumnJsx 函数参数
|
|
360
|
+
*
|
|
361
|
+
* | 参数位置 | 必填 | 类型 | 说明 |
|
|
362
|
+
* |----------|------|------|------|
|
|
363
|
+
* | defaultOption | 是 | Array<ActionOption> | 操作按钮配置数组 |
|
|
364
|
+
* | oprParams | 否 | object | 操作列额外参数(会合并到列配置) |
|
|
365
|
+
* | collectParams | 否 | boolean \| { max: number; width: number } | 是否收集操作按钮(超过 max 个时收起),默认 false |
|
|
366
|
+
*/
|
|
367
|
+
export interface ActionOption {
|
|
368
|
+
label: string | ((row: any) => string)
|
|
369
|
+
type?: 'default' | 'primary' | 'success' | 'info' | 'warning' | 'error'
|
|
370
|
+
mode?: 'pop'
|
|
371
|
+
disabled?: boolean | ((row: any) => boolean)
|
|
372
|
+
onClick?: (row: any) => void | Promise<void>
|
|
373
|
+
isRender?: (row: any) => boolean
|
|
374
|
+
permission?: string
|
|
375
|
+
loading?: boolean
|
|
376
|
+
[key: string]: any
|
|
377
|
+
}
|
|
378
|
+
|
|
379
|
+
/**
|
|
380
|
+
* Options 组件 Props(内部组件)
|
|
381
|
+
*
|
|
382
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
383
|
+
* |--------|------|------|------|
|
|
384
|
+
* | option | 否 | FormOption[] | 表单配置项数组 |
|
|
385
|
+
* | value | 否 | object | 表单数据对象 |
|
|
386
|
+
* | read | 否 | boolean | 是否只读模式 |
|
|
387
|
+
* | labelField | 否 | string | 标签字段名 |
|
|
388
|
+
* | valueField | 否 | string | 值字段名 |
|
|
389
|
+
* | style | 否 | object | 样式对象 |
|
|
390
|
+
* | formRef | 否 | object | 表单引用 |
|
|
391
|
+
* | formProps | 否 | object | 表单属性 |
|
|
392
|
+
*/
|
|
393
|
+
export interface OptionsProps {
|
|
394
|
+
option?: FormOption[]
|
|
395
|
+
value?: Record<string, any>
|
|
396
|
+
read?: boolean
|
|
397
|
+
labelField?: string
|
|
398
|
+
valueField?: string
|
|
399
|
+
style?: Record<string, any>
|
|
400
|
+
formRef?: any
|
|
401
|
+
formProps?: Record<string, any>
|
|
402
|
+
}
|
package/types/index.d.ts
CHANGED
|
@@ -1,5 +1,30 @@
|
|
|
1
1
|
import type { Component } from 'vue'
|
|
2
|
+
import type {
|
|
3
|
+
CommonDialogOptions,
|
|
4
|
+
DialogAction,
|
|
5
|
+
DataFormProps,
|
|
6
|
+
DataFormExpose,
|
|
7
|
+
CommonQueryProps,
|
|
8
|
+
CommonQueryEmits,
|
|
9
|
+
DataTableProps,
|
|
10
|
+
DataTableExpose,
|
|
11
|
+
TableColumn,
|
|
12
|
+
DataTablePagination,
|
|
13
|
+
FormOption,
|
|
14
|
+
ActionOption,
|
|
15
|
+
OptionsProps,
|
|
16
|
+
} from './components'
|
|
2
17
|
|
|
18
|
+
/**
|
|
19
|
+
* commonDialogMethod 返回值
|
|
20
|
+
*
|
|
21
|
+
* | 字段名 | 必填 | 类型 | 说明 |
|
|
22
|
+
* |--------|------|------|------|
|
|
23
|
+
* | cancel | 是 | () => void | 关闭弹窗方法 |
|
|
24
|
+
* | setValue | 是 | (v: any, key?: string) => void | 设置表单值方法 |
|
|
25
|
+
* | model | 是 | any | 表单数据对象(响应式) |
|
|
26
|
+
* | modeEnum | 是 | Record<string, { sub?: string; read?: boolean }> | 模式枚举对象 |
|
|
27
|
+
*/
|
|
3
28
|
export interface CommonDialogResult {
|
|
4
29
|
cancel(): void
|
|
5
30
|
setValue(v: any, key?: string): void
|
|
@@ -7,21 +32,130 @@ export interface CommonDialogResult {
|
|
|
7
32
|
modeEnum: Record<string, { sub?: string; read?: boolean }>
|
|
8
33
|
}
|
|
9
34
|
|
|
35
|
+
/**
|
|
36
|
+
* 通用弹窗方法
|
|
37
|
+
*
|
|
38
|
+
* @param options - 弹窗配置选项,详见 CommonDialogOptions
|
|
39
|
+
* @param dialogProps - 传递给 NDialog 的属性
|
|
40
|
+
* @returns CommonDialogResult 弹窗控制对象
|
|
41
|
+
*
|
|
42
|
+
* @example
|
|
43
|
+
* ```typescript
|
|
44
|
+
* const { cancel, setValue, model } = commonDialogMethod({
|
|
45
|
+
* title: '编辑',
|
|
46
|
+
* mode: 'edit',
|
|
47
|
+
* options: [
|
|
48
|
+
* { key: 'name', label: '名称', way: 'input', required: true },
|
|
49
|
+
* { key: 'type', label: '类型', way: 'select', options: [...] }
|
|
50
|
+
* ],
|
|
51
|
+
* valueData: { name: 'test', type: 'A' },
|
|
52
|
+
* interfaceFn: async (data, { close }) => {
|
|
53
|
+
* await saveData(data)
|
|
54
|
+
* close()
|
|
55
|
+
* }
|
|
56
|
+
* })
|
|
57
|
+
* ```
|
|
58
|
+
*/
|
|
10
59
|
export function commonDialogMethod(
|
|
11
|
-
options?:
|
|
60
|
+
options?: CommonDialogOptions,
|
|
12
61
|
dialogProps?: Record<string, any>,
|
|
13
62
|
): CommonDialogResult
|
|
14
63
|
|
|
15
|
-
|
|
16
|
-
export
|
|
17
|
-
|
|
18
|
-
|
|
64
|
+
// 导出类型定义
|
|
65
|
+
export type {
|
|
66
|
+
CommonDialogOptions,
|
|
67
|
+
DialogAction,
|
|
68
|
+
FormOption,
|
|
69
|
+
DataFormProps,
|
|
70
|
+
DataFormExpose,
|
|
71
|
+
CommonQueryProps,
|
|
72
|
+
CommonQueryEmits,
|
|
73
|
+
DataTableProps,
|
|
74
|
+
DataTableExpose,
|
|
75
|
+
TableColumn,
|
|
76
|
+
DataTablePagination,
|
|
77
|
+
ActionOption,
|
|
78
|
+
OptionsProps,
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
/**
|
|
82
|
+
* DataForm 组件
|
|
83
|
+
*
|
|
84
|
+
* Props 详见 DataFormProps
|
|
85
|
+
* Expose 详见 DataFormExpose
|
|
86
|
+
*/
|
|
87
|
+
export const DataForm: Component<DataFormProps>
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* Options 组件(内部组件)
|
|
91
|
+
*
|
|
92
|
+
* Props 详见 OptionsProps
|
|
93
|
+
*/
|
|
94
|
+
export const Options: Component<OptionsProps>
|
|
95
|
+
|
|
96
|
+
/**
|
|
97
|
+
* CommonQuery 组件
|
|
98
|
+
*
|
|
99
|
+
* Props 详见 CommonQueryProps
|
|
100
|
+
* Events 详见 CommonQueryEmits
|
|
101
|
+
*/
|
|
102
|
+
export const CommonQuery: Component<CommonQueryProps>
|
|
103
|
+
|
|
104
|
+
/**
|
|
105
|
+
* DataTable 组件
|
|
106
|
+
*
|
|
107
|
+
* Props 详见 DataTableProps
|
|
108
|
+
* Expose 详见 DataTableExpose
|
|
109
|
+
*/
|
|
110
|
+
export const DataTable: Component<DataTableProps>
|
|
111
|
+
|
|
19
112
|
export const OprButton: Component
|
|
20
113
|
export const Pop: Component
|
|
21
114
|
|
|
22
|
-
|
|
115
|
+
/**
|
|
116
|
+
* 创建操作列
|
|
117
|
+
*
|
|
118
|
+
* @param defaultOption - 操作按钮配置数组,详见 ActionOption
|
|
119
|
+
* @param oprParams - 操作列额外参数
|
|
120
|
+
* @param collectParams - 是否收集操作按钮(超过 max 个时收起)
|
|
121
|
+
* @returns TableColumn 表格列配置对象
|
|
122
|
+
*
|
|
123
|
+
* @example
|
|
124
|
+
* ```typescript
|
|
125
|
+
* const opr = createActionColumnJsx([
|
|
126
|
+
* {
|
|
127
|
+
* label: '编辑',
|
|
128
|
+
* type: 'primary',
|
|
129
|
+
* onClick: (row) => onEdit(row)
|
|
130
|
+
* },
|
|
131
|
+
* {
|
|
132
|
+
* label: '删除',
|
|
133
|
+
* type: 'error',
|
|
134
|
+
* mode: 'pop',
|
|
135
|
+
* onClick: (row) => onDelete(row)
|
|
136
|
+
* }
|
|
137
|
+
* ])
|
|
138
|
+
* ```
|
|
139
|
+
*/
|
|
140
|
+
export function createActionColumnJsx(
|
|
141
|
+
defaultOption: ActionOption[],
|
|
142
|
+
oprParams?: Record<string, any>,
|
|
143
|
+
collectParams?: boolean | { max: number; width: number }
|
|
144
|
+
): TableColumn | undefined
|
|
145
|
+
/**
|
|
146
|
+
* 初始化表单验证规则
|
|
147
|
+
*
|
|
148
|
+
* | 参数名 | 必填 | 类型 | 说明 |
|
|
149
|
+
* |--------|------|------|------|
|
|
150
|
+
* | options | 否 | FormOption[] | 表单配置项数组 |
|
|
151
|
+
* | model | 否 | any | 表单数据对象 |
|
|
152
|
+
* | labelField | 否 | string | 标签字段名,默认 'label' |
|
|
153
|
+
* | formOpr | 否 | Record<string, any> | 表单操作对象 |
|
|
154
|
+
*
|
|
155
|
+
* @returns ComputedRef<Record<string, any>> 验证规则对象
|
|
156
|
+
*/
|
|
23
157
|
export function initRules(args: {
|
|
24
|
-
options?:
|
|
158
|
+
options?: FormOption[]
|
|
25
159
|
model?: any
|
|
26
160
|
labelField?: string
|
|
27
161
|
formOpr?: Record<string, any>
|
|
@@ -65,3 +199,7 @@ declare module 'core/*' {
|
|
|
65
199
|
export = mod
|
|
66
200
|
}
|
|
67
201
|
|
|
202
|
+
// 引用类型声明文件
|
|
203
|
+
/// <reference path="./components.d.ts" />
|
|
204
|
+
/// <reference path="./src.d.ts" />
|
|
205
|
+
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 初始化路由元数据
|
|
3
|
+
*
|
|
4
|
+
* @param routes - 路由配置数组
|
|
5
|
+
* @param str - 基础路径字符串,默认为空字符串
|
|
6
|
+
* @returns 处理后的路由配置数组
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* ```typescript
|
|
10
|
+
* const routes = [
|
|
11
|
+
* {
|
|
12
|
+
* path: '/user',
|
|
13
|
+
* title: '用户管理',
|
|
14
|
+
* children: [
|
|
15
|
+
* { path: 'list', title: '用户列表' }
|
|
16
|
+
* ]
|
|
17
|
+
* }
|
|
18
|
+
* ]
|
|
19
|
+
* const processedRoutes = initRouteMeta(routes)
|
|
20
|
+
* ```
|
|
21
|
+
*/
|
|
22
|
+
export function initRouteMeta(routes: any[], str?: string): any[]
|
|
23
|
+
|
package/types/src.d.ts
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @/ 路径别名类型声明
|
|
3
|
+
*
|
|
4
|
+
* 此文件为 @xmszm/core 包中使用的 @/ 路径别名提供 TypeScript 类型支持
|
|
5
|
+
* 使用方项目需要提供对应的实现文件
|
|
6
|
+
*
|
|
7
|
+
* @see LOCAL_DEPENDENCIES.md 了解详细的使用说明
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* @/utils/permission 模块类型声明
|
|
12
|
+
*
|
|
13
|
+
* 权限检查函数模块
|
|
14
|
+
* 使用方需要在项目的 src/utils/permission.js 或 src/utils/permission.ts 中实现
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* // src/utils/permission.ts
|
|
18
|
+
* export function hasPermission(permission: string): boolean {
|
|
19
|
+
* const permissions = getPermissions() // 你的权限获取逻辑
|
|
20
|
+
* return permissions.includes(permission)
|
|
21
|
+
* }
|
|
22
|
+
*/
|
|
23
|
+
declare module '@/utils/permission' {
|
|
24
|
+
/**
|
|
25
|
+
* 权限检查函数
|
|
26
|
+
* @param permission - 权限标识字符串
|
|
27
|
+
* @returns 是否拥有该权限
|
|
28
|
+
*/
|
|
29
|
+
export function hasPermission(permission: string): boolean
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* @/utils/request 模块类型声明
|
|
34
|
+
*
|
|
35
|
+
* 请求配置模块
|
|
36
|
+
* 使用方需要在项目的 src/utils/request.js 或 src/utils/request.ts 中实现
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* // src/utils/request.ts
|
|
40
|
+
* export const BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:3000'
|
|
41
|
+
*/
|
|
42
|
+
declare module '@/utils/request' {
|
|
43
|
+
/**
|
|
44
|
+
* API 基础地址
|
|
45
|
+
* 用于构建完整的请求 URL
|
|
46
|
+
*/
|
|
47
|
+
export const BASE_URL: string
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
// 声明全局 $dialog(如果存在)
|
|
51
|
+
// 外部可以通过 window.$dialog 或直接 $dialog 注入 dialog 实例
|
|
52
|
+
declare global {
|
|
53
|
+
// eslint-disable-next-line no-var
|
|
54
|
+
var $dialog: import('naive-ui').DialogApi | undefined
|
|
55
|
+
}
|