diff --git a/src/App.vue b/src/App.vue index 3c1b7512..e3ce4367 100644 --- a/src/App.vue +++ b/src/App.vue @@ -2,25 +2,7 @@ diff --git a/src/api/auth.ts b/src/api/auth.ts index c72b6823..2f9e18c4 100644 --- a/src/api/auth.ts +++ b/src/api/auth.ts @@ -2,8 +2,20 @@ import axios from 'axios'; import type { Auth, Logout, Update } from '#/auth'; export const apiAuth = { - async login() { - const { data } = await axios.post('api/v1/auth/login'); + async login(username: string, password: string) { + const { data } = await axios.post( + 'api/v1/auth/login', + { + username, + password, + }, + { + headers: { + 'Content-Type': 'application/x-www-form-urlencoded', + }, + } + ); + return data; }, @@ -17,8 +29,11 @@ export const apiAuth = { return data; }, - async update() { - const { data } = await axios.post('api/v1/auth/update'); + async update(username: string, password: string) { + const { data } = await axios.post('api/v1/auth/update', { + username, + password, + }); return data; }, }; diff --git a/src/auto-imports.d.ts b/src/auto-imports.d.ts index df9eb747..3c9583e4 100644 --- a/src/auto-imports.d.ts +++ b/src/auto-imports.d.ts @@ -136,6 +136,7 @@ declare global { const useAsyncQueue: typeof import('@vueuse/core')['useAsyncQueue'] const useAsyncState: typeof import('@vueuse/core')['useAsyncState'] const useAttrs: typeof import('vue')['useAttrs'] + const useAuth: typeof import('./hooks/auth')['useAuth'] const useBangumiStore: typeof import('./store/bangumi')['useBangumiStore'] const useBase64: typeof import('@vueuse/core')['useBase64'] const useBattery: typeof import('@vueuse/core')['useBattery'] diff --git a/src/basic/ab-button.vue b/src/basic/ab-button.vue index 48f03ae3..9cfa3e17 100644 --- a/src/basic/ab-button.vue +++ b/src/basic/ab-button.vue @@ -17,11 +17,11 @@ defineEmits(['click']); const buttonSize = computed(() => { switch (props.size) { case 'big': - return 'rounded-10px text-h1 w-276px h-55px'; + return 'rounded-10px text-h1 w-276px h-55px text-h1'; case 'normal': return 'rounded-6px w-170px h-36px'; case 'small': - return 'rounded-6px w-86px h-28px'; + return 'rounded-6px w-86px h-28px text-main'; } }); @@ -50,26 +50,4 @@ const buttonSize = computed(() => { @include bg-mouse-event(#943c61, #521e2a, #9c8a93); } } - -.size { - &-normal { - border-radius: 6px; - width: 171px; - height: 36px; - } - - &-big { - font-size: 24px; - border-radius: 10px; - width: 276px; - height: 55px; - } - - &-small { - font-size: 12px; - border-radius: 6px; - width: 86px; - height: 28px; - } -} diff --git a/src/components.d.ts b/src/components.d.ts index 18bdd69a..04b51d44 100644 --- a/src/components.d.ts +++ b/src/components.d.ts @@ -37,6 +37,7 @@ declare module '@vue/runtime-core' { ConfigParser: typeof import('./views/config-parser.vue')['default'] ConfigProxy: typeof import('./views/config-proxy.vue')['default'] copy: typeof import('./basic/ab-switch copy.vue')['default'] + Login: typeof import('./pages/login.vue')['default'] RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] } diff --git a/src/hooks/auth.ts b/src/hooks/auth.ts new file mode 100644 index 00000000..f36c880b --- /dev/null +++ b/src/hooks/auth.ts @@ -0,0 +1,41 @@ +import type { User } from '#/auth'; + +export const useAuth = createSharedComposable(() => { + const token = useLocalStorage('token', ''); + + const user = reactive({ + username: '', + password: '', + }); + + const isLogin = computed(() => token.value !== ''); + + const login = async () => { + const res = await apiAuth.login(user.username, user.password); + console.log(res); + }; + + const logout = async () => { + apiAuth.logout(); + }; + + const refresh = async () => { + const res = await apiAuth.refresh(); + }; + + const update = async () => { + const res = await apiAuth.update(user.username, user.password); + console.log(res); + }; + + return { + token, + user, + isLogin, + + login, + logout, + refresh, + update, + }; +}); diff --git a/src/pages/index.vue b/src/pages/index.vue index 1479408a..7369e7ec 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -1,22 +1,23 @@ - + diff --git a/src/pages/index/bangumi.vue b/src/pages/index/bangumi.vue new file mode 100644 index 00000000..1479408a --- /dev/null +++ b/src/pages/index/bangumi.vue @@ -0,0 +1,22 @@ + + + diff --git a/src/pages/calendar.vue b/src/pages/index/calendar.vue similarity index 100% rename from src/pages/calendar.vue rename to src/pages/index/calendar.vue diff --git a/src/pages/config.vue b/src/pages/index/config.vue similarity index 100% rename from src/pages/config.vue rename to src/pages/index/config.vue diff --git a/src/pages/downloader.vue b/src/pages/index/downloader.vue similarity index 100% rename from src/pages/downloader.vue rename to src/pages/index/downloader.vue diff --git a/src/pages/log.vue b/src/pages/index/log.vue similarity index 100% rename from src/pages/log.vue rename to src/pages/index/log.vue diff --git a/src/pages/player.vue b/src/pages/index/player.vue similarity index 100% rename from src/pages/player.vue rename to src/pages/index/player.vue diff --git a/src/pages/login.vue b/src/pages/login.vue new file mode 100644 index 00000000..4f293bdd --- /dev/null +++ b/src/pages/login.vue @@ -0,0 +1,39 @@ + + + diff --git a/src/router-type.d.ts b/src/router-type.d.ts index b722f11f..898b5e6c 100644 --- a/src/router-type.d.ts +++ b/src/router-type.d.ts @@ -39,156 +39,110 @@ import type { declare module 'vue-router/auto/routes' { export interface RouteNamedMap { - 'Bangumi List': RouteRecordInfo< - 'Bangumi List', - '/', - Record, - Record - >; - Calendar: RouteRecordInfo< - 'Calendar', - '/calendar', - Record, - Record - >; - Config: RouteRecordInfo< - 'Config', - '/config', - Record, - Record - >; - Downloader: RouteRecordInfo< - 'Downloader', - '/downloader', - Record, - Record - >; - Log: RouteRecordInfo< - 'Log', - '/log', - Record, - Record - >; - Player: RouteRecordInfo< - 'Player', - '/player', - Record, - Record - >; + '/': RouteRecordInfo<'/', '/', Record, Record>, + 'Bangumi List': RouteRecordInfo<'Bangumi List', '/bangumi', Record, Record>, + 'Calendar': RouteRecordInfo<'Calendar', '/calendar', Record, Record>, + 'Config': RouteRecordInfo<'Config', '/config', Record, Record>, + 'Downloader': RouteRecordInfo<'Downloader', '/downloader', Record, Record>, + 'Log': RouteRecordInfo<'Log', '/log', Record, Record>, + 'Player': RouteRecordInfo<'Player', '/player', Record, Record>, + 'Login': RouteRecordInfo<'Login', '/login', Record, Record>, } } declare module 'vue-router/auto' { - import type { RouteNamedMap } from 'vue-router/auto/routes'; + import type { RouteNamedMap } from 'vue-router/auto/routes' - export type RouterTyped = _RouterTyped; + export type RouterTyped = _RouterTyped /** * Type safe version of `RouteLocationNormalized` (the type of `to` and `from` in navigation guards). * Allows passing the name of the route to be passed as a generic. */ - export type RouteLocationNormalized< - Name extends keyof RouteNamedMap = keyof RouteNamedMap - > = RouteLocationNormalizedTypedList[Name]; + export type RouteLocationNormalized = RouteLocationNormalizedTypedList[Name] /** * Type safe version of `RouteLocationNormalizedLoaded` (the return type of `useRoute()`). * Allows passing the name of the route to be passed as a generic. */ - export type RouteLocationNormalizedLoaded< - Name extends keyof RouteNamedMap = keyof RouteNamedMap - > = RouteLocationNormalizedLoadedTypedList[Name]; + export type RouteLocationNormalizedLoaded = RouteLocationNormalizedLoadedTypedList[Name] /** * Type safe version of `RouteLocationResolved` (the returned route of `router.resolve()`). * Allows passing the name of the route to be passed as a generic. */ - export type RouteLocationResolved< - Name extends keyof RouteNamedMap = keyof RouteNamedMap - > = RouteLocationResolvedTypedList[Name]; + export type RouteLocationResolved = RouteLocationResolvedTypedList[Name] /** * Type safe version of `RouteLocation` . Allows passing the name of the route to be passed as a generic. */ - export type RouteLocation< - Name extends keyof RouteNamedMap = keyof RouteNamedMap - > = RouteLocationTypedList[Name]; + export type RouteLocation = RouteLocationTypedList[Name] /** * Type safe version of `RouteLocationRaw` . Allows passing the name of the route to be passed as a generic. */ - export type RouteLocationRaw< - Name extends keyof RouteNamedMap = keyof RouteNamedMap - > = + export type RouteLocationRaw = | RouteLocationAsString | RouteLocationAsRelativeTypedList[Name] - | RouteLocationAsPathTypedList[Name]; + | RouteLocationAsPathTypedList[Name] /** * Generate a type safe params for a route location. Requires the name of the route to be passed as a generic. */ - export type RouteParams = - RouteNamedMap[Name]['params']; + export type RouteParams = RouteNamedMap[Name]['params'] /** * Generate a type safe raw params for a route location. Requires the name of the route to be passed as a generic. */ - export type RouteParamsRaw = - RouteNamedMap[Name]['paramsRaw']; + export type RouteParamsRaw = RouteNamedMap[Name]['paramsRaw'] - export function useRouter(): RouterTyped; - export function useRoute< - Name extends keyof RouteNamedMap = keyof RouteNamedMap - >(name?: Name): RouteLocationNormalizedLoadedTypedList[Name]; + export function useRouter(): RouterTyped + export function useRoute(name?: Name): RouteLocationNormalizedLoadedTypedList[Name] - export const useLink: UseLinkFnTyped; + export const useLink: UseLinkFnTyped - export function onBeforeRouteLeave( - guard: NavigationGuard - ): void; - export function onBeforeRouteUpdate( - guard: NavigationGuard - ): void; + export function onBeforeRouteLeave(guard: NavigationGuard): void + export function onBeforeRouteUpdate(guard: NavigationGuard): void - export const RouterLink: RouterLinkTyped; - export const RouterLinkProps: RouterLinkPropsTyped; + export const RouterLink: RouterLinkTyped + export const RouterLinkProps: RouterLinkPropsTyped // Experimental Data Fetching export function defineLoader< P extends Promise, Name extends keyof RouteNamedMap = keyof RouteNamedMap, - isLazy extends boolean = false + isLazy extends boolean = false, >( name: Name, loader: (route: RouteLocationNormalizedLoaded) => P, - options?: _DefineLoaderOptions - ): _DataLoader, isLazy>; + options?: _DefineLoaderOptions, + ): _DataLoader, isLazy> export function defineLoader< P extends Promise, - isLazy extends boolean = false + isLazy extends boolean = false, >( loader: (route: RouteLocationNormalizedLoaded) => P, - options?: _DefineLoaderOptions - ): _DataLoader, isLazy>; + options?: _DefineLoaderOptions, + ): _DataLoader, isLazy> export { _definePage as definePage, _HasDataLoaderMeta as HasDataLoaderMeta, _setupDataFetchingGuard as setupDataFetchingGuard, _stopDataFetchingScope as stopDataFetchingScope, - } from 'unplugin-vue-router/runtime'; + } from 'unplugin-vue-router/runtime' } declare module 'vue-router' { - import type { RouteNamedMap } from 'vue-router/auto/routes'; + import type { RouteNamedMap } from 'vue-router/auto/routes' export interface TypesConfig { - beforeRouteUpdate: NavigationGuard; - beforeRouteLeave: NavigationGuard; + beforeRouteUpdate: NavigationGuard + beforeRouteLeave: NavigationGuard - $route: RouteLocationNormalizedLoadedTypedList[keyof RouteNamedMap]; - $router: _RouterTyped; + $route: RouteLocationNormalizedLoadedTypedList[keyof RouteNamedMap] + $router: _RouterTyped - RouterLink: RouterLinkTyped; + RouterLink: RouterLinkTyped } } diff --git a/src/router/index.ts b/src/router/index.ts index 12d3df8e..bef10c3b 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -4,4 +4,11 @@ const router = createRouter({ history: createWebHashHistory(), }); +router.beforeEach((to) => { + const { isLogin } = useAuth(); + if (!isLogin.value && to.path !== '/login') { + return { name: 'Login' }; + } +}); + export { router }; diff --git a/types/auth.ts b/types/auth.ts index 643b3767..9345054e 100644 --- a/types/auth.ts +++ b/types/auth.ts @@ -11,3 +11,8 @@ export interface Logout { export interface Update { message: 'update success'; } + +export interface User { + username: string; + password: string; +} diff --git a/unocss.config.ts b/unocss.config.ts index 15347acb..609a9e77 100644 --- a/unocss.config.ts +++ b/unocss.config.ts @@ -18,6 +18,7 @@ export default defineConfig({ primary: '#493475', running: '#A3D491', stopped: '#DF7F91', + page: '#F0F0F0', }, }, rules: [ @@ -52,7 +53,7 @@ export default defineConfig({ [ 'layout-container', - 'wh-screen min-w-1024px min-h-768px p-16px space-y-12px flex flex-col bg-[#F0F0F0]', + 'wh-screen min-w-1024px min-h-768px p-16px space-y-12px flex flex-col bg-page', ], [ 'layout-main',