upd: 优化代码

package.json

@@ -64,7 +64,7 @@
     "cropperjs": "^1.5.12",
     "echarts": "^5.3.1",
     "github-markdown-css": "^5.1.0",
-    "happykit": "^2.0.1",
+    "happykit": "^2.2.0",
     "highlight.js": "^11.6.0",
     "jszip": "^3.10.0",
     "katex": "^0.16.0",

src/components/HbAdminNav.vue

@@ -14,7 +14,7 @@ import {
 import framework from '@/global/framework'
 import { h, nextTick, ref, watch } from 'vue'
 import { useRouter } from 'vue-router'
-import { removeComponentCache } from "@/global/router"
+import { removeComponentCache } from '@/global/router'
 
 const navList = framework.getNavList()
 const currentRouteMenu = framework.getCurrentMenuRoute()
@@ -61,42 +61,41 @@ const options = [
   }
 ]
 
-function refreshPage(key){
-  switch (key){
-    case 'refreshCurrent':{
-      const pageId = currentRouteMenu.value?.pageId
-      if (pageId){
-        removeComponentCache(pageId)
-        setTimeout(()=>{
-          onNavClick(pageId)
-        },100)
-      }
-      break
+function refreshPage (key) {
+  switch (key) {
+  case 'refreshCurrent':{
+    const pageId = currentRouteMenu.value?.pageId
+    if (pageId) {
+      removeComponentCache(pageId)
+      setTimeout(() => {
+        onNavClick(pageId)
+      }, 100)
     }
-    case 'refreshAll':{
-      const pageId = currentRouteMenu.value?.pageId
-      framework.getNavList().value.forEach(e=>{
-        removeComponentCache(e.pageId)
-      })
-      if (pageId){
-        setTimeout(()=>{
-          onNavClick(pageId)
-        },100)
-      }
-      break
+    break
+  }
+  case 'refreshAll':{
+    const pageId = currentRouteMenu.value?.pageId
+    framework.getNavList().value.forEach(e => {
+      removeComponentCache(e.pageId)
+    })
+    if (pageId) {
+      setTimeout(() => {
+        onNavClick(pageId)
+      }, 100)
     }
+    break
+  }
   }
-
 }
 
 function onDropdownSelect (key) {
-  if (key === 'refreshCurrent' || key === 'refreshAll'){
+  if (key === 'refreshCurrent' || key === 'refreshAll') {
     refreshPage(key)
     return
   }
   framework.closeNav(key, currentRouteMenu.value?.pageId, (removedNavs, needNavs) => {
-    if (removedNavs.length > 0){
-      removedNavs.forEach(e=>{
+    if (removedNavs.length > 0) {
+      removedNavs.forEach(e => {
         removeComponentCache(e.pageId)
       })
     }

src/components/HbAdminScreenLocker.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { NIcon, NAvatar } from 'naive-ui'
 import { ArrowForward, LockOpen } from '@vicons/ionicons5'
-import {computed, onMounted, ref, watch} from 'vue'
+import { computed, onMounted, ref, watch } from 'vue'
 import security from '@/global/security'
 
 const props = defineProps({
@@ -10,8 +10,8 @@ const props = defineProps({
     required: false,
     default : false
   },
-  to:{
-    type: String,
+  to: {
+    type    : String,
     required: false,
     default : false
   }
@@ -27,9 +27,8 @@ let minDistance = 0
 const isTrigger = ref(false)
 const box = ref(null)
 
-
-if (props.to){
-  onMounted(()=>{
+if (props.to) {
+  onMounted(() => {
     document.getElementById(props.to).append(box.value)
   })
 }
@@ -103,14 +102,13 @@ const user = security.getUser()
 </script>
 <template>
   <transition
+    ref="box"
     enter-active-class="hb-screen-locker-lock"
     leave-active-class="hb-screen-locker-unlock"
-    ref="box"
   >
     <div
       v-if="props.open"
       class="hb-screen-locker"
-
     >
       <div class="hb-screen-avatar">
         <n-avatar

src/components/dev/HbAdminDevTool.vue

@@ -5,8 +5,9 @@ import security from '@/global/security'
 import hljs from 'highlight.js/lib/core'
 import javascript from 'highlight.js/lib/languages/javascript'
 import { onMounted, ref, watch } from 'vue'
-import {cached,removeComponentCache} from "@/global/router"
+import { removeComponentCache, getCached } from '@/global/router'
 
+const cached = getCached()
 hljs.registerLanguage('javascript', javascript)
 const clientId = ref(framework.getTracker().clientId)
 const message = useMessage()
@@ -158,41 +159,43 @@ watch(showPanel, () => {
             keepalive路由缓存
           </n-alert>
           <n-table
-              :bordered="false"
-              :single-line="false"
+            :bordered="false"
+            :single-line="false"
           >
             <thead>
-            <tr>
-              <th>页面ID</th>
-              <th>标题</th>
-              <th>路径</th>
-              <th>是否开启缓存</th>
-              <th>操作</th>
-            </tr>
+              <tr>
+                <th>页面ID</th>
+                <th>标题</th>
+                <th>路径</th>
+                <th>是否开启缓存</th>
+                <th>操作</th>
+              </tr>
             </thead>
             <tbody>
-            <tr v-for="e in cached">
-              <td>{{ e.pageId }}</td>
-              <td>{{ framework.getNav(e.pageId).title }}</td>
-              <td>{{ framework.getNav(e.pageId).menuItem.routerPath }}</td>
-              <td>
-                <n-tag
+              <tr v-for="e in cached">
+                <td>{{ e.pageId }}</td>
+                <td>{{ framework.getNav(e.pageId).title }}</td>
+                <td>{{ framework.getNav(e.pageId).menuItem.routerPath }}</td>
+                <td>
+                  <n-tag
                     v-if="e.isKeepalive"
                     type="success"
-                >
-                  {{ !e.isKeepalive ? '否' : '是' }}
-                </n-tag>
-                <n-tag
+                  >
+                    {{ !e.isKeepalive ? '否' : '是' }}
+                  </n-tag>
+                  <n-tag
                     v-else
                     type="warning"
-                >
-                  {{ !e.isKeepalive ? '否' : '是' }}
-                </n-tag>
-              </td>
-              <td>
-                <n-button @click="removeComponentCache(e.pageId)">删除缓存</n-button>
-              </td>
-            </tr>
+                  >
+                    {{ !e.isKeepalive ? '否' : '是' }}
+                  </n-tag>
+                </td>
+                <td>
+                  <n-button @click="removeComponentCache(e.pageId)">
+                    删除缓存
+                  </n-button>
+                </td>
+              </tr>
             </tbody>
           </n-table>
           <n-alert type="info">

src/components/tiptap/HbAdminTipTap.vue

@@ -19,8 +19,8 @@ const props = defineProps({
     type   : String,
     default: ''
   },
-  to:{
-    type: String,
+  to: {
+    type    : String,
     required: false,
     default : false
   }
@@ -31,14 +31,14 @@ const characters = ref(0)
 const fullscreen = ref(false)
 const editorBox = ref(null)
 const editorBoxParent = ref(null)
-watch(fullscreen,()=>{
-  if (fullscreen.value === true){
-    if (props.to){
+watch(fullscreen, () => {
+  if (fullscreen.value === true) {
+    if (props.to) {
       editorBoxParent.value = editorBox.value.parentNode
       document.getElementById(props.to).append(editorBox.value)
     }
-  }else{
-    if (props.to){
+  } else {
+    if (props.to) {
       editorBoxParent.value.append(editorBox.value)
     }
   }

src/components/tiptap/components/HbTiptapImageComponent.vue

@@ -2,9 +2,9 @@
 import { NodeViewContent, nodeViewProps, NodeViewWrapper } from '@tiptap/vue-3'
 import HbTiptapResizer from '@/components/tiptap/components/HbTiptapResizer'
 import { NPopover } from 'naive-ui'
-import HbTiptapMenuItem from "@/components/tiptap/components/HbTiptapMenuItem"
-import HbTiptapImage from "@/components/tiptap/components/HbTiptapImage"
-import {ref} from "vue";
+import HbTiptapMenuItem from '@/components/tiptap/components/HbTiptapMenuItem'
+import HbTiptapImage from '@/components/tiptap/components/HbTiptapImage'
+import { ref } from 'vue'
 const props = defineProps(nodeViewProps)
 
 function onchange (width, height) {
@@ -29,48 +29,53 @@ function insertImage (url) {
     class="image-block"
     as="span"
   >
-    <n-popover placement="right-start" :showArrow="false" trigger="click" style="padding: 0">
+    <n-popover
+      placement="right-start"
+      :show-arrow="false"
+      trigger="click"
+      style="padding: 0"
+    >
       <template #trigger>
         <hb-tiptap-resizer
-            :selected="props.selected"
-            :w="props.node.attrs.width"
-            :h="props.node.attrs.height"
-            @on-change="onchange"
+          :selected="props.selected"
+          :w="props.node.attrs.width"
+          :h="props.node.attrs.height"
+          @on-change="onchange"
         >
           <template #default="{width,height}">
             <img
-                :width="width"
-                :height="height"
-                class="main-image"
-                :src="props.node.attrs.src"
-                draggable="false"
+              :width="width"
+              :height="height"
+              class="main-image"
+              :src="props.node.attrs.src"
+              draggable="false"
             >
           </template>
         </hb-tiptap-resizer>
       </template>
       <div class="image-actions">
         <div class="action-item">
           <hb-tiptap-menu-item
-              icon="settings-line"
-              title="修改图片"
-              :action="handleOpenImage"
-              :is-active="() => {}"
-          ></hb-tiptap-menu-item>
+            icon="settings-line"
+            title="修改图片"
+            :action="handleOpenImage"
+            :is-active="() => {}"
+          />
         </div>
         <div class="action-item">
           <hb-tiptap-menu-item
-              icon="delete-bin-2-line"
-              title="删除"
-              :action="props.deleteNode"
-              :is-active="() => {}"
-          ></hb-tiptap-menu-item>
+            icon="delete-bin-2-line"
+            title="删除"
+            :action="props.deleteNode"
+            :is-active="() => {}"
+          />
         </div>
       </div>
     </n-popover>
   </node-view-wrapper>
   <hb-tiptap-image
-      ref="HTI"
-      @ok="insertImage"
+    ref="HTI"
+    @ok="insertImage"
   />
 </template>