From a55c01c9c8a036a3e583ae0577392ff06600ab79 Mon Sep 17 00:00:00 2001
From: RubyLiu <liulubingjava@163.com>
Date: Fri, 22 Sep 2023 11:25:41 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A1=A8=E6=A0=BC=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=BC=96=E8=BE=91=E9=A1=B9=E5=A4=B1=E5=8E=BB=E7=84=A6=E7=82=B9?=
 =?UTF-8?q?=E5=90=8E=E6=81=A2=E5=A4=8D=E5=88=9D=E5=A7=8B=E5=80=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/pure/ms-table/base-table.vue   | 40 +++++++++++++------
 1 file changed, 27 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/pure/ms-table/base-table.vue b/frontend/src/components/pure/ms-table/base-table.vue
index b16d3762f2..0c8420507f 100644
--- a/frontend/src/components/pure/ms-table/base-table.vue
+++ b/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 {