@hzab/list-render 1.10.10 → 1.10.11

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+# @hzab/list-render@1.10.11
+
+fix: 行内编辑统一onEdit获取数据，单元格编辑支持传入其他参数
+
 # @hzab/list-render@1.10.10
 
 fix: 解决 FormModal 与 DetailModal 相互影响的问题

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hzab/list-render",
-  "version": "1.10.10",
+  "version": "1.10.11",
   "description": "",
   "main": "src",
   "scripts": {

package/src/components/Formily/FormilyEditTable.tsx

@@ -27,7 +27,7 @@ export interface EditableCellProps extends React.HTMLAttributes<HTMLElement> {
   index: number;
   editable: boolean;
   onEdit: (record: Partial<Item> & { key: React.Key }, dataIndex: string, opt: Object) => void;
-  onSave: () => void;
+  onSave: (field: { type: string; name: string }) => void;
   onCancel: () => void;
   topProps: {
     config: { hasEdit: boolean | Function };
@@ -100,7 +100,7 @@ export const EditableCell: React.FC<EditableCellProps> = ({
           />
           {editMode !== "line" ? (
             <div className="cell-editing-actions">
-              <CheckOutlined className="table-cell-confirm-icon" onClick={onSave} />
+              <CheckOutlined className="table-cell-confirm-icon" onClick={() => onSave(field)} />
               <CloseOutlined className="table-cell-cancel-icon" onClick={onCancel} />
             </div>
           ) : null}
@@ -195,13 +195,20 @@ export const useEditTable = (props) => {
   const onEdit = async (record: Partial<Item> & { key: React.Key }, key, opt = { fieldRef: null }) => {
     const { fieldRef } = opt || {};
     editingFiledRef.current = fieldRef;
-
-    // const value = await (props.onEdit && props.onEdit(record));
     formRender?.setValues(record);
     setEditingId(record[idKey]);
     setEditingKey(key);
   };
 
+  /**
+   * 点击编辑按钮
+   * @param record
+   */
+  const onEditAFetch = async (record: Partial<Item> & { key: React.Key }, ...args) => {
+    const value = await (props.onEdit && props.onEdit(record));
+    onEdit.call(this, value, ...args);
+  };
+
   const onCancel = () => {
     setEditingId("");
     setEditingKey("");
@@ -211,11 +218,11 @@ export const useEditTable = (props) => {
   /**
    * 保存数据
    */
-  const onSave = async () => {
+  const onSave = async (field) => {
     try {
       // 点击保存，数据抛出
       (await formRender?.validate()) as Item;
-      onEditSubmit && (await onEditSubmit(formRender.values));
+      onEditSubmit && (await onEditSubmit(formRender.values, { field } ));
       // 清除编辑目标
       setEditingId("");
       setEditingKey("");
@@ -246,7 +253,7 @@ export const useEditTable = (props) => {
           ? isEditing(record) && isEditingCell(col.dataIndex)
           : isEditing(record),
         topProps: props.topProps,
-        onEdit,
+        onEdit: onEditAFetch,
         onSave,
         onCancel,
       }),
@@ -274,6 +281,7 @@ export const useEditTable = (props) => {
   });
 
   return {
+    onEditAFetch,
     onEdit,
     SchemaField,
     mergedColumns,

package/src/list-render.jsx

@@ -70,7 +70,6 @@ const ListRender = forwardRef(function (props, parentRef) {
   const [total, setTotal] = useState(0);
   const [list, setList] = useState([]);
   const [formState, setFormState] = useState("");
-  const [rowId, setRowId] = useState(0);
   const [listLoading, setListLoading] = useState(false);
   const formModalRef = useRef();
   const detailModalRef = useRef();
@@ -329,14 +328,11 @@ const ListRender = forwardRef(function (props, parentRef) {
   }
 
   function handleDetail(data, id) {
-    setRowId(id);
     let title = data[modalConf?.title?.detailKey] || modalConf?.title?.detailText || "详情";
     detailModalRef.current.show(data, title);
   }
 
   function onEdit(row, idx) {
-    //编辑的时候提前存id和状态
-    setRowId(row[idKey]);
     setFormState("edit");
 
     if (props.fetchOnEdit !== false) {
@@ -367,24 +363,27 @@ const ListRender = forwardRef(function (props, parentRef) {
 
   function handleEdit(data, id) {
     const { editMode = "modal" } = props;
-    const isEditTable = editMode !== "modal";
-    if (isEditTable) {
+    // 整行编辑的模式下列表数据回填
+    if (editMode == "line") {
       return tableRef.current.onEditByTable(data, id);
     }
-    let title = data[modalConf?.title?.editKey] || modalConf?.title?.editText || "编辑";
-    formModalRef.current.show(data, title, "edit");
+    if (editMode === "modal") {
+      let title = data[modalConf?.title?.editKey] || modalConf?.title?.editText || "编辑";
+      formModalRef.current.show(data, title, "edit");
+    }
   }
 
-  async function onEditSubmit(data) {
+  async function onEditSubmit(data, opt) {
     let _data = data;
     if (isPatchUpdate) {
       if (model?.patchMap === "function") {
-        _data = model.patchMap(data);
+        _data = model.patchMap(data, opt);
       }
     } else if (typeof model?.updateMap === "function") {
-      _data = model.updateMap(data);
+      _data = model.updateMap(data, opt);
     }
 
+    // 行内编辑确认前的校验
     if (props.onEditReqVerify) {
       await props.onEditReqVerify(_data);
     }
@@ -394,7 +393,7 @@ const ListRender = forwardRef(function (props, parentRef) {
     }
     const request = isPatchUpdate ? model?.patch : model?.update;
     return request
-      .bind(model)(_data, { id: rowId })
+      .bind(model)(_data, { id: data[idKey] })
       .then((res) => {
         getList();
         message.success(res?._message || "编辑成功");

package/src/table-render/index.jsx

@@ -283,10 +283,6 @@ const TableRender = forwardRef(function (props, tableRef) {
                 <Button
                   type="link"
                   onClick={() => {
-                    // // 可编辑表格使用对应回调
-                    // if (isEditTable) {
-                    //   return onEditByTable && onEditByTable(record, index);
-                    // }
                     props.onEdit && props.onEdit(record, index);
                   }}
                 >