@wyfex/ivue 0.19.1 → 0.19.3

package/src/components/UseCrudTable/types.ts

@@ -1,4 +1,4 @@
-import type { ExtractPropTypes } from 'vue'
+import type { Component, ExtractPropTypes } from 'vue'
 import componentProps from './props'
 import type { FormColumn } from '../UseElForm/types'
 import type { TableColumn } from '../UseElTable/types'
@@ -9,10 +9,12 @@ import type { TableColumn } from '../UseElTable/types'
 export type Props = ExtractPropTypes<typeof componentProps>
 
 /**
- * emits接口
+ * emits类型
  */
-export interface Emits {
-  //  dictKeys事件
+export type Emits = {
+  /**
+   * dictKeys事件
+   */
   (e: 'onDictKeys', value?: string[]): void
 }
 
@@ -34,18 +36,36 @@ export interface Configs extends BaseConfigs {
  * 分割线配置项接口
  */
 export interface Divider {
-  show: boolean
-  borderStyle: 'none' | 'solid' | 'hidden' | 'dashed'
+  show?: boolean
+  borderStyle?: 'none' | 'solid' | 'hidden' | 'dashed'
+}
+
+/**
+ * 操作栏配置
+ */
+export interface ActionBar {
+  margin?: string
+  showControlFormDisplayBtn?: boolean
+  controlFormDisplayBtnWithOpenedIcon?: Component
+  controlFormDisplayBtnWithClosedIcon?: Component
+  reverse?: boolean
+  divider?: Divider
 }
 
 /**
  * extConfig接口
  */
 export interface ExtConfig {
-  actionBar: {
-    margin: string
-    showControlFormDisplayBtn: boolean
-    reverse: boolean
-    divider: Divider
+  /**
+   * 操作栏配置项
+   */
+  actionBar?: ActionBar
+  /**
+   * 弹窗配置项
+   * type：弹窗类型 支持Drawer和Dialog
+   * 其他配置项由于组件内部已进行v-bind透传，不不在此重复声明接口，详见UseElDrawer和UseElDialog组件types
+   */
+  modal?: {
+    type?: 'Drawer' | 'Dialog'
   }
 }

package/src/components/UseElCheckbox/types.ts

@@ -7,9 +7,9 @@ import componentProps from './props'
 export type Props = ExtractPropTypes<typeof componentProps>
 
 /**
- * emits接口
+ * emits类型
  */
-export interface Emits {
+export type Emits = {
   // 更新value值
   (e: 'update:modelValue', value: string | number | (string | number)[]): void
 }

package/src/components/UseElConfigProvider/props.ts

@@ -1,5 +1,4 @@
 import type { PropType } from 'vue'
-import type { UploadConfig } from '@/types'
 import type { ExtConfig } from './types'
 
 /**
@@ -15,14 +14,7 @@ export default {
     validator: (val: string) => ['', 'zh', 'en'].includes(val)
   },
   /**
-   * 上传配置 此处配置仅作用于UseElUpload组件
-   */
-  uploadConfig: {
-    type: Object as PropType<UploadConfig>,
-    default: () => ({})
-  },
-  /**
-   * 扩展配置 如【字典属性、调试】等
+   * 扩展配置 如【字典属性、表格、上传】等
    */
   extConfig: {
     type: Object as PropType<ExtConfig>,

package/src/components/UseElConfigProvider/types.ts

@@ -1,6 +1,6 @@
 import type { ExtractPropTypes } from 'vue'
 import componentProps from './props'
-import type { DictProps } from '@/types'
+import type { DictProps, UploadConfig } from '@/types'
 
 /**
  * props类型
@@ -28,4 +28,8 @@ export interface ExtConfig {
     pageBottomOffset?: number
     modalBottomOffset?: number
   }
+  /**
+   * 上传配置项
+   */
+  upload?: UploadConfig
 }

package/src/components/UseElForm/types.ts

@@ -8,13 +8,13 @@ import type { RenderConfig, UseDict } from '@/types'
 export type Props = ExtractPropTypes<typeof componentProps>
 
 /**
- * emits接口
+ * emits类型
  */
-export interface Emits {
-  // dictKeys事件
+export type Emits = {
+  /**
+   * dictKeys事件
+   */
   (e: 'onDictKeys', value?: string[]): void
-  // 更新formModel
-  (e: 'update:formModel', value: Record<string, any>): void
 }
 
 /**
@@ -55,7 +55,7 @@ export interface QueryConfig {
  * inputConfig接口
  */
 export interface InputConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   type?:
     | 'text'
     | 'textarea'
@@ -76,77 +76,150 @@ export interface InputConfig {
   resize?: string
   showPassword?: boolean
   placeholder?: string
-  width?: string // 默认el-input的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-input宽度
-  autoFocus?: boolean // 为true则对el-input使用v-focus聚焦指令
-  prefixContent?: string | object // el-input头部插槽内容
-  suffixContent?: string | object // el-input尾部插槽内容
-  prependContent?: string | object // el-input前置插槽内容
-  appendContent?: string | object // el-input后置插槽内容
-  unit?: string | object // 在el-input右外部显示单位
-  onClear?: (...args: any) => any // el-input的clear事件
-  inputEvent?: Function // el-input的input事件
-  onKeyupEnter?: (...args: any) => any // el-input的keyup.enter事件
+  /**
+   * 默认el-input的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-input宽度
+   */
+  width?: string
+  /**
+   * 为true则对el-input使用v-focus聚焦指令
+   */
+  autoFocus?: boolean
+  /**
+   * el-input头部插槽内容
+   */
+  prefixContent?: string | object
+  /**
+   * el-input尾部插槽内容
+   */
+  suffixContent?: string | object
+  /**
+   * el-input前置插槽内容
+   */
+  prependContent?: string | object
+  /**
+   * el-input后置插槽内容
+   */
+  appendContent?: string | object
+  /**
+   * 在el-input右外部显示单位
+   */
+  unit?: string | object
+  /**
+   * el-input的clear事件
+   */
+  onClear?: Function
+  /**
+   * el-input的input事件
+   */
+  inputEvent?: Function
+  /**
+   * el-input的keyup.enter事件
+   */
+  onKeyupEnter?: Function
 }
 
 /**
  * inputNumberConfig接口
  */
 export interface InputNumberConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   min?: number
   max?: number
   step?: number
   precision?: number
   placeholder?: string
   disabledScientific?: boolean
-  unit?: string | object // 在el-input-number右外部显示单位
+  /**
+   * 在el-input-number右外部显示单位
+   */
+  unit?: string | object
 }
 
 /**
  * radioConfig接口
  */
 export interface RadioConfig {
-  useRender: boolean | RenderConfig
-  options?: Array<{ label: string; value: string | number }> // el-radio的选项集
-  props?: { value: string; label?: string } // el-radio的props配置项
-  reverse?: boolean // 是否反转单选框和标签的位置
-  onChange?: (...args: any) => any // el-radio的change事件
+  useRender?: boolean | RenderConfig
+  /**
+   * el-radio的选项集
+   */
+  options?: Array<{ label: string; value: string | number }>
+  /**
+   * el-radio的props配置项
+   */
+  props?: { value: string; label?: string }
+  /**
+   * 是否反转单选框和标签的位置
+   */
+  reverse?: boolean
+  /**
+   * el-radio的change事件
+   */
+  onChange?: Function
 }
 
 /**
  * selectConfig接口
  */
 export interface SelectConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   multiple?: boolean
   clearable?: boolean
+  filterable?: boolean
   placeholder?: string
   options?: Array<{ label: string; value: string | number }>
   props?: { value: string; label?: string }
-  useV2: boolean //是否使用v2版本
-  reverse?: boolean // 是否反转
-  toJoin?: boolean // 是否将值为数组转为以逗号分隔的字符串
-  width?: string // 默认el-select的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-select宽度
-  onChange?: (...args: any) => any // el-select的change事件
+  /**
+   * 是否使用v2版本
+   */
+  useV2: boolean
+  /**
+   * 是否反转
+   */
+  reverse?: boolean
+  /**
+   * 是否将值为数组转为以逗号分隔的字符串
+   */
+  toJoin?: boolean
+  /**
+   * 默认el-select的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-select宽度
+   */
+  width?: string
+  /**
+   * el-select的change事件
+   */
+  onChange?: Function
 }
 
 /**
  * cascaderConfig接口
  */
 export interface CascaderConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   clearable?: boolean
-  options?: Array<{ label: string; value: string | number }> //el-cascader的选项集
-  props?: { value: string; label?: string } //el-cascader的props配置项
-  width?: string //默认el-cascader的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-cascader宽度
-  onChange?: (...args: any) => any //el-select的change事件
+  /**
+   * el-cascader的选项集
+   */
+  options?: Array<{ label: string; value: string | number }>
+  /**
+   * el-cascader的props配置项
+   */
+  props?: { value: string; label?: string }
+  /**
+   * 默认el-cascader的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-cascader宽度
+   */
+  width?: string
+  /**
+   * el-select的change事件
+   */
+  onChange?: Function
 }
 
 /**
  * datePickerConfig接口
  */
 export interface DatePickerConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   type?:
     | 'year'
     | 'years'
@@ -168,17 +241,29 @@ export interface DatePickerConfig {
   startPlaceholder?: string
   endPlaceholder?: string
   rangeSeparator?: string
-  width?: string // 默认el-date-picker的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-date-picker宽度
-  onCalendarChange?: Function // el-date-picker的calendar-change事件
-  onClear?: Function // el-date-picker的clear事件
-  onChange?: Function // el-date-picker的change事件
+  /**
+   * 默认el-date-picker的width为100% 可设置width为''或具体宽度值，为''则使用默认的el-date-picker宽度
+   */
+  width?: string
+  /**
+   * el-date-picker的calendar-change事件
+   */
+  onCalendarChange?: Function
+  /**
+   * el-date-picker的clear事件
+   */
+  onClear?: Function
+  /**
+   * el-date-picker的change事件
+   */
+  onChange?: Function
 }
 
 /**
  * timePickerConfig接口
  */
 export interface TimePickerConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   startPlaceholder?: string
   endPlaceholder?: string
   rangeSeparator?: string
@@ -186,38 +271,56 @@ export interface TimePickerConfig {
   editable?: boolean
   format?: string
   valueFormat?: string
-  onChange?: (...args: any) => any //el-date-picker的change事件
+  /**
+   * el-date-picker的change事件
+   */
+  onChange?: Function
 }
 
 /**
  * timeSelectConfig接口
  */
 export interface TimeSelectConfig {
-  useRender: boolean | RenderConfig
-  startProp: string // 时间选择范围开始时间在formModel中的属性名
-  endProp: string // 时间选择范围结束时间在formModel中的属性名
+  useRender?: boolean | RenderConfig
+  /**
+   * 时间选择范围开始时间在formModel中的属性名
+   */
+  startProp: string
+  /**
+   * 时间选择范围结束时间在formModel中的属性名
+   */
+  endProp: string
 }
 
 /**
  * switchConfig接口
  */
 export interface SwitchConfig {
-  useRender: boolean | RenderConfig
+  useRender?: boolean | RenderConfig
   activeValue?: string | number | boolean
   inactiveValue?: string | number | boolean
-  onChange?: (...args: any) => any // el-switch的change事件
+  /**
+   * el-switch的change事件
+   */
+  onChange?: Function
 }
 
 /**
  * inputRangeConfig接口
  */
 export interface InputRangeConfig {
-  startProp: string // 输入范围开始值在formModel中的属性名
-  endProp: string // 输入范围结束值在formModel中的属性名
+  /**
+   * 输入范围开始值在formModel中的属性名
+   */
+  startProp: string
+  /**
+   * 输入范围结束值在formModel中的属性名
+   */
+  endProp: string
   startPlaceholder?: string
   endPlaceholder?: string
   rangeSeparator?: string
-  onClear?: (...args: any) => any
+  onClear?: Function
 }
 
 /**
@@ -226,7 +329,10 @@ export interface InputRangeConfig {
 export interface TreeSelectConfig {
   useRender?: boolean | RenderConfig
   data: Record<string, unknown>[]
-  reverse?: boolean // 是否反转
+  /**
+   * 是否反转
+   */
+  reverse?: boolean
   width?: string
   placeholder?: string
   props?: { value: string; label?: string }
@@ -237,11 +343,17 @@ export interface TreeSelectConfig {
 }
 
 export interface IRequired {
-  // 是否必填
+  /**
+   * 是否必填
+   */
   isRequired?: boolean
-  // 内置校验器
+  /**
+   * 内置校验器
+   */
   validator: 'mobile' | 'nonNegativeDecimal'
-  // 参数
+  /**
+   * 参数
+   */
   parmas?: any
 }
 
@@ -272,7 +384,7 @@ export interface FormColumn {
    * 如为IRequired则使用内置必填校验
    * 可传对象数组进行自定义校验
    */
-  required: boolean | IRequired
+  required?: boolean | IRequired
   /**
    * 必填项错误消息
    * 如不指定则默认为“请输入xxx”或“请选择xxx”

package/src/components/UseElTable/defaultExtConfig.ts

@@ -12,7 +12,7 @@ export default {
   },
   mode: { type: 'PAGE' },
   selection: { width: 40, enableRowClick: false, align: 'center', fixed: true },
-  index: { width: 55, align: 'center', fixed: true },
+  index: { width: 55, align: 'center', fixed: true, isContinuous: true },
   expand: { show: false },
   operation: { width: 128, fixed: 'right' },
   pagination: {

package/src/components/UseElTable/props.ts

@@ -8,8 +8,8 @@ import type { DictMap, DictProps } from '@/types'
 export default {
   /**
    * 表格列 必传
-   * 注意：常规场景下列配置为静态值无需响应式；但本组件提供了 minWidth 自动计算功能并会修改列对象，
-   * 因此 tableColumns 必须用 ref/reactive 包裹，否则视图无法同步更新宽度。
+   * 注意：常规场景下列配置为静态值无需响应式；但本组件提供了 minWidth 自动计算能力并会修改列对象，
+   * 因此 tableColumns 必须用 ref/reactive 包裹，否则视图无法同步更新最小宽度。
    */
   tableColumns: {
     type: Array as PropType<TableColumn[]>,
@@ -51,6 +51,20 @@ export default {
     type: Object as PropType<DictProps>,
     default: () => ({})
   },
+  /**
+   * 当前页数
+   */
+  currentPage: {
+    type: Number,
+    default: 1
+  },
+  /**
+   * 当前页码
+   */
+  pageSize: {
+    type: Number,
+    default: 10
+  },
   /**
    * 当内容过长被隐藏时是否显示tooltip 默认是
    */

package/src/components/UseElTable/types.ts

@@ -256,9 +256,16 @@ export interface ExtConfig {
   /**
    * 序号列配置项
    * label：序号列表头文本 不显式设置则不显示序号列
+   * isContinuous：是否连续的，默认是，即第二页的序号根据第一条最后一个序号进行延续
    * width、align、fixed同选择器配置项
    */
-  index?: { label?: string; width?: number; align?: string; fixed?: boolean }
+  index?: {
+    label?: string
+    isContinuous?: boolean
+    width?: number
+    align?: string
+    fixed?: boolean
+  }
   /**
    * 展开列配置项
    * show：是否显示展开列

package/src/components/UseElUpload/props.ts

@@ -1,4 +1,5 @@
 import type { PropType } from 'vue'
+import type { UploadConfig } from '@/types'
 
 /**
  * 组件props
@@ -25,7 +26,7 @@ export default {
    * data：上传时附带的额外参数，eg：{ referer: window.location.href }
    */
   uploadConfig: {
-    type: Object as PropType<Record<string, unknown>>,
+    type: Object as PropType<UploadConfig>,
     default: () => ({
       //  action: '/api/file/upload',
       //  headers: { Authorization: `Bearer ${token}` },