@aspire-ui/element-component-pro 1.0.5 → 1.0.6

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
@@ -41,7 +41,7 @@ Vue.use(ElementComponentPro)
41
41
 
42
42
  ```vue
43
43
  <script setup lang="ts">
44
- import { ProTable, ProForm } from 'element-component-pro'
44
+ import { ProTable, ProForm, ProDescriptions } from 'element-component-pro'
45
45
  </script>
46
46
 
47
47
  <template>
@@ -315,6 +315,70 @@ const handleSubmit = (values) => {
315
315
  - **useForm + v-model**: 编程式 `setFieldsValue/resetFields` 与受控 `modelValue` 保持同步
316
316
  - **componentProps**: 支持函数,可获取 formModel、formActionType
317
317
 
318
+ ## ProDescriptions
319
+
320
+ 参考 [Vben Admin Description](https://doc.vvbin.cn/components/desc.html#usage),用于详情页信息展示,支持 `schema` 驱动、响应式列数、折叠以及 `useDescription` 编程式更新。
321
+
322
+ ```vue
323
+ <template>
324
+ <ProDescriptions
325
+ title="基础示例"
326
+ :column="3"
327
+ :data="detailData"
328
+ :schema="schema"
329
+ :use-collapse="true"
330
+ :collapse-options="{ canExpand: true }"
331
+ />
332
+ </template>
333
+
334
+ <script setup lang="ts">
335
+ import { ProDescriptions } from 'element-component-pro'
336
+ import type { DescriptionSchema } from 'element-component-pro'
337
+
338
+ const detailData = {
339
+ username: 'test',
340
+ nickName: 'VB',
341
+ phone: '15695909xxx',
342
+ email: '190848757@qq.com',
343
+ }
344
+
345
+ const schema: DescriptionSchema[] = [
346
+ { label: '用户名', dataIndex: 'username' },
347
+ { label: '昵称', dataIndex: 'nickName' },
348
+ { label: '联系电话', dataIndex: 'phone' },
349
+ { label: '邮箱', dataIndex: 'email' },
350
+ ]
351
+ </script>
352
+ ```
353
+
354
+ ### useDescription
355
+
356
+ ```vue
357
+ <template>
358
+ <ProDescriptions @register="register" />
359
+ </template>
360
+
361
+ <script setup lang="ts">
362
+ import { ProDescriptions, useDescription } from 'element-component-pro'
363
+
364
+ const [register, descriptionAction] = useDescription({
365
+ title: 'useDescription',
366
+ data: {
367
+ name: '张三',
368
+ status: '启用',
369
+ },
370
+ schema: [
371
+ { label: '姓名', dataIndex: 'name' },
372
+ { label: '状态', dataIndex: 'status' },
373
+ ],
374
+ })
375
+
376
+ const updateData = () => {
377
+ descriptionAction.setData({ status: '禁用' })
378
+ }
379
+ </script>
380
+ ```
381
+
318
382
  ## 示例与文档
319
383
 
320
384
  - **示例**:运行 `npm run dev` 后访问开发预览,包含 ProTable、ProForm、componentSettings 测试等示例
@@ -0,0 +1,136 @@
1
+ import { DescriptionActionType, DescriptionColumn, DescriptionProps, DescriptionSchema } from '../types';
2
+
3
+ declare function __VLS_template(): Partial<Record<string, (_: {
4
+ value: unknown;
5
+ record: Record<string, unknown>;
6
+ schema: DescriptionSchema & {
7
+ _span: number;
8
+ };
9
+ }) => any>>;
10
+ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
11
+ title?: string;
12
+ helpMessage?: string | string[];
13
+ size?: "medium" | "small";
14
+ bordered?: boolean;
15
+ column?: DescriptionColumn;
16
+ schema?: DescriptionSchema[];
17
+ data?: Record<string, unknown>;
18
+ emptyText?: string;
19
+ useCollapse?: boolean;
20
+ collapseOptions?: {
21
+ canExpand?: boolean;
22
+ defaultExpand?: boolean;
23
+ expandButtonText?: string;
24
+ collapseButtonText?: string;
25
+ helpMessage?: string | string[];
26
+ visibleRows?: number;
27
+ };
28
+ }>, {
29
+ size: string;
30
+ bordered: boolean;
31
+ column: () => {
32
+ xxl: number;
33
+ xl: number;
34
+ lg: number;
35
+ md: number;
36
+ sm: number;
37
+ xs: number;
38
+ };
39
+ schema: () => never[];
40
+ data: () => {};
41
+ emptyText: string;
42
+ useCollapse: boolean;
43
+ collapseOptions: () => {
44
+ canExpand: boolean;
45
+ defaultExpand: boolean;
46
+ expandButtonText: string;
47
+ collapseButtonText: string;
48
+ visibleRows: number;
49
+ };
50
+ }>, {
51
+ setProps: (props: Partial<DescriptionProps>) => Promise<void>;
52
+ setData: (data: Record<string, unknown>) => Promise<void>;
53
+ getData: () => Record<string, unknown>;
54
+ }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
55
+ register: (action: DescriptionActionType) => void;
56
+ }, string, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
57
+ title?: string;
58
+ helpMessage?: string | string[];
59
+ size?: "medium" | "small";
60
+ bordered?: boolean;
61
+ column?: DescriptionColumn;
62
+ schema?: DescriptionSchema[];
63
+ data?: Record<string, unknown>;
64
+ emptyText?: string;
65
+ useCollapse?: boolean;
66
+ collapseOptions?: {
67
+ canExpand?: boolean;
68
+ defaultExpand?: boolean;
69
+ expandButtonText?: string;
70
+ collapseButtonText?: string;
71
+ helpMessage?: string | string[];
72
+ visibleRows?: number;
73
+ };
74
+ }>, {
75
+ size: string;
76
+ bordered: boolean;
77
+ column: () => {
78
+ xxl: number;
79
+ xl: number;
80
+ lg: number;
81
+ md: number;
82
+ sm: number;
83
+ xs: number;
84
+ };
85
+ schema: () => never[];
86
+ data: () => {};
87
+ emptyText: string;
88
+ useCollapse: boolean;
89
+ collapseOptions: () => {
90
+ canExpand: boolean;
91
+ defaultExpand: boolean;
92
+ expandButtonText: string;
93
+ collapseButtonText: string;
94
+ visibleRows: number;
95
+ };
96
+ }>>>, {
97
+ size: "medium" | "small";
98
+ bordered: boolean;
99
+ column: DescriptionColumn;
100
+ schema: DescriptionSchema[];
101
+ data: Record<string, unknown>;
102
+ emptyText: string;
103
+ useCollapse: boolean;
104
+ collapseOptions: {
105
+ canExpand?: boolean;
106
+ defaultExpand?: boolean;
107
+ expandButtonText?: string;
108
+ collapseButtonText?: string;
109
+ helpMessage?: string | string[];
110
+ visibleRows?: number;
111
+ };
112
+ }>;
113
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
114
+ export default _default;
115
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
116
+ type __VLS_TypePropsToRuntimeProps<T> = {
117
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
118
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
119
+ } : {
120
+ type: import('vue').PropType<T[K]>;
121
+ required: true;
122
+ };
123
+ };
124
+ type __VLS_WithDefaults<P, D> = {
125
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
126
+ default: D[K];
127
+ }> : P[K];
128
+ };
129
+ type __VLS_Prettify<T> = {
130
+ [K in keyof T]: T[K];
131
+ } & {};
132
+ type __VLS_WithTemplateSlots<T, S> = T & {
133
+ new (): {
134
+ $scopedSlots: S;
135
+ };
136
+ };
@@ -0,0 +1,5 @@
1
+ import { default as ProDescriptions } from './ProDescriptions.vue';
2
+ import { useDescription } from './useDescription';
3
+
4
+ export { ProDescriptions, useDescription };
5
+ export default ProDescriptions;
@@ -0,0 +1,9 @@
1
+ import { Ref } from 'vue';
2
+ import { DescriptionActionType, DescriptionProps } from '../types';
3
+
4
+ export type UseDescriptionPropsReactive = DescriptionProps | Ref<DescriptionProps | undefined>;
5
+ export type UseDescriptionReturn = [
6
+ (instance: DescriptionActionType) => void,
7
+ DescriptionActionType
8
+ ];
9
+ export declare function useDescription(props?: UseDescriptionPropsReactive): UseDescriptionReturn;
@@ -186,6 +186,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
186
186
  };
187
187
  submitOnReset: boolean;
188
188
  }>>>, {
189
+ size: "medium" | "small" | "large";
189
190
  showActionButtonGroup: boolean;
190
191
  showSubmitButton: boolean;
191
192
  showResetButton: boolean;
@@ -198,7 +199,6 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
198
199
  labelWidth: string;
199
200
  labelPosition: "left" | "right" | "top";
200
201
  gutter: number;
201
- size: "medium" | "small" | "large";
202
202
  baseColProps: ColEx;
203
203
  autoSetPlaceholder: boolean;
204
204
  autoAdvancedLine: number;
@@ -372,11 +372,11 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
372
372
  };
373
373
  immediate: boolean;
374
374
  }>>>, {
375
- loading: boolean;
376
375
  size: "medium" | "small" | "large";
376
+ bordered: boolean;
377
+ loading: boolean;
377
378
  immediate: boolean;
378
379
  rowKey: string;
379
- bordered: boolean;
380
380
  striped: boolean;
381
381
  ellipsis: boolean;
382
382
  showIndexColumn: boolean;