element-plus-suite 0.0.5 → 0.0.7

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 CHANGED
@@ -1,214 +1,87 @@
1
- # Element Plus Suite
2
-
3
- Element Plus Suite 是基于 Element Plus 二次封装的组件库,开箱即用。可以显著地提升制作 CRUD 页面的效率,轻松搬砖。
4
-
5
- [文档](https://th74100.github.io/element-plus-suite/) · [GitHub](https://github.com/th74100/element-plus-suite)
6
-
7
- ## 特性
8
-
9
- - **🚀 高效开发**:提供常用业务组件,减少重复代码
10
- - **🎯 灵活配置**:支持 JSON 配置式和模板式,满足不同场景需求
11
- - **💪 TypeScript**:提供完整的类型定义,更好的开发体验
12
- - **🔥 Element Plus**:基于 Element Plus,支持主题定制
13
-
14
- ## 环境要求
15
-
16
- - Vue 3.2 或更高版本
17
- - Element Plus 2.0 或更高版本
18
- - 支持 ESM 的现代构建工具
19
-
20
- ## 安装
21
-
22
- ```bash
23
- npm install element-plus-suite
24
- ```
25
-
26
- ## 注册组件
27
-
28
- 如果项目已经全局注册 Element Plus,可以直接注册组件库:
29
-
30
- ```ts
31
- import { createApp } from 'vue'
32
- import ElementPlusSuite from 'element-plus-suite'
33
- import App from './App.vue'
34
-
35
- const app = createApp(App)
36
-
37
- app.use(ElementPlusSuite)
38
- app.mount('#app')
39
- ```
40
-
41
- 如果需要一起注册 Element Plus:
42
-
43
- ```ts
44
- import { createApp } from 'vue'
45
- import ElementPlus from 'element-plus'
46
- import 'element-plus/dist/index.css'
47
- import ElementPlusSuite from 'element-plus-suite'
48
- import 'element-plus-suite/dist/index.css'
49
- import App from './App.vue'
50
-
51
- const app = createApp(App)
52
-
53
- app.use(ElementPlus)
54
- app.use(ElementPlusSuite)
55
- app.mount('#app')
56
- ```
57
-
58
- 也可以按需导入:
59
-
60
- ```ts
61
- import { ElTablePro } from 'element-plus-suite'
62
- ```
63
-
64
- ## 快速开始
65
-
66
- ```vue
67
- <script setup lang="ts">
68
- import { ElTablePro, type TableProColumn } from 'element-plus-suite'
69
-
70
- interface User {
71
- id: number
72
- name: string
73
- email: string
74
- }
75
-
76
- const columns: TableProColumn<User>[] = [
77
- { prop: 'name', label: '姓名', minWidth: 140 },
78
- { prop: 'email', label: '邮箱', minWidth: 220 },
79
- ]
80
-
81
- const dataSource: User[] = [
82
- { id: 1, name: '林晓', email: 'linxiao@example.com' },
83
- { id: 2, name: '陈默', email: 'chenmo@example.com' },
84
- ]
85
- </script>
86
-
87
- <template>
88
- <ElTablePro
89
- :columns="columns"
90
- :data="dataSource"
91
- row-key="id"
92
- :pagination="false"
93
- />
94
- </template>
95
- ```
96
-
97
- ## 远程数据
98
-
99
- 将 `data` 换成 `request` 即可接入远程数据。`request` 接收当前分页参数和取消信号,并返回统一的数据结构:
100
-
101
- ```ts
102
- import type { TableProRequest } from 'element-plus-suite'
103
-
104
- const requestUsers: TableProRequest<User> = async ({
105
- page,
106
- pageSize,
107
- signal,
108
- }) => {
109
- const params = new URLSearchParams({
110
- page: String(page ?? 1),
111
- pageSize: String(pageSize ?? 20),
112
- })
113
- const response = await fetch(`/api/users?${params}`, { signal })
114
- const payload = await response.json()
115
-
116
- return {
117
- data: payload.list,
118
- total: payload.total,
119
- }
120
- }
121
- ```
122
-
123
- 接口的原始返回结构在 `request` 内部适配即可,组件只接收 `data` 和 `total`。
124
-
125
- 更多用法请查看[文档](https://th74100.github.io/element-plus-suite/)。
126
-
127
- ## License
128
-
1
+ # Element Plus Suite
2
+
3
+ Element Plus Suite 是基于 Element Plus 二次封装的组件库,开箱即用。可以显著地提升制作 CRUD 页面的效率,轻松搬砖。
4
+
5
+ [文档](https://th74100.github.io/element-plus-suite/) · [GitHub](https://github.com/th74100/element-plus-suite)
6
+
7
+ ## 特性
8
+
9
+ - **🚀 高效开发**:提供常用业务组件,减少重复代码
10
+ - **🎯 灵活配置**:支持 JSON 配置式和模板式,满足不同场景需求
11
+ - **💪 TypeScript**:提供完整的类型定义,更好的开发体验
12
+ - **🔥 Element Plus**:基于 Element Plus,支持主题定制
13
+
14
+ ## 环境要求
15
+
16
+ - Vue 3.2 或更高版本
17
+ - Element Plus 2.0 或更高版本
18
+ - 支持 ESM 的现代构建工具
19
+
20
+ ## 安装
21
+
22
+ ```bash
23
+ npm install element-plus-suite
24
+ ```
25
+
26
+ ## 注册组件
27
+
28
+ 如果项目已经全局注册 Element Plus,可以直接注册组件库:
29
+
30
+ ```ts
31
+ import { createApp } from 'vue'
32
+ import ElementPlusSuite from 'element-plus-suite'
33
+ import 'element-plus-suite/dist/index.css'
34
+ import App from './App.vue'
35
+
36
+ const app = createApp(App)
37
+
38
+ app.use(ElementPlusSuite)
39
+ app.mount('#app')
40
+ ```
41
+
42
+ 如果需要一起注册 Element Plus:
43
+
44
+ ```ts
45
+ import { createApp } from 'vue'
46
+ import ElementPlus from 'element-plus'
47
+ import 'element-plus/dist/index.css'
48
+ import ElementPlusSuite from 'element-plus-suite'
49
+ import 'element-plus-suite/dist/index.css'
50
+ import App from './App.vue'
51
+
52
+ const app = createApp(App)
53
+
54
+ app.use(ElementPlus)
55
+ app.use(ElementPlusSuite)
56
+ app.mount('#app')
57
+ ```
58
+
59
+ 也可以按需导入:
60
+
61
+ ```ts
62
+ import { ElButtonPro, ElTablePro } from 'element-plus-suite'
63
+ ```
64
+
65
+ ## ElButtonPro
66
+
67
+ `ElButtonPro` 在 Element Plus Button 基础上增加整行按钮、渐变背景和鼠标经过渐变能力:
68
+
69
+ ```vue
70
+ <template>
71
+ <ElButtonPro type="primary" block>提交</ElButtonPro>
72
+
73
+ <ElButtonPro
74
+ type="primary"
75
+ gradient="linear-gradient(135deg, #6253e1, #04befe)"
76
+ hover-gradient="linear-gradient(135deg, #06b6d4, #7c3aed)"
77
+ >
78
+ 渐变按钮
79
+ </ElButtonPro>
80
+ </template>
81
+ ```
82
+
83
+ 更多用法请查看[文档](https://th74100.github.io/element-plus-suite/components/button-pro/)
84
+
85
+ ## License
86
+
129
87
  MIT
130
- ## ElFormPro
131
-
132
- `ElFormPro` 是基于 schema 的 Element Plus 表单组件:
133
-
134
- ```vue
135
- <script setup lang="ts">
136
- import { ref } from 'vue'
137
- import { ElFormPro, type FormProSchemaItem } from 'element-plus-suite'
138
-
139
- const formData = ref({
140
- keyword: '',
141
- status: '',
142
- })
143
-
144
- const schema: FormProSchemaItem[] = [
145
- { key: 'keyword', label: '关键词', type: 'input', col: { span: 8 } },
146
- {
147
- key: 'status',
148
- label: '状态',
149
- type: 'select',
150
- col: { span: 8 },
151
- fieldProps: {
152
- options: [
153
- { name: '启用', id: 'active' },
154
- { name: '停用', id: 'disabled' },
155
- ],
156
- props: {
157
- label: 'name',
158
- value: 'id',
159
- },
160
- },
161
- },
162
- ]
163
- </script>
164
-
165
- <template>
166
- <ElFormPro v-model="formData" :schema="schema" />
167
- </template>
168
- ```
169
-
170
- ## 高级筛选
171
-
172
- `ElTablePro` 可以通过 `filter` 组合 `ElFormPro`:
173
-
174
- ```vue
175
- <ElTablePro
176
- :columns="columns"
177
- :request="requestUsers"
178
- :filter="{
179
- schema: filterSchema,
180
- model: filters,
181
- formConfig: {
182
- showCollapseButton: true,
183
- collapseRows: 1,
184
- },
185
- }"
186
- row-key="id"
187
- />
188
- ```
189
-
190
- 筛选草稿与已应用条件分离。点击查询后才应用条件并回到第一页;切换分页时继续使用已应用条件。
191
-
192
- `request` 会收到统一参数:
193
-
194
- ```ts
195
- const requestUsers: TableProRequest<User, UserQuery> = async ({
196
- page,
197
- pageSize,
198
- query,
199
- signal,
200
- }) => {
201
- const params = new URLSearchParams({
202
- page: String(page ?? 1),
203
- pageSize: String(pageSize ?? 20),
204
- keyword: query.keyword,
205
- })
206
- const response = await fetch(`/api/users?${params}`, { signal })
207
- const payload = await response.json()
208
-
209
- return {
210
- data: payload.list,
211
- total: payload.total,
212
- }
213
- }
214
- ```
@@ -0,0 +1,2 @@
1
+ export { default as ElButtonPro } from './index.vue';
2
+ export type { ButtonProGradient, ButtonProGradientValue, ButtonProIconPlacement, ButtonProInstance, ButtonProOwnProps, ButtonProProps, } from './types';
@@ -0,0 +1,119 @@
1
+ import { PropType } from 'vue';
2
+ import { ButtonProGradientValue, ButtonProIconPlacement } from './types';
3
+ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
4
+ block: {
5
+ type: BooleanConstructor;
6
+ default: boolean;
7
+ };
8
+ iconPlacement: {
9
+ type: PropType<ButtonProIconPlacement>;
10
+ default: string;
11
+ };
12
+ gradient: {
13
+ type: PropType<ButtonProGradientValue>;
14
+ default: undefined;
15
+ };
16
+ hoverGradient: {
17
+ type: PropType<ButtonProGradientValue>;
18
+ default: undefined;
19
+ };
20
+ size: {
21
+ readonly type: PropType<import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
22
+ readonly required: false;
23
+ readonly validator: ((val: unknown) => boolean) | undefined;
24
+ __epPropKey: true;
25
+ };
26
+ disabled: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
27
+ type: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<StringConstructor, "" | "default" | "text" | "info" | "primary" | "success" | "warning" | "danger", unknown, "", boolean>;
28
+ icon: {
29
+ readonly type: PropType<import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | (((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component)) | null)[], unknown, unknown>>;
30
+ readonly required: false;
31
+ readonly validator: ((val: unknown) => boolean) | undefined;
32
+ __epPropKey: true;
33
+ };
34
+ nativeType: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<StringConstructor, "button" | "reset" | "submit", unknown, "button", boolean>;
35
+ loading: BooleanConstructor;
36
+ loadingIcon: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | (((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component)) | null)[], unknown, unknown, () => import('vue').DefineComponent<{}, void, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, boolean>;
37
+ plain: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
38
+ text: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
39
+ link: BooleanConstructor;
40
+ bg: BooleanConstructor;
41
+ autofocus: BooleanConstructor;
42
+ round: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
43
+ circle: BooleanConstructor;
44
+ dashed: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
45
+ color: StringConstructor;
46
+ dark: BooleanConstructor;
47
+ autoInsertSpace: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
48
+ tag: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | (((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component)) | null)[], unknown, unknown, "button", boolean>;
49
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
50
+ [key: string]: any;
51
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
52
+ block: {
53
+ type: BooleanConstructor;
54
+ default: boolean;
55
+ };
56
+ iconPlacement: {
57
+ type: PropType<ButtonProIconPlacement>;
58
+ default: string;
59
+ };
60
+ gradient: {
61
+ type: PropType<ButtonProGradientValue>;
62
+ default: undefined;
63
+ };
64
+ hoverGradient: {
65
+ type: PropType<ButtonProGradientValue>;
66
+ default: undefined;
67
+ };
68
+ size: {
69
+ readonly type: PropType<import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
70
+ readonly required: false;
71
+ readonly validator: ((val: unknown) => boolean) | undefined;
72
+ __epPropKey: true;
73
+ };
74
+ disabled: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
75
+ type: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<StringConstructor, "" | "default" | "text" | "info" | "primary" | "success" | "warning" | "danger", unknown, "", boolean>;
76
+ icon: {
77
+ readonly type: PropType<import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | (((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component)) | null)[], unknown, unknown>>;
78
+ readonly required: false;
79
+ readonly validator: ((val: unknown) => boolean) | undefined;
80
+ __epPropKey: true;
81
+ };
82
+ nativeType: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<StringConstructor, "button" | "reset" | "submit", unknown, "button", boolean>;
83
+ loading: BooleanConstructor;
84
+ loadingIcon: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | (((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component)) | null)[], unknown, unknown, () => import('vue').DefineComponent<{}, void, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, boolean>;
85
+ plain: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
86
+ text: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
87
+ link: BooleanConstructor;
88
+ bg: BooleanConstructor;
89
+ autofocus: BooleanConstructor;
90
+ round: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
91
+ circle: BooleanConstructor;
92
+ dashed: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
93
+ color: StringConstructor;
94
+ dark: BooleanConstructor;
95
+ autoInsertSpace: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
96
+ tag: import('element-plus/es/utils/vue/props/types.mjs').EpPropFinalized<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | (((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component)) | null)[], unknown, unknown, "button", boolean>;
97
+ }>> & Readonly<{}>, {
98
+ tag: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | ((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | null)[], unknown, unknown>;
99
+ disabled: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<BooleanConstructor, unknown, unknown>;
100
+ type: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<StringConstructor, "" | "text" | "default" | "primary" | "success" | "warning" | "info" | "danger", unknown>;
101
+ nativeType: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<StringConstructor, "button" | "reset" | "submit", unknown>;
102
+ loading: boolean;
103
+ loadingIcon: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | ((new (...args: any[]) => (string | import('vue').Component) & {}) | (() => string | import('vue').Component) | null)[], unknown, unknown>;
104
+ plain: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<BooleanConstructor, unknown, unknown>;
105
+ text: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<BooleanConstructor, unknown, unknown>;
106
+ link: boolean;
107
+ bg: boolean;
108
+ autofocus: boolean;
109
+ round: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<BooleanConstructor, unknown, unknown>;
110
+ circle: boolean;
111
+ dashed: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<BooleanConstructor, unknown, unknown>;
112
+ dark: boolean;
113
+ autoInsertSpace: import('element-plus/es/utils/vue/props/types.mjs').EpPropMergeType<BooleanConstructor, unknown, unknown>;
114
+ block: boolean;
115
+ iconPlacement: ButtonProIconPlacement;
116
+ gradient: ButtonProGradientValue;
117
+ hoverGradient: ButtonProGradientValue;
118
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
119
+ export default _default;
@@ -0,0 +1,28 @@
1
+ import { ButtonInstance, ButtonProps } from 'element-plus';
2
+ import { Component } from 'vue';
3
+ export interface ButtonProGradient {
4
+ /** 渐变起始颜色 */
5
+ from: string;
6
+ /** 渐变结束颜色 */
7
+ to: string;
8
+ /** 渐变角度,默认 135 */
9
+ angle?: number;
10
+ }
11
+ export type ButtonProGradientValue = string | ButtonProGradient;
12
+ /** 图标在文字前或文字后 */
13
+ export type ButtonProIconPlacement = 'start' | 'end';
14
+ export interface ButtonProOwnProps {
15
+ /** 按钮是否独占一行 */
16
+ block?: boolean;
17
+ /** 图标位置,默认 start */
18
+ iconPlacement?: ButtonProIconPlacement;
19
+ /** 渐变背景,支持 CSS 渐变字符串或起止颜色对象 */
20
+ gradient?: ButtonProGradientValue;
21
+ /** 鼠标经过时的渐变背景,支持 CSS 渐变字符串或起止颜色对象 */
22
+ hoverGradient?: ButtonProGradientValue;
23
+ }
24
+ export type ButtonProProps = Omit<ButtonProps, 'tag'> & ButtonProOwnProps & {
25
+ /** 自定义渲染标签 */
26
+ tag?: string | Component;
27
+ };
28
+ export type ButtonProInstance = ButtonInstance;
@@ -0,0 +1,6 @@
1
+ import { ButtonProGradientValue } from './types';
2
+ export declare function normalizeGradient(gradient: ButtonProGradientValue): string;
3
+ /**
4
+ * 延迟读取源对象属性,使包装组件在内部实例挂载后仍能自动转发实例能力。
5
+ */
6
+ export declare function exposeFrom<T extends object>(getSource: () => T | undefined): T;
@@ -55,11 +55,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
55
55
  default: boolean;
56
56
  };
57
57
  }>> & Readonly<{
58
- "onUpdate:modelValue"?: ((_value: FormProValue) => any) | undefined;
59
- onChange?: ((_value: FormProValue) => any) | undefined;
60
- onCancel?: (() => any) | undefined;
61
58
  onReset?: ((_value: FormProValue) => any) | undefined;
62
59
  onSubmit?: ((_value: FormProValue) => any) | undefined;
60
+ onCancel?: (() => any) | undefined;
61
+ onChange?: ((_value: FormProValue) => any) | undefined;
62
+ "onUpdate:modelValue"?: ((_value: FormProValue) => any) | undefined;
63
63
  }>, {
64
64
  schema: FormProSchemaItem[];
65
65
  modelValue: FormProValue;
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),c=require("element-plus");function Fe(t){return typeof t=="function"?t():t??[]}function Y(t,l){return(r,{slots:u={}})=>{const{options:p,props:h={},slots:s={},...a}=r,f=h.label??"label",g=h.value??"value",b=h.disabled??"disabled";return n.h(t,a,{...u,default:u.default??(()=>Fe(p).map(i=>n.h(l,{label:i[f],value:i[g],disabled:i[b]},typeof i.slots=="function"?i.slots:s[i.slots])))})}}function Me(t,{slots:l}){return n.h(c.ElInput,{...t,type:"password"},l)}function qe(t,{slots:l}){const{modelValue:r,"onUpdate:modelValue":u,...p}=t;return n.h(c.ElUpload,{...p,fileList:r,"onUpdate:fileList":u},{...l,default:l.default??(()=>n.h(c.ElButton,{type:"primary",plain:!0},()=>"选择文件"))})}const je={input:c.ElInput,password:Me,number:c.ElInputNumber,select:Y(c.ElSelect,c.ElOption),selectV2:c.ElSelectV2,radio:Y(c.ElRadioGroup,c.ElRadio),checkbox:Y(c.ElCheckboxGroup,c.ElCheckbox),date:c.ElDatePicker,time:c.ElTimePicker,timeSelect:c.ElTimeSelect,autocomplete:c.ElAutocomplete,cascader:c.ElCascader,inputTag:c.ElInputTag,rate:c.ElRate,slider:c.ElSlider,switch:c.ElSwitch,tree:c.ElTreeSelect,transfer:c.ElTransfer,upload:qe,mention:c.ElMention};function Te(t){return t.type&&typeof t.type!="string"?t.type:je[t.type||"input"]??c.ElInput}const Ae=["key","label","type","style","rules","col","hidden","labelWidth","slot","defaultValue","formItemProps","fieldProps","children","separator"];function xe(t){["select","selectV2","cascader","autocomplete","tree"].includes(t.type);const l=new Set(Ae);return{clearable:!0,...Object.fromEntries(Object.entries(t).filter(([u])=>!l.has(u))),...t.fieldProps??{}}}function D(t){return typeof t=="number"?{span:t}:t??{}}function oe(t,l){return{span:24,...D(l.col),...D(t.col)}}function z(t){const l=t.flatMap(r=>{const u=r.key&&!r.children?.length?[[r.key,r.defaultValue]]:[],p=z(r.children??[]);return[...u,...Object.entries(p)]});return Object.fromEntries(l)}function ze(t){return t!=null&&typeof t=="object"}const ae={form:{submitText:"提交"},search:{submitText:"查询"}},Ve={submit:!0,reset:!0,cancel:!1};function re(t,l){return Object.fromEntries(Object.entries(t).filter(([r])=>!l.includes(r)))}const H=n.defineComponent({name:"ElFormPro",props:{schema:{type:Array,default:()=>[]},modelValue:{type:Object,default:void 0},formConfig:{type:Object,default:()=>({})},collapsible:{type:Boolean,default:!1},searchMode:{type:Boolean,default:!1}},emits:{"update:modelValue":t=>!0,submit:t=>!0,reset:t=>!0,cancel:()=>!0,change:t=>!0},setup(t,{emit:l,expose:r,slots:u}){const p=n.shallowRef(),h=n.shallowRef(typeof window>"u"?0:window.innerWidth),s=n.shallowRef(t.collapsible&&!(t.formConfig?.collapsed??!0)),a=n.reactive({...t.formConfig});n.watch(()=>t.formConfig,e=>{Object.assign(a,e)},{deep:!0}),n.watch(()=>t.formConfig?.collapsed,e=>{t.collapsible&&(s.value=!(e??!0))});const f=n.reactive(z(t.schema)),g=n.computed(()=>ze(t.modelValue)),b=n.computed({get:()=>g.value?t.modelValue:f,set:e=>{if(g.value){l("update:modelValue",e);return}for(const o of Object.keys(f))delete f[o];Object.assign(f,e),l("update:modelValue",e)}});n.watch(()=>t.schema,e=>{if(!g.value){for(const o of Object.keys(f))delete f[o];Object.assign(f,z(e))}},{deep:!0});const i=n.computed(()=>t.schema.filter(e=>!e.hidden)),w=[{key:"sm",min:768},{key:"md",min:992},{key:"lg",min:1200},{key:"xl",min:1920}],E=(e,o)=>{let v=e.base||e.xs||"top";if(o<768)return e.xs||v;for(const m of w){if(o<m.min)break;v=e[m.key]||v}return v},_=n.computed(()=>{const e=a.labelPosition;return typeof e=="string"?e:E(e||{base:"top",md:"right"},h.value)}),P=e=>typeof e=="number"?e:e?.span,R=(e,o)=>{let v=P(e.span)??24;for(const m of w){if(o<m.min)break;const k=P(e[m.key]);k!==void 0&&(v=k)}return Math.min(24,v)},V=e=>R(oe(e,a),h.value),T=(e,o)=>{const v=e%24;return v&&24-v<o&&(e+=24-v),e+o},I=n.computed(()=>!!u.buttons||a.buttons?.submit!==!1||a.buttons?.reset!==!1||a.buttons?.cancel!==void 0&&a.buttons.cancel!==!1),B=e=>{if(a.actionCol!==void 0)return R(D(a.actionCol),h.value);const o=e?24-e:0;return o>=4?o:24},U=e=>{const o=e*24;let v=0,m=0;for(const k of i.value){const C=T(v,V(k));if(C>o)break;const j=I.value?T(C,B(C)):C;if(m>0&&j>o)break;v=C,m+=1}return Math.max(1,m)},F=n.computed(()=>!t.collapsible||!a.showCollapseButton?i.value.length:a.collapseCount!==void 0?a.collapseCount:U(a.collapseRows??1)),A=n.computed(()=>s.value?i.value:i.value.slice(0,F.value)),M=n.computed(()=>{let e=0;for(const o of A.value)e=T(e,V(o));return e%24}),W=n.computed(()=>B(M.value)),N=n.computed(()=>M.value>0&&M.value+W.value<=24),d=n.computed(()=>_.value==="top"&&N.value),y=n.computed(()=>{if(a.actionCol!==void 0)return{span:24,...D(a.actionCol)};const e=M.value,o=e?24-e:0;return{span:o>=4?o:24}}),S=n.computed(()=>{const e={submit:{type:"primary",text:t.searchMode?ae.search.submitText:ae.form.submitText,disabled:!1,loading:!1},reset:{plain:!0,text:"重置",disabled:!1},cancel:{plain:!0,text:"取消",disabled:!1}},o=v=>{const m=a.buttons?.[v];return m===!1||m===void 0&&!Ve[v]?null:{...e[v],...m??{}}};return{submit:o("submit"),reset:o("reset"),cancel:o("cancel")}}),q=n.computed(()=>Object.values(S.value).some(Boolean)),he=n.computed(()=>{const e=a.buttonAlign??"right";return e==="start"?"is-start":e==="center"?"is-center":"is-end"}),ve=e=>oe(e,a),ge=(e,o)=>{const v={...b.value,[e]:o};b.value=v,l("change",v)},be=e=>Array.isArray(e)?e:e?[e]:[],me=e=>{const o=[],v=m=>{for(const k of m)k.hidden||(k.children?.length?v(k.children):o.push(k))};return v(e.children??[]),o},ye=e=>be(e).some(o=>o?.required),we=e=>me(e).some(o=>ye(o.rules)),K=(e,o)=>e?n.h(c.ElButton,{...re(e,["text"]),onClick:o},()=>e.text):null,$=e=>{const o=u[e.slot??e.key??""];if(o)return o({item:e,model:b.value});const v=Te(e);if(n.isVNode(v))return v;const{slots:m,...k}=xe(e),C=Object.fromEntries(Object.entries(m??{}).flatMap(([j,x])=>{const O=typeof x=="function"?x:u[String(x)];return O?[[j,(L={})=>O({...L,item:e,model:b.value})]]:[]}));return n.h(v,{...k,modelValue:e.key==null?void 0:b.value[e.key],"onUpdate:modelValue":j=>{e.key!=null&&ge(e.key,j)}},C)},J=e=>typeof e.label=="function"?e.label():e.label,Pe=e=>{const o=_.value;return n.h("div",{class:["el-form-item",`el-form-item--label-${o}`,"el-form-pro__group",{"is-required":e.formItemProps?.required??we(e),"is-no-asterisk":a.hideRequiredAsterisk,"asterisk-right":a.requireAsteriskPosition==="right","asterisk-left":a.requireAsteriskPosition!=="right"}],style:e.style},[e.label?n.h("div",{class:"el-form-item__label",style:o==="top"?void 0:{width:e.labelWidth??a.labelWidth}},[J(e)]):null,n.h("div",{class:"el-form-item__content"},[X(e)])])},Se=e=>e.children?.length?X(e):n.h(c.ElFormItem,{...e.formItemProps??{},prop:e.key,rules:e.rules,labelWidth:e.labelWidth??a.labelWidth,class:[e.formItemProps?.class,"el-form-pro__child"],style:e.style},{default:()=>$(e)}),X=e=>e.children?.length?n.h("div",{class:"el-form-pro__children"},e.children.filter(o=>!o.hidden).flatMap((o,v)=>{const m=n.h("div",{class:"el-form-pro__child-wrapper",key:o.key},[Se(o)]);return v===0?[m]:[n.h("span",{class:"el-form-pro__separator"},e.separator??""),m]})):$(e),Z=async()=>{t.collapsible&&(s.value=!0),await n.nextTick(),p.value?.$el?.querySelector(".is-error")?.scrollIntoView({behavior:"smooth",block:"center"})},ee=(...e)=>p.value?.validate(...e),ke=(...e)=>p.value?.validateField(...e),te=async()=>{try{await ee(),l("submit",b.value)}catch{Z()}},Ee=e=>{const o=z(t.schema),v=e==null?null:new Set(Array.isArray(e)?e:[e]),m={},k=(C,j=!1,x=!1)=>{for(const O of C){const L=j||v===null||v.has(O.key);O.children?.length?k(O.children,L,!0):x&&L&&O.key!=null&&(m[O.key]=o[O.key])}};return k(t.schema),m},ne=(...e)=>{p.value?.resetFields(...e);const o=Ee(e[0]);return Object.keys(o).length&&(b.value={...b.value,...o}),{...b.value,...o}},Ce=()=>{const e=ne();l("reset",e)},Oe=()=>l("cancel"),_e=e=>{Object.assign(a,e)},Re=()=>b.value,G=()=>{p.value?.$el,typeof window<"u"&&(h.value=window.innerWidth)},Q=typeof ResizeObserver>"u"?null:new ResizeObserver(G);n.watch(()=>p.value?.$el,e=>{Q?.disconnect(),e&&Q?.observe(e),G()},{flush:"post"});const le=()=>{typeof window<"u"&&(h.value=window.innerWidth),G()};return typeof window<"u"&&window.addEventListener("resize",le),n.onBeforeUnmount(()=>{Q?.disconnect(),typeof window<"u"&&window.removeEventListener("resize",le)}),r({validate:(...e)=>ee(...e),validateField:(...e)=>ke(...e),resetFields:(...e)=>{ne(...e)},clearValidate:(...e)=>{p.value?.clearValidate(...e)},scrollToError:Z,setState:_e,getValues:Re}),()=>{const e={...re(a,["buttonAlign","buttons","row","col","showCollapseButton","collapseRows","collapseCount","collapsed","actionCol"])};return n.h(c.ElForm,{...e,class:["el-form-pro",e.class].filter(Boolean),labelPosition:_.value,ref:p,model:b.value,onSubmit:o=>{o.preventDefault(),te()}},{default:()=>[n.h(c.ElRow,{gutter:18,...a.row??{}},{default:()=>[...A.value.map(o=>n.h(c.ElCol,{...ve(o),key:o.key??o.children?.[0]?.key},{default:()=>o.children?.length?Pe(o):n.h(c.ElFormItem,{...o.formItemProps??{},label:typeof o.label=="function"?void 0:o.label,labelWidth:o.labelWidth??a.labelWidth,prop:o.key,rules:o.rules,class:o.formItemProps?.class,style:o.style},{...typeof o.label=="function"?{label:()=>J(o)}:{},default:()=>$(o)})})),q.value&&i.value.length?n.h(c.ElCol,y.value,{default:()=>n.h(c.ElFormItem,null,{...d.value?{label:()=>n.h("label",{class:"el-form-pro__actions-label"})}:{},default:()=>n.h("div",{class:["el-form-pro__actions",he.value]},[u.buttons?u.buttons():[K(S.value.submit,()=>{te()}),K(S.value.reset,Ce),K(S.value.cancel,Oe)],t.collapsible&&a.showCollapseButton&&i.value.length>F.value?n.h(c.ElButton,{type:"primary",link:!0,onClick:()=>{s.value=!s.value}},()=>s.value?"收起":"展开"):null])})}):null]})]})}}});function se(t,l){return t.flatMap(r=>{if(r.visible===!1)return[];const{visible:u,slot:p,headerSlot:h,render:s,headerRender:a,autoMerge:f,children:g,...b}=r,i={...b},w={},E=p?l[p]:void 0,_=h?l[h]:void 0;if(E?w.default=E:s&&(w.default=P=>s({row:P.row,column:P.column,$index:P.$index})),_?w.header=_:a&&(w.header=P=>a({column:P.column,$index:P.$index,store:P.store,_self:P._self})),g?.length){const P={default:()=>se(g,l)};return w.header&&(P.header=w.header),[n.h(c.ElTableColumn,i,P)]}return[n.h(c.ElTableColumn,i,Object.keys(w).length?w:void 0)]})}function ue(t){return t.prop??t.property}function Ie(t,l){if(t===null||typeof t!="object")return;const r=t;if(Object.prototype.hasOwnProperty.call(r,l))return r[l];if(!l.includes("."))return;let u=r;for(const p of l.split(".")){if(u===null||typeof u!="object")return;u=u[p]}return u}function ie(t){return t.flatMap(l=>l.visible===!1?[]:l.children?.length?ie(l.children):[l])}function Be(t,l=[]){const r=ie(t),u=new Map;for(const a of r){const f=ue(a);f&&!u.has(f)&&u.set(f,a)}const p=new Set,h=[],s=a=>{!a||p.has(a)||!u.has(a)||(p.add(a),h.push({key:a,getValue:f=>Ie(f,a)}))};return l.forEach(s),r.forEach(a=>{a.autoMerge&&s(ue(a))}),h}function Le(t,l){const r=t.length,u=new Map(l.map(s=>[s.key,Array.from({length:r},()=>1)]));if(!r||!l.length)return u;const p=t.map(s=>l.map(a=>a.getValue(s))),h=l.map(()=>0);for(let s=1;s<=r;s+=1){let a=!0;for(let f=0;f<l.length;f+=1){const g=s<r&&a&&p[s][f]===p[s-1][f];if(!g){const b=u.get(l[f].key),i=h[f],w=s-i;b[i]=w;for(let E=i+1;E<s;E+=1)b[E]=0;h[f]=s}a=g}}return u}function De(t,l="children"){return t.some(r=>{if(r===null||typeof r!="object")return!1;const u=r[l];return Array.isArray(u)&&u.length>0})}function Ue(t){const l=n.computed(()=>Be(t.columns(),t.mergeFields())),r=n.computed(()=>l.value.length?t.tableRef.value?.store?.states?.data?.value??t.data.value:t.data.value),u=n.computed(()=>{if(!l.value.length||t.lazy())return new Map;const h=t.treeProps()?.children??"children",s=r.value;return De(s,h)?new Map:Le(s,l.value)});return{spanMethod:n.computed(()=>{const h=t.userSpanMethod();return l.value.length?s=>{const a=h?.(s);if(a!==void 0)return a;const f=s.column.property,g=f?u.value.get(f)?.[s.rowIndex]:void 0;if(!(g===void 0||g===1))return{rowspan:g,colspan:1}}:h}),spanMap:u}}const ce={page:1,pageSize:20,pageSizes:[10,20,50,100],pagerCount:5,layout:"total, sizes, prev, pager, next, jumper",background:!0};function de(t){return t===!1?null:{...ce,...t===!0?{}:t??{}}}function We(t){const l=n.computed(()=>de(t())),r=n.shallowRef(l.value?.page??1),u=n.shallowRef(l.value?.pageSize??20);n.watch(()=>l.value?.page,a=>{a!==void 0&&(r.value=a)}),n.watch(()=>l.value?.pageSize,a=>{a!==void 0&&(u.value=a)});const p=n.computed(()=>l.value?r.value:null),h=n.computed(()=>l.value?u.value:null);function s(a){u.value=a,r.value=1}return{enabled:n.computed(()=>l.value!=null),config:l,currentPage:r,pageSize:u,requestPage:p,requestPageSize:h,setPageSize:s}}function Ne(t){const l=n.shallowRef(!1);let r=null,u=0;async function p(){const s=t.request();if(!s)return;r?.abort(),r=new AbortController;const a=++u,f=r;l.value=!0;try{const g=await s({page:t.page(),pageSize:t.pageSize(),query:t.query(),signal:f.signal});if(f.signal.aborted||a!==u)return;t.onData?.(g),t.onLoaded?.(g)}catch(g){if(f.signal.aborted||a!==u)return;t.onError?.(g)}finally{a===u&&(l.value=!1)}}function h(){r?.abort(),u+=1,l.value=!1}return n.onBeforeUnmount(h),{loading:l,load:p,cancel:h}}const fe=n.defineComponent({name:"ElTablePro",inheritAttrs:!1,props:{columns:{type:Array,default:()=>[]},request:{type:Function,default:void 0},pagination:{type:[Boolean,Object],default:!0},mergeFields:{type:Array,default:()=>[]},query:{type:Object,default:void 0},filter:{type:Object,default:void 0},data:{type:Array,default:()=>[]},rowKey:{type:[String,Function],required:!0}},emits:{loaded:t=>!0,error:t=>!0},setup(t,{attrs:l,emit:r,expose:u}){const p=n.useSlots(),h=n.shallowRef(null),s=n.shallowRef([]),a=n.shallowRef(0),f=n.computed(()=>({...z(t.filter?.schema??[]),...t.filter?.defaultValue??{},...t.filter?.model??{}})),g=n.reactive({...f.value}),b=n.shallowRef({...f.value,...t.query??{}});n.watch(()=>t.query,d=>{b.value={...f.value,...d??{}},t.request&&R()},{deep:!0}),n.watch(()=>t.filter?.model,d=>{for(const y of Object.keys(g))delete g[y];Object.assign(g,f.value,d??{})},{deep:!0});const i=We(()=>t.pagination);let w=!1;function E(d){d!==i.currentPage.value&&(i.enabled.value&&(w=!0),i.currentPage.value=d)}const _=n.computed(()=>{const d=t.rowKey;return typeof d=="function"?y=>String(d(y)):d}),{loading:P,load:R,cancel:V}=Ne({request:()=>t.request,page:()=>i.requestPage.value,pageSize:()=>i.requestPageSize.value,query:()=>b.value,onData:d=>{s.value=d.data,a.value=d.total},onLoaded:d=>r("loaded",d),onError:d=>r("error",d)}),T=n.computed(()=>P.value),I=n.computed(()=>{if(t.request)return s.value;if(!t.data)return[];if(!i.config.value)return t.data;const d=(i.currentPage.value-1)*i.pageSize.value;return t.data.slice(d,d+i.pageSize.value)}),B=n.computed(()=>t.request?a.value:t.data?.length??0),{spanMethod:U}=Ue({tableRef:h,columns:()=>t.columns,data:I,mergeFields:()=>t.mergeFields,userSpanMethod:()=>l.spanMethod,treeProps:()=>l.treeProps,lazy:()=>!!l.lazy});async function F(d){d?.page!==void 0&&E(d.page),await R()}async function A(){b.value={...g},E(1),await R()}async function M(){const d={...f.value};for(const y of Object.keys(g))delete g[y];Object.assign(g,d),b.value={...d},E(1),await R()}n.watch(()=>t.request,d=>{s.value=[],a.value=0,d?F():V()}),n.watch(()=>[i.requestPage.value,i.requestPageSize.value],()=>{if(w){w=!1;return}t.request&&F()});const W=new Proxy({},{get(d,y){if(y==="reload")return F;if(y==="search")return A;if(y==="resetFilter")return M;const S=h.value;if(!S)return;const q=S[y];return typeof q=="function"?q.bind(S):q},has(d,y){return y==="reload"||y==="search"||y==="resetFilter"?!0:h.value!=null&&y in h.value}});u(W),n.onMounted(()=>{t.request&&F()});const N=()=>Object.fromEntries(Object.entries(p).filter(([d])=>d.startsWith("filter-")).map(([d,y])=>[d.slice(7),y]));return()=>{const d=t.filter?n.h(H,{schema:t.filter.schema,modelValue:g,collapsible:!0,searchMode:!0,formConfig:{...t.filter.formConfig?.showCollapseButton?{collapseRows:1}:{},...t.filter.formConfig??{}},"onUpdate:modelValue":S=>{for(const q of Object.keys(g))delete g[q];Object.assign(g,S)},onSubmit:()=>{A()},onReset:()=>{M()}},N()):null,y=n.h(c.ElTable,{...l,ref:h,data:I.value,rowKey:_.value,spanMethod:U.value},{default:()=>se(t.columns,p),empty:p.empty,append:p.append});return n.h("div",{class:"el-table-pro"},[d,n.withDirectives(y,[[c.vLoading,T.value]]),i.enabled.value?n.h(c.ElPagination,{currentPage:i.currentPage.value,pageSize:i.pageSize.value,total:B.value,pageSizes:[...i.config.value?.pageSizes??[]],pagerCount:i.config.value?.pagerCount,layout:i.config.value?.layout,background:i.config.value?.background,"onUpdate:currentPage":S=>{i.currentPage.value=S},"onUpdate:pageSize":S=>{i.setPageSize(S)}}):null])}}}),Ke=[H,fe];function pe(t){Ke.forEach(l=>{const r=l.name;r&&t.component(r,l)})}const $e={install:pe};exports.ElFormPro=H;exports.ElTablePro=fe;exports.TABLE_PRO_DEFAULT_PAGINATION=ce;exports.default=$e;exports.install=pe;exports.normalizePagination=de;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),d=require("element-plus");function oe(e){if(typeof e=="string")return e.trim();const{from:l,to:r,angle:u=135}=e;return`linear-gradient(${u}deg, ${l}, ${r})`}function je(e){return new Proxy({},{get(l,r){return e()?.[r]},has(l,r){const u=e();return!!(u&&r in u)}})}const ie=n.defineComponent({name:"ElButtonPro",inheritAttrs:!1,props:{...d.buttonProps,block:{type:Boolean,default:!1},iconPlacement:{type:String,default:"start"},gradient:{type:[String,Object],default:void 0},hoverGradient:{type:[String,Object],default:void 0}},setup(e,{attrs:l,expose:r,slots:u}){const v=n.shallowRef(),f=n.shallowRef(!1),s=n.computed(()=>{const{onClick:k,...S}=l;return S}),a=n.computed(()=>!e.plain&&!e.dashed&&!e.text&&!e.link&&e.type!=="text"),c=n.computed(()=>e.gradient&&a.value?oe(e.gradient):""),p=n.computed(()=>c.value&&e.hoverGradient?oe(e.hoverGradient):""),m=n.computed(()=>{if(c.value)return{"--el-button-pro-gradient":c.value,...p.value&&{"--el-button-pro-hover-gradient":p.value}}}),i=n.computed(()=>{const{block:k,iconPlacement:S,gradient:y,hoverGradient:R,...x}=e;return x});async function P(k){const S=l.onClick;if(typeof S!="function")return;const y=S(k);if(!(!y||typeof y.then!="function")){f.value=!0;try{await y}finally{f.value=!1}}}return r(je(()=>v.value)),()=>n.h(d.ElButton,n.mergeProps(i.value,s.value,{ref:v,loading:e.loading||f.value,class:["el-button-pro",{"is-block":e.block,"is-gradient":!!c.value,"has-icon-end":e.iconPlacement==="end","has-hover-gradient":!!p.value}],style:m.value,onClick:P}),u)}});function qe(e){return typeof e=="function"?e():e??[]}function Y(e,l){return(r,{slots:u={}})=>{const{options:v,props:f={},slots:s={},...a}=r,c=f.label??"label",p=f.value??"value",m=f.disabled??"disabled";return n.h(e,a,{...u,default:u.default??(()=>qe(v).map(i=>n.h(l,{label:i[c],value:i[p],disabled:i[m]},typeof i.slots=="function"?i.slots:s[i.slots])))})}}function xe(e,{slots:l}){return n.h(d.ElInput,{...e,type:"password"},l)}function Ae(e,{slots:l}){const{modelValue:r,"onUpdate:modelValue":u,...v}=e;return n.h(d.ElUpload,{...v,fileList:r,"onUpdate:fileList":u},{...l,default:l.default??(()=>n.h(d.ElButton,{type:"primary",plain:!0},()=>"选择文件"))})}const Te={input:d.ElInput,password:xe,number:d.ElInputNumber,select:Y(d.ElSelect,d.ElOption),selectV2:d.ElSelectV2,radio:Y(d.ElRadioGroup,d.ElRadio),checkbox:Y(d.ElCheckboxGroup,d.ElCheckbox),date:d.ElDatePicker,time:d.ElTimePicker,timeSelect:d.ElTimeSelect,autocomplete:d.ElAutocomplete,cascader:d.ElCascader,inputTag:d.ElInputTag,rate:d.ElRate,slider:d.ElSlider,switch:d.ElSwitch,tree:d.ElTreeSelect,transfer:d.ElTransfer,upload:Ae,mention:d.ElMention};function Ve(e){return e.type&&typeof e.type!="string"?e.type:Te[e.type||"input"]??d.ElInput}const ze=["key","label","type","style","rules","col","hidden","labelWidth","slot","defaultValue","formItemProps","fieldProps","children","separator"];function Be(e){["select","selectV2","cascader","autocomplete","tree"].includes(e.type);const l=new Set(ze);return{clearable:!0,...Object.fromEntries(Object.entries(e).filter(([u])=>!l.has(u))),...e.fieldProps??{}}}function D(e){return typeof e=="number"?{span:e}:e??{}}function ae(e,l){return{span:24,...D(l.col),...D(e.col)}}function z(e){const l=e.flatMap(r=>{const u=r.key&&!r.children?.length?[[r.key,r.defaultValue]]:[],v=z(r.children??[]);return[...u,...Object.entries(v)]});return Object.fromEntries(l)}function Ie(e){return e!=null&&typeof e=="object"}const re={form:{submitText:"提交"},search:{submitText:"查询"}},Le={submit:!0,reset:!0,cancel:!1};function ue(e,l){return Object.fromEntries(Object.entries(e).filter(([r])=>!l.includes(r)))}const H=n.defineComponent({name:"ElFormPro",props:{schema:{type:Array,default:()=>[]},modelValue:{type:Object,default:void 0},formConfig:{type:Object,default:()=>({})},collapsible:{type:Boolean,default:!1},searchMode:{type:Boolean,default:!1}},emits:{"update:modelValue":e=>!0,submit:e=>!0,reset:e=>!0,cancel:()=>!0,change:e=>!0},setup(e,{emit:l,expose:r,slots:u}){const v=n.shallowRef(),f=n.shallowRef(typeof window>"u"?0:window.innerWidth),s=n.shallowRef(e.collapsible&&!(e.formConfig?.collapsed??!0)),a=n.reactive({...e.formConfig});n.watch(()=>e.formConfig,t=>{Object.assign(a,t)},{deep:!0}),n.watch(()=>e.formConfig?.collapsed,t=>{e.collapsible&&(s.value=!(t??!0))});const c=n.reactive(z(e.schema)),p=n.computed(()=>Ie(e.modelValue)),m=n.computed({get:()=>p.value?e.modelValue:c,set:t=>{if(p.value){l("update:modelValue",t);return}for(const o of Object.keys(c))delete c[o];Object.assign(c,t),l("update:modelValue",t)}});n.watch(()=>e.schema,t=>{if(!p.value){for(const o of Object.keys(c))delete c[o];Object.assign(c,z(t))}},{deep:!0});const i=n.computed(()=>e.schema.filter(t=>!t.hidden)),P=[{key:"sm",min:768},{key:"md",min:992},{key:"lg",min:1200},{key:"xl",min:1920}],k=(t,o)=>{let g=t.base||t.xs||"top";if(o<768)return t.xs||g;for(const b of P){if(o<b.min)break;g=t[b.key]||g}return g},S=n.computed(()=>{const t=a.labelPosition;return typeof t=="string"?t:k(t||{base:"top",md:"right"},f.value)}),y=t=>typeof t=="number"?t:t?.span,R=(t,o)=>{let g=y(t.span)??24;for(const b of P){if(o<b.min)break;const E=y(t[b.key]);E!==void 0&&(g=E)}return Math.min(24,g)},x=t=>R(ae(t,a),f.value),A=(t,o)=>{const g=t%24;return g&&24-g<o&&(t+=24-g),t+o},B=n.computed(()=>!!u.buttons||a.buttons?.submit!==!1||a.buttons?.reset!==!1||a.buttons?.cancel!==void 0&&a.buttons.cancel!==!1),I=t=>{if(a.actionCol!==void 0)return R(D(a.actionCol),f.value);const o=t?24-t:0;return o>=4?o:24},U=t=>{const o=t*24;let g=0,b=0;for(const E of i.value){const _=A(g,x(E));if(_>o)break;const q=B.value?A(_,I(_)):_;if(b>0&&q>o)break;g=_,b+=1}return Math.max(1,b)},F=n.computed(()=>!e.collapsible||!a.showCollapseButton?i.value.length:a.collapseCount!==void 0?a.collapseCount:U(a.collapseRows??1)),T=n.computed(()=>s.value?i.value:i.value.slice(0,F.value)),M=n.computed(()=>{let t=0;for(const o of T.value)t=A(t,x(o));return t%24}),W=n.computed(()=>I(M.value)),$=n.computed(()=>M.value>0&&M.value+W.value<=24),h=n.computed(()=>S.value==="top"&&$.value),w=n.computed(()=>{if(a.actionCol!==void 0)return{span:24,...D(a.actionCol)};const t=M.value,o=t?24-t:0;return{span:o>=4?o:24}}),C=n.computed(()=>{const t={submit:{type:"primary",text:e.searchMode?re.search.submitText:re.form.submitText,disabled:!1,loading:!1},reset:{plain:!0,text:"重置",disabled:!1},cancel:{plain:!0,text:"取消",disabled:!1}},o=g=>{const b=a.buttons?.[g];return b===!1||b===void 0&&!Le[g]?null:{...t[g],...b??{}}};return{submit:o("submit"),reset:o("reset"),cancel:o("cancel")}}),j=n.computed(()=>Object.values(C.value).some(Boolean)),ge=n.computed(()=>{const t=a.buttonAlign??"right";return t==="start"?"is-start":t==="center"?"is-center":"is-end"}),me=t=>ae(t,a),be=(t,o)=>{const g={...m.value,[t]:o};m.value=g,l("change",g)},ye=t=>Array.isArray(t)?t:t?[t]:[],we=t=>{const o=[],g=b=>{for(const E of b)E.hidden||(E.children?.length?g(E.children):o.push(E))};return g(t.children??[]),o},Pe=t=>ye(t).some(o=>o?.required),ke=t=>we(t).some(o=>Pe(o.rules)),G=(t,o)=>t?n.h(d.ElButton,{...ue(t,["text"]),onClick:o},()=>t.text):null,N=t=>{const o=u[t.slot??t.key??""];if(o)return o({item:t,model:m.value});const g=Ve(t);if(n.isVNode(g))return g;const{slots:b,...E}=Be(t),_=Object.fromEntries(Object.entries(b??{}).flatMap(([q,V])=>{const O=typeof V=="function"?V:u[String(V)];return O?[[q,(L={})=>O({...L,item:t,model:m.value})]]:[]}));return n.h(g,{...E,modelValue:t.key==null?void 0:m.value[t.key],"onUpdate:modelValue":q=>{t.key!=null&&be(t.key,q)}},_)},J=t=>typeof t.label=="function"?t.label():t.label,Se=t=>{const o=S.value;return n.h("div",{class:["el-form-item",`el-form-item--label-${o}`,"el-form-pro__group",{"is-required":t.formItemProps?.required??ke(t),"is-no-asterisk":a.hideRequiredAsterisk,"asterisk-right":a.requireAsteriskPosition==="right","asterisk-left":a.requireAsteriskPosition!=="right"}],style:t.style},[t.label?n.h("div",{class:"el-form-item__label",style:o==="top"?void 0:{width:t.labelWidth??a.labelWidth}},[J(t)]):null,n.h("div",{class:"el-form-item__content"},[X(t)])])},Ce=t=>t.children?.length?X(t):n.h(d.ElFormItem,{...t.formItemProps??{},prop:t.key,rules:t.rules,labelWidth:t.labelWidth??a.labelWidth,class:[t.formItemProps?.class,"el-form-pro__child"],style:t.style},{default:()=>N(t)}),X=t=>t.children?.length?n.h("div",{class:"el-form-pro__children"},t.children.filter(o=>!o.hidden).flatMap((o,g)=>{const b=n.h("div",{class:"el-form-pro__child-wrapper",key:o.key},[Ce(o)]);return g===0?[b]:[n.h("span",{class:"el-form-pro__separator"},t.separator??""),b]})):N(t),Z=async()=>{e.collapsible&&(s.value=!0),await n.nextTick(),v.value?.$el?.querySelector(".is-error")?.scrollIntoView({behavior:"smooth",block:"center"})},ee=(...t)=>v.value?.validate(...t),Ee=(...t)=>v.value?.validateField(...t),te=async()=>{try{await ee(),l("submit",m.value)}catch{Z()}},_e=t=>{const o=z(e.schema),g=t==null?null:new Set(Array.isArray(t)?t:[t]),b={},E=(_,q=!1,V=!1)=>{for(const O of _){const L=q||g===null||g.has(O.key);O.children?.length?E(O.children,L,!0):V&&L&&O.key!=null&&(b[O.key]=o[O.key])}};return E(e.schema),b},ne=(...t)=>{v.value?.resetFields(...t);const o=_e(t[0]);return Object.keys(o).length&&(m.value={...m.value,...o}),{...m.value,...o}},Oe=()=>{const t=ne();l("reset",t)},Re=()=>l("cancel"),Fe=t=>{Object.assign(a,t)},Me=()=>m.value,K=()=>{v.value?.$el,typeof window<"u"&&(f.value=window.innerWidth)},Q=typeof ResizeObserver>"u"?null:new ResizeObserver(K);n.watch(()=>v.value?.$el,t=>{Q?.disconnect(),t&&Q?.observe(t),K()},{flush:"post"});const le=()=>{typeof window<"u"&&(f.value=window.innerWidth),K()};return typeof window<"u"&&window.addEventListener("resize",le),n.onBeforeUnmount(()=>{Q?.disconnect(),typeof window<"u"&&window.removeEventListener("resize",le)}),r({validate:(...t)=>ee(...t),validateField:(...t)=>Ee(...t),resetFields:(...t)=>{ne(...t)},clearValidate:(...t)=>{v.value?.clearValidate(...t)},scrollToError:Z,setState:Fe,getValues:Me}),()=>{const t={...ue(a,["buttonAlign","buttons","row","col","showCollapseButton","collapseRows","collapseCount","collapsed","actionCol"])};return n.h(d.ElForm,{...t,class:["el-form-pro",t.class].filter(Boolean),labelPosition:S.value,ref:v,model:m.value,onSubmit:o=>{o.preventDefault(),te()}},{default:()=>[n.h(d.ElRow,{gutter:18,...a.row??{}},{default:()=>[...T.value.map(o=>n.h(d.ElCol,{...me(o),key:o.key??o.children?.[0]?.key},{default:()=>o.children?.length?Se(o):n.h(d.ElFormItem,{...o.formItemProps??{},label:typeof o.label=="function"?void 0:o.label,labelWidth:o.labelWidth??a.labelWidth,prop:o.key,rules:o.rules,class:o.formItemProps?.class,style:o.style},{...typeof o.label=="function"?{label:()=>J(o)}:{},default:()=>N(o)})})),j.value&&i.value.length?n.h(d.ElCol,w.value,{default:()=>n.h(d.ElFormItem,null,{...h.value?{label:()=>n.h("label",{class:"el-form-pro__actions-label"})}:{},default:()=>n.h("div",{class:["el-form-pro__actions",ge.value]},[u.buttons?u.buttons():[G(C.value.submit,()=>{te()}),G(C.value.reset,Oe),G(C.value.cancel,Re)],e.collapsible&&a.showCollapseButton&&i.value.length>F.value?n.h(d.ElButton,{type:"primary",link:!0,onClick:()=>{s.value=!s.value}},()=>s.value?"收起":"展开"):null])})}):null]})]})}}});function ce(e,l){return e.flatMap(r=>{if(r.visible===!1)return[];const{visible:u,slot:v,headerSlot:f,render:s,headerRender:a,autoMerge:c,children:p,...m}=r,i={...m},P={},k=v?l[v]:void 0,S=f?l[f]:void 0;if(k?P.default=k:s&&(P.default=y=>s({row:y.row,column:y.column,$index:y.$index})),S?P.header=S:a&&(P.header=y=>a({column:y.column,$index:y.$index,store:y.store,_self:y._self})),p?.length){const y={default:()=>ce(p,l)};return P.header&&(y.header=P.header),[n.h(d.ElTableColumn,i,y)]}return[n.h(d.ElTableColumn,i,Object.keys(P).length?P:void 0)]})}function se(e){return e.prop??e.property}function De(e,l){if(e===null||typeof e!="object")return;const r=e;if(Object.prototype.hasOwnProperty.call(r,l))return r[l];if(!l.includes("."))return;let u=r;for(const v of l.split(".")){if(u===null||typeof u!="object")return;u=u[v]}return u}function de(e){return e.flatMap(l=>l.visible===!1?[]:l.children?.length?de(l.children):[l])}function Ue(e,l=[]){const r=de(e),u=new Map;for(const a of r){const c=se(a);c&&!u.has(c)&&u.set(c,a)}const v=new Set,f=[],s=a=>{!a||v.has(a)||!u.has(a)||(v.add(a),f.push({key:a,getValue:c=>De(c,a)}))};return l.forEach(s),r.forEach(a=>{a.autoMerge&&s(se(a))}),f}function We(e,l){const r=e.length,u=new Map(l.map(s=>[s.key,Array.from({length:r},()=>1)]));if(!r||!l.length)return u;const v=e.map(s=>l.map(a=>a.getValue(s))),f=l.map(()=>0);for(let s=1;s<=r;s+=1){let a=!0;for(let c=0;c<l.length;c+=1){const p=s<r&&a&&v[s][c]===v[s-1][c];if(!p){const m=u.get(l[c].key),i=f[c],P=s-i;m[i]=P;for(let k=i+1;k<s;k+=1)m[k]=0;f[c]=s}a=p}}return u}function $e(e,l="children"){return e.some(r=>{if(r===null||typeof r!="object")return!1;const u=r[l];return Array.isArray(u)&&u.length>0})}function Ge(e){const l=n.computed(()=>Ue(e.columns(),e.mergeFields())),r=n.computed(()=>l.value.length?e.tableRef.value?.store?.states?.data?.value??e.data.value:e.data.value),u=n.computed(()=>{if(!l.value.length||e.lazy())return new Map;const f=e.treeProps()?.children??"children",s=r.value;return $e(s,f)?new Map:We(s,l.value)});return{spanMethod:n.computed(()=>{const f=e.userSpanMethod();return l.value.length?s=>{const a=f?.(s);if(a!==void 0)return a;const c=s.column.property,p=c?u.value.get(c)?.[s.rowIndex]:void 0;if(!(p===void 0||p===1))return{rowspan:p,colspan:1}}:f}),spanMap:u}}const fe={page:1,pageSize:20,pageSizes:[10,20,50,100],pagerCount:5,layout:"total, sizes, prev, pager, next, jumper",background:!0};function ve(e){return e===!1?null:{...fe,...e===!0?{}:e??{}}}function Ne(e){const l=n.computed(()=>ve(e())),r=n.shallowRef(l.value?.page??1),u=n.shallowRef(l.value?.pageSize??20);n.watch(()=>l.value?.page,a=>{a!==void 0&&(r.value=a)}),n.watch(()=>l.value?.pageSize,a=>{a!==void 0&&(u.value=a)});const v=n.computed(()=>l.value?r.value:null),f=n.computed(()=>l.value?u.value:null);function s(a){u.value=a,r.value=1}return{enabled:n.computed(()=>l.value!=null),config:l,currentPage:r,pageSize:u,requestPage:v,requestPageSize:f,setPageSize:s}}function Ke(e){const l=n.shallowRef(!1);let r=null,u=0;async function v(){const s=e.request();if(!s)return;r?.abort(),r=new AbortController;const a=++u,c=r;l.value=!0;try{const p=await s({page:e.page(),pageSize:e.pageSize(),query:e.query(),signal:c.signal});if(c.signal.aborted||a!==u)return;e.onData?.(p),e.onLoaded?.(p)}catch(p){if(c.signal.aborted||a!==u)return;e.onError?.(p)}finally{a===u&&(l.value=!1)}}function f(){r?.abort(),u+=1,l.value=!1}return n.onBeforeUnmount(f),{loading:l,load:v,cancel:f}}const he=n.defineComponent({name:"ElTablePro",inheritAttrs:!1,props:{columns:{type:Array,default:()=>[]},request:{type:Function,default:void 0},pagination:{type:[Boolean,Object],default:!0},mergeFields:{type:Array,default:()=>[]},query:{type:Object,default:void 0},filter:{type:Object,default:void 0},data:{type:Array,default:()=>[]},rowKey:{type:[String,Function],required:!0}},emits:{loaded:e=>!0,error:e=>!0},setup(e,{attrs:l,emit:r,expose:u}){const v=n.useSlots(),f=n.shallowRef(null),s=n.shallowRef([]),a=n.shallowRef(0),c=n.computed(()=>({...z(e.filter?.schema??[]),...e.filter?.defaultValue??{},...e.filter?.model??{}})),p=n.reactive({...c.value}),m=n.shallowRef({...c.value,...e.query??{}});n.watch(()=>e.query,h=>{m.value={...c.value,...h??{}},e.request&&R()},{deep:!0}),n.watch(()=>e.filter?.model,h=>{for(const w of Object.keys(p))delete p[w];Object.assign(p,c.value,h??{})},{deep:!0});const i=Ne(()=>e.pagination);let P=!1;function k(h){h!==i.currentPage.value&&(i.enabled.value&&(P=!0),i.currentPage.value=h)}const S=n.computed(()=>{const h=e.rowKey;return typeof h=="function"?w=>String(h(w)):h}),{loading:y,load:R,cancel:x}=Ke({request:()=>e.request,page:()=>i.requestPage.value,pageSize:()=>i.requestPageSize.value,query:()=>m.value,onData:h=>{s.value=h.data,a.value=h.total},onLoaded:h=>r("loaded",h),onError:h=>r("error",h)}),A=n.computed(()=>y.value),B=n.computed(()=>{if(e.request)return s.value;if(!e.data)return[];if(!i.config.value)return e.data;const h=(i.currentPage.value-1)*i.pageSize.value;return e.data.slice(h,h+i.pageSize.value)}),I=n.computed(()=>e.request?a.value:e.data?.length??0),{spanMethod:U}=Ge({tableRef:f,columns:()=>e.columns,data:B,mergeFields:()=>e.mergeFields,userSpanMethod:()=>l.spanMethod,treeProps:()=>l.treeProps,lazy:()=>!!l.lazy});async function F(h){h?.page!==void 0&&k(h.page),await R()}async function T(){m.value={...p},k(1),await R()}async function M(){const h={...c.value};for(const w of Object.keys(p))delete p[w];Object.assign(p,h),m.value={...h},k(1),await R()}n.watch(()=>e.request,h=>{s.value=[],a.value=0,h?F():x()}),n.watch(()=>[i.requestPage.value,i.requestPageSize.value],()=>{if(P){P=!1;return}e.request&&F()});const W=new Proxy({},{get(h,w){if(w==="reload")return F;if(w==="search")return T;if(w==="resetFilter")return M;const C=f.value;if(!C)return;const j=C[w];return typeof j=="function"?j.bind(C):j},has(h,w){return w==="reload"||w==="search"||w==="resetFilter"?!0:f.value!=null&&w in f.value}});u(W),n.onMounted(()=>{e.request&&F()});const $=()=>Object.fromEntries(Object.entries(v).filter(([h])=>h.startsWith("filter-")).map(([h,w])=>[h.slice(7),w]));return()=>{const h=e.filter?n.h(H,{schema:e.filter.schema,modelValue:p,collapsible:!0,searchMode:!0,formConfig:{...e.filter.formConfig?.showCollapseButton?{collapseRows:1}:{},...e.filter.formConfig??{}},"onUpdate:modelValue":C=>{for(const j of Object.keys(p))delete p[j];Object.assign(p,C)},onSubmit:()=>{T()},onReset:()=>{M()}},$()):null,w=n.h(d.ElTable,{...l,ref:f,data:B.value,rowKey:S.value,spanMethod:U.value},{default:()=>ce(e.columns,v),empty:v.empty,append:v.append});return n.h("div",{class:"el-table-pro"},[h,n.withDirectives(w,[[d.vLoading,A.value]]),i.enabled.value?n.h(d.ElPagination,{currentPage:i.currentPage.value,pageSize:i.pageSize.value,total:I.value,pageSizes:[...i.config.value?.pageSizes??[]],pagerCount:i.config.value?.pagerCount,layout:i.config.value?.layout,background:i.config.value?.background,"onUpdate:currentPage":C=>{i.currentPage.value=C},"onUpdate:pageSize":C=>{i.setPageSize(C)}}):null])}}}),Qe=[ie,H,he];function pe(e){Qe.forEach(l=>{const r=l.name;r&&e.component(r,l)})}const Ye={install:pe};exports.ElButtonPro=ie;exports.ElFormPro=H;exports.ElTablePro=he;exports.TABLE_PRO_DEFAULT_PAGINATION=fe;exports.default=Ye;exports.install=pe;exports.normalizePagination=ve;
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- .el-form-pro__group{gap:4px}.el-form-pro__actions-label:after{display:inline-block;content:" "}.el-form-pro__actions{display:flex;flex-wrap:nowrap;width:100%}.el-form-pro__actions.is-start{justify-content:flex-start}.el-form-pro__actions.is-center{justify-content:center}.el-form-pro__actions.is-end{justify-content:flex-end}.el-form-pro__children{display:flex;align-items:flex-start;width:100%}.el-form-pro__child-wrapper{flex:1;min-width:0}.el-form-pro__child{margin-bottom:0}.el-form-pro__separator{flex:none;padding:0 8px;color:var(--el-text-color-secondary)}.el-table-pro{min-width:0}.el-table-pro .el-pagination{margin-top:16px}.el-table-pro .el-pagination .btn-prev{margin-left:auto}
1
+ .el-button-pro.is-block{display:flex;width:100%;margin-left:0}.el-button-pro.is-block:not(:last-child){margin-bottom:12px}.el-button-pro:has(>.el-icon)>span{margin-left:0}.el-button-pro:has(>.el-icon){gap:6px}.el-button-pro.el-button--small:has(>.el-icon){gap:4px}.el-button-pro.el-button--large:has(>.el-icon){gap:8px}.el-button-pro.has-icon-end:has(>.el-icon)>.el-icon{order:1}.el-button-pro.has-icon-end:has(>.el-icon)>span{order:0}.el-button-pro.is-gradient{position:relative;isolation:isolate;border:0}.el-button-pro.is-gradient.has-hover-gradient{background-image:var(--el-button-pro-hover-gradient)}.el-button-pro.is-gradient:after{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;background:var(--el-button-pro-gradient);opacity:1;pointer-events:none;transition:all .3s}.el-button-pro.is-gradient>span,.el-button-pro.is-gradient>.el-icon{position:relative;z-index:1}.el-button-pro.is-gradient.has-hover-gradient:not(.is-loading):not(.is-disabled):hover:after,.el-button-pro.is-gradient.has-hover-gradient:not(.is-loading):not(.is-disabled):active:after{opacity:0}.el-button-pro.is-gradient.is-disabled{background-image:none}.el-button-pro.is-gradient.is-disabled:after{display:none}.el-button-pro.is-gradient.is-loading:before{z-index:2}.el-form-pro__actions-label:after{display:inline-block;content:" "}.el-form-pro__actions{display:flex;flex-wrap:nowrap;width:100%}.el-form-pro__actions.is-start{justify-content:flex-start}.el-form-pro__actions.is-center{justify-content:center}.el-form-pro__actions.is-end{justify-content:flex-end}.el-form-pro__group{gap:4px}.el-form-pro__children{display:flex;align-items:flex-start;width:100%}.el-form-pro__child-wrapper{flex:1;min-width:0}.el-form-pro__child{margin-bottom:0}.el-form-pro__separator{flex:none;padding:0 8px;color:var(--el-text-color-secondary)}.el-table-pro{min-width:0}.el-table-pro .el-pagination{margin-top:16px}.el-table-pro .el-pagination .btn-prev{margin-left:auto}
package/dist/index.d.ts CHANGED
@@ -1,9 +1,11 @@
1
1
  import { App } from 'vue';
2
+ import { ElButtonPro } from './button-pro';
2
3
  import { ElFormPro } from './form-pro';
3
4
  import { ElTablePro } from './table-pro';
5
+ export * from './button-pro';
4
6
  export * from './form-pro';
5
7
  export * from './table-pro';
6
- export { ElFormPro, ElTablePro };
8
+ export { ElButtonPro, ElFormPro, ElTablePro };
7
9
  export declare function install(app: App): void;
8
10
  declare const _default: {
9
11
  install: typeof install;