opt: 抽离 session 验证函数，修正前端路由覆盖 bug

web/src/views/404.vue

@@ -1,17 +1,40 @@
 <template>
-  <div>{{ title }}</div>
+  <div class="page-404" :style="{ height: winHeight + 'px' }">
+    <div class="inner">
+      <h1>404</h1>
+      <h2>饶了地球一圈，还是没有找到您要的页面</h2>
+    </div>
+  </div>
 </template>
 
-<script>
-import { defineComponent } from "vue"
+<script setup>
+import {ref} from "vue"
 
-export default defineComponent({
-  name: 'NotFound',
-  data () {
-    return {
-      title: "404 Page",
-
-    }
-  },
-})
+const winHeight = ref(window.innerHeight)
 </script>
+
+<style lang="stylus" scoped>
+.page-404 {
+  display: flex;
+  justify-content: center;
+  background-color: #282c34;
+
+  .inner {
+    text-align center
+
+    h1 {
+      color: #202020;
+      font-size: 120px;
+      font-weight: bold;
+      letter-spacing: 0.1em;
+      text-shadow: -1px -1px 1px #111111, 2px 2px 1px #363636;
+    }
+
+    h2 {
+      color #ffffff;
+      font-weight: bold;
+    }
+  }
+
+}
+</style>