diff --git a/public/icons/avatar.svg b/public/icons/avatar.svg new file mode 100644 index 0000000..98cc3b6 --- /dev/null +++ b/public/icons/avatar.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icons/eye.svg b/public/icons/eye.svg new file mode 100644 index 0000000..a18c8ec --- /dev/null +++ b/public/icons/eye.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/icons/logout.svg b/public/icons/logout.svg new file mode 100644 index 0000000..87ba003 --- /dev/null +++ b/public/icons/logout.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icons/password.svg b/public/icons/password.svg new file mode 100644 index 0000000..23ed6f1 --- /dev/null +++ b/public/icons/password.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/images/login-bg.png b/public/images/login-bg.png new file mode 100644 index 0000000..6463079 Binary files /dev/null and b/public/images/login-bg.png differ diff --git a/src/api/fetchUrl.ts b/src/api/fetchUrl.ts index 0f64249..c755c83 100644 --- a/src/api/fetchUrl.ts +++ b/src/api/fetchUrl.ts @@ -11,3 +11,9 @@ export const getSegmentStatic = () => `${baseUrl}/api/bigScreenData/bigScreenSta export const getBigScreenRanking = () => `${baseUrl}/api/bigScreenData/bigScreenRanks`; export const getSixStatisticsUrl = () => `${baseUrl}/api/bigScreenData/wechatData` + +export const postLoginUrl=() => `${baseUrl}/api/sysAuth/BigScreenLogin` + +export const getUserInfoUrl = ()=> `${baseUrl}/api/sysAuth/userInfo` + +export const getLogoutUrl = () => `${baseUrl}/api/sysAuth/logout` \ No newline at end of file diff --git a/src/assets/svg-img/login-border.svg b/src/assets/svg-img/login-border.svg new file mode 100644 index 0000000..3f4ad0e --- /dev/null +++ b/src/assets/svg-img/login-border.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/svg-img/login-input.svg b/src/assets/svg-img/login-input.svg new file mode 100644 index 0000000..a50c593 --- /dev/null +++ b/src/assets/svg-img/login-input.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/svg-img/login-title.svg b/src/assets/svg-img/login-title.svg new file mode 100644 index 0000000..2ca6bb4 --- /dev/null +++ b/src/assets/svg-img/login-title.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/ErrorComponent.vue b/src/components/ErrorComponent.vue new file mode 100644 index 0000000..de908a7 --- /dev/null +++ b/src/components/ErrorComponent.vue @@ -0,0 +1,29 @@ + + + + + \ No newline at end of file diff --git a/src/components/LoadingComponent.vue b/src/components/LoadingComponent.vue new file mode 100644 index 0000000..143b429 --- /dev/null +++ b/src/components/LoadingComponent.vue @@ -0,0 +1,26 @@ + + + \ No newline at end of file diff --git a/src/router/index.ts b/src/router/index.ts index f7769d6..b43fac0 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,6 +1,8 @@ import { createRouter, createWebHistory } from "vue-router"; import { publicRoutes } from "./publicRoutes"; import { privateRoutes } from "./privateRoutes"; +import { useUserStore } from "@/store/user"; + function getRoutes() { const routes = [ // 私有路由,请在这里添加 @@ -16,6 +18,7 @@ function getRoutes() { } + const router = createRouter({ history: createWebHistory(), routes: getRoutes(), @@ -23,19 +26,26 @@ const router = createRouter({ // 全局前置守卫,这边可以对身份进行验证 router.beforeEach((to, _from, next) => { - - let userRole = "admin"; + const userStore = useUserStore() + let userRole = ""; + let hasLogin = userStore.getAccessToken; + console.log(hasLogin); + // 如果目标路由没有角色限制 if (!to.meta.role) { next(); } + console.log(to.meta.role); + // 判断当前用户角色是否在目标路由的允许角色列表中 if ((to.meta.role as string[]).includes(userRole)) { - // 如果角色匹配,允许进入目标路由 + // 如果角色匹配,允许进入目标路由 + next(); + }else if(hasLogin){ next(); } else { // 如果角色不匹配,跳转到 unauthorized 页面 - next({ path: "/unauthorized" }); + next({ path: "/login" }); } }); diff --git a/src/router/privateRoutes.ts b/src/router/privateRoutes.ts index 67dd74c..8963f3a 100644 --- a/src/router/privateRoutes.ts +++ b/src/router/privateRoutes.ts @@ -1 +1,11 @@ -export const privateRoutes = []; +export const privateRoutes = [ + { + path:"/", + name:'home', + meta:{ + title:'主页', + role:['admin'] + }, + component:()=>import('../views/home.vue') + }, +]; diff --git a/src/router/publicRoutes.ts b/src/router/publicRoutes.ts index cc2cfc0..1e4f2a8 100644 --- a/src/router/publicRoutes.ts +++ b/src/router/publicRoutes.ts @@ -8,12 +8,13 @@ export const publicRoutes = [ }, component:()=>import('../views/unauthorized.vue') }, + { - path:"/", - name:'home', + path:"/login", + name:'login', meta:{ - title:'home' + title:'登陆' }, - component:()=>import('../views/home.vue') + component:()=>import('../views/login.vue') } ] \ No newline at end of file diff --git a/src/store/user.ts b/src/store/user.ts index a1ad193..699cf65 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -2,16 +2,23 @@ import { defineStore } from "pinia"; export const useUserStore = defineStore("user", { persist:true, state:()=>({ - token:"" + accessToken:"", + refreshToken:"" }), getters:{ - getToken(state){ - return state.token; + getAccessToken(state){ + return state.accessToken; + }, + getRefreshToken(state){ + return state.refreshToken } }, actions:{ - setToken(token:string){ - this.token = token; + setAccessToken(token:string){ + this.accessToken = token; + }, + setRefreshToken(token:string){ + this.refreshToken = token } } }); \ No newline at end of file diff --git a/src/views/components/AskSection.vue b/src/views/components/AskSection.vue index a76665d..f365293 100644 --- a/src/views/components/AskSection.vue +++ b/src/views/components/AskSection.vue @@ -1,5 +1,5 @@