@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.
Files changed (43) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/index.css +1 -1
  3. package/dist/index.d.ts +109 -338
  4. package/dist/index.js +1062 -1029
  5. package/dist/version-info.json +7 -7
  6. package/package.json +1 -1
  7. package/dist/_virtual/_plugin-vue_export-helper.js +0 -9
  8. package/dist/components/CommonButton/index.vue.js +0 -40
  9. package/dist/components/CommonButton/index.vue2.js +0 -4
  10. package/dist/components/CommonCascader/index.vue.js +0 -46
  11. package/dist/components/CommonCascader/index.vue2.js +0 -4
  12. package/dist/components/CommonCheckbox/index.vue.js +0 -38
  13. package/dist/components/CommonCheckbox/index.vue2.js +0 -4
  14. package/dist/components/CommonConfigProvider/index.vue.js +0 -19
  15. package/dist/components/CommonConfigProvider/index.vue2.js +0 -4
  16. package/dist/components/CommonDatePicker/index.vue.js +0 -74
  17. package/dist/components/CommonDatePicker/index.vue2.js +0 -4
  18. package/dist/components/CommonForm/index.vue.js +0 -7
  19. package/dist/components/CommonForm/index.vue2.js +0 -148
  20. package/dist/components/CommonInput/index.vue.js +0 -38
  21. package/dist/components/CommonInput/index.vue2.js +0 -4
  22. package/dist/components/CommonInputNumber/index.vue.js +0 -45
  23. package/dist/components/CommonInputNumber/index.vue2.js +0 -4
  24. package/dist/components/CommonPagination/index.vue.js +0 -88
  25. package/dist/components/CommonPagination/index.vue2.js +0 -4
  26. package/dist/components/CommonQueryTable/index.vue.js +0 -7
  27. package/dist/components/CommonQueryTable/index.vue2.js +0 -132
  28. package/dist/components/CommonRadio/index.vue.js +0 -37
  29. package/dist/components/CommonRadio/index.vue2.js +0 -4
  30. package/dist/components/CommonSelect/index.vue.js +0 -44
  31. package/dist/components/CommonSelect/index.vue2.js +0 -4
  32. package/dist/components/CommonSwitch/index.vue.js +0 -51
  33. package/dist/components/CommonSwitch/index.vue2.js +0 -4
  34. package/dist/components/CommonTable/config.js +0 -57
  35. package/dist/components/CommonTable/index.vue.js +0 -7
  36. package/dist/components/CommonTable/index.vue2.js +0 -139
  37. package/dist/components/CommonTimePicker/index.vue.js +0 -72
  38. package/dist/components/CommonTimePicker/index.vue2.js +0 -4
  39. package/dist/hooks/useGetComponentsChildrenSlots.js +0 -58
  40. package/dist/hooks/useResettable.js +0 -20
  41. package/dist/provide/index.js +0 -10
  42. package/dist/provide/key.js +0 -4
  43. 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
- /** 组件Props定义,提供默认值 */
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
- * 允许使用任意 Vue 组件作为表单项
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
- * 支持通过 prop 访问表单字段值,并允许额外的字符串索引
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 - 表单数据对象类型,默认为 AnyObject
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 - 组件的 Props 类型
463
+ * @typeParam T - 组件类型,可以是内置字符串标识或自定义组件
464
+ * @typeParam P - 组件 Props 类型
602
465
  * @typeParam D - 表单数据对象类型
603
- * @typeParam V - 初始值的类型,默认为 any
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
- * - 内置组件:'input' | 'input-number' | 'select' | 'date-picker' | 'time-picker' | 'cascader' | 'radio' | 'check-box' | 'switch'
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
- /** 表单字段名,支持表单数据类型的 key 或任意字符串 */
477
+ /** 表单字段名 */
635
478
  prop: keyof D | (string & {});
636
479
  /** 传递给组件的额外属性 */
637
480
  props?: Partial<P>;
638
481
  /** 字段初始值 */
639
482
  initialValue?: V;
640
- /** ElFormItem 的额外属性配置(不包含 prop 和 label */
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
- * 直接继承Element Plus分页组件的属性,所有属性均为可选
766
- * Element Plus内部已用ExtractPropTypes处理过类型
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
- * @param params - 查询参数,包含分页和表单查询条件
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: any;
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
- /** 每页显示条数,支持v-model双向绑定 */
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, index) => row.status === 'active'
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