@lingxiteam/ebe-utils 0.1.5 → 0.1.6

package/lib/pcpublic/src/components/pcfactory/src/Table/EditComponent/index.tsx

@@ -16,6 +16,7 @@ import { getRegExp, initMomentLocale } from '../../utils/common';
 import { useLocale } from '../../utils/hooks/useLocale';
 import { ExpressionRenderingParams } from '../../utils/PropsType';
 import { EDIT_COMPONENT_STOP_PROPAGATION_CLS } from '../constant';
+import { getFormItemFieldName } from '../utils';
 
 export interface MyEditComponent {
   inlineVChange: (date: any, _label: any) => void;
@@ -531,9 +532,16 @@ const EditComponent: React.FC<MyEditComponent> = (props) => {
   };
 
   if (supportEditComponents.includes(edittype) && validateRules) {
-    const fieldName = `${compId}_${currentRowKey}_${
-      rowData[currentRowKey] || rowId
-    }_${dataIndex}`;
+    // const fieldName = `${compId}_${currentRowKey}_${
+    //   rowData[currentRowKey] || rowId
+    // }_${dataIndex}`;
+    const fieldName = getFormItemFieldName({
+      compId,
+      currentRowKey,
+      rowData,
+      rowId,
+      dataIndex,
+    });
     return (
       <Form.Item
         style={{ height: 'auto' }}

package/lib/pcpublic/src/components/pcfactory/src/Table/hooks/useCMDActions.ts

@@ -20,6 +20,7 @@ interface UseCommonCMDAction {
   setOuterDataSource: Function;
   onRowSelected: Function;
   engineApis?: EngineApisType;
+  form?: any;
 }
 
 interface UseCMDActionPropsType extends UseCommonCMDAction {
@@ -94,6 +95,10 @@ const useCMDAction = (props: UseCMDActionPropsType) => {
      * 加载表格数据（加载完之后，表格就脱离了数据源的控制了）
      */
     setTableData: (data: { dataSource: any[]; total: any; current: any }) => {
+      // 重置表格，避免下次加载后编辑组件还保留原始值
+      if (typeof form?.resetFields === 'function') {
+        form.resetFields();
+      }
       if (tableUpdateInnerDataSource) {
         setInnerDataSource(data?.dataSource || []);
       } else {
@@ -291,6 +296,7 @@ const useCommonCMDAction = (props: UseCommonCMDAction) => {
     setInnerDataSource,
     setOuterDataSource,
     engineApis,
+    form,
   } = props;
 
   const [loading, setLoading] = useState(false);
@@ -341,6 +347,9 @@ const useCommonCMDAction = (props: UseCommonCMDAction) => {
       }
     },
     clearData: () => {
+      if (typeof form?.resetFields === 'function') {
+        form.resetFields();
+      }
       setInnerDataSource([]);
       if (!tableUpdateInnerDataSource) {
         // 3.8.1前，清空表格数据后，会脱离数据源控制

package/lib/pcpublic/src/components/pcfactory/src/Table/hooks/useRowEdit.ts

@@ -3,6 +3,7 @@ import { EDIT_COMPONENT_STOP_PROPAGATION_CLS } from '../constant';
 import {
   deleteTempRowProperties,
   EMPTY_ROW_TEMP_KEY_ATTR,
+  getFormItemFieldName,
   LATEST_EMPTY_ROW_FLAG_ATTR,
 } from '../utils';
 
@@ -28,6 +29,8 @@ const useRowEdit = (props: any) => {
     onBeforeInlineEdit,
     onBeforeInlineSave,
     engineApis,
+    compId,
+    form,
   } = props;
 
   const [nowInlineEditKey, setNowInlineEditKey] = useState<string | null>();
@@ -103,6 +106,22 @@ const useRowEdit = (props: any) => {
   };
 
   const onRowCancelClick = (row: any) => {
+    // 取消时重置为原始数据
+    if (typeof form?.setFieldsValue === 'function') {
+      const originRow: Record<string, any> = {};
+      Object.keys(row).forEach((key) => {
+        // 表单项名称
+        const fieldName = getFormItemFieldName({
+          compId,
+          currentRowKey,
+          rowData: row,
+          rowId: row[currentRowKey],
+          dataIndex: key,
+        });
+        originRow[fieldName] = row[key];
+      });
+      form.setFieldsValue(originRow);
+    }
     setNowEditingData(null);
     setNowInlineEditKey(null);
     // 取消编辑的时候，如果当前行是刚刚新增的空白行，则过滤当前行

package/lib/pcpublic/src/components/pcfactory/src/Table/index.tsx

@@ -210,6 +210,8 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
     selectedRows,
     onRowSelected,
     engineApis,
+    compId,
+    form,
   });
 
   const { rowSpanColMap, rowSpanMap, rowClassMap } = useRowMerge({

package/lib/pcpublic/src/components/pcfactory/src/Table/utils/index.ts

@@ -492,3 +492,19 @@ export const getFullCheckedKeySet = <T extends {}>(params: {
     }, [] as (string | number)[]),
   );
 };
+
+// 获取编辑组件表单项字段编码
+export const getFormItemFieldName = ({
+  compId,
+  currentRowKey,
+  rowData,
+  rowId,
+  dataIndex,
+}: {
+  compId: string;
+  currentRowKey: string;
+  rowData: any;
+  rowId?: string | number;
+  dataIndex: string | string[];
+}) =>
+  `${compId}_${currentRowKey}_${rowData[currentRowKey] || rowId}_${dataIndex}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lingxiteam/ebe-utils",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "",
   "keywords": [],
   "author": "",
@@ -19,7 +19,7 @@
     "@babel/types": "^7.12.12",
     "cac": "^6.7.14",
     "fs-extra": "9.x",
-    "@lingxiteam/ebe": "0.1.5"
+    "@lingxiteam/ebe": "0.1.6"
   },
   "publishConfig": {
     "access": "public"