feat: 表格组件编辑项失去焦点后恢复初始值

frontend/src/components/pure/ms-table/base-table.vue

@@ -98,8 +98,8 @@
                   "
                   ref="currentInputRef"
                   v-model="record[item.dataIndex as string]"
-                  @blur="handleEditInputBlur()"
-                  @press-enter="handleEditInputEnter(record)"
+                  @blur="handleEditInputBlur(record, item.dataIndex as string, true)"
+                  @keydown.enter="handleEditInputBlur(record, item.dataIndex as string, false)"
                 />
                 <a-tooltip v-else placement="top" :content="String(record[item.dataIndex as string])">
                   <div class="one-line-text max-w-[300px]">
@@ -119,7 +119,7 @@
                     class="ml-2 cursor-pointer"
                     :class="{ 'ms-table-edit-active': editActiveKey === rowIndex }"
                     type="icon-icon_edit_outlined"
-                    @click="handleEdit(item.dataIndex as string, rowIndex)"
+                    @click="handleEdit(item.dataIndex as string, rowIndex, record)"
                   />
                 </div>
                 <div>
@@ -238,8 +238,13 @@
 
   // 编辑按钮的Active状态
   const editActiveKey = ref<string>('');
-  // 编辑input的Ref
+  // 编辑项的Ref
   const currentInputRef = ref();
+  // 编辑项的初始值，用于blur时恢复旧值
+  const currentEditValue = ref<string>('');
+  // 是否是enter触发
+  const isEnter = ref<boolean>(false);
+
   const { rowKey }: Partial<MsTableProps<any>> = attrs;
   // 第一行表格合并
   const currentSpanMethod = ({
@@ -312,14 +317,22 @@
     emit('batchAction', value, queryParams);
   };
 
-  const handleEditInputEnter = (record: TableData) => {
-    editActiveKey.value = '';
-    emit('rowNameChange', record);
-  };
-
-  const handleEditInputBlur = () => {
-    currentInputRef.value = null;
-    editActiveKey.value = '';
+  const handleEditInputBlur = (record: TableData, dataIndex: string, isBlur: boolean) => {
+    if (isBlur) {
+      if (!isEnter.value) {
+        // 不是由Enter触发的blur
+        record[dataIndex] = currentEditValue.value;
+      }
+      isEnter.value = false;
+      currentInputRef.value = null;
+      editActiveKey.value = '';
+      currentEditValue.value = '';
+    } else {
+      // 触发的是Enter
+      emit('rowNameChange', record);
+      isEnter.value = true;
+      editActiveKey.value = '';
+    }
   };
 
   // 排序change事件
@@ -341,8 +354,9 @@
   };
 
   // 编辑单元格的input
-  const handleEdit = (dataIndex: string, rowIndex: number) => {
+  const handleEdit = (dataIndex: string, rowIndex: number, record: TableData) => {
     editActiveKey.value = dataIndex + rowIndex;
+    currentEditValue.value = record[dataIndex];
     if (currentInputRef.value) {
       currentInputRef.value[0].focus();
     } else {