From c0a9fd52087e397f2eebaae12d11ce0a8bee5c3a Mon Sep 17 00:00:00 2001
From: ChenZhaoYu <790348264@qq.com>
Date: Tue, 28 Mar 2023 13:48:49 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=BF=AB=E9=80=9F=E6=8C=89=E4=B8=8B?=
 =?UTF-8?q?=E5=88=A0=E9=99=A4=E4=BC=9A=E8=AF=9D=E5=AF=BC=E8=87=B4=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=20#917?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/functions/debounce.ts      | 18 ++++++++++++++++++
 src/views/chat/layout/sider/List.vue |  8 +++++---
 2 files changed, 23 insertions(+), 3 deletions(-)
 create mode 100644 src/utils/functions/debounce.ts

diff --git a/src/utils/functions/debounce.ts b/src/utils/functions/debounce.ts
new file mode 100644
index 0000000..eb54b02
--- /dev/null
+++ b/src/utils/functions/debounce.ts
@@ -0,0 +1,18 @@
+type CallbackFunc<T extends unknown[]> = (...args: T) => void
+
+export function debounce<T extends unknown[]>(
+  func: CallbackFunc<T>,
+  wait: number,
+): (...args: T) => void {
+  let timeoutId: ReturnType<typeof setTimeout> | undefined
+
+  return (...args: T) => {
+    const later = () => {
+      clearTimeout(timeoutId)
+      func(...args)
+    }
+
+    clearTimeout(timeoutId)
+    timeoutId = setTimeout(later, wait)
+  }
+}
diff --git a/src/views/chat/layout/sider/List.vue b/src/views/chat/layout/sider/List.vue
index 0f5ddae..1d652f8 100644
--- a/src/views/chat/layout/sider/List.vue
+++ b/src/views/chat/layout/sider/List.vue
@@ -4,6 +4,7 @@ import { NInput, NPopconfirm, NScrollbar } from 'naive-ui'
 import { SvgIcon } from '@/components/common'
 import { useAppStore, useChatStore } from '@/store'
 import { useBasicLayout } from '@/hooks/useBasicLayout'
+import { debounce } from '@/utils/functions/debounce'
 
 const { isMobile } = useBasicLayout()
 
@@ -36,6 +37,8 @@ function handleDelete(index: number, event?: MouseEvent | TouchEvent) {
     appStore.setSiderCollapsed(true)
 }
 
+const handleDeleteDebounce = debounce(handleDelete, 600)
+
 function handleEnter({ uuid }: Chat.History, isEdit: boolean, event: KeyboardEvent) {
   event?.stopPropagation()
   if (event.key === 'Enter')
@@ -69,8 +72,7 @@ function isActive(uuid: number) {
             <div class="relative flex-1 overflow-hidden break-all text-ellipsis whitespace-nowrap">
               <NInput
                 v-if="item.isEdit"
-                v-model:value="item.title"
-                size="tiny"
+                v-model:value="item.title" size="tiny"
                 @keypress="handleEnter(item, false, $event)"
               />
               <span v-else>{{ item.title }}</span>
@@ -85,7 +87,7 @@ function isActive(uuid: number) {
                 <button class="p-1">
                   <SvgIcon icon="ri:edit-line" @click="handleEdit(item, true, $event)" />
                 </button>
-                <NPopconfirm placement="bottom" @positive-click="handleDelete(index, $event)">
+                <NPopconfirm placement="bottom" @positive-click="handleDeleteDebounce(index, $event)">
                   <template #trigger>
                     <button class="p-1">
                       <SvgIcon icon="ri:delete-bin-line" />