50 lines
1.4 KiB
Vue
50 lines
1.4 KiB
Vue
<script setup lang="ts">
|
|
const route = useRoute()
|
|
const errorCode = route.params.code as string
|
|
const errorMessages: Record<string, { icon: string; title: string; message: string }> = {
|
|
'400': {
|
|
icon: '❓',
|
|
title: '哦豁!请求有点问题',
|
|
message: '请求似乎有点小问题,服务器君有点摸不着头脑呢!',
|
|
},
|
|
'403': {
|
|
icon: '🔒',
|
|
title: '哎呀!大门被锁住了',
|
|
message: '你没有权限访问这个角落,试试返回首页吧!',
|
|
},
|
|
'404': {
|
|
icon: '🌌',
|
|
title: '哎呀!你发现了超级基地的秘密角落',
|
|
message: '看起来你找的页面藏到了未知的时空层里!',
|
|
},
|
|
'500': {
|
|
icon: '🚀',
|
|
title: '糟糕!超级基地出了一点故障',
|
|
message: '服务器君正在努力解决问题,请稍等片刻!',
|
|
},
|
|
'502': {
|
|
icon: '👽',
|
|
title: '糟糕!基地信号被外星人拦截了',
|
|
message: '网络通道似乎遇到了问题,请稍后再试!',
|
|
},
|
|
default: {
|
|
icon: '⚠️',
|
|
title: '哦豁!此时遇到了点小麻烦',
|
|
message: '请求在穿越洋葱星球时迷路了,请返回首页重新探索!',
|
|
},
|
|
};
|
|
|
|
const errorContent = computed(() => errorMessages[errorCode] || errorMessages['default']);
|
|
|
|
onMounted(() => {
|
|
emitter.emit("startLoading", false)
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<alert :title="errorContent.title" :message="errorContent.message" :icon="errorContent.icon"/>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |