@yetuzi/vue3-query-components 1.5.0 → 1.5.1
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/CHANGELOG.md +17 -0
- package/dist/index.css +1 -1
- package/dist/index.d.ts +109 -338
- package/dist/index.js +1062 -1029
- package/dist/version-info.json +7 -7
- package/package.json +1 -1
- package/dist/_virtual/_plugin-vue_export-helper.js +0 -9
- package/dist/components/CommonButton/index.vue.js +0 -40
- package/dist/components/CommonButton/index.vue2.js +0 -4
- package/dist/components/CommonCascader/index.vue.js +0 -46
- package/dist/components/CommonCascader/index.vue2.js +0 -4
- package/dist/components/CommonCheckbox/index.vue.js +0 -38
- package/dist/components/CommonCheckbox/index.vue2.js +0 -4
- package/dist/components/CommonConfigProvider/index.vue.js +0 -19
- package/dist/components/CommonConfigProvider/index.vue2.js +0 -4
- package/dist/components/CommonDatePicker/index.vue.js +0 -74
- package/dist/components/CommonDatePicker/index.vue2.js +0 -4
- package/dist/components/CommonForm/index.vue.js +0 -7
- package/dist/components/CommonForm/index.vue2.js +0 -148
- package/dist/components/CommonInput/index.vue.js +0 -38
- package/dist/components/CommonInput/index.vue2.js +0 -4
- package/dist/components/CommonInputNumber/index.vue.js +0 -45
- package/dist/components/CommonInputNumber/index.vue2.js +0 -4
- package/dist/components/CommonPagination/index.vue.js +0 -88
- package/dist/components/CommonPagination/index.vue2.js +0 -4
- package/dist/components/CommonQueryTable/index.vue.js +0 -7
- package/dist/components/CommonQueryTable/index.vue2.js +0 -132
- package/dist/components/CommonRadio/index.vue.js +0 -37
- package/dist/components/CommonRadio/index.vue2.js +0 -4
- package/dist/components/CommonSelect/index.vue.js +0 -44
- package/dist/components/CommonSelect/index.vue2.js +0 -4
- package/dist/components/CommonSwitch/index.vue.js +0 -51
- package/dist/components/CommonSwitch/index.vue2.js +0 -4
- package/dist/components/CommonTable/config.js +0 -57
- package/dist/components/CommonTable/index.vue.js +0 -7
- package/dist/components/CommonTable/index.vue2.js +0 -139
- package/dist/components/CommonTimePicker/index.vue.js +0 -72
- package/dist/components/CommonTimePicker/index.vue2.js +0 -4
- package/dist/hooks/useGetComponentsChildrenSlots.js +0 -58
- package/dist/hooks/useResettable.js +0 -20
- package/dist/provide/index.js +0 -10
- package/dist/provide/key.js +0 -4
- package/dist/utils/index.js +0 -14
package/dist/index.d.ts
CHANGED
|
@@ -64,10 +64,10 @@ onChange?: ((args_0: PaginationParam) => any) | undefined;
|
|
|
64
64
|
"onUpdate:pageSize"?: ((value: number) => any) | undefined;
|
|
65
65
|
}>, {
|
|
66
66
|
readonly background: boolean;
|
|
67
|
-
readonly teleported: EpPropMergeType<BooleanConstructor, unknown, unknown>;
|
|
68
|
-
readonly layout: string;
|
|
69
67
|
readonly total: number;
|
|
68
|
+
readonly layout: string;
|
|
70
69
|
readonly pageSizes: number[];
|
|
70
|
+
readonly teleported: EpPropMergeType<BooleanConstructor, unknown, unknown>;
|
|
71
71
|
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
|
|
72
72
|
|
|
73
73
|
declare const __VLS_component_4: DefineComponent<__VLS_PublicProps_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
|
|
@@ -109,7 +109,7 @@ declare type __VLS_PrettifyLocal_2<T> = {
|
|
|
109
109
|
[K in keyof T]: T[K];
|
|
110
110
|
} & {};
|
|
111
111
|
|
|
112
|
-
/** 组件Props
|
|
112
|
+
/** 组件 Props 定义,默认不传表单配置时使用空数组 */
|
|
113
113
|
declare type __VLS_Props = CommonQueryTableProps;
|
|
114
114
|
|
|
115
115
|
declare type __VLS_Props_10 = CommonCheckboxProps;
|
|
@@ -117,7 +117,12 @@ declare type __VLS_Props_10 = CommonCheckboxProps;
|
|
|
117
117
|
/** 组件Props定义,提供默认值 */
|
|
118
118
|
declare type __VLS_Props_11 = CommonSwitchProps;
|
|
119
119
|
|
|
120
|
-
/**
|
|
120
|
+
/**
|
|
121
|
+
* 组件 Props 定义。
|
|
122
|
+
*
|
|
123
|
+
* 在 Element Plus 原生分页属性基础上补充默认值,
|
|
124
|
+
* 让业务场景下可以直接使用常见分页布局。
|
|
125
|
+
*/
|
|
121
126
|
declare type __VLS_Props_2 = CommonPaginationProps;
|
|
122
127
|
|
|
123
128
|
/** 组件Props定义,提供默认值 */
|
|
@@ -359,9 +364,8 @@ export declare interface CommonCheckboxProps extends ExtractPublicPropTypes<Chec
|
|
|
359
364
|
export declare const CommonConfigProvider: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
360
365
|
|
|
361
366
|
/**
|
|
362
|
-
* CommonConfigProvider
|
|
363
|
-
*
|
|
364
|
-
* 使用@vue-ignore忽略Vue类型检查
|
|
367
|
+
* CommonConfigProvider 组件 Props 类型
|
|
368
|
+
* 支持以深度可选的方式覆盖任意层级配置项
|
|
365
369
|
*/
|
|
366
370
|
export declare interface CommonConfigProviderProps extends /* @vue-ignore */ DeepPartial<Config> {
|
|
367
371
|
}
|
|
@@ -398,246 +402,85 @@ export declare const CommonForm: <T extends AnyObject>(__VLS_props: NonNullable<
|
|
|
398
402
|
__ctx?: Awaited<typeof __VLS_setup>;
|
|
399
403
|
};
|
|
400
404
|
|
|
401
|
-
/**
|
|
402
|
-
* 级联选择器组件表单项
|
|
403
|
-
*
|
|
404
|
-
* @typeParam T - 表单数据对象类型
|
|
405
|
-
*
|
|
406
|
-
* @example
|
|
407
|
-
* ```ts
|
|
408
|
-
* const cascaderItem: CommonFormCascaderItem<UserData> = {
|
|
409
|
-
* is: 'cascader',
|
|
410
|
-
* prop: 'region',
|
|
411
|
-
* label: '地区',
|
|
412
|
-
* props: {
|
|
413
|
-
* options: regionOptions,
|
|
414
|
-
* props: {
|
|
415
|
-
* value: 'code',
|
|
416
|
-
* label: 'name',
|
|
417
|
-
* children: 'children'
|
|
418
|
-
* }
|
|
419
|
-
* }
|
|
420
|
-
* }
|
|
421
|
-
* ```
|
|
422
|
-
*/
|
|
405
|
+
/** 级联选择器表单项 */
|
|
423
406
|
export declare interface CommonFormCascaderItem<T extends AnyObject> extends CommonFormItemBase<'cascader', CommonCascaderProps, T> {
|
|
424
407
|
}
|
|
425
408
|
|
|
426
|
-
/**
|
|
427
|
-
* 多选框组件表单项
|
|
428
|
-
*
|
|
429
|
-
* @typeParam T - 表单数据对象类型
|
|
430
|
-
*
|
|
431
|
-
* @example
|
|
432
|
-
* ```ts
|
|
433
|
-
* const checkboxItem: CommonFormCheckboxItem<UserData> = {
|
|
434
|
-
* is: 'check-box',
|
|
435
|
-
* prop: 'hobbies',
|
|
436
|
-
* label: '爱好',
|
|
437
|
-
* props: {
|
|
438
|
-
* options: [
|
|
439
|
-
* { label: '阅读', value: 'reading' },
|
|
440
|
-
* { label: '运动', value: 'sports' }
|
|
441
|
-
* ]
|
|
442
|
-
* }
|
|
443
|
-
* }
|
|
444
|
-
* ```
|
|
445
|
-
*/
|
|
409
|
+
/** 多选框表单项 */
|
|
446
410
|
export declare interface CommonFormCheckboxItem<T extends AnyObject> extends CommonFormItemBase<'check-box', CommonCheckboxProps, T> {
|
|
447
411
|
}
|
|
448
412
|
|
|
449
413
|
/**
|
|
450
414
|
* 自定义组件表单项
|
|
451
|
-
*
|
|
452
|
-
*
|
|
453
|
-
* @typeParam T - 表单数据对象类型
|
|
454
|
-
* @typeParam C - 自定义组件类型,默认为 Component
|
|
455
|
-
* @typeParam P - 组件 Props 类型,默认从组件推导
|
|
456
|
-
*
|
|
457
|
-
* @example
|
|
458
|
-
* ```ts
|
|
459
|
-
* import MyCustomComponent from './MyCustomComponent.vue'
|
|
460
|
-
*
|
|
461
|
-
* const customItem: CommonFormCustomItem<UserData> = {
|
|
462
|
-
* is: MyCustomComponent,
|
|
463
|
-
* prop: 'custom',
|
|
464
|
-
* label: '自定义字段',
|
|
465
|
-
* props: {
|
|
466
|
-
* // 传递给自定义组件的属性
|
|
467
|
-
* customProp: 'value'
|
|
468
|
-
* }
|
|
469
|
-
* }
|
|
470
|
-
* ```
|
|
415
|
+
* 允许任意 Vue 组件作为表单项渲染
|
|
471
416
|
*/
|
|
472
417
|
export declare interface CommonFormCustomItem<T extends AnyObject, C extends Component = Component, P = ComponentProps<C>> extends CommonFormItemBase<C, P, T> {
|
|
473
418
|
}
|
|
474
419
|
|
|
475
420
|
/**
|
|
476
421
|
* 表单数据类型
|
|
477
|
-
*
|
|
422
|
+
* 既支持通过已知字段访问,也允许额外的动态字段
|
|
478
423
|
*
|
|
479
424
|
* @typeParam T - 表单数据对象类型
|
|
480
425
|
*/
|
|
481
426
|
export declare type CommonFormData<T extends AnyObject> = T & Record<string, any>;
|
|
482
427
|
|
|
483
|
-
/**
|
|
484
|
-
* 日期选择器组件表单项
|
|
485
|
-
*
|
|
486
|
-
* @typeParam T - 表单数据对象类型
|
|
487
|
-
*
|
|
488
|
-
* @example
|
|
489
|
-
* ```ts
|
|
490
|
-
* const dateItem: CommonFormDatePickerItem<UserData> = {
|
|
491
|
-
* is: 'date-picker',
|
|
492
|
-
* prop: 'birthday',
|
|
493
|
-
* label: '生日',
|
|
494
|
-
* props: {
|
|
495
|
-
* type: 'date',
|
|
496
|
-
* placeholder: '请选择日期'
|
|
497
|
-
* }
|
|
498
|
-
* }
|
|
499
|
-
* ```
|
|
500
|
-
*/
|
|
428
|
+
/** 日期选择器表单项 */
|
|
501
429
|
export declare interface CommonFormDatePickerItem<T extends AnyObject> extends CommonFormItemBase<'date-picker', CommonDatePickerProps, T> {
|
|
502
430
|
}
|
|
503
431
|
|
|
504
432
|
/**
|
|
505
|
-
* CommonForm
|
|
506
|
-
* 继承 Element Plus FormInstance
|
|
433
|
+
* CommonForm 暴露实例类型
|
|
434
|
+
* 继承 Element Plus `FormInstance`,并附带 `formData`
|
|
507
435
|
*
|
|
508
|
-
* @typeParam T -
|
|
509
|
-
*
|
|
510
|
-
* @example
|
|
511
|
-
* ```vue
|
|
512
|
-
* <script setup lang="ts">
|
|
513
|
-
* import { ref } from 'vue'
|
|
514
|
-
*
|
|
515
|
-
* const formRef = ref<CommonFormExpose<UserData>>()
|
|
516
|
-
*
|
|
517
|
-
* const handleSubmit = async () => {
|
|
518
|
-
* // 调用 FormInstance 方法
|
|
519
|
-
* await formRef.value?.validate()
|
|
520
|
-
*
|
|
521
|
-
* // 访问表单数据
|
|
522
|
-
* console.log(formRef.value?.formData)
|
|
523
|
-
* }
|
|
524
|
-
* </script>
|
|
525
|
-
* ```
|
|
436
|
+
* @typeParam T - 表单数据对象类型
|
|
526
437
|
*/
|
|
527
438
|
export declare interface CommonFormExpose<T extends AnyObject = AnyObject> extends FormInstance {
|
|
528
|
-
/**
|
|
529
|
-
* 表单数据响应式对象
|
|
530
|
-
* 包含所有表单字段的当前值
|
|
531
|
-
*/
|
|
439
|
+
/** 当前表单响应式数据对象 */
|
|
532
440
|
formData: Reactive<CommonFormData<T>>;
|
|
533
441
|
}
|
|
534
442
|
|
|
535
|
-
/**
|
|
536
|
-
* 输入框组件表单项
|
|
537
|
-
*
|
|
538
|
-
* @typeParam T - 表单数据对象类型
|
|
539
|
-
*
|
|
540
|
-
* @example
|
|
541
|
-
* ```ts
|
|
542
|
-
* const inputItem: CommonFormInputItem<UserData> = {
|
|
543
|
-
* is: 'input',
|
|
544
|
-
* prop: 'name',
|
|
545
|
-
* label: '姓名',
|
|
546
|
-
* props: {
|
|
547
|
-
* placeholder: '请输入姓名',
|
|
548
|
-
* clearable: true
|
|
549
|
-
* }
|
|
550
|
-
* }
|
|
551
|
-
* ```
|
|
552
|
-
*/
|
|
443
|
+
/** 输入框表单项 */
|
|
553
444
|
export declare interface CommonFormInputItem<T extends AnyObject> extends CommonFormItemBase<'input', CommonInputProps, T> {
|
|
554
445
|
}
|
|
555
446
|
|
|
556
|
-
/**
|
|
557
|
-
* 数字输入框组件表单项
|
|
558
|
-
*
|
|
559
|
-
* @typeParam T - 表单数据对象类型
|
|
560
|
-
*
|
|
561
|
-
* @example
|
|
562
|
-
* ```ts
|
|
563
|
-
* const inputNumberItem: CommonFormInputNumberItem<UserData> = {
|
|
564
|
-
* is: 'input-number',
|
|
565
|
-
* prop: 'age',
|
|
566
|
-
* label: '年龄',
|
|
567
|
-
* props: {
|
|
568
|
-
* min: 0,
|
|
569
|
-
* max: 150,
|
|
570
|
-
* step: 1
|
|
571
|
-
* }
|
|
572
|
-
* }
|
|
573
|
-
* ```
|
|
574
|
-
*/
|
|
447
|
+
/** 数字输入框表单项 */
|
|
575
448
|
export declare interface CommonFormInputNumberItem<T extends AnyObject> extends CommonFormItemBase<'input-number', CommonInputNumberProps, T> {
|
|
576
449
|
}
|
|
577
450
|
|
|
578
451
|
/**
|
|
579
|
-
*
|
|
580
|
-
* 用于 CommonForm 的 form
|
|
452
|
+
* 表单项数组类型
|
|
453
|
+
* 用于 CommonForm 的 `form` 属性,也可用于独立类型标注
|
|
581
454
|
*
|
|
582
455
|
* @typeParam T - 表单数据对象类型
|
|
583
|
-
*
|
|
584
|
-
* @example
|
|
585
|
-
* ```ts
|
|
586
|
-
* import type { CommonFormItemArray } from '@yetuzi/vue3-query-components'
|
|
587
|
-
*
|
|
588
|
-
* const form: CommonFormItemArray<MyDataType> = [
|
|
589
|
-
* { is: 'input', prop: 'name', label: '用户名' },
|
|
590
|
-
* { is: 'select', prop: 'status', label: '状态' }
|
|
591
|
-
* ]
|
|
592
|
-
* ```
|
|
593
456
|
*/
|
|
594
457
|
export declare type CommonFormItemArray<T extends AnyObject> = Array<CommonFormSelectItem<T> | CommonFormInputItem<T> | CommonFormInputNumberItem<T> | CommonFormDatePickerItem<T> | CommonFormTimePickerItem<T> | CommonFormCascaderItem<T> | CommonFormRadioItem<T> | CommonFormCustomItem<T> | CommonFormCheckboxItem<T> | CommonFormSwitchItem<T>>;
|
|
595
458
|
|
|
596
459
|
/**
|
|
597
460
|
* 表单项基础接口
|
|
598
|
-
*
|
|
461
|
+
* 定义所有表单项共享的公共属性
|
|
599
462
|
*
|
|
600
|
-
* @typeParam T -
|
|
601
|
-
* @typeParam P -
|
|
463
|
+
* @typeParam T - 组件类型,可以是内置字符串标识或自定义组件
|
|
464
|
+
* @typeParam P - 组件 Props 类型
|
|
602
465
|
* @typeParam D - 表单数据对象类型
|
|
603
|
-
* @typeParam V -
|
|
604
|
-
*
|
|
605
|
-
* @example 内置组件
|
|
606
|
-
* ```ts
|
|
607
|
-
* const inputItem: CommonFormInputItem<UserData> = {
|
|
608
|
-
* is: 'input',
|
|
609
|
-
* prop: 'name',
|
|
610
|
-
* label: '姓名'
|
|
611
|
-
* }
|
|
612
|
-
* ```
|
|
613
|
-
*
|
|
614
|
-
* @example 自定义组件
|
|
615
|
-
* ```ts
|
|
616
|
-
* import MyComponent from './MyComponent.vue'
|
|
617
|
-
*
|
|
618
|
-
* const customItem: CommonFormCustomItem<UserData> = {
|
|
619
|
-
* is: MyComponent,
|
|
620
|
-
* prop: 'custom',
|
|
621
|
-
* label: '自定义字段'
|
|
622
|
-
* }
|
|
623
|
-
* ```
|
|
466
|
+
* @typeParam V - 初始值类型
|
|
624
467
|
*/
|
|
625
468
|
declare interface CommonFormItemBase<T, P, D extends AnyObject, V = any> {
|
|
626
469
|
/**
|
|
627
470
|
* 组件类型标识
|
|
628
|
-
* -
|
|
471
|
+
* - 内置组件:`input`、`input-number`、`select`、`date-picker`、`time-picker`、`cascader`、`radio`、`check-box`、`switch`
|
|
629
472
|
* - 自定义组件:直接传入组件对象
|
|
630
473
|
*/
|
|
631
474
|
is: T | (string & {});
|
|
632
475
|
/** 表单项标签 */
|
|
633
476
|
label?: string;
|
|
634
|
-
/**
|
|
477
|
+
/** 表单字段名 */
|
|
635
478
|
prop: keyof D | (string & {});
|
|
636
479
|
/** 传递给组件的额外属性 */
|
|
637
480
|
props?: Partial<P>;
|
|
638
481
|
/** 字段初始值 */
|
|
639
482
|
initialValue?: V;
|
|
640
|
-
/** ElFormItem
|
|
483
|
+
/** ElFormItem 的额外配置,不包含 `prop` 和 `label` */
|
|
641
484
|
formItem?: Partial<Omit<FormItemProps, 'prop' | 'label'>>;
|
|
642
485
|
}
|
|
643
486
|
|
|
@@ -645,100 +488,25 @@ declare interface CommonFormItemBase<T, P, D extends AnyObject, V = any> {
|
|
|
645
488
|
* CommonForm 组件 Props
|
|
646
489
|
*
|
|
647
490
|
* @typeParam T - 表单数据对象类型
|
|
648
|
-
*
|
|
649
|
-
* @example
|
|
650
|
-
* ```vue
|
|
651
|
-
* <template>
|
|
652
|
-
* <CommonForm :form="formConfig" v-model="formData" />
|
|
653
|
-
* </template>
|
|
654
|
-
* ```
|
|
655
491
|
*/
|
|
656
492
|
export declare interface CommonFormProps<T extends AnyObject> extends ExtractPropTypes<FormProps> {
|
|
657
493
|
/** 表单项配置数组 */
|
|
658
494
|
form?: CommonFormItemArray<T>;
|
|
659
495
|
}
|
|
660
496
|
|
|
661
|
-
/**
|
|
662
|
-
* 单选框组件表单项
|
|
663
|
-
*
|
|
664
|
-
* @typeParam T - 表单数据对象类型
|
|
665
|
-
*
|
|
666
|
-
* @example
|
|
667
|
-
* ```ts
|
|
668
|
-
* const radioItem: CommonFormRadioItem<UserData> = {
|
|
669
|
-
* is: 'radio',
|
|
670
|
-
* prop: 'gender',
|
|
671
|
-
* label: '性别',
|
|
672
|
-
* props: {
|
|
673
|
-
* options: [
|
|
674
|
-
* { label: '男', value: 'male' },
|
|
675
|
-
* { label: '女', value: 'female' }
|
|
676
|
-
* ]
|
|
677
|
-
* }
|
|
678
|
-
* }
|
|
679
|
-
* ```
|
|
680
|
-
*/
|
|
497
|
+
/** 单选框表单项 */
|
|
681
498
|
export declare interface CommonFormRadioItem<T extends AnyObject> extends CommonFormItemBase<'radio', CommonRadioProps, T> {
|
|
682
499
|
}
|
|
683
500
|
|
|
684
|
-
/**
|
|
685
|
-
* 选择器组件表单项
|
|
686
|
-
*
|
|
687
|
-
* @typeParam T - 表单数据对象类型
|
|
688
|
-
*
|
|
689
|
-
* @example
|
|
690
|
-
* ```ts
|
|
691
|
-
* const selectItem: CommonFormSelectItem<UserData> = {
|
|
692
|
-
* is: 'select',
|
|
693
|
-
* prop: 'city',
|
|
694
|
-
* label: '城市',
|
|
695
|
-
* props: {
|
|
696
|
-
* options: [
|
|
697
|
-
* { label: '北京', value: 'beijing' },
|
|
698
|
-
* { label: '上海', value: 'shanghai' }
|
|
699
|
-
* ]
|
|
700
|
-
* }
|
|
701
|
-
* }
|
|
702
|
-
* ```
|
|
703
|
-
*/
|
|
501
|
+
/** 选择器表单项 */
|
|
704
502
|
export declare interface CommonFormSelectItem<T extends AnyObject> extends CommonFormItemBase<'select', CommonSelectProps, T> {
|
|
705
503
|
}
|
|
706
504
|
|
|
707
|
-
/**
|
|
708
|
-
* 开关组件表单项
|
|
709
|
-
*
|
|
710
|
-
* @typeParam T - 表单数据对象类型
|
|
711
|
-
*
|
|
712
|
-
* @example
|
|
713
|
-
* ```ts
|
|
714
|
-
* const switchItem: CommonFormSwitchItem<UserData> = {
|
|
715
|
-
* is: 'switch',
|
|
716
|
-
* prop: 'enabled',
|
|
717
|
-
* label: '是否启用',
|
|
718
|
-
* initialValue: true
|
|
719
|
-
* }
|
|
720
|
-
* ```
|
|
721
|
-
*/
|
|
505
|
+
/** 开关表单项 */
|
|
722
506
|
export declare interface CommonFormSwitchItem<T extends AnyObject> extends CommonFormItemBase<'switch', CommonSwitchProps, T> {
|
|
723
507
|
}
|
|
724
508
|
|
|
725
|
-
/**
|
|
726
|
-
* 时间选择器组件表单项
|
|
727
|
-
*
|
|
728
|
-
* @typeParam T - 表单数据对象类型
|
|
729
|
-
*
|
|
730
|
-
* @example
|
|
731
|
-
* ```ts
|
|
732
|
-
* const timeItem: CommonFormTimePickerItem<UserData> = {
|
|
733
|
-
* is: 'time-picker',
|
|
734
|
-
* prop: 'startTime',
|
|
735
|
-
* label: '开始时间',
|
|
736
|
-
* props: {
|
|
737
|
-
* placeholder: '请选择时间'
|
|
738
|
-
* }
|
|
739
|
-
* }
|
|
740
|
-
* ```
|
|
741
|
-
*/
|
|
509
|
+
/** 时间选择器表单项 */
|
|
742
510
|
export declare interface CommonFormTimePickerItem<T extends AnyObject> extends CommonFormItemBase<'time-picker', CommonTimePickerProps, T> {
|
|
743
511
|
}
|
|
744
512
|
|
|
@@ -761,9 +529,10 @@ export declare interface CommonInputProps extends /* @vue-ignore */ ExtractDefau
|
|
|
761
529
|
export declare const CommonPagination: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
|
|
762
530
|
|
|
763
531
|
/**
|
|
764
|
-
* CommonPagination
|
|
765
|
-
*
|
|
766
|
-
* Element Plus
|
|
532
|
+
* `CommonPagination` 组件属性类型。
|
|
533
|
+
*
|
|
534
|
+
* 组件在 Element Plus `PaginationProps` 基础上做轻量封装,
|
|
535
|
+
* 因此直接复用其大部分属性定义,并将字段统一声明为可选。
|
|
767
536
|
*/
|
|
768
537
|
export declare interface CommonPaginationProps extends Partial<PaginationProps> {
|
|
769
538
|
}
|
|
@@ -771,36 +540,32 @@ export declare interface CommonPaginationProps extends Partial<PaginationProps>
|
|
|
771
540
|
export declare const CommonQueryTable: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
|
|
772
541
|
|
|
773
542
|
/**
|
|
774
|
-
* CommonQueryTable
|
|
543
|
+
* CommonQueryTable 组件暴露方法
|
|
544
|
+
* 可通过 `ref` 直接调用
|
|
545
|
+
*
|
|
546
|
+
* @typeParam T - 表格行数据类型
|
|
775
547
|
*/
|
|
776
548
|
export declare interface CommonQueryTableExpose<T = AnyObject> {
|
|
777
|
-
/**
|
|
778
|
-
* 刷新列表数据
|
|
779
|
-
* 使用当前查询条件和分页参数重新请求数据
|
|
780
|
-
*/
|
|
549
|
+
/** 使用当前条件刷新列表数据 */
|
|
781
550
|
refresh: () => void;
|
|
782
|
-
/**
|
|
783
|
-
* 重置查询条件和分页
|
|
784
|
-
* 重置表单字段到初始值,重置分页到第一页,并重新请求数据
|
|
785
|
-
*/
|
|
551
|
+
/** 重置查询条件和分页,并重新获取列表数据 */
|
|
786
552
|
reset: () => void;
|
|
787
|
-
/**
|
|
788
|
-
* 获取表单数据
|
|
789
|
-
* @returns 当前表单的值对象
|
|
790
|
-
*/
|
|
553
|
+
/** 获取当前表单数据 */
|
|
791
554
|
getFormData: () => Partial<T>;
|
|
792
|
-
/**
|
|
793
|
-
* 获取表格选中的行数据
|
|
794
|
-
* @returns 选中的行数据数组
|
|
795
|
-
*/
|
|
555
|
+
/** 获取当前表格选中行数据 */
|
|
796
556
|
getSelectionRows: () => T[];
|
|
797
557
|
}
|
|
798
558
|
|
|
559
|
+
/**
|
|
560
|
+
* CommonQueryTable 组件 Props
|
|
561
|
+
* 将查询表单、数据表格和分页能力组合到一个组件中
|
|
562
|
+
*
|
|
563
|
+
* @typeParam T - 表格行数据类型
|
|
564
|
+
*/
|
|
799
565
|
export declare interface CommonQueryTableProps<T extends AnyObject = AnyObject> {
|
|
800
566
|
/**
|
|
801
567
|
* 数据获取函数
|
|
802
|
-
*
|
|
803
|
-
* @returns Promise 包含数据列表和总数的对象
|
|
568
|
+
* 接收查询参数并返回包含列表和总数的 Promise
|
|
804
569
|
*/
|
|
805
570
|
fetch: (params?: ListParam) => Promise<{
|
|
806
571
|
list: T[];
|
|
@@ -808,12 +573,12 @@ export declare interface CommonQueryTableProps<T extends AnyObject = AnyObject>
|
|
|
808
573
|
}>;
|
|
809
574
|
/**
|
|
810
575
|
* 表单配置数组
|
|
811
|
-
*
|
|
576
|
+
* 用于定义查询表单的字段结构和属性
|
|
812
577
|
*/
|
|
813
578
|
form?: CommonFormItemArray<T>;
|
|
814
579
|
/**
|
|
815
580
|
* 表格列配置
|
|
816
|
-
*
|
|
581
|
+
* 定义列表表格的列结构与展示方式
|
|
817
582
|
*/
|
|
818
583
|
columns: CommonTableColumn<T>;
|
|
819
584
|
}
|
|
@@ -875,7 +640,7 @@ export declare const CommonTable: <T extends AnyObject>(__VLS_props: NonNullable
|
|
|
875
640
|
row: any;
|
|
876
641
|
column: any;
|
|
877
642
|
index: any;
|
|
878
|
-
value:
|
|
643
|
+
value: T[keyof T] | undefined;
|
|
879
644
|
}) => any>> & {
|
|
880
645
|
empty?(_: {}): any;
|
|
881
646
|
};
|
|
@@ -885,10 +650,10 @@ export declare const CommonTable: <T extends AnyObject>(__VLS_props: NonNullable
|
|
|
885
650
|
};
|
|
886
651
|
|
|
887
652
|
/**
|
|
888
|
-
*
|
|
889
|
-
* 用于 CommonTable 的 columns
|
|
653
|
+
* 表格列数组类型
|
|
654
|
+
* 用于 CommonTable 的 `columns` 属性,也可用于独立类型标注
|
|
890
655
|
*
|
|
891
|
-
* @typeParam T -
|
|
656
|
+
* @typeParam T - 表格行数据类型
|
|
892
657
|
*
|
|
893
658
|
* @example
|
|
894
659
|
* ```ts
|
|
@@ -897,7 +662,7 @@ export declare const CommonTable: <T extends AnyObject>(__VLS_props: NonNullable
|
|
|
897
662
|
* const columns: CommonTableArrayColumns<MyDataType> = [
|
|
898
663
|
* { prop: 'id', label: 'ID', type: 'index' },
|
|
899
664
|
* { prop: 'name', label: '用户名' },
|
|
900
|
-
* { prop: 'createTime', label: '创建时间', type: 'dateTime' }
|
|
665
|
+
* { prop: 'createTime', label: '创建时间', type: 'dateTime' },
|
|
901
666
|
* ]
|
|
902
667
|
* ```
|
|
903
668
|
*/
|
|
@@ -905,15 +670,15 @@ export declare type CommonTableArrayColumns<T extends AnyObject> = Array<CommonT
|
|
|
905
670
|
|
|
906
671
|
/**
|
|
907
672
|
* 表格列配置类型
|
|
908
|
-
*
|
|
673
|
+
* 支持数组形式和对象形式两种列配置写法
|
|
909
674
|
*
|
|
910
|
-
* @typeParam T -
|
|
675
|
+
* @typeParam T - 表格行数据类型
|
|
911
676
|
*
|
|
912
677
|
* @example 数组形式
|
|
913
678
|
* ```ts
|
|
914
679
|
* const columns: CommonTableArrayColumns<UserData> = [
|
|
915
680
|
* { prop: 'name', label: '姓名' },
|
|
916
|
-
* { prop: 'age', label: '年龄' }
|
|
681
|
+
* { prop: 'age', label: '年龄' },
|
|
917
682
|
* ]
|
|
918
683
|
* ```
|
|
919
684
|
*
|
|
@@ -921,33 +686,34 @@ export declare type CommonTableArrayColumns<T extends AnyObject> = Array<CommonT
|
|
|
921
686
|
* ```ts
|
|
922
687
|
* const columns: CommonTableObjectColumns<UserData> = {
|
|
923
688
|
* name: { prop: 'name', label: '姓名' },
|
|
924
|
-
* age: { prop: 'age', label: '年龄' }
|
|
689
|
+
* age: { prop: 'age', label: '年龄' },
|
|
925
690
|
* }
|
|
926
691
|
* ```
|
|
927
692
|
*/
|
|
928
693
|
export declare type CommonTableColumn<T extends AnyObject> = CommonTableArrayColumns<T> | CommonTableObjectColumns<T>;
|
|
929
694
|
|
|
930
695
|
/**
|
|
931
|
-
*
|
|
932
|
-
*
|
|
696
|
+
* 表格列根类型
|
|
697
|
+
* 包含所有列类型的联合定义
|
|
933
698
|
*
|
|
934
|
-
* @typeParam T -
|
|
699
|
+
* @typeParam T - 表格行数据类型
|
|
935
700
|
*/
|
|
936
701
|
export declare type CommonTableColumnRoot<T extends AnyObject> = TableColumnBase<T> | TableColumnTypeDefault<T> | TableColumnTypeIndex<T> | TableColumnTypeSelection<T> | TableColumnTypeExpand<T> | TableColumnTypeDate<T> | TableColumnTypeDateTime<T> | TableColumnTypeDict<T>;
|
|
937
702
|
|
|
938
703
|
/**
|
|
939
704
|
* 表格列类型标识
|
|
940
|
-
* 从 CommonTableColumnRoot 中自动提取 type
|
|
705
|
+
* 从 `CommonTableColumnRoot` 中自动提取 `type` 字段类型
|
|
941
706
|
*
|
|
942
707
|
* @example
|
|
943
708
|
* ```ts
|
|
944
709
|
* let columnType: CommonTableColumnType
|
|
945
710
|
*
|
|
946
|
-
* columnType = 'index'
|
|
947
|
-
* columnType = 'selection'
|
|
948
|
-
* columnType = 'expand'
|
|
949
|
-
* columnType = 'date'
|
|
950
|
-
* columnType = 'dateTime'
|
|
711
|
+
* columnType = 'index'
|
|
712
|
+
* columnType = 'selection'
|
|
713
|
+
* columnType = 'expand'
|
|
714
|
+
* columnType = 'date'
|
|
715
|
+
* columnType = 'dateTime'
|
|
716
|
+
* columnType = 'dict'
|
|
951
717
|
* ```
|
|
952
718
|
*/
|
|
953
719
|
export declare type CommonTableColumnType = Extract<CommonTableColumnRoot<AnyObject>, {
|
|
@@ -962,6 +728,7 @@ export declare type CommonTableColumnType = Extract<CommonTableColumnRoot<AnyObj
|
|
|
962
728
|
* ```vue
|
|
963
729
|
* <script setup lang="ts">
|
|
964
730
|
* import { ref } from 'vue'
|
|
731
|
+
* import type { CommonTableExpose } from '@yetuzi/vue3-query-components'
|
|
965
732
|
*
|
|
966
733
|
* const tableRef = ref<CommonTableExpose>()
|
|
967
734
|
*
|
|
@@ -980,15 +747,15 @@ export declare interface CommonTableExpose extends TableInstance {
|
|
|
980
747
|
|
|
981
748
|
/**
|
|
982
749
|
* 表格列对象形式类型
|
|
983
|
-
*
|
|
750
|
+
* 以键值对的方式配置列,键名通常会作为默认 prop 使用
|
|
984
751
|
*
|
|
985
|
-
* @typeParam T -
|
|
752
|
+
* @typeParam T - 表格行数据类型
|
|
986
753
|
*
|
|
987
754
|
* @example
|
|
988
755
|
* ```ts
|
|
989
756
|
* const columns: CommonTableObjectColumns<UserData> = {
|
|
990
757
|
* name: { prop: 'name', label: '姓名' },
|
|
991
|
-
* age: { prop: 'age', label: '年龄' }
|
|
758
|
+
* age: { prop: 'age', label: '年龄' },
|
|
992
759
|
* }
|
|
993
760
|
* ```
|
|
994
761
|
*/
|
|
@@ -996,9 +763,9 @@ declare type CommonTableObjectColumns<T extends AnyObject> = Record<keyof T | (s
|
|
|
996
763
|
|
|
997
764
|
/**
|
|
998
765
|
* CommonTable 组件 Props
|
|
999
|
-
* 基于 Element Plus Table
|
|
766
|
+
* 基于 Element Plus Table 封装,提供开箱即用的表格能力
|
|
1000
767
|
*
|
|
1001
|
-
* @typeParam T -
|
|
768
|
+
* @typeParam T - 表格行数据类型
|
|
1002
769
|
*
|
|
1003
770
|
* @example
|
|
1004
771
|
* ```vue
|
|
@@ -1018,10 +785,10 @@ declare type CommonTableObjectColumns<T extends AnyObject> = Record<keyof T | (s
|
|
|
1018
785
|
* const columns: CommonTableArrayColumns<UserData> = [
|
|
1019
786
|
* { prop: 'id', label: 'ID', type: 'index' },
|
|
1020
787
|
* { prop: 'name', label: '姓名' },
|
|
1021
|
-
* { prop: 'email', label: '邮箱' }
|
|
788
|
+
* { prop: 'email', label: '邮箱' },
|
|
1022
789
|
* ]
|
|
1023
790
|
*
|
|
1024
|
-
* const tableData: UserData[] = [
|
|
791
|
+
* const tableData: UserData[] = []
|
|
1025
792
|
* </script>
|
|
1026
793
|
* ```
|
|
1027
794
|
*/
|
|
@@ -1202,10 +969,10 @@ export declare type ListParam<T extends AnyObject = AnyObject> = PaginationParam
|
|
|
1202
969
|
*/
|
|
1203
970
|
export declare type OptionalFields<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
|
|
1204
971
|
|
|
1205
|
-
/** 当前页码,支持v-model
|
|
972
|
+
/** 当前页码,支持 `v-model:pageNo`。 */
|
|
1206
973
|
declare const pageNo: ModelRef<number, string, number, number>;
|
|
1207
974
|
|
|
1208
|
-
/**
|
|
975
|
+
/** 每页条数,支持 `v-model:pageSize`。 */
|
|
1209
976
|
declare const pageSize: ModelRef<number, string, number, number>;
|
|
1210
977
|
|
|
1211
978
|
/**
|
|
@@ -1235,9 +1002,9 @@ export declare type RequiredSomeFields<T extends object, K extends keyof T> = Om
|
|
|
1235
1002
|
|
|
1236
1003
|
/**
|
|
1237
1004
|
* 表格列基础接口
|
|
1238
|
-
*
|
|
1005
|
+
* 定义所有列类型共享的公共属性
|
|
1239
1006
|
*
|
|
1240
|
-
* @typeParam T -
|
|
1007
|
+
* @typeParam T - 表格行数据类型
|
|
1241
1008
|
*/
|
|
1242
1009
|
declare interface TableColumnBase<T extends AnyObject> extends Partial<Omit<TableColumnCtx<T>, 'prop' | 'type'>> {
|
|
1243
1010
|
/** 列字段名,支持数据类型的 key 或任意字符串 */
|
|
@@ -1250,14 +1017,14 @@ declare interface TableColumnBase<T extends AnyObject> extends Partial<Omit<Tabl
|
|
|
1250
1017
|
* 日期列类型
|
|
1251
1018
|
* 自动格式化日期显示
|
|
1252
1019
|
*
|
|
1253
|
-
* @typeParam T -
|
|
1020
|
+
* @typeParam T - 表格行数据类型
|
|
1254
1021
|
*
|
|
1255
1022
|
* @example
|
|
1256
1023
|
* ```ts
|
|
1257
1024
|
* const dateColumn: TableColumnTypeDate<UserData> = {
|
|
1258
1025
|
* type: 'date',
|
|
1259
1026
|
* prop: 'createTime',
|
|
1260
|
-
* label: '创建日期'
|
|
1027
|
+
* label: '创建日期',
|
|
1261
1028
|
* }
|
|
1262
1029
|
* ```
|
|
1263
1030
|
*/
|
|
@@ -1269,14 +1036,14 @@ declare interface TableColumnTypeDate<T extends AnyObject> extends TableColumnBa
|
|
|
1269
1036
|
* 日期时间列类型
|
|
1270
1037
|
* 自动格式化日期时间显示
|
|
1271
1038
|
*
|
|
1272
|
-
* @typeParam T -
|
|
1039
|
+
* @typeParam T - 表格行数据类型
|
|
1273
1040
|
*
|
|
1274
1041
|
* @example
|
|
1275
1042
|
* ```ts
|
|
1276
1043
|
* const dateTimeColumn: TableColumnTypeDateTime<UserData> = {
|
|
1277
1044
|
* type: 'dateTime',
|
|
1278
1045
|
* prop: 'updateTime',
|
|
1279
|
-
* label: '更新时间'
|
|
1046
|
+
* label: '更新时间',
|
|
1280
1047
|
* }
|
|
1281
1048
|
* ```
|
|
1282
1049
|
*/
|
|
@@ -1284,6 +1051,10 @@ declare interface TableColumnTypeDateTime<T extends AnyObject> extends TableColu
|
|
|
1284
1051
|
type: 'dateTime';
|
|
1285
1052
|
}
|
|
1286
1053
|
|
|
1054
|
+
/**
|
|
1055
|
+
* 默认列类型
|
|
1056
|
+
* 普通数据列,通常只需要配置 `prop`、`label` 等基础属性
|
|
1057
|
+
*/
|
|
1287
1058
|
declare interface TableColumnTypeDefault<T extends AnyObject> extends OptionalFields<TableColumnBase<T>, 'prop'> {
|
|
1288
1059
|
type: 'default';
|
|
1289
1060
|
}
|
|
@@ -1292,7 +1063,7 @@ declare interface TableColumnTypeDefault<T extends AnyObject> extends OptionalFi
|
|
|
1292
1063
|
* 字典列类型
|
|
1293
1064
|
* 根据配置的字典选项,将值转换为对应的标签显示
|
|
1294
1065
|
*
|
|
1295
|
-
* @typeParam T -
|
|
1066
|
+
* @typeParam T - 表格行数据类型
|
|
1296
1067
|
*
|
|
1297
1068
|
* @example 使用 options
|
|
1298
1069
|
* ```ts
|
|
@@ -1302,8 +1073,8 @@ declare interface TableColumnTypeDefault<T extends AnyObject> extends OptionalFi
|
|
|
1302
1073
|
* label: '状态',
|
|
1303
1074
|
* options: [
|
|
1304
1075
|
* { label: '启用', value: 1 },
|
|
1305
|
-
* { label: '禁用', value: 0 }
|
|
1306
|
-
* ]
|
|
1076
|
+
* { label: '禁用', value: 0 },
|
|
1077
|
+
* ],
|
|
1307
1078
|
* }
|
|
1308
1079
|
* ```
|
|
1309
1080
|
*
|
|
@@ -1313,7 +1084,7 @@ declare interface TableColumnTypeDefault<T extends AnyObject> extends OptionalFi
|
|
|
1313
1084
|
* type: 'dict',
|
|
1314
1085
|
* prop: 'gender',
|
|
1315
1086
|
* label: '性别',
|
|
1316
|
-
* dictName: 'gender'
|
|
1087
|
+
* dictName: 'gender',
|
|
1317
1088
|
* }
|
|
1318
1089
|
* ```
|
|
1319
1090
|
*/
|
|
@@ -1330,15 +1101,15 @@ export declare interface TableColumnTypeDict<T extends AnyObject> extends TableC
|
|
|
1330
1101
|
|
|
1331
1102
|
/**
|
|
1332
1103
|
* 展开列类型
|
|
1333
|
-
*
|
|
1104
|
+
* 提供行展开能力
|
|
1334
1105
|
*
|
|
1335
|
-
* @typeParam T -
|
|
1106
|
+
* @typeParam T - 表格行数据类型
|
|
1336
1107
|
*
|
|
1337
1108
|
* @example
|
|
1338
1109
|
* ```ts
|
|
1339
1110
|
* const expandColumn: TableColumnTypeExpand<UserData> = {
|
|
1340
1111
|
* type: 'expand',
|
|
1341
|
-
* label: '详情'
|
|
1112
|
+
* label: '详情',
|
|
1342
1113
|
* }
|
|
1343
1114
|
* ```
|
|
1344
1115
|
*/
|
|
@@ -1350,14 +1121,14 @@ declare interface TableColumnTypeExpand<T extends AnyObject> extends OptionalFie
|
|
|
1350
1121
|
* 索引列类型
|
|
1351
1122
|
* 自动显示行号
|
|
1352
1123
|
*
|
|
1353
|
-
* @typeParam T -
|
|
1124
|
+
* @typeParam T - 表格行数据类型
|
|
1354
1125
|
*
|
|
1355
1126
|
* @example
|
|
1356
1127
|
* ```ts
|
|
1357
1128
|
* const indexColumn: TableColumnTypeIndex<UserData> = {
|
|
1358
1129
|
* type: 'index',
|
|
1359
1130
|
* label: '序号',
|
|
1360
|
-
* width: 60
|
|
1131
|
+
* width: 60,
|
|
1361
1132
|
* }
|
|
1362
1133
|
* ```
|
|
1363
1134
|
*/
|
|
@@ -1367,23 +1138,23 @@ declare interface TableColumnTypeIndex<T extends AnyObject> extends OptionalFiel
|
|
|
1367
1138
|
|
|
1368
1139
|
/**
|
|
1369
1140
|
* 选择列类型
|
|
1370
|
-
*
|
|
1141
|
+
* 提供多选能力
|
|
1371
1142
|
*
|
|
1372
|
-
* @typeParam T -
|
|
1143
|
+
* @typeParam T - 表格行数据类型
|
|
1373
1144
|
*
|
|
1374
1145
|
* @example
|
|
1375
1146
|
* ```ts
|
|
1376
1147
|
* const selectionColumn: TableColumnTypeSelection<UserData> = {
|
|
1377
1148
|
* type: 'selection',
|
|
1378
|
-
* selectable: (row
|
|
1149
|
+
* selectable: (row) => row.status === 'active',
|
|
1379
1150
|
* }
|
|
1380
1151
|
* ```
|
|
1381
1152
|
*/
|
|
1382
1153
|
declare interface TableColumnTypeSelection<T extends AnyObject> extends OptionalFields<TableColumnBase<T>, 'prop'> {
|
|
1383
1154
|
type: 'selection';
|
|
1384
|
-
/**
|
|
1155
|
+
/** 行是否可选的条件函数 */
|
|
1385
1156
|
selectable?: (row: T, index: number) => boolean;
|
|
1386
|
-
/**
|
|
1157
|
+
/** 是否保留之前的选中状态 */
|
|
1387
1158
|
'reserve-selection'?: boolean;
|
|
1388
1159
|
}
|
|
1389
1160
|
|