perf: 同步代码

src/layout/components/tag/index.vue

@@ -49,6 +49,7 @@ const router = useRouter();
 const showTags = ref(storageLocal.getItem("tagsVal") || false);
 const containerDom = templateRef<HTMLElement | null>("containerDom", null);
 const activeIndex = ref(-1);
+
 const tagsViews = ref<Array<tagsViewsType>>([
   {
     icon: refresh,
@@ -173,9 +174,6 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
       routerArrays.splice(start, end);
       relativeStorage.routesInStorage = routerArrays;
     }
-    router.push(obj.path);
-    // 删除缓存路由
-    handleAliveRoute(route.matched, "delete");
   };
 
   if (tag === "other") {
@@ -188,15 +186,32 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
     // 从当前匹配到的路径中删除
     spliceRoute(valueIndex, 1);
   }
-
-  if (current === obj.path) {
+  let newRoute: any = routerArrays.slice(-1);
+  if (current === route.path) {
+    // 删除缓存路由
+    handleAliveRoute(route.matched, "delete");
     // 如果删除当前激活tag就自动切换到最后一个tag
-    let newRoute: any = routerArrays.slice(-1);
+    if (tag === "left") return;
     nextTick(() => {
       router.push({
         path: newRoute[0].path
       });
     });
+  } else {
+    //保存跳转之前的路径
+    let oldPath = route.path;
+    router.push(obj.path);
+    // 删除缓存路由
+    handleAliveRoute(route.matched, "delete");
+    if (!routerArrays.length) return;
+    let isHasOldPath = routerArrays.some(item => {
+      return item.path === oldPath;
+    });
+    isHasOldPath
+      ? router.push(oldPath)
+      : router.push({
+          path: newRoute[0].path
+        });
   }
 }
 
@@ -655,7 +670,6 @@ onBeforeMount(() => {
   .contextmenu {
     margin: 0;
     background: #fff;
-    z-index: 3000;
     position: absolute;
     list-style-type: none;
     padding: 5px 0;

src/layout/index.vue

@@ -33,14 +33,12 @@ import {
   computed,
   onMounted,
   watchEffect,
-  useCssModule,
   onBeforeMount,
   getCurrentInstance
 } from "vue";
 import { setType } from "./types";
 import { useI18n } from "vue-i18n";
 import { emitter } from "/@/utils/mitt";
-import { toggleClass } from "/@/utils/operate";
 import { useEventListener } from "@vueuse/core";
 import { storageLocal } from "/@/utils/storage";
 import { useAppStoreHook } from "/@/store/modules/app";
@@ -56,7 +54,6 @@ import Vertical from "./components/sidebar/vertical.vue";
 import Horizontal from "./components/sidebar/horizontal.vue";
 
 const pureSetting = useSettingStoreHook();
-const { hiddenMainContainer } = useCssModule();
 
 const instance =
   getCurrentInstance().appContext.app.config.globalProperties.$storage;
@@ -128,21 +125,9 @@ const $_resizeHandler = () => {
 };
 
 function onFullScreen() {
-  if (unref(hiddenSideBar)) {
-    hiddenSideBar.value = false;
-    toggleClass(
-      false,
-      hiddenMainContainer,
-      document.querySelector(".main-container")
-    );
-  } else {
-    hiddenSideBar.value = true;
-    toggleClass(
-      true,
-      hiddenMainContainer,
-      document.querySelector(".main-container")
-    );
-  }
+  unref(hiddenSideBar)
+    ? (hiddenSideBar.value = false)
+    : (hiddenSideBar.value = true);
 }
 
 onMounted(() => {
@@ -151,11 +136,6 @@ onMounted(() => {
     useAppStoreHook().toggleDevice("mobile");
     handleClickOutside(true);
   }
-  toggleClass(
-    unref(hiddenSideBar),
-    hiddenMainContainer,
-    document.querySelector(".main-container")
-  );
 });
 
 onBeforeMount(() => {
@@ -175,7 +155,7 @@ onBeforeMount(() => {
       @click="handleClickOutside(false)"
     />
     <Vertical v-show="!hiddenSideBar && layout.includes('vertical')" />
-    <div class="main-container">
+    <div :class="['main-container', hiddenSideBar ? 'main-hidden' : '']">
       <div :class="{ 'fixed-header': set.fixedHeader }">
         <!-- 顶部导航栏 -->
         <navbar v-show="!hiddenSideBar && layout.includes('vertical')" />
@@ -196,12 +176,6 @@ onBeforeMount(() => {
   </div>
 </template>
 
-<style scoped module>
-.hiddenMainContainer {
-  margin-left: 0 !important;
-}
-</style>
-
 <style lang="scss" scoped>
 @mixin clearfix {
   &::after {
@@ -224,6 +198,10 @@ onBeforeMount(() => {
   }
 }
 
+.main-hidden {
+  margin-left: 0 !important;
+}
+
 .drawer-bg {
   background: #000;
   opacity: 0.3;