@wyfex/ivue 0.22.1 → 0.22.3

package/dist/types/UseElTable/types.d.ts

@@ -1,6 +1,7 @@
 import { Component, ExtractPropTypes } from 'vue';
 import { EditAttrs, GlobalConfig, UseDict } from '../../types';
 import { default as componentProps } from './props';
+import { QueryApiPayload } from '../UseElConfigProvider/types';
 export type Props = ExtractPropTypes<typeof componentProps>;
 export type Emits = {
     (e: 'onDictKeys', value?: string[]): void;
@@ -59,7 +60,21 @@ export interface Selection {
     align?: string;
     fixed?: boolean;
 }
+export type Query = {
+    api?: Function;
+    immediate?: boolean;
+    isPageApi?: boolean;
+    resolveParamsFn?: Function;
+    autoCancelStrategy?: 'none' | 'unmount' | 'deactivate' | 'both';
+    onQueryBefore?: (opts: {
+        params: Record<string, any>;
+        dictKeys: string[];
+        done: (continueRequest?: boolean) => void;
+    }) => void;
+    onQueryError?: (err: any) => void;
+} & QueryApiPayload;
 export interface ExtConfig {
+    query?: Query;
     extraHeader?: {
         border?: boolean;
         class?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wyfex/ivue",
-  "version": "0.22.1",
+  "version": "0.22.3",
   "description": "万有前端 X 体系下基于 Vite8 + Vue3 + Typescript6 + ElementPlus2 构建的以配置驱动视图组件库",
   "homepage": "https://wyfex.top/idocs/ivue",
   "type": "module",

package/src/components/UseCrud/defaultExtConfig.ts

@@ -4,7 +4,7 @@ import type { MergedExtConfig } from './types'
  * 默认扩展配置
  */
 export default {
-  crudFetch: { queryImmediate: true, autoCancelQueryStrategy: 'unmount' },
+  query: { immediate: true, isPageApi: true, autoCancelStrategy: 'unmount' },
   mode: { type: 'PAGE' },
   actionBar: {
     margin: '20px 0',

package/src/components/UseCrud/types.ts

@@ -76,21 +76,6 @@ export interface ActionBar {
  * extConfig接口
  */
 export interface ExtConfig {
-  /** 增删改查请求配置项 */
-  crudFetch?: {
-    /** 查询api */
-    queryApi?: Function
-    /** 是否立即查询 */
-    queryImmediate?: boolean
-    /** 自动取消查询策略 配合signal实现接口取消请求 */
-    autoCancelQueryStrategy?: 'none' | 'unmount' | 'deactivate' | 'both'
-    /** 开始查询前钩子 用于注入字典数据等 */
-    onQueryBefore?: (done: () => void) => void
-    /** 查询错误钩子  */
-    onQueryError?: (err: any) => void
-    /** 删除api */
-    deleteApi?: Function
-  }
   /** 操作栏配置项 */
   actionBar?: ActionBar
   /** 弹窗配置项 */
@@ -128,8 +113,6 @@ export interface UseCrudState {
   pageSize: number
   /** 分页总数 */
   total: number
-  /** 字典映射 */
-  dictMap: Record<string, any>
 }
 
 /**
@@ -146,7 +129,7 @@ export interface UseCrudReturn {
   onCancelQueryRequest: () => void
   handleDelete: (
     payload: { id?: string | number; ids?: string | Array<string | number> },
-    loadingConfig: { source?: Record<string, unknown>; key?: string },
+    config: { api: Function; source?: Record<string, unknown>; key?: string },
     successCb?: () => void,
     errorCb?: (err: unknown) => void,
     successMsg?: string

package/src/components/UseElConfigProvider/defaultExtConfig.ts

@@ -4,6 +4,12 @@ import type { ExtConfig } from './types'
  * 默认扩展配置
  */
 export default {
-  dictProps: { value: 'value', label: 'label', children: 'children' },
+  dict: { props: { value: 'value', label: 'label', children: 'children' } },
+  queryApiPayload: {
+    pageField: 'page',
+    pageSizeField: 'pageSize',
+    records: 'records',
+    total: 'total'
+  },
   table: { pageBottomOffset: 20, modalBottomOffset: 92 }
 } satisfies ExtConfig

package/src/components/UseElConfigProvider/types.ts

@@ -1,18 +1,36 @@
 import type { ExtractPropTypes } from 'vue'
 import componentProps from './props'
-import type { DictProps, UploadConfig } from '@/types'
+import type { Dict, UploadConfig } from '@/types'
 
 /**
  * props类型
  */
 export type Props = ExtractPropTypes<typeof componentProps>
 
+/**
+ * 查询接口载荷接口
+ */
+export interface QueryApiPayload {
+  /** 分页字段 */
+  pageField?: string
+  /** 分页大小字段 */
+  pageSizeField?: string
+  /** 非分页接口响应数据载荷 */
+  default?: string
+  /** 分页接口响应数据载荷 */
+  records?: string
+  /** 分页接口响应总数载荷 */
+  total?: string
+}
+
 /**
  * extConfig接口
  */
 export interface ExtConfig {
-  /** 字典属性配置项 */
-  dictProps?: DictProps
+  /** 字典配置项 */
+  dict?: Dict
+  /** 查询接口载荷配置项 */
+  queryApiPayload?: QueryApiPayload
   /** crud配置项 */
   crud?: {
     /** crud表格页面高度 extConfig.mode.type='PAGE'时生效，显式设置则表格自适应高度不生效，否则默认使用表格自适应高度 */

package/src/components/UseElDescriptions/props.ts

@@ -1,6 +1,6 @@
 import type { PropType } from 'vue'
 import type { ConfigColumn } from './types'
-import type { DictMap, DictProps } from '@/types'
+import type { Dict } from '@/types'
 import type { RenderConfig } from '@/types'
 
 /**
@@ -22,25 +22,18 @@ export default {
     required: true
   },
   /**
-   * 是否使用渲染器 默认否
-   */
-  useRender: {
-    type: [Boolean, Object] as PropType<boolean | RenderConfig>,
-    default: false
-  },
-  /**
-   * 字典映射 数据结构为{ configs[][label | useDict | useDict.key]: Array<{ label: string, value: any }> }
+   * 字典 可配置api、payload和props等，默认由UseElConfigProvider提供
    */
-  dictMap: {
-    type: Object as PropType<DictMap>,
+  dict: {
+    type: Object as PropType<Dict>,
     default: () => ({})
   },
   /**
-   * 字典属性 默认为{ value: 'value', label: 'label', children: 'children' }，可通过全局配置进行设置，为适配全局配置此处不再设置默认值
+   * 是否使用渲染器 默认否
    */
-  dictProps: {
-    type: Object as PropType<DictProps>,
-    default: () => ({})
+  useRender: {
+    type: [Boolean, Object] as PropType<boolean | RenderConfig>,
+    default: false
   },
   /**
    * 一行 Descriptions Item 的数量 默认2

package/src/components/UseElForm/props.ts

@@ -1,6 +1,6 @@
 import type { PropType } from 'vue'
 import type { FormColumn, QueryConfig } from './types'
-import type { DictMap, DictProps, RenderConfig } from '@/types'
+import type { Dict, RenderConfig } from '@/types'
 
 /**
  * 组件props
@@ -21,25 +21,18 @@ export default {
     required: true
   },
   /**
-   * 是否使用渲染器 默认否
-   */
-  useRender: {
-    type: [Boolean, Object] as PropType<boolean | RenderConfig>,
-    default: false
-  },
-  /**
-   * 字典映射 数据结构为{ formColumns[][label | useDict | useDict.key]: Array<{ label: string, value: any }> }
+   * 字典 可配置api、payload和props等，默认由UseElConfigProvider提供
    */
-  dictMap: {
-    type: Object as PropType<DictMap>,
+  dict: {
+    type: Object as PropType<Dict>,
     default: () => ({})
   },
   /**
-   * 字典属性 默认为{ value: 'value', label: 'label', children: 'children' }，可通过全局配置进行设置，为适配全局配置此处不再设置默认值
+   * 是否使用渲染器 默认否
    */
-  dictProps: {
-    type: Object as PropType<DictProps>,
-    default: () => ({})
+  useRender: {
+    type: [Boolean, Object] as PropType<boolean | RenderConfig>,
+    default: false
   },
   /**
    * el-form-item宽度值

package/src/components/UseElSelect/props.ts

@@ -1,5 +1,5 @@
 import type { PropType } from 'vue'
-import type { DictProps, RenderConfig } from '@/types'
+import type { Dict, RenderConfig } from '@/types'
 
 /**
  * 组件props
@@ -20,10 +20,11 @@ export default {
     default: () => []
   },
   /**
-   * 字典属性 默认为{ value: 'value', label: 'label', children: 'children' }，可通过全局配置进行设置，为适配全局配置此处不再设置默认值
+   * 字典 可配置api、payload和props等，默认由UseElConfigProvider提供
+   * todo：当前阶段本组件未对api和payload进行内部实现，后续实际业务需要再进行实现，暂时预留该配置
    */
-  dictProps: {
-    type: Object as PropType<DictProps>,
+  dict: {
+    type: Object as PropType<Dict>,
     default: () => ({})
   },
   /**

package/src/components/UseElTable/defaultExtConfig.ts

@@ -4,6 +4,7 @@ import type { ExtConfig } from './types'
  * 默认扩展配置
  */
 export default {
+  query: { immediate: true, isPageApi: true, autoCancelStrategy: 'unmount' },
   extraHeader: {
     style: {
       padding: '10px',

package/src/components/UseElTable/props.ts

@@ -1,6 +1,6 @@
 import type { PropType } from 'vue'
 import type { ExtConfig, TableColumn } from './types'
-import type { DictMap, DictProps } from '@/types'
+import type { Dict } from '@/types'
 
 /**
  * 组件props
@@ -38,17 +38,10 @@ export default {
     validator: (val: string) => ['left', 'center', 'right'].includes(val)
   },
   /**
-   * 字典映射 数据结构为{ tableColumns[][label | useDict | useDict.key]: Array<{ label: string, value: any }> }
+   * 字典 可配置api、payload和props等，默认由UseElConfigProvider提供
    */
-  dictMap: {
-    type: Object as PropType<DictMap>,
-    default: () => ({})
-  },
-  /**
-   * 字典属性 默认为{ value: 'value', label: 'label',children:'children' }，可通过全局配置进行设置，为适配全局配置此处不再设置默认值
-   */
-  dictProps: {
-    type: Object as PropType<DictProps>,
+  dict: {
+    type: Object as PropType<Dict>,
     default: () => ({})
   },
   /**

package/src/components/UseElTable/types.ts

@@ -1,6 +1,7 @@
 import type { Component, ExtractPropTypes } from 'vue'
 import type { EditAttrs, GlobalConfig, UseDict } from '@/types'
 import componentProps from './props'
+import type { QueryApiPayload } from '../UseElConfigProvider/types'
 
 /**
  * props类型
@@ -134,10 +135,36 @@ export interface Selection {
   fixed?: boolean
 }
 
+/**
+ * 查询类型
+ */
+export type Query = {
+  /** 查询接口 */
+  api?: Function
+  /** 是否立即查询 */
+  immediate?: boolean
+  /** 是否是分页接口 */
+  isPageApi?: boolean
+  /** 处理查询参数的方法 */
+  resolveParamsFn?: Function
+  /** 自动取消查询策略 配合signal实现接口取消请求 */
+  autoCancelStrategy?: 'none' | 'unmount' | 'deactivate' | 'both'
+  /** 开始查询前钩子 用于注入字典数据等 */
+  onQueryBefore?: (opts: {
+    params: Record<string, any>
+    dictKeys: string[]
+    done: (continueRequest?: boolean) => void
+  }) => void
+  /** 查询错误钩子  */
+  onQueryError?: (err: any) => void
+} & QueryApiPayload
+
 /**
  * UseElTable的extConfig接口
  */
 export interface ExtConfig {
+  /** 查询配置项 */
+  query?: Query
   /** 额外表头配置项 */
   extraHeader?: {
     /** 是否显示边框线 默认和el-table的border保持一致 */

package/src/types/index.ts

@@ -68,6 +68,22 @@ export interface UseDict {
   /** 字典分割符 默认为逗号(,) */
   separator?: string
 }
+
+/**
+ * 字典接口
+ */
+export interface Dict {
+  /** 字典接口 */
+  api?: Function
+  /** 字典接口参数 */
+  apiParam?: string
+  /** 字典接口响应数据载荷 */
+  apiPayload?: string
+  /** 字典属性 */
+  props?: DictProps
+  /** 字典映射 数据结构为：{ formColumns[][label | useDict | useDict.key]: Array<{ label: string, value: any }> } */
+  map?: DictMap
+}
 // =========================== 字典相关接口 end ===========================
 
 // =========================== 其他接口 start ===========================
@@ -91,10 +107,28 @@ export interface UploadConfig {
 export interface GlobalConfig {
   /** 最终语言 */
   finalLanguage: string
+
+  /** 最终字典api */
+  finalDictApi: Function
+  /** 最终字典接口响应数据载荷 */
+  finalDictApiPayload: string
   /** 最终字典属性 */
   finalDictProps: DictProps
   /** 最终字典映射 */
   finalDictMap: DictMap
+
+  /** 最终查询接口分页字段 */
+  finalQueryApiPageField: string
+  /** 最终查询接口分页大小字段 */
+  finalQueryApiPageSizeField: string
+
+  /** 最终查询接口非分页数据载荷 */
+  finalQueryApiDefaultPayload: string
+  /** 最终查询接口分页数据载荷 */
+  finalQueryApiRecordsPayload: string
+  /** 最终查询接口分页总数载荷 */
+  finalQueryApiTotalPayload: string
+
   /** 最终crud表格页面高度 */
   finalCrudTablePageHeight: string
   /** 最终crud表格弹窗高度 */
@@ -103,10 +137,12 @@ export interface GlobalConfig {
   finalTablePageHeight: string
   /** 最终表格弹窗高度 */
   finalTableModalHeight: string
+
   /** 最终表格页面底部预留偏移 */
   finalTablePageBottomOffset: number
   /** 最终表格弹窗底部预留偏移 tableMode=modal生效 */
   finalTableModalBottomOffset: number
+
   /** 最终上传配置 */
   finalUploadConfig: UploadConfig
 }