feat: chatbot删除全部会话功能和右键菜单重命名

src/views/homeWindow/robot/layout/Left.vue

@@ -52,10 +52,23 @@
                 <div class="absolute flex flex-col gap-14px w-full p-[8px_14px] box-border">
                   <n-flex justify="space-between" align="center" :size="0" class="leading-22px">
                     <n-ellipsis
+                      v-if="editingItemId !== item.id"
                       style="width: calc(100% - 20px)"
                       class="text-(14px [--chat-text-color]) truncate font-500 select-none">
                       {{ item.title }}
                     </n-ellipsis>
+                    <n-input
+                      v-else
+                      @blur="handleBlur(item)"
+                      ref="inputInstRef"
+                      v-model:value="item.title"
+                      clearable
+                      placeholder="输入标题"
+                      type="text"
+                      size="tiny"
+                      style="width: 200px"
+                      class="h-22px lh-22px rounded-6px">
+                    </n-input>
                     <svg
                       @click.stop="deleteChat(item)"
                       class="color-[--chat-text-color] size-20px opacity-0 absolute right-0px top-4px">
@@ -75,8 +88,8 @@
     </n-flex>
 
     <!-- 底部选项栏 -->
-    <n-flex justify="space-between" align="center" class="m-[auto_4px_10px_4px]">
-      <n-flex :size="12" align="center">
+    <n-flex :size="1" justify="space-between" align="center" class="m-[auto_4px_10px_4px]">
+      <n-flex :size="4" align="center">
         <div
           @click="jump"
           class="bg-[--chat-bt-color] border-(1px solid [--line-color]) color-[--chat-text-color] size-fit p-[8px_9px] rounded-8px custom-shadow cursor-pointer">
@@ -91,13 +104,18 @@
         </a>
       </n-flex>
 
-      <n-flex
-        :size="4"
-        align="center"
-        @click="add"
-        class="bg-[--chat-bt-color] border-(1px solid [--line-color]) select-none text-(14px [--chat-text-color]) size-fit p-8px rounded-8px custom-shadow cursor-pointer">
-        <svg class="size-18px"><use href="#plus"></use></svg>
-        <p>新的聊天</p>
+      <n-flex :size="4" align="center">
+        <div
+          @click="add"
+          class="flex items-center bg-[--chat-bt-color] border-(1px solid [--line-color]) select-none text-(12px [--chat-text-color]) size-fit p-8px rounded-8px custom-shadow cursor-pointer">
+          <svg class="size-15px"><use href="#plus"></use></svg>
+          <p>新的聊天</p>
+        </div>
+        <div
+          @click="deleteChat()"
+          class="flex items-center bg-[--chat-bt-color] border-(1px solid [--line-color]) select-none text-(12px [--chat-text-color]) p-8px rounded-8px custom-shadow cursor-pointer">
+          <svg class="size-15px"><use href="#delete"></use></svg>全部删除
+        </div>
       </n-flex>
     </n-flex>
   </n-flex>
@@ -105,7 +123,7 @@
 <script setup lang="ts">
 import { setting } from '@/stores/setting.ts'
 import { storeToRefs } from 'pinia'
-import { NIcon, VirtualListInst } from 'naive-ui'
+import { NIcon, VirtualListInst, InputInst } from 'naive-ui'
 import Mitt from '@/utils/Bus.ts'
 import { VueDraggable } from 'vue-draggable-plus'
 import router from '@/router'
@@ -114,6 +132,8 @@ const settingStore = setting()
 const { login } = storeToRefs(settingStore)
 const activeItem = ref(0)
 const scrollbar = ref<VirtualListInst>()
+const inputInstRef = ref<InputInst | null>(null)
+const editingItemId = ref<number | null>()
 const chatList = ref(
   Array.from({ length: 20 }, (_, index) => ({
     id: index + 1,
@@ -142,6 +162,13 @@ const menuList = ref<OPT.RightMenu[]>([
     click: (item: any) => {
       console.log(item)
     }
+  },
+  {
+    label: '重命名',
+    icon: 'edit',
+    click: (item: any) => {
+      renameChat(item)
+    }
   }
 ])
 const specialMenuList = ref<OPT.RightMenu[]>([
@@ -181,7 +208,7 @@ const add = () => {
 }
 
 /** 删除会话 */
-const deleteChat = (item: any) => {
+const deleteChat = (item?: any) => {
   // 根据key找到items中对应的下标
   const index = chatList.value.indexOf(item)
 
@@ -204,6 +231,17 @@ const deleteChat = (item: any) => {
     }
   }
 
+  //如果没有传值，则删除全部
+  if (!item) {
+    //删除全部的逻辑
+    if (chatList.value.length > 0) {
+      chatList.value.shift()
+      deleteChat()
+    } else {
+      triggeringAdd(true)
+    }
+  }
+
   // 如果找到了对应的元素，则移除
   if (index !== -1) {
     const removeItem = chatList.value.splice(index, 1)[0]
@@ -228,6 +266,22 @@ const deleteChat = (item: any) => {
   }
 }
 
+/** 重命名 */
+const renameChat = (item: any) => {
+  editingItemId.value = item.id
+  nextTick(() => {
+    inputInstRef.value?.select()
+  })
+}
+
+const handleBlur = (item: any) => {
+  editingItemId.value = null
+  const index = chatList.value[item.id - 1].title
+  window.$message.success(`已重命名为 ${index}`, {
+    icon: () => h(NIcon, null, { default: () => h('svg', null, [h('use', { href: '#face' })]) })
+  })
+}
+
 onMounted(() => {
   // /** 默认选择第一个聊天内容 */
   // handleActive(chatList.value[0])