跳转bigwindow加动画效果

gassafetyprogress-web/src/App.vue

+<!--
+ * @Author: your name
+ * @Date: 2022-02-26 22:22:56
+ * @LastEditTime: 2022-03-31 15:28:05
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: /gassafety-progress/gassafetyprogress-web/src/App.vue
+-->
 <template>
   <div id="app">
-    <router-view />
+    <transition name="fade" mode="out-in">
+      <router-view />
+    </transition>
   </div>
 </template>
 
 <script>
-export default  {
-  name:  'App'
-}
+export default {
+  name: "App",
+};
 </script>

gassafetyprogress-web/src/permission.js

-import router from './router'
-import store from './store'
-import { Message } from 'element-ui'
-import NProgress from 'nprogress'
-import 'nprogress/nprogress.css'
-import { getToken } from '@/utils/auth'
+import router from "./router";
+import store from "./store";
+import { Message } from "element-ui";
+import NProgress from "nprogress";
+import "nprogress/nprogress.css";
+import { getToken } from "@/utils/auth";
 
-NProgress.configure({ showSpinner: false })
+NProgress.configure({ showSpinner: false });
 
-const whiteList = ['/login', '/auth-redirect', '/bind', '/register']
+const whiteList = ["/login", "/auth-redirect", "/bind", "/register"];
 
+// 路由前置守卫
 router.beforeEach((to, from, next) => {
-  NProgress.start()
+  NProgress.start();
+  // 如果cookie里有token
   if (getToken()) {
     /* has token*/
-    if (to.path === '/login') {
-      next({ path: '/' })
-      NProgress.done()
+    // 如果要去login，就直接去默认页面
+    if (to.path === "/login") {
+      next({ path: "/" });
+      NProgress.done();
     } else {
+      // 如果没有获得当前用户的所有信息
       if (store.getters.roles.length === 0) {
         // 判断当前用户是否已拉取完user_info信息
-        store.dispatch('GetInfo').then(() => {
-          store.dispatch('GenerateRoutes').then(accessRoutes => {
-            // 根据roles权限生成可访问的路由表
-            router.addRoutes(accessRoutes) // 动态添加可访问路由表
-            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
-          })
-        }).catch(err => {
-            store.dispatch('LogOut').then(() => {
-              Message.error(err)
-              next({ path: '/' })
-            })
+        store
+          .dispatch("GetInfo")
+          .then(() => {
+            // 生成路有树
+            store.dispatch("GenerateRoutes").then((accessRoutes) => {
+              // 根据roles权限生成可访问的路由表
+              router.addRoutes(accessRoutes); // 动态添加可访问路由表
+              next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
+            });
           })
+          .catch((err) => {
+            store.dispatch("LogOut").then(() => {
+              Message.error(err);
+              next({ path: "/" });
+            });
+          });
       } else {
-        next()
+        next();
+        // // 判断各种浏览器，找到正确的方法
+        // function launchFullscreen(element) {
+        //   if (element.requestFullscreen) {
+        //     element.requestFullscreen();
+        //   } else if (element.mozRequestFullScreen) {
+        //     element.mozRequestFullScreen();
+        //   } else if (element.webkitRequestFullscreen) {
+        //     element.webkitRequestFullscreen();
+        //   } else if (element.msRequestFullscreen) {
+        //     element.msRequestFullscreen();
+        //   }
+        // }
+        // launchFullscreen(document.documentElement)
       }
     }
   } else {
     // 没有token
     if (whiteList.indexOf(to.path) !== -1) {
       // 在免登录白名单，直接进入
-      next()
+      next();
     } else {
-      next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
-      NProgress.done()
+      next(`/login?redirect=${to.fullPath}`); // 否则全部重定向到登录页
+      NProgress.done();
     }
   }
-})
+});
 
 router.afterEach(() => {
-  NProgress.done()
-})
+  NProgress.done();
+});

gassafetyprogress-web/src/store/modules/permission.js

@@ -39,6 +39,8 @@ const permission = {
         getRouters().then(res => {
           const sdata = JSON.parse(JSON.stringify(res.data))
           const rdata = JSON.parse(JSON.stringify(res.data))
+
+
           const sidebarRoutes = filterAsyncRouter(sdata)
           const rewriteRoutes = filterAsyncRouter(rdata, false, true)
           rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true })