From b50db413cf86b60bab28d9801f9a16fcf29132db Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Fri, 21 Feb 2025 18:54:05 +0800
Subject: [PATCH] feat: History record supports modifying chat abstract

---
 ui/src/api/log.ts                        | 26 +++++++-
 ui/src/locales/lang/en-US/ai-chat.ts     |  3 +-
 ui/src/locales/lang/zh-CN/ai-chat.ts     |  4 +-
 ui/src/locales/lang/zh-Hant/ai-chat.ts   |  3 +-
 ui/src/stores/modules/log.ts             | 12 ++++
 ui/src/views/chat/pc/EditTitleDialog.vue | 85 ++++++++++++++++++++++++
 ui/src/views/chat/pc/index.vue           | 33 +++++++--
 7 files changed, 154 insertions(+), 12 deletions(-)
 create mode 100644 ui/src/views/chat/pc/EditTitleDialog.vue

diff --git a/ui/src/api/log.ts b/ui/src/api/log.ts
index 20973a371..edcd4d93e 100644
--- a/ui/src/api/log.ts
+++ b/ui/src/api/log.ts
@@ -220,6 +220,29 @@ const delChatClientLog: (
   return del(`${prefix}/${application_id}/chat/client/${chat_id}`, undefined, {}, loading)
 }
 
+/**
+ * 修改历史日志abstract
+ * @param 参数
+ * application_id, chat_id, 
+ * data {
+          "abstract": "string",
+        }
+ */
+
+const putChatClientLog: (
+  application_id: string,
+  chat_id: string,
+  data: any,
+  loading?: Ref<boolean>
+) => Promise<Result<boolean>> = (application_id, chat_id, data, loading) => {
+  return put(
+    `${prefix}/${application_id}/chat/client/${chat_id}`,
+    data,
+    undefined,
+    loading
+  )
+}
+
 export default {
   getChatLog,
   delChatLog,
@@ -231,5 +254,6 @@ export default {
   exportChatLog,
   getChatLogClient,
   delChatClientLog,
-  postChatRecordLog
+  postChatRecordLog,
+  putChatClientLog
 }
diff --git a/ui/src/locales/lang/en-US/ai-chat.ts b/ui/src/locales/lang/en-US/ai-chat.ts
index d5629716e..ac6cc886d 100644
--- a/ui/src/locales/lang/en-US/ai-chat.ts
+++ b/ui/src/locales/lang/en-US/ai-chat.ts
@@ -90,5 +90,6 @@ export default {
     title: 'Knowledge Quote',
     question: 'User Question',
     optimizationQuestion: 'Optimized Question'
-  }
+  },
+  editTitle: 'Edit Title',
 }
diff --git a/ui/src/locales/lang/zh-CN/ai-chat.ts b/ui/src/locales/lang/zh-CN/ai-chat.ts
index a4b54ad03..fdc4a55f7 100644
--- a/ui/src/locales/lang/zh-CN/ai-chat.ts
+++ b/ui/src/locales/lang/zh-CN/ai-chat.ts
@@ -25,7 +25,6 @@ export default {
     continue: '继续',
     stopChat: '停止回答'
   },
-
   tip: {
     error500Message: '抱歉，当前正在维护，无法提供服务，请稍后再试！',
     errorIdentifyMessage: '无法识别用户身份',
@@ -91,5 +90,6 @@ export default {
     title: '知识库引用',
     question: '用户问题',
     optimizationQuestion: '优化后问题'
-  }
+  },
+  editTitle: '编辑标题',
 }
diff --git a/ui/src/locales/lang/zh-Hant/ai-chat.ts b/ui/src/locales/lang/zh-Hant/ai-chat.ts
index a0aa1c27b..2972bfe4f 100644
--- a/ui/src/locales/lang/zh-Hant/ai-chat.ts
+++ b/ui/src/locales/lang/zh-Hant/ai-chat.ts
@@ -90,5 +90,6 @@ export default {
     title: '知識庫引用',
     question: '用戶問題',
     optimizationQuestion: '優化後問題'
-  }
+  },
+  editTitle: '編輯標題',
 }
diff --git a/ui/src/stores/modules/log.ts b/ui/src/stores/modules/log.ts
index d7a8d6498..d487c1baf 100644
--- a/ui/src/stores/modules/log.ts
+++ b/ui/src/stores/modules/log.ts
@@ -60,6 +60,18 @@ const useLogStore = defineStore({
             reject(error)
           })
       })
+    },
+    async asyncPutChatClientLog(id: string, chatId: string, data: any, loading?: Ref<boolean>) {
+      return new Promise((resolve, reject) => {
+        logApi
+          .putChatClientLog(id, chatId, data, loading)
+          .then((data) => {
+            resolve(data)
+          })
+          .catch((error) => {
+            reject(error)
+          })
+      })
     }
   }
 })
diff --git a/ui/src/views/chat/pc/EditTitleDialog.vue b/ui/src/views/chat/pc/EditTitleDialog.vue
new file mode 100644
index 000000000..eea839ea8
--- /dev/null
+++ b/ui/src/views/chat/pc/EditTitleDialog.vue
@@ -0,0 +1,85 @@
+<template>
+  <el-dialog
+    :title="$t('chat.editTitle')"
+    v-model="dialogVisible"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    :destroy-on-close="true"
+    append-to-body
+  >
+    <el-form
+      label-position="top"
+      ref="fieldFormRef"
+      :model="form"
+      require-asterisk-position="right"
+    >
+      <el-form-item
+        prop="abstract"
+        :rules="[
+          {
+            required: true,
+            message: $t('common.inputPlaceholder'),
+            trigger: 'blur'
+          }
+        ]"
+      >
+        <el-input
+          v-model="form.abstract"
+          maxlength="1024"
+          show-word-limit
+          @blur="form.abstract = form.abstract.trim()"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click.prevent="dialogVisible = false"> {{ $t('common.cancel') }} </el-button>
+        <el-button type="primary" @click="submit(fieldFormRef)" :loading="loading">
+          {{ $t('common.save') }}
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts">
+import { reactive, ref, watch } from 'vue'
+import type { FormInstance } from 'element-plus'
+import useStore from '@/stores'
+import { t } from '@/locales'
+
+const { log } = useStore()
+const emit = defineEmits(['refresh'])
+
+const fieldFormRef = ref()
+const loading = ref<boolean>(false)
+const applicationId = ref<string>('')
+const chatId = ref<string>('')
+
+const form = ref<any>({
+  abstract: ''
+})
+
+const dialogVisible = ref<boolean>(false)
+
+const open = (row: any, id: string) => {
+  applicationId.value = id
+  chatId.value = row.id
+  form.value.abstract = row.abstract
+  dialogVisible.value = true
+}
+
+const submit = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  await formEl.validate((valid) => {
+    if (valid) {
+      log.asyncPutChatClientLog(applicationId.value, chatId.value, form.value, loading).then(() => {
+        emit('refresh')
+        dialogVisible.value = false
+      })
+    }
+  })
+}
+
+defineExpose({ open, close })
+</script>
+<style lang="scss" scoped></style>
diff --git a/ui/src/views/chat/pc/index.vue b/ui/src/views/chat/pc/index.vue
index ba4338ed1..3bcaca657 100644
--- a/ui/src/views/chat/pc/index.vue
+++ b/ui/src/views/chat/pc/index.vue
@@ -66,10 +66,22 @@
                       <auto-tooltip :content="row.abstract">
                         {{ row.abstract }}
                       </auto-tooltip>
-                      <div @click.stop v-if="mouseId === row.id && row.id !== 'new'">
-                        <el-button style="padding: 0" link @click.stop="deleteLog(row)">
-                          <el-icon><Delete /></el-icon>
-                        </el-button>
+                      <div @click.stop v-show="mouseId === row.id && row.id !== 'new'">
+                        <el-dropdown trigger="click" :teleported="false">
+                          <el-icon class="rotate-90 mt-4"><MoreFilled /></el-icon>
+                          <template #dropdown>
+                            <el-dropdown-menu>
+                              <el-dropdown-item @click.stop="editLogTitle(row)">
+                                <el-icon><EditPen /></el-icon>
+                                {{ $t('common.edit') }}
+                              </el-dropdown-item>
+                              <el-dropdown-item @click.stop="deleteLog(row)">
+                                <el-icon><Delete /></el-icon>
+                                {{ $t('common.delete') }}
+                              </el-dropdown-item>
+                            </el-dropdown-menu>
+                          </template>
+                        </el-dropdown>
                       </div>
                     </div>
                   </template>
@@ -145,6 +157,7 @@
       </div>
     </div>
   </div>
+  <EditTitleDialog ref="EditTitleDialogRef" @refresh="refreshFieldTitle" />
 </template>
 
 <script setup lang="ts">
@@ -155,14 +168,13 @@ import { isAppIcon } from '@/utils/application'
 import useStore from '@/stores'
 import useResize from '@/layout/hooks/useResize'
 import { hexToRgba } from '@/utils/theme'
+import EditTitleDialog from './EditTitleDialog.vue'
 import { t } from '@/locales'
 useResize()
 
 const { user, log, common } = useStore()
 
-const isDefaultTheme = computed(() => {
-  return user.isDefaultTheme()
-})
+const EditTitleDialogRef = ref()
 
 const isCollapse = ref(false)
 
@@ -216,6 +228,13 @@ const mouseId = ref('')
 function mouseenter(row: any) {
   mouseId.value = row.id
 }
+
+function editLogTitle(row: any) {
+  EditTitleDialogRef.value.open(row, applicationDetail.value.id)
+}
+function refreshFieldTitle() {
+  getChatLog(applicationDetail.value.id)
+}
 function deleteLog(row: any) {
   log.asyncDelChatClientLog(applicationDetail.value.id, row.id, left_loading).then(() => {
     if (currentChatId.value === row.id) {