@dt-frames/ui 2.0.23 → 3.0.1

package/es/components/modal/src/props.d.ts

@@ -1,20 +1,17 @@
+import { CSSProperties } from 'vue';
 import { ButtonProps } from '../../form/src/types/form.type';
-import { Recordable } from "@dt-frames/core";
-import { ComputedRef, CSSProperties, PropType } from "vue";
 export declare const basicProps: {
     t: {
         type: StringConstructor;
     };
-    visible: {
+    open: {
         type: BooleanConstructor;
+        default: boolean;
     };
     closable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    destroyOnClose: {
-        type: BooleanConstructor;
-    };
     scrollTop: {
         type: BooleanConstructor;
         default: boolean;
@@ -26,7 +23,7 @@ export declare const basicProps: {
         type: NumberConstructor;
     };
     width: {
-        type: PropType<String | Number>;
+        type: globalThis.PropType<String | Number>;
     };
     draggable: {
         type: BooleanConstructor;
@@ -40,7 +37,7 @@ export declare const basicProps: {
         default: boolean;
     };
     title: {
-        type: PropType<String | ComputedRef<String> | ((data: Recordable) => String)>;
+        type: globalThis.PropType<String | globalThis.ComputedRef<String> | globalThis.Ref<String> | ((data: Recordable) => String)>;
     };
     loading: {
         type: BooleanConstructor;
@@ -50,10 +47,6 @@ export declare const basicProps: {
         type: StringConstructor;
         default: string;
     };
-    useWrapper: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     wrapClassName: {
         type: StringConstructor;
     };
@@ -89,13 +82,13 @@ export declare const basicProps: {
         type: BooleanConstructor;
         default: boolean;
     };
-    maskStyle: PropType<CSSProperties>;
+    maskStyle: globalThis.PropType<CSSProperties>;
     footer: {
-        type: PropType<ButtonProps[]>;
+        type: globalThis.PropType<ButtonProps[]>;
     };
-    bodyStyle: PropType<CSSProperties>;
+    bodyStyle: globalThis.PropType<CSSProperties>;
     wrapperProps: ObjectConstructor;
-    getContainer: PropType<() => any>;
-    closeFunc: PropType<() => Promise<boolean>>;
+    getContainer: globalThis.PropType<() => any>;
+    closeFunc: globalThis.PropType<() => Promise<boolean>>;
     afterClose: FunctionConstructor;
 };

package/es/components/modal/src/types/{modal.type.d.ts → index.type.d.ts}

@@ -1,6 +1,7 @@
-import { ExtractPropTypes } from "vue";
-import { basicProps } from "../props";
-export declare type ModalMethods = {
+import { ExtractPropTypes, Ref } from 'vue';
+import { basicProps } from '../props';
+export type ModalMethods = {
+    getModalProps?: () => Partial<ExtractPropTypes<typeof basicProps>>;
     setModalProps: (props: Partial<ExtractPropTypes<typeof basicProps>>) => void;
     redoModalHeight?: () => void;
 };
@@ -12,6 +13,6 @@ export interface ReturnInnerMethods extends ModalMethods {
     closeModal: <T = any>(res?: T) => void;
     setLoading: (loading: boolean) => void;
 }
-export declare type RegisterFn = (modalMethods: ModalMethods, uuid?: string) => void;
-export declare type UseModalReturnType = [RegisterFn, ReturnMethods];
-export declare type UseModalInnerReturnType = [RegisterFn, ReturnInnerMethods];
+export type RegisterFn = (modalMethods: ModalMethods, uuid?: string) => void;
+export type UseModalReturnType = [RegisterFn, ReturnMethods, Ref<boolean>];
+export type UseModalInnerReturnType = [RegisterFn, ReturnInnerMethods];

package/es/components/source/index.d.ts

@@ -1,2 +1,2 @@
-import { useSource } from "./hooks/useSource";
+import { useSource } from './src/hooks/useSource';
 export { useSource };

package/es/components/source/index.js

@@ -1,34 +1,8 @@
-import { ref, unref, toRaw } from "vue";
-import { isString, http, isObject, useAppStore, error, getDictValueByCode, formatNumber, useI18n, useMessage, isArray, isFunction, isBoolean } from "@dt-frames/core";
-import { isObject as isObject$1 } from "@vueuse/core";
+import { http, isObject, isString, useAppStore, error, getDictValueByCode, formatNumber, useI18n, isArray, message, confirm, isBoolean } from "@dt-frames/core";
 import { capitalize } from "lodash-es";
 import * as xlsx from "xlsx";
 import dayjs from "dayjs";
-const getApi = (api, baseUrl) => {
-  const loading = {
-    onSearch: ref(false),
-    onReset: ref(false),
-    onQuerypage: ref(false)
-  };
-  const newApi = {};
-  const testIsFullApi = (str) => str.startsWith("/") ? str : baseUrl + str;
-  for (let it in api) {
-    loading["on" + capitalize(it)] = ref(false);
-    const item = api[it];
-    if (isString(item)) {
-      newApi[it] = testIsFullApi(item);
-    } else {
-      newApi[it] = {
-        ...item,
-        api: testIsFullApi(item.api)
-      };
-    }
-  }
-  return {
-    api: newApi,
-    loading
-  };
-};
+import { unref, ref, toRaw } from "vue";
 function useDownload(exportUrl, exportName) {
   function download(excelData, extraData = []) {
     const { params: searchDTO, type, columns } = excelData;
@@ -131,27 +105,76 @@ function useDownload(exportUrl, exportName) {
     download
   };
 }
-function useSource(props) {
+const getApi = (api, baseUrl) => {
+  const loading = {
+    onSearch: ref(false),
+    onReset: ref(false),
+    onQuerypage: ref(false),
+    onSave: ref(false)
+  };
+  const newApi = {};
+  const testIsFullApi = (str) => str.startsWith("/") ? str : baseUrl + str;
+  for (let it in api) {
+    loading["on" + capitalize(it)] = ref(false);
+    const item = api[it];
+    if (isString(item)) {
+      newApi[it] = testIsFullApi(item);
+    } else {
+      newApi[it] = {
+        ...item,
+        api: testIsFullApi(item.api)
+      };
+    }
+  }
+  return {
+    api: newApi,
+    loading
+  };
+};
+function fetch(api, params, onlyData = true) {
+  const { type = "post", header = {} } = isObject(api) ? api : {};
+  return new Promise((resolve, reject) => {
+    http[type](api, params, {
+      ...header,
+      onlyData: false
+    }).then(
+      (data) => {
+        resolve(onlyData ? data?.data : data);
+      },
+      (error2) => {
+        reject(error2);
+      }
+    );
+  });
+}
+function useSource({
+  baseUrl,
+  api: orgApi,
+  pageName,
+  queryAfterUpdate,
+  authPrefix,
+  autoFetch = true
+}) {
   const { t } = useI18n("UI");
-  const { confirm, message } = useMessage();
   const { appConf } = useAppStore();
-  let okCode = appConf?.http?.okCode;
-  let _okCode = isArray(okCode) ? okCode : [okCode];
-  const { baseUrl, api: orgApi, exportName, queryAfterUpdate, beforeUpdate, afterUpdate, authPrefix } = props;
+  const getOkCode = () => {
+    const code = appConf?.http?.okCode;
+    return isArray(code) ? code : [code];
+  };
   const pagination = ref({
     current: appConf?.ui?.table?.defaultPageNo || 1,
     pageSize: appConf?.ui?.table?.defaultPageSize || 20,
     total: 0
   });
   const { loading, api } = getApi(orgApi, baseUrl);
+  let tableInstance = null;
+  let formInstance = null;
+  let curdInstance = null;
   const dataSource = ref([]);
   let baseData = {
     pageNumber: 1,
     pageSize: appConf?.ui?.table?.defaultPageSize || 20
   };
-  let tableInstance = null;
-  let formInstance = null;
-  let curdInstance = null;
   function onSearch(params = {}) {
     if (!api.queryPage)
       return;
@@ -189,11 +212,11 @@ function useSource(props) {
         ...params
       });
       if (isArray(result)) {
-        dataSource.value.splice(0, dataSource.value.length, ...result);
+        dataSource.value = result;
         return;
       }
       const { records, total, size, current, pageDTO } = result;
-      dataSource.value.splice(0, dataSource.value.length, ...records);
+      dataSource.value = records;
       if (pageDTO) {
         pagination.value = {
           current: pageDTO.pageNo + 1,
@@ -208,7 +231,7 @@ function useSource(props) {
         };
       }
     } catch (err) {
-      console.error(`\u5206\u9875\u67E5\u8BE2\u9519\u8BEF\uFF1A${err}`);
+      error(`\u5206\u9875\u67E5\u8BE2\u9519\u8BEF\uFF1A${err}`);
     } finally {
       loading.onSearch.value = false;
       loading.onQuerypage.value = false;
@@ -218,15 +241,16 @@ function useSource(props) {
   function onTableChange(params) {
     const { pagination: pagination2, sort, filter } = params;
     if (!appConf?.ui?.table?.multipleSorter) {
-      let order = sort.order;
-      let sortOrder = order === "ascend" ? "asc" : order === "descend" ? "desc" : null;
+      const order = sort.order;
+      const sortOrder = order === "ascend" ? "asc" : order === "descend" ? "desc" : null;
       baseData = {
         ...baseData,
         sortName: sortOrder ? sort.field : "",
         sortOrder
       };
     } else {
-      baseData.sort = (sort || []).map((it) => {
+      const _sort = isObject(sort) ? [sort] : sort;
+      baseData.sort = (_sort || []).map((it) => {
         if (it.order) {
           return {
             sortName: it.field,
@@ -242,11 +266,11 @@ function useSource(props) {
     };
     setPage(filter);
   }
-  function onOPenAddDialog() {
+  function onOpenAddDialog() {
     curdInstance && curdInstance.openAddDialog();
   }
-  async function onOpenUpdateDialog(row) {
-    curdInstance && curdInstance.openUpdateDialog(row);
+  async function onOpenEditDialog(row) {
+    curdInstance && curdInstance.openEditDialog(row);
   }
   function onDelete(row) {
     if (curdInstance) {
@@ -258,35 +282,82 @@ function useSource(props) {
   function onQueryById(id) {
     return fetch(api.queryById, { id });
   }
+  function onDeletes(ids) {
+    if (!tableInstance) {
+      return;
+    }
+    if (!api.deletes) {
+      message.error(t("EMPTY_URL"));
+      return;
+    }
+    const _ids = ids || tableInstance.getSelectedRowKeys();
+    if (!_ids.length) {
+      message.error(t("EMPTY"));
+      return;
+    }
+    const isSingleDelete = !!ids;
+    !isSingleDelete && (loading.onDeletes.value = true);
+    confirm({
+      title: isSingleDelete ? t("DELETE_CONFIRM") : t("MULTIFY_DELETE_CONFIRM"),
+      content: isSingleDelete ? t("CONFIRM_DELETE") : t("CONFIRM_MULTIFY_DELETE", { length: _ids.length }),
+      iconType: "warning",
+      onOk() {
+        fetch(api.deletes, toRaw(_ids), false).then((rsp) => {
+          if (getOkCode().includes(rsp?.code)) {
+            message.success(
+              (isSingleDelete ? "" : t("MULTIFY")) + t("DELETE_SUCCESS")
+            );
+            !isSingleDelete && tableInstance.clearSelectedRowKeys();
+            if (queryAfterUpdate !== false) {
+              onSearch();
+            }
+            if (curdInstance.afterClose) {
+              curdInstance.afterClose({
+                type: "DELETE",
+                data: rsp.data
+              });
+            }
+          }
+        }).finally(() => {
+          isSingleDelete && (loading.onDeletes.value = false);
+        });
+      }
+    });
+  }
   async function onSave(params) {
-    const methods = curdInstance ? curdInstance.curdFormMethods : formInstance;
+    const methods = curdInstance || formInstance;
     if (!methods) {
       console.log("\u672A\u914D\u7F6E\u8868\u5355\u5B9E\u4F8B\uFF01");
       return;
     }
-    let model = {
+    const model = {
       ...params,
       ...methods.getFormValues()
     };
     try {
       await methods.validate();
-      if (beforeUpdate && isFunction(beforeUpdate)) {
-        let canUpdate = beforeUpdate(model);
+      if (curdInstance.beforeSave) {
+        const canUpdate = curdInstance.beforeSave(model);
         if (isBoolean(canUpdate) && canUpdate === false) {
           return false;
         }
       }
-      if (!model.id) {
+      if (!model[tableInstance?.rowKey || "id"]) {
         loading.onAdd.value = true;
         try {
           const result = await fetch(api.add, { ...model }, false);
-          if (_okCode.includes(result?.code)) {
+          if (getOkCode().includes(result?.code)) {
             message.success(t("ADD_SUCCESS"));
             curdInstance && curdInstance.closeModal();
-            if (queryAfterUpdate !== false)
+            if (queryAfterUpdate !== false) {
               onSearch();
-            if (afterUpdate && isFunction(afterUpdate))
-              afterUpdate(result.data);
+            }
+            if (curdInstance.afterClose) {
+              curdInstance.afterClose({
+                type: "ADD",
+                data: result.data
+              });
+            }
           }
         } catch (err) {
         } finally {
@@ -296,13 +367,18 @@ function useSource(props) {
         loading.onUpdate.value = true;
         try {
           const result = await fetch(api.update, { ...model }, false);
-          if (_okCode.includes(result?.code)) {
+          if (getOkCode().includes(result?.code)) {
             message.success(t("UPDATE_SUCCESS"));
             curdInstance && curdInstance.closeModal();
-            if (queryAfterUpdate !== false)
+            if (queryAfterUpdate !== false) {
               onSearch();
-            if (afterUpdate && isFunction(afterUpdate))
-              afterUpdate(result.data);
+            }
+            if (curdInstance.afterClose) {
+              curdInstance.afterClose({
+                type: "EDIT",
+                data: result.data
+              });
+            }
           }
         } catch (err) {
         } finally {
@@ -314,60 +390,11 @@ function useSource(props) {
     } finally {
     }
   }
-  function onDeletes(ids) {
-    if (!tableInstance)
-      return;
-    if (!api.deletes) {
-      message.error(t("EMPTY_URL"));
-      return;
-    }
-    const _ids = ids || tableInstance.getSelectedRowKeys();
-    if (!_ids.length) {
-      message.error(t("EMPTY"));
-      return;
-    }
-    const isSingleDelete = !!ids;
-    !isSingleDelete && (loading.onDeletes.value = true);
-    confirm({
-      title: isSingleDelete ? t("DELETE_CONFIRM") : t("MULTIFY_DELETE_CONFIRM"),
-      content: isSingleDelete ? t("CONFIRM_DELETE") : t("CONFIRM_MULTIFY_DELETE", { length: _ids.length }),
-      iconType: "warning",
-      onOk() {
-        fetch(api.deletes, toRaw(_ids), false).then((rsp) => {
-          if (_okCode.includes(rsp?.code)) {
-            message.success((isSingleDelete ? "" : t("MULTIFY")) + t("DELETE_SUCCESS"));
-            !isSingleDelete && tableInstance.clearSelectedRowKeys();
-            if (queryAfterUpdate !== false)
-              onSearch();
-            if (afterUpdate && isFunction(afterUpdate))
-              afterUpdate(rsp.data);
-          }
-        }).finally(() => {
-          isSingleDelete && (loading.onDeletes.value = false);
-        });
-      }
-    });
-  }
   function onDownload(excelData, extraData = []) {
-    const { download } = useDownload(api.export, exportName);
+    console.log("s=s=s=s=s=");
+    const { download } = useDownload(api.export, pageName);
     download({ ...excelData, params: baseData }, extraData);
   }
-  function fetch(api2, params, onlyData = true) {
-    const { type = "post", header = {} } = isObject$1(api2) ? api2 : {};
-    return new Promise((resolve, reject) => {
-      http[type](api2, params, {
-        ...header,
-        onlyData: false
-      }).then(
-        (data) => {
-          resolve(onlyData ? data?.data : data);
-        },
-        (error2) => {
-          reject(error2);
-        }
-      );
-    });
-  }
   const form = {
     onSearch,
     onReset,
@@ -376,13 +403,14 @@ function useSource(props) {
   };
   const table = {
     authPrefix,
+    autoFetch,
     dataSource,
     pagination,
     loading: loading.onQuerypage,
     onSearch,
     onTableChange,
-    onOPenAddDialog,
-    onOpenUpdateDialog,
+    onOpenAddDialog,
+    onOpenEditDialog,
     onDelete,
     onDeletes,
     onDownload,
@@ -390,6 +418,7 @@ function useSource(props) {
   };
   const curd = {
     authPrefix,
+    title: pageName,
     onSave,
     onDeletes,
     onQueryById,
@@ -402,8 +431,8 @@ function useSource(props) {
     api,
     loading,
     dataSource,
-    onOPenAddDialog,
-    onOpenUpdateDialog,
+    onOpenAddDialog,
+    onOpenEditDialog,
     onDelete,
     onDeletes,
     onQueryById,

package/es/components/source/{hooks → src/hooks}/useDownload.d.ts

@@ -1,6 +1,6 @@
-import { DownloadType } from '../../table/src/types/header.type';
 import { Recordable, ApiType } from "@dt-frames/core";
 import { ComputedRef } from "vue";
+import { DownloadType } from '../../../table';
 export declare function useDownload(exportUrl: string | ApiType, exportName: string | ComputedRef): {
     download: (excelData: DownloadType & {
         params: Recordable;

package/es/components/source/{hooks → src/hooks}/useSource.d.ts

@@ -1,51 +1,54 @@
-import { CurdActionType } from '../../curd/src/types/curd.type';
-import { FormActionType } from '../../form/src/types/actions.type';
-import { TableActionType } from '../../table/src/types/actions.type';
-import { DownloadType } from '../../table/src/types/header.type';
-import { Recordable } from "@dt-frames/core";
-import { Key } from "ant-design-vue/es/table/interface";
-import { SourceOption, TableParamsType } from "../types/source.type";
-export declare function useSource(props: SourceOption): {
+import { Key } from 'ant-design-vue/es/table/interface';
+import { ApiObjType, SourceConf, TableParamsType } from '../types/source.type';
+import { FormActionType } from '../../../form';
+import { CurdActionType } from '../../../curd';
+import { DownloadType, TableActionType } from '../../../table';
+type registerTableType = TableActionType & {
+    rowKey: string | number;
+};
+export declare function useSource({ baseUrl, api: orgApi, pageName, queryAfterUpdate, authPrefix, autoFetch }: SourceConf): {
     form: {
         onSearch: (params?: Recordable) => void;
         onReset: (params?: Recordable) => void;
         loading: {
-            [key: string]: import("vue").Ref<boolean>;
+            [key: string]: globalThis.Ref<boolean>;
         };
         registerInstance: (instance: FormActionType) => FormActionType;
     };
     table: {
         authPrefix: string;
-        dataSource: import("vue").Ref<any[]>;
-        pagination: import("vue").Ref<{
+        autoFetch: boolean;
+        dataSource: globalThis.Ref<any[]>;
+        pagination: globalThis.Ref<{
             current: number;
             pageSize: number;
             total: number;
         }>;
-        loading: import("vue").Ref<boolean>;
+        loading: globalThis.Ref<boolean>;
         onSearch: (params?: Recordable) => void;
         onTableChange: (params: TableParamsType) => void;
-        onOPenAddDialog: () => void;
-        onOpenUpdateDialog: (row?: Recordable) => Promise<void>;
+        onOpenAddDialog: () => void;
+        onOpenEditDialog: (row?: Recordable) => Promise<void>;
         onDelete: (row: Recordable) => void;
         onDeletes: (ids: Key[]) => void;
         onDownload: (excelData: DownloadType, extraData?: any[]) => void;
-        registerInstance: (instance: TableActionType) => TableActionType;
+        registerInstance: (instance: registerTableType) => registerTableType;
     };
     curd: {
         authPrefix: string;
+        title: string | globalThis.ComputedRef<any>;
         onSave: (params?: Recordable) => Promise<boolean>;
         onDeletes: (ids: Key[]) => void;
         onQueryById: (id: Key) => Promise<unknown>;
         registerInstance: (instance: CurdActionType) => CurdActionType;
     };
-    api: import("../types/source.type").ApiObjType;
+    api: ApiObjType;
     loading: {
-        [key: string]: import("vue").Ref<boolean>;
+        [key: string]: globalThis.Ref<boolean>;
     };
-    dataSource: import("vue").Ref<any[]>;
-    onOPenAddDialog: () => void;
-    onOpenUpdateDialog: (row?: Recordable) => Promise<void>;
+    dataSource: globalThis.Ref<any[]>;
+    onOpenAddDialog: () => void;
+    onOpenEditDialog: (row?: Recordable) => Promise<void>;
     onDelete: (row: Recordable) => void;
     onDeletes: (ids: Key[]) => void;
     onQueryById: (id: Key) => Promise<unknown>;
@@ -55,3 +58,4 @@ export declare function useSource(props: SourceOption): {
     onReset: (params?: Recordable) => void;
     onTableChange: (params: TableParamsType) => void;
 };
+export {};

package/es/components/source/{types → src/types}/source.type.d.ts

@@ -1,6 +1,6 @@
-import { ApiType, Recordable } from "@dt-frames/core";
-import { ComputedRef } from "vue";
-export declare type ApiObjType = {
+import { ApiType, Recordable } from '@dt-frames/core';
+import { ComputedRef } from 'vue';
+export type ApiObjType = {
     add?: string | ApiType;
     update?: string | ApiType;
     save?: string | ApiType;
@@ -9,27 +9,26 @@ export declare type ApiObjType = {
     queryPage?: string | ApiType;
     [key: string]: string | ApiType;
 };
-export declare type SourceOption = {
+export type SourceConf = {
     baseUrl?: string;
-    exportName?: string | ComputedRef;
+    pageName?: string | ComputedRef;
     authPrefix?: string;
+    autoFetch?: boolean;
     queryAfterUpdate?: boolean;
-    beforeUpdate?: (model: Recordable) => boolean | Recordable | undefined;
-    afterUpdate?: (data: Recordable) => void;
     api?: ApiObjType;
 };
-export declare type orderType = {
-    field: string | number;
-    order: 'asc' | 'desc';
-};
-export declare type BaseDataType = {
+export type BaseDataType = {
     pageNumber: Number;
     pageSize: Number;
     [key: string]: any;
 };
-export declare type TableParamsType = {
+export type TableParamsType = {
     pagination: any;
     showBtnLoading: boolean;
     sort: Recordable;
     filter: any;
 };
+export type orderType = {
+    field: string | number;
+    order: 'asc' | 'desc';
+};

package/es/components/table/index.d.ts

@@ -1,3 +1,8 @@
-import { useTable } from "./src/hooks/useTable";
+import { useTable } from './src/hooks/useTable';
 import DtTable from "./src/index";
-export { DtTable, useTable };
+import DtTableHeader from "./src/components/TableHeader";
+import { TableActionType } from './src/types/actions.type';
+import { DownloadType } from './src/types/header.type';
+import { BasicColumn, ButtonType, TableRowAction, TableSetting } from './src/types/table.type';
+export { DtTable, DtTableHeader, useTable };
+export type { TableActionType, DownloadType, BasicColumn, TableSetting, TableRowAction, ButtonType };