添加404页面
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import { createRouter, createWebHistory, RouteRecordRaw, createWebHashHistory } from 'vue-router'
|
import { createRouter, createWebHistory, RouteRecordRaw, createWebHashHistory } from 'vue-router'
|
||||||
import { defineAsyncComponent } from 'vue'
|
import { defineAsyncComponent } from 'vue'
|
||||||
import {getBrowserInfo,murmur} from '@/tool/util'
|
import { getBrowserInfo, murmur } from '@/tool/util'
|
||||||
import { getCookie,setCookie } from "@/tool/cookie";
|
import { getCookie, setCookie } from "@/tool/cookie";
|
||||||
const _import = (path: string) => defineAsyncComponent(() => import(`../views/${path}.vue`));
|
const _import = (path: string) => defineAsyncComponent(() => import(`../views/${path}.vue`));
|
||||||
|
|
||||||
const routes: Array<RouteRecordRaw> = [
|
const routes: Array<RouteRecordRaw> = [
|
||||||
@@ -36,7 +36,7 @@ const routes: Array<RouteRecordRaw> = [
|
|||||||
name: 'history',
|
name: 'history',
|
||||||
component: _import('HistoryPage')
|
component: _import('HistoryPage')
|
||||||
},
|
},
|
||||||
// {
|
// {//老版本history
|
||||||
// path: '/oldHistory',
|
// path: '/oldHistory',
|
||||||
// name: 'oldHistory',
|
// name: 'oldHistory',
|
||||||
// component: _import('OldHistoryPage')
|
// component: _import('OldHistoryPage')
|
||||||
@@ -56,6 +56,11 @@ const routes: Array<RouteRecordRaw> = [
|
|||||||
name: 'setIdentification',
|
name: 'setIdentification',
|
||||||
component: _import('setIdentification')
|
component: _import('setIdentification')
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/404',
|
||||||
|
name: '404',
|
||||||
|
component: _import('404')
|
||||||
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
@@ -64,28 +69,45 @@ const router = createRouter({
|
|||||||
routes
|
routes
|
||||||
})
|
})
|
||||||
router.beforeEach((to, from, next) => {
|
router.beforeEach((to, from, next) => {
|
||||||
// 系统维护
|
// 系统维护
|
||||||
// const toName = to.name === 'upgrade';
|
// const toName = to.name === 'upgrade';
|
||||||
// if (toName) {
|
// if (toName) {
|
||||||
// next();
|
// next();
|
||||||
// } else {
|
// } else {
|
||||||
// next({ name: 'upgrade' });
|
// next({ name: 'upgrade' });
|
||||||
// }
|
// }
|
||||||
|
// 检查路由是否存在
|
||||||
// 机房用户
|
// 机房用户
|
||||||
let murmurStr:any = localStorage.getItem('murmurStr')
|
let murmurStr: any = localStorage.getItem('murmurStr')
|
||||||
let getIsMurmur:any = getCookie("isMurmur")
|
let getIsMurmur: any = getCookie("isMurmur")
|
||||||
let token = getCookie("token");
|
let token = getCookie("token");
|
||||||
let isMurmur = JSON.parse(getIsMurmur)
|
let isMurmur = JSON.parse(getIsMurmur)
|
||||||
if(isMurmur&& murmurStr && token){
|
|
||||||
const toName = to.name === 'login';
|
const routeExists = router.getRoutes().some(({ name }) =>{
|
||||||
if (toName) {
|
if(name){
|
||||||
next({ name: 'home' });
|
return name === to.name
|
||||||
|
}else{
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (routeExists) {
|
||||||
|
if (isMurmur && murmurStr && token) {
|
||||||
|
const toName = to.name === 'login';
|
||||||
|
if (toName) {
|
||||||
|
next({ name: 'home' });
|
||||||
|
} else {
|
||||||
|
next();
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
|
// 如果页面存在,正常跳转
|
||||||
next();
|
next();
|
||||||
}
|
}
|
||||||
}else{
|
|
||||||
next();
|
next();
|
||||||
|
} else {
|
||||||
|
// 如果页面不存在,可以跳转到404页面或者其他页面
|
||||||
|
next('/404');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
});
|
});
|
||||||
export default router
|
export default router
|
||||||
|
|||||||
90
src/views/404.vue
Normal file
90
src/views/404.vue
Normal file
@@ -0,0 +1,90 @@
|
|||||||
|
<template>
|
||||||
|
<div class="aida-404page">
|
||||||
|
<div class="aida-404page-content">
|
||||||
|
<h1 class="aida-404">404</h1>
|
||||||
|
<p class="aida-text">NOT FOUND</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { defineComponent,h,ref} from "vue";
|
||||||
|
export default defineComponent({
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<style scoped lang="less">
|
||||||
|
.aida-404page{
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
position: relative;
|
||||||
|
--upgradePageColor:#000;
|
||||||
|
.aida-404page-content{
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%,-50%);
|
||||||
|
.aida-404{
|
||||||
|
font-size: 30vh;
|
||||||
|
font-weight: bold;
|
||||||
|
position: relative;
|
||||||
|
line-height: 1;
|
||||||
|
text-align: center;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.aida-404::after{
|
||||||
|
content: '404';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
color: transparent;
|
||||||
|
background: -webkit-repeating-linear-gradient(-45deg, #71b7e6, #69a6ce, #b98acc, #ee8176, #b98acc, #69a6ce, #9b59b6);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
background-size: 400%;
|
||||||
|
text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.25);
|
||||||
|
animation: animateTextBackground 10s ease-in-out infinite;
|
||||||
|
@keyframes animateTextBackground {
|
||||||
|
0%{
|
||||||
|
background-position: 0 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
background-position: 100% 0;
|
||||||
|
}
|
||||||
|
50%{
|
||||||
|
background-position: 100% 100%;
|
||||||
|
}
|
||||||
|
75%{
|
||||||
|
background-position: 0 100%;
|
||||||
|
}
|
||||||
|
100%{
|
||||||
|
background-position: 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.aida-text{
|
||||||
|
color: #d6d6d6;
|
||||||
|
font-size: 8vh;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 10vh;
|
||||||
|
max-width: 600px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -219,7 +219,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="login_footer">
|
<div class="login_footer">
|
||||||
<div class="login_footer_item"><div class="login_footer_item_text">©2024 CodeCreate</div></div>
|
<div class="login_footer_item"><div class="login_footer_item_text">©2024 Code-Create Limited</div></div>
|
||||||
<div class="login_footer_item">
|
<div class="login_footer_item">
|
||||||
<div class="login_footer_item_text footer_item_text_pointer" @click="turnToWindow('https://code-create.com.hk/aida-terms-and-conditions/')">Terms&Conditions</div>
|
<div class="login_footer_item_text footer_item_text_pointer" @click="turnToWindow('https://code-create.com.hk/aida-terms-and-conditions/')">Terms&Conditions</div>
|
||||||
<div class="login_footer_line"></div>
|
<div class="login_footer_line"></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user