更新路由逻辑：1.在登陆后访问login页会跳转到主页 2.访问不存在地址会跳回主页;更新平台选择下拉框样式

components.d.ts

@@ -10,46 +10,25 @@ declare module 'vue' {
     Dialog: typeof import('./src/components/common/Dialog.vue')['default']
     DropDownSelection: typeof import('./src/components/dataAnalysis/DropDownSelection.vue')['default']
     ElButton: typeof import('element-plus/es')['ElButton']
-    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
-    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
-    ElDialog: typeof import('element-plus/es')['ElDialog']
     ElDivider: typeof import('element-plus/es')['ElDivider']
-    ElDrawer: typeof import('element-plus/es')['ElDrawer']
-    ElDropdown: typeof import('element-plus/es')['ElDropdown']
-    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
-    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
-    ElForm: typeof import('element-plus/es')['ElForm']
-    ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElIcon: typeof import('element-plus/es')['ElIcon']
     ElImage: typeof import('element-plus/es')['ElImage']
-    ElInput: typeof import('element-plus/es')['ElInput']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
     ElOption: typeof import('element-plus/es')['ElOption']
-    ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopover: typeof import('element-plus/es')['ElPopover']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
-    ElSwitch: typeof import('element-plus/es')['ElSwitch']
-    ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
-    ElTabPane: typeof import('element-plus/es')['ElTabPane']
-    ElTabs: typeof import('element-plus/es')['ElTabs']
-    ElTag: typeof import('element-plus/es')['ElTag']
     ElText: typeof import('element-plus/es')['ElText']
-    ElTooltip: typeof import('element-plus/es')['ElTooltip']
-    ElUpload: typeof import('element-plus/es')['ElUpload']
     FileUpload: typeof import('./src/components/form/FileUpload.vue')['default']
     FilterPopover: typeof import('./src/components/toolsBtn/FilterPopover.vue')['default']
     Form: typeof import('./src/components/form/Form.vue')['default']
     HeaderCard: typeof import('./src/components/dataAnalysis/HeaderCard.vue')['default']
-    IconIcBaselineVisibility: typeof import('~icons/ic/baseline-visibility')['default']
-    IconIcBaselineVisibilityOff: typeof import('~icons/ic/baseline-visibility-off')['default']
     IconIconParkGameThree: typeof import('~icons/icon-park/game-three')['default']
     IconMaterialSymbolsLightLogout: typeof import('~icons/material-symbols-light/logout')['default']
     IconMdiPassword: typeof import('~icons/mdi/password')['default']
-    IconTablerPointFilled: typeof import('~icons/tabler/point-filled')['default']
     MyButton: typeof import('./src/components/form/MyButton.vue')['default']
     MyInput: typeof import('./src/components/form/MyInput.vue')['default']
     RegreshBtn: typeof import('./src/components/toolsBtn/RegreshBtn.vue')['default']

src/components/common/WithIconSelect.vue

@@ -224,9 +224,10 @@ onMounted(() => {
             :key="item.value"
             :value="item.value"
             @click="selectPf(item)"
+            style="box-sizing: border-box; padding-right: 15px"
           >
             <el-image
-              style="width: 20px; height: 20px; margin-right: 5px"
+              style="width: 20px; height: 20px; margin-right: 10px"
               :src="blobUrlInfo[item.value]"
               :fit="'cover'"
             />
@@ -265,8 +266,8 @@ onMounted(() => {
   margin-left: 4px;
 }
 
-.radioMenu {
-  margin-right: 15px;
+.radioMenu > .selectItem {
+  padding-right: 15px !important;
 }
 
 .disabledSelect {

src/router/index.ts

@@ -2,14 +2,14 @@
  * @Author: fxs bjnsfxs@163.com
  * @Date: 2024-08-20 14:06:49
  * @LastEditors: fxs bjnsfxs@163.com
- * @LastEditTime: 2024-10-09 12:07:47
+ * @LastEditTime: 2024-10-10 17:35:00
  * @FilePath: \Game-Backstage-Management-System\src\router\index.ts
  * @Description:
  *
  */
 import { createRouter, createWebHashHistory } from 'vue-router'
 
-import { authToken } from '@/utils/axios/auth'
+import { authLogin } from '@/utils/axios/auth'
 
 import HomeRoutes from './home'
 import LoginRoutes from './login'
@@ -27,6 +27,11 @@ const routes = [
   {
     path: '/',
     redirect: '/home/overView'
+  },
+  {
+    //访问不存在的路由的时候，跳转到首页
+    path: '/:pathMatch(.*)',
+    redirect: '/home/overView'
   }
 ]
 
@@ -35,21 +40,15 @@ const router = createRouter({
   routes
 })
 
-router.beforeEach((to, from, next) => {
-  if (from) {
-    // 毫无意义，但是不加from，会导致from没有使用从而导致打包错误
-  }
-
+router.beforeEach((to, _from, next) => {
   if (to.name === 'Login') {
     next()
   } else {
-    authToken()
-      .then(() => {
-        next()
-      })
-      .catch(() => {
-        router.push('login')
-      })
+    if (authLogin()) {
+      next()
+    } else {
+      router.push('login')
+    }
   }
 })
 export default router

src/router/login.ts

@@ -2,15 +2,29 @@
  * @Author: fxs bjnsfxs@163.com
  * @Date: 2024-08-20 14:32:43
  * @LastEditors: fxs bjnsfxs@163.com
- * @LastEditTime: 2024-08-31 09:59:13
+ * @LastEditTime: 2024-10-10 17:25:25
  * @FilePath: \Game-Backstage-Management-System\src\router\login.ts
  * @Description:
  *
  */
+import type { RouteLocationNormalized, NavigationGuardNext } from 'vue-router'
+
+import { getLoginState } from '@/utils/localStorage/localStorage'
 export default [
   {
     path: '/login',
     name: 'Login',
-    component: () => import('@/views/Login/LoginView.vue')
+    component: () => import('@/views/Login/LoginView.vue'),
+    beforeEnter: (
+      _to: RouteLocationNormalized,
+      _from: RouteLocationNormalized,
+      next: NavigationGuardNext
+    ) => {
+      if (getLoginState()) {
+        next('/')
+      } else {
+        next()
+      }
+    }
   }
 ]

src/utils/axios/auth.ts

@@ -2,7 +2,7 @@
  * @Author: fxs bjnsfxs@163.com
  * @Date: 2024-08-21 11:12:21
  * @LastEditors: fxs bjnsfxs@163.com
- * @LastEditTime: 2024-10-09 10:05:08
+ * @LastEditTime: 2024-10-10 17:29:59
  * @FilePath: \Game-Backstage-Management-System\src\utils\axios\auth.ts
  * @Description:
  *
@@ -10,20 +10,45 @@
 
 import { ElMessage } from 'element-plus'
 import { MessageType } from '@/types/res'
+import { getLoginState } from '../localStorage/localStorage'
 
-export const authToken = () => {
-  return new Promise((reslove, reject) => {
-    let refreshToken = localStorage.getItem('refreshToken')
-    let token = localStorage.getItem('token')
-    if (refreshToken || token) {
-      reslove(true)
-    } else {
-      ElMessage({
-        type: MessageType.Warning,
-        message: '请先登录',
-        duration: 1500
-      })
-      reject(false)
-    }
-  })
+// export const authToken = () => {
+//   return new Promise((reslove, reject) => {
+//     if (!getLoginState()) {
+//       ElMessage({
+//         type: 'warning',
+//         message: '请先登录',
+//         duration: 1500
+//       })
+//       reject(false)
+
+//       // return // 如果没有登录，就跳转到登录页面
+//     } else {
+//       reslove(true)
+//     }
+//     // let refreshToken = localStorage.getItem('refreshToken')
+//     // let token = localStorage.getItem('token')
+//     // if (refreshToken || token) {
+//     //   reslove(true)
+//     // } else {
+//     //   ElMessage({
+//     //     type: MessageType.Warning,
+//     //     message: '请先登录',
+//     //     duration: 1500
+//     //   })
+//     //   reject(false)
+//     // }
+//   })
+// }
+
+export const authLogin = (): boolean => {
+  const state = getLoginState()
+  if (!state) {
+    ElMessage({
+      type: MessageType.Warning,
+      message: '请先登录',
+      duration: 1500
+    })
+  }
+  return state
 }

src/utils/axios/axiosInstance.ts

@@ -2,7 +2,7 @@
  * @Author: fxs bjnsfxs@163.com
  * @Date: 2024-08-20 17:18:52
  * @LastEditors: fxs bjnsfxs@163.com
- * @LastEditTime: 2024-10-09 18:17:34
+ * @LastEditTime: 2024-10-10 17:14:03
  * @FilePath: \Game-Backstage-Management-System\src\utils\axios\axiosInstance.ts
  * @Description:
  *
@@ -14,6 +14,7 @@ import { ElMessage } from 'element-plus'
 import { useRequest } from '@/hooks/useRequest'
 import { MessageType } from '@/types/res'
 import { getToken, refreshToken, setToken } from '../token/token'
+import { setLoginState } from '../localStorage/localStorage'
 
 const { baseURL } = useRequest()
 
@@ -40,6 +41,7 @@ axiosInstance.interceptors.response.use(
         message: '请先登录',
         duration: 1500
       })
+      setLoginState(false)
       router.push('/login')
     }
     // -1是token过期的情况
@@ -63,6 +65,7 @@ axiosInstance.interceptors.response.use(
                 message: '登录已过期，请重新登陆',
                 duration: 1500
               })
+              setLoginState(false)
               router.push('/login')
             }
           })
@@ -73,6 +76,7 @@ axiosInstance.interceptors.response.use(
               message: '登录已过期，请重新登陆',
               duration: 1500
             })
+            setLoginState(false)
             router.push('/login')
           })
           .finally(() => {
@@ -97,6 +101,7 @@ axiosInstance.interceptors.response.use(
       message: '服务器错误，请稍后再试',
       duration: 1500
     })
+    setLoginState(false)
     // router.push('/login')
     return Promise.reject(error)
   }

src/utils/localStorage/localStorage.ts

@@ -33,4 +33,21 @@ const saveLocalInfo = (name: string, value: any, prop?: string) => {
   }
 }
 
-export { getLocalInfo, saveLocalInfo }
+/**
+ * @description: 设置登陆状态
+ * @param {boolean} state 登录状态
+ * @return {*}
+ */
+const setLoginState = (state: boolean) => {
+  localStorage.setItem('loginState', JSON.stringify(state))
+}
+
+/**
+ * @description: 获取当前登录状态
+ * @return {boolean}
+ */
+const getLoginState = (): boolean => {
+  return JSON.parse(localStorage.getItem('loginState') as string) as boolean
+}
+
+export { getLocalInfo, saveLocalInfo, setLoginState, getLoginState }

src/views/Index.vue

@@ -2,7 +2,7 @@
  * @Author: fxs bjnsfxs@163.com
  * @Date: 2024-08-20 14:06:49
  * @LastEditors: fxs bjnsfxs@163.com
- * @LastEditTime: 2024-10-10 15:49:48
+ * @LastEditTime: 2024-10-10 17:43:52
  * @FilePath: \Game-Backstage-Management-System\src\views\Index.vue
  * @Description: 
  * 
@@ -19,6 +19,7 @@ import type { DropDownInfo } from '@/types/dataAnalysis'
 import DropDownSelection from '@/components/dataAnalysis/DropDownSelection.vue'
 import { useCommonStore } from '@/stores/useCommon'
 import { initLoadResouce } from '@/utils/resource'
+import { setLoginState } from '@/utils/localStorage/localStorage'
 
 const route = useRoute()
 const { selectInfo, allGameInfo, saveSelectInfo } = useCommonStore()
@@ -64,6 +65,7 @@ const logOut = () => {
     message: '退出成功',
     duration: 1000
   })
+  setLoginState(false)
   localStorage.removeItem('token')
   localStorage.removeItem('refreshToken')
   router.push('/login')
@@ -209,17 +211,6 @@ const watchLoadingState = watch(
               label: item.gameName
             })
           })
-          // getGameInfo()
-          // newGameInfo.map((item) => console.log(item))
-          // console.log(...newGameInfo)
-          // gameSelectInfo.optionsList.splice(0, gameSelectInfo.optionsList.length, ...newGameInfo)
-          // if (newGameInfo.length > oldGameInfo.length) {
-          //   gameSelectInfo.optionsList.push({
-          //     value: newGameInfo[newGameInfo.length - 1].gid,
-          //     label: newGameInfo[newGameInfo.length - 1].gameName
-          //   })
-          // }else{
-          // }
         },
         { deep: true }
       )

src/views/Login/LoginView.vue

@@ -8,6 +8,7 @@ import MyButton from '@/components/form/MyButton.vue'
 import MyInput from '@/components/form/MyInput.vue'
 import { initLoadResouce } from '@/utils/resource'
 import { setToken, setRefreshToken } from '@/utils/token/token'
+import { setLoginState } from '@/utils/localStorage/localStorage'
 
 const { AllApi, analysisResCode } = useRequest()
 
@@ -34,6 +35,7 @@ const userLogin = () => {
           .then(() => {
             setToken(result.token)
             setRefreshToken(result.refreshToken)
+            setLoginState(true)
             // localStorage.setItem('token', result.token)
             // localStorage.setItem('refreshToken', result.refreshToken)
             axiosInstance.defaults.headers['Authorization'] = result.token // 需要在这里设置，不然又会触发拦截器
@@ -101,7 +103,6 @@ const resourceInfo: Record<string, string> = {
 const blobUrlInfo = reactive<Record<string, string>>({})
 
 onMounted(() => {
-  console.log('tt')
   // 去加载所有需要的资源
   initLoadResouce(resourceInfo).then((data) => {
     Object.assign(blobUrlInfo, data)