From c055dacfaf3bd359bd8134fab4d974e453bf64e7 Mon Sep 17 00:00:00 2001 From: pan <1029559041@qq.com> Date: Sat, 12 Jun 2021 16:01:02 +0800 Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E5=8F=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- mock/test.ts | 88 +++++++++++++++++- src/App.vue | 54 +++++++++-- .../{Login.vue => ManagerLogin.vue} | 9 +- src/components/Room.vue | 93 +++++++++++++++++++ src/components/UserLogin.vue | 81 ++++++++++++++++ src/global.ts | 3 +- src/interface.ts | 6 +- src/request.ts | 15 ++- src/router.ts | 85 ++++++++++++----- 9 files changed, 391 insertions(+), 43 deletions(-) rename src/components/{Login.vue => ManagerLogin.vue} (86%) create mode 100644 src/components/Room.vue create mode 100644 src/components/UserLogin.vue diff --git a/mock/test.ts b/mock/test.ts index d90ea78..864f380 100644 --- a/mock/test.ts +++ b/mock/test.ts @@ -1,5 +1,15 @@ import {MockMethod} from 'vite-plugin-mock'; -import {changeEmailApi, changePwdApi, checkAdminApi, loginApi, sendCodeApi, telegramBotApi} from "../src/interface"; +import { + addRoomApi, + changeEmailApi, + changePwdApi, + checkAdminApi, + getRoomApi, + managerLoginApi, + sendCodeApi, + telegramBotApi, + userLoginApi +} from "../src/interface"; import {JSONResponse} from "../src/request"; @@ -108,7 +118,7 @@ export default [ } }, { - url: loginApi, + url: managerLoginApi, method: "post", response: ({body}) => { const result: JSONResponse = { @@ -156,5 +166,79 @@ export default [ return {message: '查询管理员失败'} } } + }, + { + url: userLoginApi, + method: "post", + response: ({body}) => { + const result: JSONResponse = { + result: Math.random() < 0.9 ? 'OK' : "FAIL", + } + if (result.result === 'OK') { + return { + ...result, + ...Mock.mock({ + 'message': '登陆成功', + 'body': { + 'token': /[a-zA-Z0-9]{32}/, + 'userEmail': body['userEmail'] + } + }) + } + } else { + return { + ...result, + ...Mock.mock({ + 'message': /登陆失败，(邮箱或密码错误)/ + }) + } + } + } + }, + { + url: addRoomApi, + method: "post", + response: ({body}) => { + const result: JSONResponse = { + result: Math.random() < 0.9 ? 'OK' : "FAIL", + } + if (result.result === 'OK') { + return { + ...result, + message: '添加成功' + } + } else { + return { + ...result, + message: '添加失败' + } + } + } + }, + { + url: getRoomApi, + method: "get", + response: ({body}) => { + console.info(111111) + const result: JSONResponse = { + result: Math.random() < 0.9 ? 'OK' : "FAIL", + } + const data = Mock.mock({ + "rooms|1-10": [ + { + "id|1-100": 100, + user: '@cname', + title: '@ctitle', + "status|1-3": 1, + "email|1": true, + "telegram|1": true + } + ] + }) + return { + ...result, + ...data + } + } } ] as MockMethod[]; \ No newline at end of file diff --git a/src/App.vue b/src/App.vue index 15f3941..83214d9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,12 +1,14 @@ + + \ No newline at end of file diff --git a/src/components/UserLogin.vue b/src/components/UserLogin.vue new file mode 100644 index 0000000..a831ebe --- /dev/null +++ b/src/components/UserLogin.vue @@ -0,0 +1,81 @@ + + + + + \ No newline at end of file diff --git a/src/global.ts b/src/global.ts index cad1166..a26b92a 100644 --- a/src/global.ts +++ b/src/global.ts @@ -1,2 +1,3 @@ -export const token_cookie_key = 'token' +export const manager_token_key = 'manager_token' +export const user_token_key = "user_token" export const email_cookie_key = 'user_email' \ No newline at end of file diff --git a/src/interface.ts b/src/interface.ts index 6e755ca..07f8c59 100644 --- a/src/interface.ts +++ b/src/interface.ts @@ -5,4 +5,8 @@ export const changePwdApi = `${prefix}/change/pwd` export const telegramBotApi = `${prefix}/telegram/bot` export const testTelegramBotApi = (token: string) => `https://api.telegram.org/bot${token}/getMe` export const checkAdminApi = `${prefix}/checkAdmin` -export const loginApi = `${prefix}/login` \ No newline at end of file +export const managerLoginApi = `${prefix}/login` +const frontend = '/api/frontend' +export const userLoginApi = `${frontend}/login` +export const addRoomApi = `${frontend}/room` +export const getRoomApi = `${frontend}/load/room` diff --git a/src/request.ts b/src/request.ts index df78a8e..1ca4ef7 100644 --- a/src/request.ts +++ b/src/request.ts @@ -1,8 +1,9 @@ import { + addRoomApi, changeEmailApi, changePwdApi, checkAdminApi, - loginApi, + getRoomApi, sendCodeApi, telegramBotApi, testTelegramBotApi @@ -89,8 +90,16 @@ export function checkAdmin() { return fetch(new Request(checkAdminApi), {method: 'GET'}) } -export function login(userEmail: string, password: string) { - return fetch(new Request(loginApi), {method: 'POST', body: JSON.stringify({userEmail, password})}) +export function login(api: string, userEmail: string, password: string) { + return fetch(new Request(api), {method: 'POST', body: JSON.stringify({userEmail, password})}) +} + +export function addRoom(roomId: string) { + return fetch(new Request(addRoomApi), {method: 'POST', body: JSON.stringify({roomId})}) +} + +export function loadRoom() { + return fetch(new Request(getRoomApi), {method: 'GET'}) } export type Result = 'OK' | 'FAIL' diff --git a/src/router.ts b/src/router.ts index 7ce94be..f5016c2 100644 --- a/src/router.ts +++ b/src/router.ts @@ -5,29 +5,40 @@ import {useStore} from "vuex"; import {onMounted} from "vue"; import Password from "./components/Password.vue"; import TelegramBot from "./components/TelegramBot.vue"; -import Login from "./components/Login.vue"; +import ManagerLogin from "./components/ManagerLogin.vue"; import Register from "./components/Register.vue"; import {checkAdmin, JSONResponse} from "./request"; +import UserLogin from "./components/UserLogin.vue" // @ts-ignore import crumbs from 'crumbsjs'; -import {token_cookie_key} from "./global"; +import {manager_token_key, user_token_key} from "./global"; +import Room from "./components/Room.vue"; -const backend = '/backend' -export const registerPath = `${backend}/register` -export const loginPath = `${backend}/login` +export const backend = '/backend' +export const managerRegisterPath = `${backend}/register` +export const managerLoginPath = `${backend}/login` export const configPath = `${backend}/config` export const telegramPath = `${configPath}/telegram` export const managerEmailPath = `${backend}/email` export const managerPasswordPath = `${backend}/password` +export const frontend = '/frontend' +export const userLoginPath = `${frontend}/login` +export const userMainPath = `${frontend}/main` const routes = [ + {path: '/', redirect: userLoginPath}, {path: backend, redirect: configPath}, - {path: registerPath, component: Register}, - {path: configPath, component: Config}, - {path: telegramPath, component: TelegramBot}, + {path: managerEmailPath, component: Email}, {path: managerPasswordPath, component: Password}, - {path: loginPath, component: Login} + {path: managerLoginPath, component: ManagerLogin}, + {path: managerRegisterPath, component: Register}, + + {path: configPath, component: Config}, + {path: telegramPath, component: TelegramBot}, + + {path: userLoginPath, component: UserLogin}, + {path: userMainPath, component: Room} ] @@ -37,31 +48,57 @@ export const router = createRouter({ }) //路由导航守卫 router.beforeEach(async (to, from) => { - if (crumbs.get(token_cookie_key)) { - if ([registerPath, loginPath].includes(to.fullPath)) { - console.info('存在cookie，访问的路由是登录或注册，重定向到主页') - return '/' + const fullPath = to.fullPath + if (fullPath.startsWith(backend)) { + const token_key = manager_token_key + const registerPath = managerRegisterPath + const loginPath = managerLoginPath + if (crumbs.get(token_key)) { + if ([registerPath, loginPath].includes(fullPath)) { + console.info('存在cookie，访问的路由是登录或注册，重定向到主页') + return '/' + } else { + console.info('放通路由') + return true + } } else { - console.info('放通路由') - return true + let res: JSONResponse = await checkAdmin().then(res => res.json()) + if (res.body) { + if (fullPath === loginPath) { + console.info('放通路由') + return true + } else { + console.info('存在管理员，访问的不是登录路由，重定向到登录') + return loginPath + } + } else { + if (fullPath === registerPath) { + console.info('放通路由') + return true + } else { + console.info('不存在管理员，访问的不是注册路由，重定向到注册') + return registerPath + } + } } } else { - let res: JSONResponse = await checkAdmin().then(res => res.json()) - if (res.body) { - if (to.fullPath === loginPath) { + const token_key = user_token_key + const fullPath = to.fullPath + if (crumbs.get(token_key)) { + if (fullPath == userLoginPath) { + console.info('存在cookie，访问的路由是登录或注册，重定向到主页') + return '/' + } else { console.info('放通路由') return true - } else { - console.info('存在管理员，访问的不是登录路由，重定向到登录') - return loginPath } } else { - if (to.fullPath === registerPath) { + if (fullPath === userLoginPath) { console.info('放通路由') return true } else { - console.info('不存在管理员，访问的不是注册路由，重定向到注册') - return registerPath + console.info('访问的不是登录路由，重定向到登录') + return userLoginPath } } }