@dazhicheng/ui 1.6.18 → 1.6.20

package/dist/components/tt-table/src/hooks/usePagination.js

@@ -1,52 +1,66 @@
-import { GlobalConfig as f } from "../../../../hooks/useSetup.js";
+import { GlobalConfig as s } from "../../../../hooks/useSetup.js";
 import "axios";
 import "element-plus";
+import { isFunction as P } from "../../../../packages/utils/src/is.js";
+import { ref as h, unref as t, computed as C, watch as y } from "vue";
 import "dayjs";
-import { ref as c, unref as o, computed as P, watch as l } from "vue";
 import "numeral";
 import "xe-utils";
 import "dayjs/plugin/utc";
 import "dayjs/plugin/timezone";
-import { mergeWithArrayOverride as s } from "../../../../packages/utils/src/merge.js";
+import { mergeWithArrayOverride as b } from "../../../../packages/utils/src/merge.js";
 import "../../../../node_modules/.pnpm/decimal.js@10.6.0/node_modules/decimal.js/decimal.js";
 import "../../../../node_modules/.pnpm/crypto-js@4.2.0/node_modules/crypto-js/aes.js";
 import "../../../../node_modules/.pnpm/crypto-js@4.2.0/node_modules/crypto-js/enc-utf8.js";
 import "../../../../node_modules/.pnpm/crypto-js@4.2.0/node_modules/crypto-js/mode-ecb.js";
 import "../../../../node_modules/.pnpm/crypto-js@4.2.0/node_modules/crypto-js/pad-pkcs7.js";
 import "lodash-es";
-const C = {
+const z = {
   currentPage: 1,
   pageSize: 300,
   total: 0,
   pageSizes: [300, 500, 1e3, 2e3],
   layouts: ["Total", "PrevPage", "JumpNumber", "NextPage", "Sizes", "FullJump"]
 };
-function T(e, g) {
-  var a;
-  const r = c(
-    s(o(e).pagerConfig || {}, ((a = f.table) == null ? void 0 : a.pagerConfig) || {})
-  ), i = P(() => {
-    const { showPager: t, pagerConfig: u } = o(e);
-    if (!(!t && !u))
-      return { ...C, ...o(r) };
+function D(i, f) {
+  var u;
+  const r = h(
+    b(t(i).pagerConfig || {}, ((u = s.table) == null ? void 0 : u.pagerConfig) || {})
+  ), g = C(() => {
+    const { showPager: e, pagerConfig: n } = t(i);
+    if (!(!e && !n))
+      return { ...z, ...t(r) };
   });
-  function p() {
-    return o(i);
+  function c() {
+    return t(g);
   }
-  function n(t) {
-    r.value = { ...o(r), ...t };
+  function o(e) {
+    r.value = { ...t(r), ...e };
   }
-  function m(t) {
-    g("page-change", t);
+  let a = !1;
+  async function l(e) {
+    const { currentPage: n, pageSize: m } = e, { beforePageChange: p } = t(i);
+    if (P(p)) {
+      if (a) return;
+      a = !0;
+      try {
+        if (await p({ ...t(r), currentPage: n, pageSize: m }) === !1) return;
+      } catch {
+        return;
+      } finally {
+        a = !1;
+      }
+    }
+    o({ currentPage: n, pageSize: m }), f("page-change", e);
   }
-  return l(
-    () => o(e).pagerConfig,
-    (t) => {
-      t && n(t);
+  return y(
+    () => t(i).pagerConfig,
+    (e) => {
+      e && o(e);
     },
     { deep: !0 }
-  ), { pagination: r, paginationInfo: i, getPagination: p, setPagination: n, onPageChange: m };
+  ), { pagination: r, paginationInfo: g, getPagination: c, setPagination: o, onPageChange: l };
 }
 export {
-  T as usePagination
+  D as usePagination
 };

package/dist/components/tt-table/src/hooks/useTableRender.d.ts

@@ -16,9 +16,9 @@ type TtTableRenderEmits = Record<string, (...args: any[]) => any>;
  *
  * `Row` 是业务行数据类型，传入后表格插槽作用域与 `tableFormApi.tableApi` 的方法签名跟着推断。
  */
-export type TtUseTableFormRenderReturnType<Row = any> = [
-    DefineSetupFnComponent<TtTableFormProps<Row>, TtTableRenderEmits, SlotsType<TtTableSlots<Row>>>,
-    TtTableExtendedTableFormApi<Row>
+export type TtUseTableFormRenderReturnType<Row = any, TValues extends Record<string, any> = Record<string, any>> = [
+    DefineSetupFnComponent<TtTableFormProps<Row, TValues>, TtTableRenderEmits, SlotsType<TtTableSlots<Row>>>,
+    TtTableExtendedTableFormApi<Row, TValues>
 ];
 /**
  * useTableRender 的返回值
@@ -61,7 +61,7 @@ export type TtUseTableRenderReturnType<Row = any> = [
  * // 在模板中使用
  * <FormTable />
  */
-export declare function useTableFormRender<Row = any>(options: NoInfer<TtTableFormProps<Row>>): TtUseTableFormRenderReturnType<Row>;
+export declare function useTableFormRender<Row = any, TValues extends Record<string, any> = Record<string, any>>(options: NoInfer<TtTableFormProps<Row, TValues>>): TtUseTableFormRenderReturnType<Row, TValues>;
 /**
  * 用于渲染表格的 hooks，返回 [TableRender 组件, 表格API]。
  *

package/dist/components/tt-table/src/props.d.ts

@@ -2,7 +2,7 @@ import { PropType } from 'vue';
 import { TtExtendedFormApi, TtFormProps } from '../../tt-form';
 import { VxeTableDefines, VxeTablePropTypes } from 'vxe-table';
 import { TtTableExtendedTableApi, TtTableProps } from './types/table';
-import { TtTableExtendedTableFormApi } from './types/tableForm';
+import { TtTableExtendedTableFormApi, TtTableFormProps } from './types/tableForm';
 import { TtTableToolsProps } from './types/tableTools';
 /** 表格参数 */
 export declare const tableProps: {
@@ -71,6 +71,11 @@ export declare const tableProps: {
         type: PropType<TtTableProps["beforeFetch"]>;
         default: null;
     };
+    /** 用户操作分页器请求前的回调，返回 false 拦下这次翻页 */
+    beforePageChange: {
+        type: PropType<TtTableProps["beforePageChange"]>;
+        default: null;
+    };
     /**
      * data
      *
@@ -479,6 +484,7 @@ export declare const tableFormProps: {
             immediate?: boolean;
             afterFetch?: ((data: any[], res: Recordable | Recordable[]) => Promise<any[]>) | undefined;
             beforeFetch?: (params: Recordable) => Promise<Recordable>;
+            beforePageChange?: (page: import("vxe-table").VxeGridPropTypes.PagerConfig) => boolean | Promise<boolean>;
             isScrollFetch?: boolean;
             showToolbar?: boolean;
             columnsFieldSort?: string[];
@@ -504,6 +510,11 @@ export declare const tableFormProps: {
         type: PropType<Fn>;
         default: null;
     };
+    /** 查询发起请求前的调用方法，返回 false 拦截本次查询 */
+    tableSearchBefore: {
+        type: PropType<NonNullable<TtTableFormProps["tableSearchBefore"]>>;
+        default: null;
+    };
     /** TtTableTools的props */
     toolConfig: {
         type: PropType<TtTableToolsProps>;

package/dist/components/tt-table/src/props.js

@@ -82,7 +82,7 @@ const a = {
     type: Function
     // default: () => GlobalConfig.table?.customizeColumn,
   }
-}, p = {
+}, n = {
   /** api请求方法 */
   api: {
     type: Function,
@@ -102,6 +102,11 @@ const a = {
     type: Function,
     default: null
   },
+  /** 用户操作分页器请求前的回调，返回 false 拦下这次翻页 */
+  beforePageChange: {
+    type: Function,
+    default: null
+  },
   /**
    * data
    *
@@ -115,7 +120,7 @@ const a = {
   },
   /** 是否滚动加载数据 */
   isScrollFetch: { type: Boolean, default: () => e("isScrollFetch") }
-}, n = {
+}, p = {
   /** 是否显示toolbar */
   showToolbar: { type: Boolean, default: () => e("showToolbar") },
   /** 具体某些列排序 field数组 */
@@ -207,8 +212,8 @@ const a = {
   },
   ...a,
   ...r,
-  ...p,
-  ...n
+  ...n,
+  ...p
 }, i = {
   /** 按键配置项 */
   keyboardConfig: {
@@ -261,6 +266,11 @@ const a = {
     type: Function,
     default: null
   },
+  /** 查询发起请求前的调用方法，返回 false 拦截本次查询 */
+  tableSearchBefore: {
+    type: Function,
+    default: null
+  },
   /** TtTableTools的props */
   toolConfig: {
     type: Object,

package/dist/components/tt-table/src/types/table.d.ts

@@ -77,6 +77,14 @@ export type TtTableFetchProps<Row = any> = {
      * @param params 请求参数
      */
     beforeFetch?: (params: Recordable) => Promise<Recordable>;
+    /**
+     * 用户操作分页器发起请求前的回调，返回 `false` 拦下这次翻页，页码保持原样。
+     *
+     * 只拦分页器上的交互，代码里调 `setPagination()` 改分页不经过它。
+     * `TtTableForm` 会用它把分页接到 `tableSearchBefore` 上，用表单的组合方式时不必自己传。
+     * @param page 这次要切到的分页信息
+     */
+    beforePageChange?: (page: VxeGridPropTypes.PagerConfig) => boolean | Promise<boolean>;
     /** 是否滚动加载 */
     isScrollFetch?: boolean;
 };

package/dist/components/tt-table/src/types/tableForm.d.ts

@@ -3,19 +3,43 @@ import { TtSelectRowKeysType, TtTableMethods, TtTableProps } from '../types/tabl
 import { TableFormApi } from '../utils/table-form-api';
 import { TtTableToolsProps } from './tableTools';
 import { TtExtendedFormApi, TtFormProps } from '../../../tt-form';
-export type TtTableFormRenderFormProps = Partial<TtFormProps>;
-export type TtTableRenderFormInstance = TtExtendedFormApi;
+/**
+ * 搜索表单配置。
+ *
+ * `TValues` 是搜索表单的值类型，由 `useTableFormRender<Row, SearchValues>()` 传入后，
+ * schema 里 `dependencies` 等回调的 values 参数会跟着推断；不传时退化为 `Record<string, any>`。
+ */
+export type TtTableFormRenderFormProps<TValues extends Record<string, any> = Record<string, any>> = Partial<TtFormProps<TValues>>;
+export type TtTableRenderFormInstance<TValues extends Record<string, any> = Record<string, any>> = TtExtendedFormApi<TValues>;
+/**
+ * 触发查询的入口。
+ *
+ * `submit` 查询按钮或回车提交，`reset` 重置按钮，`refresh` 工具栏刷新按钮，`page` 分页器翻页或改每页条数。
+ */
+export type TtTableSearchTrigger = "submit" | "reset" | "refresh" | "page";
+/**
+ * 查询前拦截的返回结果。
+ *
+ * 直接返回布尔值表示是否发起查询；需要在拦截的同时清掉列表时返回对象形式。
+ */
+export type TtTableSearchBeforeResult = boolean | {
+    /** 是否继续发起查询请求 */
+    canSearch: boolean;
+    /** 是否清空表格数据与分页总数，默认 false */
+    clearData?: boolean;
+};
 /**
  * 表单 + 表格的组合配置。
  *
  * `Row` 是业务行数据类型，由 `useTableFormRender<Row>()` 传入后 `table` 里的列配置、
  * 数据与 `tableApi` 的方法签名都会跟着推断；不传时退化为 `any`。
+ * `TValues` 是搜索表单的值类型，由第二个类型参数传入，决定 `form` 里各回调的 values 类型。
  */
-export type TtTableFormProps<Row = any> = {
+export type TtTableFormProps<Row = any, TValues extends Record<string, any> = Record<string, any>> = {
     /** 表格配置 */
     table?: Partial<TtTableProps<Row>>;
     /** form 配置 */
-    form?: TtTableFormRenderFormProps;
+    form?: TtTableFormRenderFormProps<TValues>;
     /** 是否开启form表单 */
     useSearchForm?: boolean;
     handleSearchInfoFn?: Fn;
@@ -23,6 +47,16 @@ export type TtTableFormProps<Row = any> = {
     toolConfig?: TtTableToolsProps;
     /** 刷新前的调用方法 */
     tableRefreshBefore?: (...arg: any[]) => Promise<any>;
+    /**
+     * 用户操作发起查询请求前的调用方法。
+     *
+     * 返回 `false` 拦截本次查询；返回 `{ canSearch, clearData }` 可以在拦截的同时清空表格数据。
+     * 覆盖查询、重置、工具栏刷新与分页器四个用户入口；`table.immediate` 的首次自动请求、
+     * `reload()` / `setPagination()` 等 API 调用都不经过这里。分页被拦下时页码保持原样。
+     * @param values 通过校验后的当前表单值，重置时是重置后的值
+     * @param trigger 触发入口
+     */
+    tableSearchBefore?: (values: TValues, trigger: TtTableSearchTrigger) => TtTableSearchBeforeResult | Promise<TtTableSearchBeforeResult>;
     /**
      * 表格 testId，用于生成测试标识
      * 如果不指定，将从 table.api 路径自动提取
@@ -31,13 +65,13 @@ export type TtTableFormProps<Row = any> = {
      */
     testId?: string;
 };
-export type TtTableFormActionType<Row = any> = {
+export type TtTableFormActionType<Row = any, TValues extends Record<string, any> = Record<string, any>> = {
     setTableProps: (props: Partial<TtTableProps<Row>>) => void;
-    setFormProps: (props: TtTableFormRenderFormProps) => void;
+    setFormProps: (props: TtTableFormRenderFormProps<TValues>) => void;
     tableMethods: TtTableMethods<Row>;
-    formMethods: TtTableRenderFormInstance;
+    formMethods: TtTableRenderFormInstance<TValues>;
     /** 设置props */
-    setProps: (props: Partial<TtTableFormProps<Row>>) => void;
+    setProps: (props: Partial<TtTableFormProps<Row, TValues>>) => void;
     /** reload */
     reload: TtTableMethods<Row>["reload"];
     /**
@@ -46,6 +80,6 @@ export type TtTableFormActionType<Row = any> = {
      */
     selectedKeys: MaybeRef<TtSelectRowKeysType>;
 };
-export type TtTableExtendedTableFormApi<Row = any> = TableFormApi<Row> & {
-    useStore: <T = NoInfer<TtTableFormProps<Row>>>(selector?: (state: NoInfer<TtTableFormProps<Row>>) => T) => Readonly<Ref<T>>;
+export type TtTableExtendedTableFormApi<Row = any, TValues extends Record<string, any> = Record<string, any>> = TableFormApi<Row, TValues> & {
+    useStore: <T = NoInfer<TtTableFormProps<Row, TValues>>>(selector?: (state: NoInfer<TtTableFormProps<Row, TValues>>) => T) => Readonly<Ref<T>>;
 };

package/dist/components/tt-table/src/utils/table-form-api.d.ts

@@ -13,37 +13,37 @@ import { Store } from '@tanstack/vue-store';
  * api.reload()
  * api.setFormProps({ ... })
  */
-declare class TableFormApi<Row = any> {
+declare class TableFormApi<Row = any, TValues extends Record<string, any> = Record<string, any>> {
     /** form 表单实例（FormApi） */
-    formApi: TtExtendedFormApi;
+    formApi: TtExtendedFormApi<TValues>;
     /** 表格 API 实例（TableApi） */
     tableApi: TtTableExtendedTableApi<Row>;
     /** vxe-grid 表格实例 */
     grid: VxeGridInstance;
     /** 当前表单+表格的 props 状态 */
-    state: null | TtTableFormProps<Row>;
+    state: null | TtTableFormProps<Row, TValues>;
     /** 表单操作方法集合（TableFormActionType） */
-    tableForm: TtTableFormActionType<Row>;
+    tableForm: TtTableFormActionType<Row, TValues>;
     /** 响应式 store，存储表单+表格的状态 */
-    store: Store<TtTableFormProps<Row>>;
+    store: Store<TtTableFormProps<Row, TValues>>;
     private isMounted;
     private stateHandler;
     /**
      * 构造函数，初始化 store、tableApi、状态等
      * @param options 表单+表格配置项
      */
-    constructor(options?: TtTableFormProps<Row>);
+    constructor(options?: TtTableFormProps<Row, TValues>);
     /**
      * 组件挂载时调用，注入表单和表格实例
      * @param instance 表单操作方法实例
      * @param formApi 表单实例
      */
-    mount(instance: null | TtTableFormActionType<Row>, formApi: TtExtendedFormApi): void;
+    mount(instance: null | TtTableFormActionType<Row, TValues>, formApi: TtExtendedFormApi<TValues>): void;
     /**
      * 更新表单+表格的数据
      * @param stateOrFn 新状态或返回新状态的函数
      */
-    setState(stateOrFn: ((prev: TtTableFormProps<Row>) => Partial<TtTableFormProps<Row>>) | Partial<TtTableFormProps<Row>>): void;
+    setState(stateOrFn: ((prev: TtTableFormProps<Row, TValues>) => Partial<TtTableFormProps<Row, TValues>>) | Partial<TtTableFormProps<Row, TValues>>): void;
     /**
      * 重新加载表格数据
      * @param data 可选的查询参数
@@ -56,7 +56,7 @@ declare class TableFormApi<Row = any> {
     /**
      * 获取表单实例
      */
-    formInstance(): import('../../../tt-form/src/types').ExtendedFormApi;
+    formInstance(): TtExtendedFormApi<TValues>;
     /**
      * 获取 vxe-grid 表格实例
      */
@@ -74,12 +74,12 @@ declare class TableFormApi<Row = any> {
      * 设置表单属性
      * @param props 表单属性
      */
-    setFormProps(props: Partial<TtTableFormRenderFormProps>): void;
+    setFormProps(props: Partial<TtTableFormRenderFormProps<TValues>>): void;
     /**
      * 设置表单+表格属性
      * @param props 属性
      */
-    setProps(props: Partial<TtTableFormProps<Row>>): void;
+    setProps(props: Partial<TtTableFormProps<Row, TValues>>): void;
     /**
      * 组件卸载时调用，重置挂载状态
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dazhicheng/ui",
-  "version": "1.6.18",
+  "version": "1.6.20",
   "description": "",
   "main": "./dist/index.js",
   "module": "./dist/index.js",