feat: 添加404页面,当访问不存在资源时跳转404页

This commit is contained in:
mixtan 2025-06-18 15:50:39 +08:00
parent 5c019f48d7
commit efb4a0724b
5 changed files with 76 additions and 8 deletions

1
components.d.ts vendored
View File

@ -37,6 +37,7 @@ declare module 'vue' {
ElUpload: typeof import('element-plus/es')['ElUpload']
FloatingMenu: typeof import('./src/components/floatingMenu.vue')['default']
Login: typeof import('./src/components/login.vue')['default']
PageNotFound: typeof import('./src/components/PageNotFound.vue')['default']
Register: typeof import('./src/components/register.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']

View File

@ -0,0 +1,33 @@
<template>
<div class="mycontainer">
<el-result
icon="warning"
title="404请求资源不存在"
sub-title="抱歉!未找到页面"
>
<template #extra>
<el-button type="primary" @click="toHomePage">返回首页</el-button>
</template>
</el-result>
</div>
</template>
<script setup>
import { useRouter } from "vue-router";
const router = useRouter();
const toHomePage = ()=>{
router.replace('/index')
}
</script>
<style lang="scss" scoped>
.mycontainer{
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
</style>

View File

@ -45,6 +45,14 @@ const routes=[
isFullpage: true
}
},
{
path:'/:pathMatch(.*)*',
name:'NotFound',
component:()=>import('@/components/PageNotFound.vue'),
meta:{
isFullpage: true
}
},
];
const router = createRouter({
history:createWebHistory(),

View File

@ -20,7 +20,7 @@
<div class="start">
<el-button plain type="danger" @click="handleOpenStartPage">
{{
approval_status == 4 || !isLoggedIn ? "立即入驻" : "查看审核状态"
approval_status == -1 || approval_status == 4 || !isLoggedIn ? "立即入驻" : "查看审核状态"
}}
</el-button>
</div>
@ -38,7 +38,7 @@
<el-button
link
@click="handleUserInfoClick"
:title="approval_status == 4 ? '点击立即入驻' : '点击查看审核详情'"
:title="approval_status == -1 || approval_status == 4 ? '点击立即入驻' : '点击查看审核详情'"
>
{{ mobile }}
</el-button>
@ -101,7 +101,7 @@ const userStore = useUserStore();
// userStore
const isLoggedIn = ref(userStore.isLoggedIn);
const mobile = ref("");
const approval_status = ref(0);
const approval_status = ref(-1);
// token
onMounted(() => {
@ -144,15 +144,15 @@ const handleOpenStartPage = () => {
return;
}
if (approval_status.value == 4) {
if (approval_status.value == -1 || approval_status.value == 4) {
router.push({ name: "start" });
} else {
router.push({ name: "check" }); // check
router.push({ name: "check" });
}
};
const handleUserInfoClick = () => {
if (approval_status.value == 4) {
if (approval_status.value == -1 || approval_status.value == 4) {
router.push({ name: "start" });
} else {
router.push({ name: "check" });

View File

@ -84,7 +84,16 @@ import { useTransition } from "@vueuse/core";
import { ref, onMounted, defineEmits } from "vue";
import { Promotion, Download } from "@element-plus/icons-vue";
import { ElMessage } from 'element-plus'
import { getApproval_status } from "@/api/login";
import { useRouter } from "vue-router";
import { useUserStore } from "@/stores/userStore";
const router = useRouter();
const userStore = useUserStore();
const isLoggedIn = ref(userStore.isLoggedIn);
const approval_status = ref(-1);
const businessman = ref(0);
const product = ref(0);
const member = ref(0);
@ -93,8 +102,16 @@ const order = ref(0);
const emits = defineEmits(["open-register-form"]);
const openRegisterForm = () => {
console.log(1111);
if (!isLoggedIn.value) {
emits("open-register-form");
return;
}
if (approval_status.value == -1 || approval_status.value == 4) {
router.push({ name: "start" });
} else {
router.push({ name: "check" }); // check
}
};
const downAndroid = ()=>{
@ -125,6 +142,15 @@ const formatter = (value: number) => {
const formatter2 = (value: number) => {
return `${Math.round(value)}k+`;
};
onMounted(()=>{
getApproval_status().then((res) => {
if (res.code === 0 && res.status === 200) {
approval_status.value = res.data.approval_status;
console.log("res.data.approval_status", res.data.approval_status);
}
});
})
</script>
<style lang="scss" scoped>