feat: 404

This commit is contained in:
wangdan-fit2cloud 2023-12-12 17:34:05 +08:00
parent bfa39ef17e
commit 5c226a6ba8
2 changed files with 37 additions and 38 deletions

View File

@ -47,10 +47,14 @@ instance.interceptors.response.use(
return response
},
(err: any) => {
console.log(err)
if (err.code === 'ECONNABORTED') {
MsgError(err.message)
console.error(err)
}
if (err.response?.status === 404) {
router.push('/404 ')
}
if (err.response?.status === 401) {
router.push({ name: 'login' })
}

View File

@ -1,49 +1,44 @@
<template >
<el-row class="not-found-container">
<el-col class="img" :span="12">
</el-col>
<el-col class="message-container" :span="12">
<div class="title">404</div>
<div class="message">很抱歉您要访问的页面地址有误,或者该页面不存在</div>
<div class="operate"><el-button type="primary" @click="router.push('/')">返回首页</el-button></div>
</el-col>
</el-row>
<template>
<el-row class="not-found-container">
<el-col class="img" :span="12"> </el-col>
<el-col class="message-container" :span="12">
<div class="title">404</div>
<div class="message">很抱歉无法访问应用</div>
<!-- <div class="operate"><el-button type="primary" @click="router.push('/')">返回首页</el-button></div> -->
</el-col>
</el-row>
</template>
<script setup lang="ts">
import { useRouter } from 'vue-router';
import { useRouter } from 'vue-router'
const router = useRouter()
</script>
<style lang="scss" scoped>
.not-found-container {
height: 100vh;
width: 100vw;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
width: 100vw;
display: flex;
justify-content: center;
align-items: center;
.img {
background-image: url('@/assets/404.png');
background-size: 100% 100%;
width: 50%;
height: 100%;
.img {
background-image: url('@/assets/404.png');
background-size: 100% 100%;
width: 50%;
height: 100%;
}
.message-container {
color: var(--app-text-color);
.title {
font-size: 50px;
font-weight: 500;
}
.message-container {
color: var(--app-text-color);
.title {
font-size: 50px;
font-weight: 500;
}
.message {
font-size: 20px;
margin: 50px 0 20px 0;
}
.message {
font-size: 20px;
margin: 30px 0 20px 0;
}
}
}
</style>
</style>