From b852159e39161d17dab607dd8d7a40f4973c2f0e Mon Sep 17 00:00:00 2001
From: Frost-ZX <frost-zx@foxmail.com>
Date: Sun, 8 Sep 2024 16:27:42 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=B7=A5=E5=85=B7=E7=AE=B1):=20=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E5=B7=A5=E5=85=B7=E7=AE=B1=E9=A1=B5=E9=9D=A2=EF=BC=8C?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=BF=94=E5=9B=9E=E6=8C=89=E9=92=AE=E5=92=8C?=
 =?UTF-8?q?=E5=B7=A5=E5=85=B7=E7=89=88=E6=9C=AC=E4=BF=A1=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ToolboxView/ToolboxView.vue | 41 ++++++++++++++++++++++++---
 1 file changed, 37 insertions(+), 4 deletions(-)

diff --git a/src/views/ToolboxView/ToolboxView.vue b/src/views/ToolboxView/ToolboxView.vue
index 799a83f..ee09b10 100644
--- a/src/views/ToolboxView/ToolboxView.vue
+++ b/src/views/ToolboxView/ToolboxView.vue
@@ -1,7 +1,20 @@
 <template>
   <div class="toolbox-view flex-col">
     <div class="app-view-header">
+
+      <!-- 返回上一级 -->
+      <n-button
+        v-show="isToolDetail"
+        class="back-button"
+        :text="true"
+        @click="handleCloseTool"
+      >
+        <span class="mdi mdi-arrow-left"></span>
+      </n-button>
+
+      <!-- 标题 -->
       <span>{{ routeTitle }}</span>
+
     </div>
     <div class="app-view-content is-transparent">
 
@@ -29,14 +42,23 @@
               @click="handleOpenTool(toolItem)"
             >
               <div class="item-header">
-                <span :class="['item-icon', toolItem.iconClass || 'mdi mdi-package-variant-closed']"></span>
+                <n-tooltip placement="top-start" trigger="hover">
+                  <template #trigger>
+                    <span :class="['item-icon', toolItem.iconClass || 'mdi mdi-package-variant-closed']"></span>
+                  </template>
+                  <div>
+                    <div>创建：{{ toolItem.createdAt }}</div>
+                    <div>更新：{{ toolItem.updatedAt }}</div>
+                    <div>版本：{{ toolItem.version }}</div>
+                  </div>
+                </n-tooltip>
               </div>
               <div class="item-body">
                 <div class="item-title">{{ toolItem.title }}</div>
                 <n-ellipsis
                   class="item-desc"
                   :line-clamp="2"
-                  :tooltip="true"
+                  :tooltip="{ placement: 'bottom-start' }"
                 >{{ toolItem.desc }}</n-ellipsis>
               </div>
             </div>
@@ -60,7 +82,7 @@
 
 <script setup>
 import {
-  NCollapse, NCollapseItem, NEllipsis,
+  NButton, NCollapse, NCollapseItem, NEllipsis, NTooltip,
 } from 'naive-ui';
 
 import {
@@ -91,18 +113,29 @@ const routeTitle = computed(() => {
   return route.meta.title;
 });
 
+/** 关闭工具 */
+function handleCloseTool() {
+  return router.push({
+    name: 'ToolboxView',
+  });
+}
+
 /**
  * @description 打开工具
  * @param {ToolboxItem} data
  */
 function handleOpenTool(data) {
-  router.push({
+  return router.push({
     name: `Toolbox/${data.component}`,
   });
 }
 </script>
 
 <style lang="less" scoped>
+.back-button {
+  margin-right: 0.5em;
+  font-size: 24px;
+}
 .tool-list {
   width: 100%;
   height: 100%;