kailong321200875
4 years ago
parent
3fc7d4d39a
commit
c5ab3599c8
File diff suppressed because it is too large
Load Diff
@ -1,7 +1,8 @@
|
|||||||
import { useAxios } from '@/hooks/web/useAxios'
|
import { useAxios } from '@/hooks/web/useAxios'
|
||||||
|
import type { UserLoginType } from './types'
|
||||||
|
|
||||||
const { request } = useAxios()
|
const { request } = useAxios()
|
||||||
|
|
||||||
export const loginApi = ({ data }: AxiosConfig) => {
|
export const loginApi = (data: UserLoginType) => {
|
||||||
return request({ url: '/user/login', method: 'post', data })
|
return request({ url: '/user/login', method: 'post', data })
|
||||||
}
|
}
|
||||||
@ -0,0 +1,4 @@
|
|||||||
|
export type UserLoginType = {
|
||||||
|
username: string
|
||||||
|
password: string
|
||||||
|
}
|
||||||
@ -0,0 +1,32 @@
|
|||||||
|
import { watch, ref, nextTick, unref } from 'vue'
|
||||||
|
import type { NProgressOptions } from 'nprogress'
|
||||||
|
import NProgress from 'nprogress'
|
||||||
|
import 'nprogress/nprogress.css'
|
||||||
|
import { useCssVar } from '@vueuse/core'
|
||||||
|
|
||||||
|
const primaryColor = useCssVar('--el-color-primary', document.documentElement)
|
||||||
|
|
||||||
|
export function useNProgress() {
|
||||||
|
const isLoading = ref(false)
|
||||||
|
NProgress.configure({ showSpinner: false } as NProgressOptions)
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => isLoading.value,
|
||||||
|
async (loading: boolean) => {
|
||||||
|
loading ? NProgress.start() : NProgress.done()
|
||||||
|
await nextTick()
|
||||||
|
const bar = document.getElementById('nprogress')?.getElementsByClassName('bar')[0] as ElRef
|
||||||
|
if (bar) {
|
||||||
|
bar.style.background = unref(primaryColor.value)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
function toggle() {
|
||||||
|
isLoading.value = !isLoading.value
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
toggle
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
import { watch, ref } from 'vue'
|
||||||
|
import { isString } from '@/utils/is'
|
||||||
|
import { useAppStoreWithOut } from '@/store/modules/app'
|
||||||
|
import { useI18n } from '@/hooks/web/useI18n'
|
||||||
|
|
||||||
|
const appStore = useAppStoreWithOut()
|
||||||
|
|
||||||
|
export function useTitle(newTitle?: string) {
|
||||||
|
const { t } = useI18n()
|
||||||
|
const title = ref(
|
||||||
|
newTitle ? `${appStore.getTitle} - ${t(newTitle as string)}` : appStore.getTitle
|
||||||
|
)
|
||||||
|
|
||||||
|
watch(
|
||||||
|
title,
|
||||||
|
(n, o) => {
|
||||||
|
if (isString(n) && n !== o && document) {
|
||||||
|
document.title = n
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ immediate: true }
|
||||||
|
)
|
||||||
|
|
||||||
|
return title
|
||||||
|
}
|
||||||
@ -0,0 +1,9 @@
|
|||||||
|
<script setup lang="ts"></script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<section>
|
||||||
|
<router-view v-slot="{ Component, route }">
|
||||||
|
<component :is="Component" :key="route.fullPath" />
|
||||||
|
</router-view>
|
||||||
|
</section>
|
||||||
|
</template>
|
||||||
@ -0,0 +1,51 @@
|
|||||||
|
import router from './router'
|
||||||
|
import { useAppStoreWithOut } from '@/store/modules/app'
|
||||||
|
import { useCache } from '@/hooks/web/useCache'
|
||||||
|
// import type { RouteRecordRaw } from 'vue-router'
|
||||||
|
import { useTitle } from '@/hooks/web/useTitle'
|
||||||
|
import { useNProgress } from '@/hooks/web/useNProgress'
|
||||||
|
|
||||||
|
const appStore = useAppStoreWithOut()
|
||||||
|
|
||||||
|
const { wsCache } = useCache()
|
||||||
|
|
||||||
|
const { toggle } = useNProgress()
|
||||||
|
|
||||||
|
const whiteList = ['/login'] // 不重定向白名单
|
||||||
|
|
||||||
|
router.beforeEach((to, from, next) => {
|
||||||
|
console.log(from)
|
||||||
|
toggle()
|
||||||
|
if (wsCache.get(appStore.getUserInfo)) {
|
||||||
|
if (to.path === '/login') {
|
||||||
|
next({ path: '/' })
|
||||||
|
} else {
|
||||||
|
// if (permissionStore.getIsAddRouters) {
|
||||||
|
// next()
|
||||||
|
// return
|
||||||
|
// }
|
||||||
|
// permissionStore.generateRoutes().then(() => {
|
||||||
|
// permissionStore.addRouters.forEach(async (route) => {
|
||||||
|
// await router.addRoute(route as RouteRecordRaw) // 动态添加可访问路由表
|
||||||
|
// })
|
||||||
|
// const redirectPath = from.query.redirect || to.path
|
||||||
|
// const redirect = decodeURIComponent(redirectPath as string)
|
||||||
|
// const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect }
|
||||||
|
// permissionStore.setIsAddRouters(true)
|
||||||
|
// next(nextData)
|
||||||
|
// })
|
||||||
|
next()
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (whiteList.indexOf(to.path) !== -1) {
|
||||||
|
next()
|
||||||
|
} else {
|
||||||
|
next(`/login?redirect=${to.path}`) // 否则全部重定向到登录页
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
router.afterEach(async (to) => {
|
||||||
|
useTitle(to?.meta?.title as string)
|
||||||
|
toggle() // 结束Progress
|
||||||
|
})
|
||||||
@ -0,0 +1,30 @@
|
|||||||
|
<template>
|
||||||
|
<div></div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { unref } from 'vue'
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
|
||||||
|
const { currentRoute, replace } = useRouter()
|
||||||
|
|
||||||
|
const { params, query } = unref(currentRoute)
|
||||||
|
const { path, _redirect_type = 'path' } = params
|
||||||
|
|
||||||
|
Reflect.deleteProperty(params, '_redirect_type')
|
||||||
|
Reflect.deleteProperty(params, 'path')
|
||||||
|
|
||||||
|
const _path = Array.isArray(path) ? path.join('/') : path
|
||||||
|
|
||||||
|
if (_redirect_type === 'name') {
|
||||||
|
replace({
|
||||||
|
name: _path,
|
||||||
|
query,
|
||||||
|
params
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
replace({
|
||||||
|
path: _path.startsWith('/') ? _path : '/' + _path,
|
||||||
|
query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue