From 3c46d2c159c327f8e1b4ad88b5ae5658a331b7cf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E4=BC=A0=E9=BE=99?= <zclzone@outlook.com>
Date: Thu, 21 Apr 2022 22:35:26 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=9B=86=E6=88=90=E9=87=8D=E6=96=B0?=
 =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E9=A1=B5=E9=9D=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/AppMain.vue          |  5 ++++-
 src/layout/components/sidebar/SideMenu.vue | 14 ++++++-------
 src/store/modules/app.js                   | 23 ++++++++++++++++++++++
 src/views/test-page/TestMessage.vue        |  9 +++++++++
 4 files changed, 43 insertions(+), 8 deletions(-)
 create mode 100644 src/store/modules/app.js

diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 556c2ad..bdf01de 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -1,7 +1,7 @@
 <template>
   <router-view v-slot="{ Component, route }">
     <transition name="fade-slide" mode="out-in" appear>
-      <div :key="route.path">
+      <div v-if="appStore.reloadFlag" :key="route.path">
         <keep-alive :include="keepAliveRouteNames">
           <component :is="Component" />
         </keep-alive>
@@ -13,6 +13,9 @@
 <script setup>
 import { computed } from 'vue'
 import { useRouter } from 'vue-router'
+import { useAppStore } from '@/store/modules/app'
+
+const appStore = useAppStore()
 const router = useRouter()
 const allRoutes = router.getRoutes()
 const keepAliveRouteNames = computed(() => {
diff --git a/src/layout/components/sidebar/SideMenu.vue b/src/layout/components/sidebar/SideMenu.vue
index d5a8386..b37436b 100644
--- a/src/layout/components/sidebar/SideMenu.vue
+++ b/src/layout/components/sidebar/SideMenu.vue
@@ -19,9 +19,11 @@ import { NIcon } from 'naive-ui'
 import { IconCircle, IconMenu } from '@/components/AppIcons'
 
 import { isExternal } from '@/utils/is'
+import { useAppStore } from '@/store/modules/app'
 
 const router = useRouter()
 const permissionStore = usePermissionStore()
+const appStore = useAppStore()
 const { currentRoute } = router
 
 const menuOptions = computed(() => {
@@ -83,14 +85,12 @@ function handleMenuSelect(key, item) {
   if (isExternal(item.path)) {
     window.open(item.path)
   } else {
-    router.push(item.path)
+    if (item.path === currentRoute.value.path && !currentRoute.value.meta?.keepAlive) {
+      appStore.reloadPage()
+    } else {
+      router.push(item.path)
+    }
   }
-
-  // 通过path重定向
-  // router.push({
-  //   path: '/redirect',
-  //   query: { redirect: item.path },
-  // })
 }
 </script>
 
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
new file mode 100644
index 0000000..fb95c63
--- /dev/null
+++ b/src/store/modules/app.js
@@ -0,0 +1,23 @@
+import { defineStore } from 'pinia'
+import { nextTick } from 'vue'
+
+export const useAppStore = defineStore('app', {
+  state() {
+    return {
+      reloadFlag: true,
+    }
+  },
+  actions: {
+    async reloadPage() {
+      $loadingBar.start()
+      this.reloadFlag = false
+      await nextTick()
+      this.reloadFlag = true
+
+      setTimeout(() => {
+        document.documentElement.scrollTo({ left: 0, top: 0 })
+        $loadingBar.finish()
+      }, 100)
+    },
+  },
+})
diff --git a/src/views/test-page/TestMessage.vue b/src/views/test-page/TestMessage.vue
index a042e84..6187ea1 100644
--- a/src/views/test-page/TestMessage.vue
+++ b/src/views/test-page/TestMessage.vue
@@ -5,6 +5,15 @@
 </template>
 
 <script setup>
+import { useAppStore } from '@/store/modules/app'
+import { onMounted } from 'vue'
+
+const appStore = useAppStore()
+
+onMounted(() => {
+  $message.success('onMounted')
+})
+
 function handleLogin() {
   $message.loading('登陆中...')
   setTimeout(() => {