浏览代码

代码上传

zhangqi 2 年之前
父节点
当前提交
4d75456b09
共有 3 个文件被更改,包括 66 次插入7 次删除
  1. 58 2
      src/components/layout/index.vue
  2. 2 5
      src/components/layout/modules/header.vue
  3. 6 0
      src/stores/modules/auth.js

+ 58 - 2
src/components/layout/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-layout class="layout">
+  <a-layout class="layout" v-if="isRefresh">
     <web-socket></web-socket>
     <div class="flex">
       <asideTemp style="flex:1 0 auto;"></asideTemp>
@@ -24,16 +24,25 @@
       Copyright © 2023 嘉兴市云链信息技术有限公司
     </a-layout-footer>
   </a-layout>
+  <div class="flex-loading" v-else>
+    <div style="text-align:center">
+      <div class="loading"></div>
+      <p style="margin-top:40px;color:rgb(100, 108, 255)">站点切换中,正在加载站点配置...</p>
+    </div>
+  </div>
 </template>
 <script setup>
 import headTemp from './modules/header.vue';
 import asideTemp from './modules/aside.vue'
 import historyTabs from './modules/historyTabs.vue'
 import webSocket from '../webSocket/index.vue'
+import { storeToRefs } from 'pinia'
+import { useAuthStore } from '@/stores/modules/auth'
 import { useRouter } from "vue-router";
 const router = useRouter()
 
-
+const store = useAuthStore()
+let { isRefresh } = storeToRefs(store)
 </script>
 <style>
 .layout{
@@ -77,4 +86,51 @@ const router = useRouter()
 .fade-leave-to {
   opacity: 0;
 }
+.flex-loading{
+  height: 100vh;
+  width: 100vw;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  background-image: url(@/assets/bg.png);
+  background-size: cover;
+}
+.loading {
+  position: relative;
+  width: 205px;
+  perspective: 200px;
+  text-align: center;
+}
+
+.loading:before,
+.loading:after {
+  position: absolute;
+  width: 20px;
+  height: 20px;
+  content: "";
+  animation: jumping 0.5s infinite alternate;
+  background: rgba(0, 0, 0, 0);
+}
+
+.loading:before {
+  left: 55%;
+}
+
+.loading:after {
+  right: 55%;
+  animation-delay: 0.15s;
+}
+
+@keyframes jumping {
+  0% {
+    transform: scale(1) translateY(0px) rotateX(0deg);
+    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+  }
+
+  100% {
+    transform: scale(1.2) translateY(-25px) rotateX(45deg);
+    background: rgb(100, 108, 255);
+    box-shadow: 0 25px 40px #000;
+  }
+}
 </style>

+ 2 - 5
src/components/layout/modules/header.vue

@@ -93,10 +93,9 @@ const modClick = (item)=>{
 }
 const accountItemClick = (account,bool)=>{
   store.defaultAccount(account,()=>{
-    if (!bool)
-      router.go(0)
+    store.reloadPage()
+    historyRoutes.value = []
   })
-  historyRoutes.value = []
 }
 const routeChange = (app)=>{
   router.replace({path:app.path,meta:{keepAlive:false}})
@@ -164,8 +163,6 @@ onMounted(()=>{
 })
 onBeforeMount(()=>{
   setTheme('normal')
-  store.getConfig()
-  store.systemAuthData()
 })
 </script>
 <style scoped>

+ 6 - 0
src/stores/modules/auth.js

@@ -113,7 +113,13 @@ export const useAuthStore = defineStore('auth', {
     // 设置默认账号
     defaultAccount (account,fn) {
       this.nowAccount = account
+
       sessionStorage.setItem('token',account.token)
+
+      this.getConfig()
+
+      this.systemAuthData()
+
       fn()
     },
     //