@cfmm/umi-plugins-ui-v2 0.0.7 → 0.0.8

package/dist/cjs/components/CrudTable.tpl

@@ -1,22 +1,29 @@
 import { CloudDownloadOutlined, DownloadOutlined, PlusOutlined, UploadOutlined } from '@ant-design/icons';
-import { ActionType, ColumnsState, ProColumns, ProTable } from '@ant-design/pro-components';
+import { ActionType, ColumnsState, ProColumns, ProFormInstance, ProTable } from '@ant-design/pro-components';
 import { cfmmUtils, ImportExecl, useFormatLocale, useIntl, useModel } from '@umijs/max';
-import { Button, Dropdown, MenuProps, message, Modal, Progress } from 'antd';
+import { Button, Drawer, Dropdown, MenuProps, message, Modal, Progress } from 'antd';
 import React, { ForwardedRef, forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import useAction from '../hooks/useAction';
 import useAuthority from '../hooks/useAuthority';
 import useMemoizedFn from '../hooks/useMemoizedFn';
 import useQueryTableList from '../hooks/useQueryTableList';
-import { API, CrudTableConfig, CrudTableRefType, ExportMultiLangListItem, LangInfoItem, RefDrawerFormRefType } from '../types';
+import { importMultiLangList, queryLangInfoExportList } from '../services';
+import {
+  API,
+  CrudTableConfig,
+  CrudTableRefType,
+  ExportMultiLangListItem,
+  LangInfoItem,
+  RefDrawerFormRefType,
+} from '../types';
+import { genExcel, genExcelAdvanced, getExportColumns, getExportValueForColumns } from '../utils/excelHelper';
+import { handleImportList, showCheckErrorTips } from '../utils/importHelper';
 import ActionLogDrawer from './ActionLogDrawer';
 import CreateForm from './AddDrawerForm';
 import DropdownButton from './DropdownButton';
 import EditMultiLangForm from './EditMultiLangForm';
 import MyFooterToolbar from './MyFooterToolbar';
 import ViewTableItemDrawer from './ViewTableItemDrawer';
-import { genExcel, genExcelAdvanced, getExportColumns, getExportValueForColumns } from '../utils/excelHelper';
-import { importMultiLangList, queryLangInfoExportList } from '../services';
-import { handleImportList, showCheckErrorTips } from '../utils/importHelper';
 
 const { confirm } = Modal;
 export const TABLE_SCROLL = { x: 'max-content' };
@@ -87,6 +94,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
   const actionRef = useRef<ActionType>();
   const updateDrawerRef = useRef<RefDrawerFormRefType>();
   const timer = useRef<NodeJS.Timeout>();
+  const updateFormRef = useRef<ProFormInstance>();
 
   // 状态管理
   const [tableList, setTableList] = useState<T[]>([]);
@@ -96,6 +104,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
   const [selectedRows, setSelectedRows] = useState<T[]>([]);
   const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
   const [createModalOpen, setCreateModalOpen] = useState<boolean>(false);
+  const [updateModalOpen, setUpdateModalOpen] = useState<boolean>(false);
 
   // 多语言编辑状态
   const [editLangModalOpen, setEditLangModalOpen] = useState<boolean>(false);
@@ -133,27 +142,35 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     setEditLangModalOpen(true);
   });
 
-  const queryMultiLangData = useMemoizedFn(async (tableName: string, columnName: string): Promise<ExportMultiLangListItem[]> => {
-    if (!multiLang) return [];
+  // 查询多语言数据
+  const queryMultiLangData = useMemoizedFn(
+    async (tableName: string, columnName: string): Promise<ExportMultiLangListItem[]> => {
+      if (!multiLang) return [];
 
-    if (multiLang.multiLangList) {
-      return multiLang.multiLangList;
-    }
+      if (multiLang.multiLangList) {
+        return multiLang.multiLangList;
+      }
 
-    if (multiLang.queryExportMultiLangData) {
-      return await multiLang.queryExportMultiLangData(tableName, columnName);
-    }
+      if (multiLang.queryExportMultiLangData) {
+        return await multiLang.queryExportMultiLangData(tableName, columnName);
+      }
 
-    const result = await doAction('GET', { tableName, columnName }, {
-      actionFn: queryLangInfoExportList,
-    });
+      const result = await doAction(
+        'GET',
+        { tableName, columnName },
+        {
+          actionFn: queryLangInfoExportList,
+        },
+      );
 
-    if (result.success && result.data) {
-      return result.data;
-    }
-    return [];
-  });
+      if (result.success && result.data) {
+        return result.data;
+      }
+      return [];
+    },
+  );
 
+  // 导出多语言数据
   const handleExportMultiLang = useMemoizedFn(async () => {
     if (multiLang?.exportMultiLangData) {
       return await multiLang.exportMultiLangData();
@@ -173,7 +190,14 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
 
     if (!data.length) return;
 
-    const handleData = data.map(item => [item.dataId, item.columnValue, item.zh_CN, item.zh_TW, item.en_US, item.th_TH]);
+    const handleData = data.map((item) => [
+      item.dataId,
+      item.columnValue,
+      item.zh_CN,
+      item.zh_TW,
+      item.en_US,
+      item.th_TH,
+    ]);
 
     genExcelAdvanced(
       `${title}.xlsx`,
@@ -184,10 +208,12 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         codeColumns: codeList,
         title: title,
         titleStyle: { fontSize: 18, bold: true },
-        notice: [formatMessage({ id: 'cfmmUI.common.button.exportMultiLang.notice', defaultMessage: '请勿修改表格结构' })],
+        notice: [
+          formatMessage({ id: 'cfmmUI.common.button.exportMultiLang.notice', defaultMessage: '请勿修改表格结构' }),
+        ],
         worksheetColumns: new Array(codeList.length).fill('').map((item, index) => ({ hidden: index == 0, width: 25 })),
         lockedColumns: [0], // 第一列不允许修改
-      }
+      },
     );
     return false;
   });
@@ -212,14 +238,18 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     //   return Promise.resolve({ success: false });
     // }
 
-    const result = await doAction('IMPORT', {
-      tableName: tableName,
-      columnName: columnName,
-      i18nDataList: newList.filter(item => item.en_US || item.zh_CN || item.zh_TW || item.th_TH),
-    }, {
-      actionFn: importMultiLangList,
-      showMsg: false,
-    });
+    const result = await doAction(
+      'IMPORT',
+      {
+        tableName: tableName,
+        columnName: columnName,
+        i18nDataList: newList.filter((item) => item.en_US || item.zh_CN || item.zh_TW || item.th_TH),
+      },
+      {
+        actionFn: importMultiLangList,
+        showMsg: false,
+      },
+    );
 
     if (result.success) {
       actionRef.current?.reload();
@@ -359,6 +389,10 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
       editData = processedData;
     }
 
+    setUpdateModalOpen(true);
+
+    updateFormRef.current?.setFieldsValue(editData);
+    
     updateDrawerRef.current?.show();
     setEditRow(editData);
   });
@@ -402,9 +436,9 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     });
   };
 
-  // 导入物料
+  // 导入列表数据
   const importListData = useMemoizedFn(async (list: T[]) => {
-    if(!apis.importData && !interceptors.importData?.submitImportListData) return;
+    if (!apis.importData && !interceptors.importData?.submitImportListData) return;
 
     // 处理导入数据，正确赋值字段以及转格式
     const newList = interceptors.importData?.request?.(list) ?? handleImportList<T>(list);
@@ -417,7 +451,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
       return Promise.resolve({ success: false });
     }
 
-    const resutl = await interceptors.importData?.submitImportListData?.(newList) || await submitListData(newList);
+    const resutl = (await interceptors.importData?.submitImportListData?.(newList)) || (await submitListData(newList));
 
     onAfterImport?.(resutl);
 
@@ -427,13 +461,14 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     return resutl;
   });
 
+  // 处理进度条变化
   const handlePercentChange = (value: number) => {
     setPercent(value);
   };
 
   /**
- * 下载数据为Excel
- */
+   * 下载数据为Excel
+   */
   const handleDownloadExcel = async () => {
     const result = await handleSearchAll();
     if (!result.success || result.error || !result.data) {
@@ -569,7 +604,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         ...(actionColumnConfig?.columnConfig ?? {}),
       },
     ];
-  }, [rowKey, columns, multiLang, defaultAuthCodes, actionColumnConfig]);
+  }, [rowKey, columns, multiLang, defaultAuthCodes, actionColumnConfig, updateFormRef]);
 
   useImperativeHandle(
     ref,
@@ -630,7 +665,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
 
   // 处理表格额外操作按钮列表
   const handleTableButtonList = (allButtons: MenuProps['items']) => {
-    if(!allButtons?.length) return allButtons;
+    if (!allButtons?.length) return allButtons;
 
     let renderList: MenuProps['items'] | any[] = [...(allButtons ?? [])];
 
@@ -704,7 +739,8 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         ),
       },
       {
-        auth: getAuthorityFn(defaultAuthCodes.import) && (apis.importData || interceptors.importData?.submitImportListData),
+        auth:
+          getAuthorityFn(defaultAuthCodes.import) && (apis.importData || interceptors.importData?.submitImportListData),
         key: 'import',
         label: (
           <ImportExecl key="importMaterial" rangeStart={{ c: 0, r: 2 }} onChange={importListData}>
@@ -719,19 +755,19 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         auth: getAuthorityFn(defaultAuthCodes.export),
         key: 'export',
         disabled: !tableList.length || loading,
-        label: <a onClick={handleDownloadExcel} key="export">
-          <CloudDownloadOutlined style={{ marginRight: 6 }} />
-          {formatMessage({ id: 'cfmmUI.common.button.exportData', defaultMessage: '导出数据' })}
-        </a>
+        label: (
+          <a onClick={handleDownloadExcel} key="export">
+            <CloudDownloadOutlined style={{ marginRight: 6 }} />
+            {formatMessage({ id: 'cfmmUI.common.button.exportData', defaultMessage: '导出数据' })}
+          </a>
+        ),
       },
     ];
 
     allButtons = handleTableButtonList(allButtons);
 
     // 过滤有权限的按钮，并移除 auth 属性避免传递到 DOM
-    return allButtons!
-      .filter((button) => button.auth)
-      .map(({ auth, ...rest }) => rest);
+    return allButtons!.filter((button) => button.auth).map(({ auth, ...rest }) => rest);
   }, [tableList, loading, columnsStateMap]);
 
   return (
@@ -750,10 +786,14 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         toolBarRender={useMemoizedFn(() => {
           if (!getBarButtons?.length) return [];
           return [
-            <Dropdown.Button type="primary" loading={actionLoading || downloadButtonLoading} menu={{ items: getBarButtons.slice(1) }}>
+            <Dropdown.Button
+              type="primary"
+              loading={actionLoading || downloadButtonLoading}
+              menu={{ items: getBarButtons.slice(1) }}
+            >
               {getBarButtons[0].icon}
               {getBarButtons[0].label}
-            </Dropdown.Button>
+            </Dropdown.Button>,
           ];
         })}
         request={useMemoizedFn(async (params, sorter) => {
@@ -844,7 +884,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
       )}
 
       {/* 编辑表单 */}
-      {updateConfig.Component && (
+      {updateConfig.Component ? (
         <updateConfig.Component
           updateDrawerRef={updateDrawerRef}
           values={editRow}
@@ -864,6 +904,64 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
           }}
           {...(updateConfig.props as U)}
         />
+      ) : (
+        <Drawer
+          width={500}
+          title={formatMessage({
+            id: `${baseLocalCode}.update.title`,
+            defaultMessage: '修改',
+          })}
+          forceRender // 勿删，否则formRef无法被绑定到ProTable上，因为ProTable是异步渲染的
+          maskClosable={false}
+          open={updateModalOpen}
+          onClose={() => {
+            setEditRow(null);
+            setUpdateModalOpen(false);
+          }}
+          // footer={<Button onClick={() => props.form?.resetFields()}>清空</Button>}
+        >
+          <ProTable<T, T>
+            loading={actionLoading}
+            onSubmit={useMemoizedFn(async (value) => {
+
+              const success = await handleAction('PUT', {
+                ...value,
+                [rowKey]: editRow?.[rowKey],
+              });
+              if (success) {
+                actionRef.current?.reload();
+                setEditRow(null);
+                setUpdateModalOpen(false);
+              }
+              return success;
+            })}
+            rowKey={rowKey as string}
+            type="form"
+            columns={columns}
+            {...(updateConfig.props as U)}
+            formRef={updateFormRef}
+            onReset={() => {
+              updateFormRef.current?.setFieldsValue({ ...(editRow || {}) });
+            }}
+            // 自定义按钮
+            // form={{
+            //   submitter: {
+            //     searchConfig: {
+            //       submitText: '保存',
+            //       resetText: '还原',
+            //     },
+            //     submitButtonProps: { type: 'primary' },
+            //     resetButtonProps: { type: 'default' },
+            //     render: (props, dom) => (
+            //       <Space>
+            //         <Button onClick={() => props.form?.resetFields()}>清空</Button>
+            //         {dom[1]} {/* 默认提交按钮 */}
+            //       </Space>
+            //     ),
+            //   },
+            // }}
+          />
+        </Drawer>
       )}
 
       {/* 多语言编辑 */}
@@ -886,8 +984,4 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
   );
 }
 
-export default React.memo(forwardRef(CrudTable)) as <T, U = any, C = any>(
-  props: CrudTableConfig<T, U, C> & {
-    ref?: ForwardedRef<CrudTableRefType<T>>;
-  },
-) => JSX.Element;
+export default React.memo(forwardRef(CrudTable)) as typeof CrudTable;

package/dist/cjs/components/MySelect.tpl

@@ -1,3 +1,6 @@
+// @ts-nocheck
+// This file is generated by Umi automatically
+// DO NOT CHANGE IT MANUALLY!
 import { Empty, Select, Spin } from 'antd';
 import React, {
   ForwardedRef,
@@ -16,24 +19,6 @@ import { MySelectProps } from '../types';
 
 const { Option } = Select;
 
-/**
- * @param autoSelect 列表只有一项时，直接选中，不需要再次点击
- * @param showAllList 获取所有数据，不分页
- * @param localListData 传递给组件的下拉数据
- * @param backShowList 回显列表
- * @param request  请求列表数据
- * @param keyNames  Option组件的参数
- * @param searchKey  搜索传给后端的key
- * @param otherSearchValue  根据其他条件查询下拉列表数据
- * @param selectKey  下拉框选择的值
- * @param onlyShowName  只显示名称
- * @param itemRender  自定义渲染
- * @param valueType  内容类型
- * @param showDropdown  判断下拉框的显示
- * @param getSelectList 获取当前选中的原始数据数组
- * @param dropDownListChange 数据下拉列表变化回调
- * @param 组件Select的参数
- */
 const MySelect = <T,>(props: MySelectProps<T>, ref: ForwardedRef<any>) => {
   const {
     readonly,
@@ -262,6 +247,23 @@ const MySelect = <T,>(props: MySelectProps<T>, ref: ForwardedRef<any>) => {
   );
 };
 
-export default React.memo(forwardRef(MySelect)) as <T>(
-  props: MySelectProps<T> & { ref?: ForwardedRef<any> },
-) => JSX.Element;
+/**
+ * 写在这里使用时才有提示
+ * @param autoSelect 列表只有一项时，直接选中，不需要再次点击
+ * @param showAllList 获取所有数据，不分页
+ * @param localListData 传递给组件的下拉数据
+ * @param backShowList 回显列表
+ * @param request  请求列表数据
+ * @param keyNames  Option组件的参数
+ * @param searchKey  搜索传给后端的key
+ * @param otherSearchValue  根据其他条件查询下拉列表数据
+ * @param selectKey  下拉框选择的值
+ * @param onlyShowName  只显示名称
+ * @param itemRender  自定义渲染
+ * @param valueType  内容类型
+ * @param showDropdown  判断下拉框的显示
+ * @param getSelectList 获取当前选中的原始数据数组
+ * @param dropDownListChange 数据下拉列表变化回调
+ * @param 组件Select的参数
+ */
+export default React.memo(forwardRef(MySelect)) as typeof MySelect;

package/dist/esm/components/CrudTable.tpl

@@ -1,22 +1,29 @@
 import { CloudDownloadOutlined, DownloadOutlined, PlusOutlined, UploadOutlined } from '@ant-design/icons';
-import { ActionType, ColumnsState, ProColumns, ProTable } from '@ant-design/pro-components';
+import { ActionType, ColumnsState, ProColumns, ProFormInstance, ProTable } from '@ant-design/pro-components';
 import { cfmmUtils, ImportExecl, useFormatLocale, useIntl, useModel } from '@umijs/max';
-import { Button, Dropdown, MenuProps, message, Modal, Progress } from 'antd';
+import { Button, Drawer, Dropdown, MenuProps, message, Modal, Progress } from 'antd';
 import React, { ForwardedRef, forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import useAction from '../hooks/useAction';
 import useAuthority from '../hooks/useAuthority';
 import useMemoizedFn from '../hooks/useMemoizedFn';
 import useQueryTableList from '../hooks/useQueryTableList';
-import { API, CrudTableConfig, CrudTableRefType, ExportMultiLangListItem, LangInfoItem, RefDrawerFormRefType } from '../types';
+import { importMultiLangList, queryLangInfoExportList } from '../services';
+import {
+  API,
+  CrudTableConfig,
+  CrudTableRefType,
+  ExportMultiLangListItem,
+  LangInfoItem,
+  RefDrawerFormRefType,
+} from '../types';
+import { genExcel, genExcelAdvanced, getExportColumns, getExportValueForColumns } from '../utils/excelHelper';
+import { handleImportList, showCheckErrorTips } from '../utils/importHelper';
 import ActionLogDrawer from './ActionLogDrawer';
 import CreateForm from './AddDrawerForm';
 import DropdownButton from './DropdownButton';
 import EditMultiLangForm from './EditMultiLangForm';
 import MyFooterToolbar from './MyFooterToolbar';
 import ViewTableItemDrawer from './ViewTableItemDrawer';
-import { genExcel, genExcelAdvanced, getExportColumns, getExportValueForColumns } from '../utils/excelHelper';
-import { importMultiLangList, queryLangInfoExportList } from '../services';
-import { handleImportList, showCheckErrorTips } from '../utils/importHelper';
 
 const { confirm } = Modal;
 export const TABLE_SCROLL = { x: 'max-content' };
@@ -87,6 +94,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
   const actionRef = useRef<ActionType>();
   const updateDrawerRef = useRef<RefDrawerFormRefType>();
   const timer = useRef<NodeJS.Timeout>();
+  const updateFormRef = useRef<ProFormInstance>();
 
   // 状态管理
   const [tableList, setTableList] = useState<T[]>([]);
@@ -96,6 +104,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
   const [selectedRows, setSelectedRows] = useState<T[]>([]);
   const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
   const [createModalOpen, setCreateModalOpen] = useState<boolean>(false);
+  const [updateModalOpen, setUpdateModalOpen] = useState<boolean>(false);
 
   // 多语言编辑状态
   const [editLangModalOpen, setEditLangModalOpen] = useState<boolean>(false);
@@ -133,27 +142,35 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     setEditLangModalOpen(true);
   });
 
-  const queryMultiLangData = useMemoizedFn(async (tableName: string, columnName: string): Promise<ExportMultiLangListItem[]> => {
-    if (!multiLang) return [];
+  // 查询多语言数据
+  const queryMultiLangData = useMemoizedFn(
+    async (tableName: string, columnName: string): Promise<ExportMultiLangListItem[]> => {
+      if (!multiLang) return [];
 
-    if (multiLang.multiLangList) {
-      return multiLang.multiLangList;
-    }
+      if (multiLang.multiLangList) {
+        return multiLang.multiLangList;
+      }
 
-    if (multiLang.queryExportMultiLangData) {
-      return await multiLang.queryExportMultiLangData(tableName, columnName);
-    }
+      if (multiLang.queryExportMultiLangData) {
+        return await multiLang.queryExportMultiLangData(tableName, columnName);
+      }
 
-    const result = await doAction('GET', { tableName, columnName }, {
-      actionFn: queryLangInfoExportList,
-    });
+      const result = await doAction(
+        'GET',
+        { tableName, columnName },
+        {
+          actionFn: queryLangInfoExportList,
+        },
+      );
 
-    if (result.success && result.data) {
-      return result.data;
-    }
-    return [];
-  });
+      if (result.success && result.data) {
+        return result.data;
+      }
+      return [];
+    },
+  );
 
+  // 导出多语言数据
   const handleExportMultiLang = useMemoizedFn(async () => {
     if (multiLang?.exportMultiLangData) {
       return await multiLang.exportMultiLangData();
@@ -173,7 +190,14 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
 
     if (!data.length) return;
 
-    const handleData = data.map(item => [item.dataId, item.columnValue, item.zh_CN, item.zh_TW, item.en_US, item.th_TH]);
+    const handleData = data.map((item) => [
+      item.dataId,
+      item.columnValue,
+      item.zh_CN,
+      item.zh_TW,
+      item.en_US,
+      item.th_TH,
+    ]);
 
     genExcelAdvanced(
       `${title}.xlsx`,
@@ -184,10 +208,12 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         codeColumns: codeList,
         title: title,
         titleStyle: { fontSize: 18, bold: true },
-        notice: [formatMessage({ id: 'cfmmUI.common.button.exportMultiLang.notice', defaultMessage: '请勿修改表格结构' })],
+        notice: [
+          formatMessage({ id: 'cfmmUI.common.button.exportMultiLang.notice', defaultMessage: '请勿修改表格结构' }),
+        ],
         worksheetColumns: new Array(codeList.length).fill('').map((item, index) => ({ hidden: index == 0, width: 25 })),
         lockedColumns: [0], // 第一列不允许修改
-      }
+      },
     );
     return false;
   });
@@ -212,14 +238,18 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     //   return Promise.resolve({ success: false });
     // }
 
-    const result = await doAction('IMPORT', {
-      tableName: tableName,
-      columnName: columnName,
-      i18nDataList: newList.filter(item => item.en_US || item.zh_CN || item.zh_TW || item.th_TH),
-    }, {
-      actionFn: importMultiLangList,
-      showMsg: false,
-    });
+    const result = await doAction(
+      'IMPORT',
+      {
+        tableName: tableName,
+        columnName: columnName,
+        i18nDataList: newList.filter((item) => item.en_US || item.zh_CN || item.zh_TW || item.th_TH),
+      },
+      {
+        actionFn: importMultiLangList,
+        showMsg: false,
+      },
+    );
 
     if (result.success) {
       actionRef.current?.reload();
@@ -359,6 +389,10 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
       editData = processedData;
     }
 
+    setUpdateModalOpen(true);
+
+    updateFormRef.current?.setFieldsValue(editData);
+    
     updateDrawerRef.current?.show();
     setEditRow(editData);
   });
@@ -402,9 +436,9 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     });
   };
 
-  // 导入物料
+  // 导入列表数据
   const importListData = useMemoizedFn(async (list: T[]) => {
-    if(!apis.importData && !interceptors.importData?.submitImportListData) return;
+    if (!apis.importData && !interceptors.importData?.submitImportListData) return;
 
     // 处理导入数据，正确赋值字段以及转格式
     const newList = interceptors.importData?.request?.(list) ?? handleImportList<T>(list);
@@ -417,7 +451,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
       return Promise.resolve({ success: false });
     }
 
-    const resutl = await interceptors.importData?.submitImportListData?.(newList) || await submitListData(newList);
+    const resutl = (await interceptors.importData?.submitImportListData?.(newList)) || (await submitListData(newList));
 
     onAfterImport?.(resutl);
 
@@ -427,13 +461,14 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
     return resutl;
   });
 
+  // 处理进度条变化
   const handlePercentChange = (value: number) => {
     setPercent(value);
   };
 
   /**
- * 下载数据为Excel
- */
+   * 下载数据为Excel
+   */
   const handleDownloadExcel = async () => {
     const result = await handleSearchAll();
     if (!result.success || result.error || !result.data) {
@@ -569,7 +604,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         ...(actionColumnConfig?.columnConfig ?? {}),
       },
     ];
-  }, [rowKey, columns, multiLang, defaultAuthCodes, actionColumnConfig]);
+  }, [rowKey, columns, multiLang, defaultAuthCodes, actionColumnConfig, updateFormRef]);
 
   useImperativeHandle(
     ref,
@@ -630,7 +665,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
 
   // 处理表格额外操作按钮列表
   const handleTableButtonList = (allButtons: MenuProps['items']) => {
-    if(!allButtons?.length) return allButtons;
+    if (!allButtons?.length) return allButtons;
 
     let renderList: MenuProps['items'] | any[] = [...(allButtons ?? [])];
 
@@ -704,7 +739,8 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         ),
       },
       {
-        auth: getAuthorityFn(defaultAuthCodes.import) && (apis.importData || interceptors.importData?.submitImportListData),
+        auth:
+          getAuthorityFn(defaultAuthCodes.import) && (apis.importData || interceptors.importData?.submitImportListData),
         key: 'import',
         label: (
           <ImportExecl key="importMaterial" rangeStart={{ c: 0, r: 2 }} onChange={importListData}>
@@ -719,19 +755,19 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         auth: getAuthorityFn(defaultAuthCodes.export),
         key: 'export',
         disabled: !tableList.length || loading,
-        label: <a onClick={handleDownloadExcel} key="export">
-          <CloudDownloadOutlined style={{ marginRight: 6 }} />
-          {formatMessage({ id: 'cfmmUI.common.button.exportData', defaultMessage: '导出数据' })}
-        </a>
+        label: (
+          <a onClick={handleDownloadExcel} key="export">
+            <CloudDownloadOutlined style={{ marginRight: 6 }} />
+            {formatMessage({ id: 'cfmmUI.common.button.exportData', defaultMessage: '导出数据' })}
+          </a>
+        ),
       },
     ];
 
     allButtons = handleTableButtonList(allButtons);
 
     // 过滤有权限的按钮，并移除 auth 属性避免传递到 DOM
-    return allButtons!
-      .filter((button) => button.auth)
-      .map(({ auth, ...rest }) => rest);
+    return allButtons!.filter((button) => button.auth).map(({ auth, ...rest }) => rest);
   }, [tableList, loading, columnsStateMap]);
 
   return (
@@ -750,10 +786,14 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
         toolBarRender={useMemoizedFn(() => {
           if (!getBarButtons?.length) return [];
           return [
-            <Dropdown.Button type="primary" loading={actionLoading || downloadButtonLoading} menu={{ items: getBarButtons.slice(1) }}>
+            <Dropdown.Button
+              type="primary"
+              loading={actionLoading || downloadButtonLoading}
+              menu={{ items: getBarButtons.slice(1) }}
+            >
               {getBarButtons[0].icon}
               {getBarButtons[0].label}
-            </Dropdown.Button>
+            </Dropdown.Button>,
           ];
         })}
         request={useMemoizedFn(async (params, sorter) => {
@@ -844,7 +884,7 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
       )}
 
       {/* 编辑表单 */}
-      {updateConfig.Component && (
+      {updateConfig.Component ? (
         <updateConfig.Component
           updateDrawerRef={updateDrawerRef}
           values={editRow}
@@ -864,6 +904,64 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
           }}
           {...(updateConfig.props as U)}
         />
+      ) : (
+        <Drawer
+          width={500}
+          title={formatMessage({
+            id: `${baseLocalCode}.update.title`,
+            defaultMessage: '修改',
+          })}
+          forceRender // 勿删，否则formRef无法被绑定到ProTable上，因为ProTable是异步渲染的
+          maskClosable={false}
+          open={updateModalOpen}
+          onClose={() => {
+            setEditRow(null);
+            setUpdateModalOpen(false);
+          }}
+          // footer={<Button onClick={() => props.form?.resetFields()}>清空</Button>}
+        >
+          <ProTable<T, T>
+            loading={actionLoading}
+            onSubmit={useMemoizedFn(async (value) => {
+
+              const success = await handleAction('PUT', {
+                ...value,
+                [rowKey]: editRow?.[rowKey],
+              });
+              if (success) {
+                actionRef.current?.reload();
+                setEditRow(null);
+                setUpdateModalOpen(false);
+              }
+              return success;
+            })}
+            rowKey={rowKey as string}
+            type="form"
+            columns={columns}
+            {...(updateConfig.props as U)}
+            formRef={updateFormRef}
+            onReset={() => {
+              updateFormRef.current?.setFieldsValue({ ...(editRow || {}) });
+            }}
+            // 自定义按钮
+            // form={{
+            //   submitter: {
+            //     searchConfig: {
+            //       submitText: '保存',
+            //       resetText: '还原',
+            //     },
+            //     submitButtonProps: { type: 'primary' },
+            //     resetButtonProps: { type: 'default' },
+            //     render: (props, dom) => (
+            //       <Space>
+            //         <Button onClick={() => props.form?.resetFields()}>清空</Button>
+            //         {dom[1]} {/* 默认提交按钮 */}
+            //       </Space>
+            //     ),
+            //   },
+            // }}
+          />
+        </Drawer>
       )}
 
       {/* 多语言编辑 */}
@@ -886,8 +984,4 @@ function CrudTable<T extends Record<string, any>, U = {}, C = {}>(
   );
 }
 
-export default React.memo(forwardRef(CrudTable)) as <T, U = any, C = any>(
-  props: CrudTableConfig<T, U, C> & {
-    ref?: ForwardedRef<CrudTableRefType<T>>;
-  },
-) => JSX.Element;
+export default React.memo(forwardRef(CrudTable)) as typeof CrudTable;

package/dist/esm/components/MySelect.tpl

@@ -1,3 +1,6 @@
+// @ts-nocheck
+// This file is generated by Umi automatically
+// DO NOT CHANGE IT MANUALLY!
 import { Empty, Select, Spin } from 'antd';
 import React, {
   ForwardedRef,
@@ -16,24 +19,6 @@ import { MySelectProps } from '../types';
 
 const { Option } = Select;
 
-/**
- * @param autoSelect 列表只有一项时，直接选中，不需要再次点击
- * @param showAllList 获取所有数据，不分页
- * @param localListData 传递给组件的下拉数据
- * @param backShowList 回显列表
- * @param request  请求列表数据
- * @param keyNames  Option组件的参数
- * @param searchKey  搜索传给后端的key
- * @param otherSearchValue  根据其他条件查询下拉列表数据
- * @param selectKey  下拉框选择的值
- * @param onlyShowName  只显示名称
- * @param itemRender  自定义渲染
- * @param valueType  内容类型
- * @param showDropdown  判断下拉框的显示
- * @param getSelectList 获取当前选中的原始数据数组
- * @param dropDownListChange 数据下拉列表变化回调
- * @param 组件Select的参数
- */
 const MySelect = <T,>(props: MySelectProps<T>, ref: ForwardedRef<any>) => {
   const {
     readonly,
@@ -262,6 +247,23 @@ const MySelect = <T,>(props: MySelectProps<T>, ref: ForwardedRef<any>) => {
   );
 };
 
-export default React.memo(forwardRef(MySelect)) as <T>(
-  props: MySelectProps<T> & { ref?: ForwardedRef<any> },
-) => JSX.Element;
+/**
+ * 写在这里使用时才有提示
+ * @param autoSelect 列表只有一项时，直接选中，不需要再次点击
+ * @param showAllList 获取所有数据，不分页
+ * @param localListData 传递给组件的下拉数据
+ * @param backShowList 回显列表
+ * @param request  请求列表数据
+ * @param keyNames  Option组件的参数
+ * @param searchKey  搜索传给后端的key
+ * @param otherSearchValue  根据其他条件查询下拉列表数据
+ * @param selectKey  下拉框选择的值
+ * @param onlyShowName  只显示名称
+ * @param itemRender  自定义渲染
+ * @param valueType  内容类型
+ * @param showDropdown  判断下拉框的显示
+ * @param getSelectList 获取当前选中的原始数据数组
+ * @param dropDownListChange 数据下拉列表变化回调
+ * @param 组件Select的参数
+ */
+export default React.memo(forwardRef(MySelect)) as typeof MySelect;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cfmm/umi-plugins-ui-v2",
   "author": "ysj <411367308@qq.com>",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "main": "dist/cjs/index.js",
   "types": "dist/cjs/index.d.ts",
   "publishConfig": {