添加了一点新内容

src/App.vue

@@ -3,6 +3,7 @@ import {onMounted} from "vue";
 import emitter from "@/utils/mitt.ts";
 import NavBar from "@/components/nav/NavBar.vue";
 import {removeMobileTopColor, setMobileTopColor} from "@/utils/function.ts";
+import MainFooter from "@/components/footer/MainFooter.vue";
 
 const loadingElement = document.getElementById("loading") as HTMLDivElement;
 
@@ -21,52 +22,13 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="relative min-h-screen overflow-hidden bg-blue-50">
+  <div class="relative flex min-h-screen flex-col overflow-hidden bg-blue-50">
     <nav-bar/>
     <router-view/>
-    <footer class="mt-8 items-end pt-48 pb-8 min-h-48 bg">
+    <main-footer/>
-      <div class="container mx-auto px-4 md:px-0 xl:max-w-screen-xl">
-        <div class="grid-cols-4 gird min-h-48">
-          <div>
-            <div class="flex items-center gap-4">
-              <img alt="" class="h-20 w-20" src="@/assets/logo-c.png">
-              <div class="text-4xl leading-7 text-gray-500" style="font-family: BaconyScript, sans-serif">
-                <p>CantyOn_ion's</p>
-                <p>Index</p>
-              </div>
-            </div>
-            <p class="mt-20 leading-8 text-gray-500">&copy;2024 All rights reserved.</p>
-          </div>
-        </div>
-        <div class="flex flex-col text-gray-500 md:flex-row">
-          <a class="mr-4 hover:text-black" href="https://beian.miit.gov.cn/"
-             target="_blank">苏ICP备2022016243号-1</a>
-          <div>
-            <img alt="" class="inline-block w-4 pb-1" src="@/assets/beian.png"/>
-            <a class="hover:text-black" href="https://beian.mps.gov.cn/#/query/webSearch?code=32050602011641/"
-               target="_blank">苏公网安备32050602011641</a>
-          </div>
-        </div>
-        <!--        <div class="flex justify-center gap-4">-->
-        <!--          <a href="https://beian.miit.gov.cn/" target="_blank">-->
-        <!--            <img alt="苏ICP备2022016243号-1"-->
-        <!--                 src="https://img.shields.io/badge/%E8%8B%8FICP%E5%A4%87-2022016243%E5%8F%B7&#45;&#45;1-green?style=for-the-badge">-->
-        <!--          </a>-->
-        <!--          <a href="https://beian.mps.gov.cn/#/query/webSearch?code=32050602011641" rel="noreferrer" target="_blank">-->
-        <!--            <img alt="苏公网安备32050602011641"-->
-        <!--                 src="https://img.shields.io/badge/%E8%8B%8F%E5%85%AC%E7%BD%91%E5%AE%89%E5%A4%87-32050602011641-blue?style=for-the-badge&logo=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAAACQAAAAoCAYAAACWwljjAAAFQklEQVRYw%2B3Wa1BUdRjH8SOpMeg4WhZGpDIxiaaTeUFgWrxE4AVRQJGlRRAVIV1JkbgMgQLi5AVBQSVLSp0xlEAUKBEEFZCrCstll8UV2AV2YbmoGCrYv31%2BR95UL5pmmtamZ%2Bbz6rz5nvOc%2F5zDcX9jGLs%2FiTxuyvIlWYkRFeTHA2HVRFtzfhthTG5KuH96%2FvUgNlC4mMgyw1NJit%2FaAXLKazYje9xtIMZ%2FOZz50gW%2B9hcNkvoLEemEPbnrSP47QYwxQ5Ifv54RqzcXwFFvSyjaOhfavN8F7Y5ZcC%2FHH9JOB4LNa9Zw5YA76OZV8vIGMdZtSp7cDrtOnOavYiQhTAiPwi1AMtIQaqyngsxpBtw2GAGDKfaQmpUAa6xc4Vfp4UtEdzAMycsT9JQ1Tyctl%2F2eEkuTlYysF%2FrCUNxMqDEzgTqzSXBnpgnIHCzgjvEEuD52DLBr3rA1MAaWmNtB582wdtIljZ9G9D%2BIPU6aTxIPBjHCcXvg3CEh9K2fDLWvjIH6D6fwTIyheuwEqLUyhzLOALq8pkN%2BbgRw3HY4FBsMzxojZxP9DequLjAlQwVrbpIjhyIY4UYGQ%2FbuhdBqPxlk3Gion2IMDQIz3kJe%2FZS34I7uHkmD7VSQVgYDNyIAwsNCgfXGXoOBPjP9DKrOCAogA2etGTmTHAMcFwFZye7wS5QlVHGjoEw4A2qPCUBZ6AzNcQ5Q%2FYYRdO%2BYB1U3dsDwypLio4FJ3ECryIzWz6Cm3NgTRHN8HiPF6eHAGSbAdh8feFZkB7krzaHE9h2o85sDsiAbkIsXQMN%2Be2CtGyF0kzdwXCgU5%2B%2BD%2FouLQFV4OEU%2Fg2Q%2FiNuIPNaKkQflAWBqexxGjhLDVUcL6IwSQN3SGVChe6FJg9dckCx6D1QBliDZLIAxo7eA8eyv4KE0BJqTrHkZvnL9DJKn%2BTwmt0NsGGHZy2Dn3kQYfsQ53Hh4%2Fr4RNGz8AIpdzKEuaAF0RC2E57MmQgE3ATjuM%2FCPiANW7AqSfQJQ5vk362eQKmd3JrmXsoSRocpNIMnbB9zbceDIWUPmuHFQNMkISqa9DpUvNK6YDpW2s8DfwBK48WFQnhMCgzUBoLy0BrRVe5P0NWjPLdKUsJiR1tR1wGp8IeZwMgx%2FSrgRvjxuAziNcwLvyathLOcJHLflhRDYGRYFrNET2rJ5yvPLoas0tOj%2FoL8UpC4JHyTSU%2B6MNCS4gvKoAB5WiKG%2BMAQSg0WwLXQ%2FZJ3xhao0FxB5hYCbUwAEfhEF3Td8QP2dAOQnPwFlxgrolUVq9TPoaX%2BZB2nLc2Gk6awj1MU78HZZwJMid2Byb550JQwVO0NfxlJgdz14vWKeRAiK6DlQF28PLZdcoLNcBIO92bb6GTQ8Q%2F13RURT6tlH2gvXMlITLYD6uI%2Bgp2ozdF0VQXumM6ivCqGvahM8kPiDItkeGo8tB025GFQ3xFrSr06zI3%2F4yde7oN7m0sWk5eKWDqK5JWJQvAHac9ygq3Adr9gTNNc3QG85rzPfHe5%2F7wDtPwuhp%2FZz6CjyhaZzwi6ivfetHdH%2FoP77%2B3PJQOsuRnqkQdCa4wWqyx6gyecpL64GTaEX7ycXUJz4GJp1B4O0X%2FHg0Xp1tFV%2B8Ei1k6c5coHofxBrrzQinbKYo0SVJ%2Bwn6iurGHlY5gY911aDJnMFaHXXiDp9GQyvtKfUA9QFTtBZ7gPdit0tpFd9OpwwFmlA9D%2Fo9yNLDpxIKmI8PMnNSNtviCLVpYTITzrXEGWaq4qos0WgOPdpCenIF%2BeRrurjB4k0PXopYZG6gMg%2FD%2FgNBUxhAbSAmKMAAAAASUVORK5CYII%3D">-->
-        <!--          </a>-->
-        <!--        </div>-->
-      </div>
-    </footer>
   </div>
 </template>
 
-<style lang="scss" scoped>
+<style scoped>
-.bg {
+
-  background: url("@/assets/footer-bg.svg");
-  background-size: 100% auto;
-  background-color: white;
-  background-repeat: no-repeat;
-}
 </style>

src/components/alert/Alert.vue

@@ -1,13 +1,16 @@
 <script lang="ts" setup>
-
+defineProps<{
+  title: string
+  message: string
+}>()
 </script>
 
 <template>
-  <div class="flex min-h-screen items-center justify-center bg-blue-50">
+  <div class="flex flex-grow items-center justify-center bg-blue-50 min-h-96">
     <div class="w-full max-w-md rounded-lg bg-white p-6 text-center shadow-lg">
-      <h1 class="mb-4 text-4xl font-bold text-gray-800">建设中 🚧</h1>
+      <h1 class="mb-4 text-4xl font-bold text-gray-800">{{ title }}</h1>
       <p class="text-lg text-gray-600">
-        此页面正在建设中，请稍后再来查看更新。
+        {{ message }}
       </p>
     </div>
   </div>

src/components/card/FullScreenIntroCard.vue

@@ -44,7 +44,7 @@ const handleMouseMove = (event: MouseEvent) => {
   mouseY.value = -(event.clientY / window.innerHeight - 0.5) * 100
 }
 
-const debouncedMouseMove = debounce(handleMouseMove, 10)
+const debouncedMouseMove = debounce(handleMouseMove, 5)
 
 // 根据鼠标位置动态调整背景图像的位置
 const backgroundStyle = computed(() => ({

src/components/footer/MainFooter.vue

@@ -0,0 +1,40 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+  <footer class="mt-8 items-end pt-48 pb-8 min-h-48 bg">
+    <div class="container mx-auto px-4 md:px-0 xl:max-w-screen-xl">
+      <div class="grid-cols-4 gird min-h-48">
+        <div>
+          <div class="flex items-center gap-4">
+            <img alt="" class="h-20 w-20" src="@/assets/logo-c.png">
+            <div class="text-4xl leading-7 text-gray-500" style="font-family: BaconyScript, sans-serif">
+              <p>CantyOn_ion's</p>
+              <p>Index</p>
+            </div>
+          </div>
+          <p class="mt-20 leading-8 text-gray-500">&copy;2024 All rights reserved.</p>
+        </div>
+      </div>
+      <div class="flex flex-col text-gray-500 md:flex-row">
+        <a class="mr-4 hover:text-black" href="https://beian.miit.gov.cn/"
+           target="_blank">苏ICP备2022016243号-1</a>
+        <div>
+          <img alt="" class="inline-block w-4 pb-1" src="@/assets/beian.png"/>
+          <a class="hover:text-black" href="https://beian.mps.gov.cn/#/query/webSearch?code=32050602011641/"
+             target="_blank">苏公网安备32050602011641</a>
+        </div>
+      </div>
+    </div>
+  </footer>
+</template>
+
+<style scoped lang="scss">
+.bg {
+  background: url("@/assets/footer-bg.svg");
+  background-size: 100% auto;
+  background-color: white;
+  background-repeat: no-repeat;
+}
+</style>

src/components/nav/NavBar.vue

@@ -21,8 +21,8 @@ const littleWidget: Widget[] = [
   },
   {
     icon: ['fas', 'cloud'],
-    url: "/files/",
+    url: "/nas/",
-    title: "Tiny File Manager",
+    title: "Nextcloud",
   },
   {
     icon: ['fas', 'code-branch'],
@@ -157,8 +157,6 @@ onUnmounted(() => {
       </div>
     </div>
   </nav>
-  <!-- 用于隔开元素的 -->
-  <!--  <div class="mb-4 h-16 w-full"></div>-->
 </template>
 
 <style scoped>

src/router/index.ts

@@ -57,12 +57,31 @@ const router = createRouter({
       path: "/maintenance",
       component: () => import('@/views/error/MaintenanceView.vue'),
       name: 'maintenance'
+    },
+    {
+      name: 'error',
+      children: [
+        {
+          name: '404',
+          path: '/error/404',
+          component: () => import('@/views/error/NotFoundView.vue')
+        },
+        {
+          name: '502',
+          path: '/error/502',
+          component: () => import('@/views/error/BadGateway.vue')
+        }
+      ]
+    },
+    {
+      path: '/:catchAll(.*)',
+      redirect: '/error/404'
     }
   ]
 });
 
 router.beforeEach((to, _, next) => {
-  if (to.meta.maintenance === true && !import.meta.env.DEV) next({name: 'maintenance'})
+  if (to.meta.maintenance === true && import.meta.env.DEV) next({name: 'maintenance'})
   else next()
 })
 

src/views/error/BadGateway.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import Alert from "@/components/alert/Alert.vue";
+import {onMounted} from "vue";
+import emitter from "@/utils/mitt.ts";
+
+onMounted(() => {
+  emitter.emit('startLoading', false)
+})
+</script>
+
+<template>
+  <alert title="502 Bad Gateway 😵" message="上游服务器响应无效，这不是你的问题，稍后再来吧。"/>
+</template>
+
+<style scoped>
+
+</style>

src/views/error/MaintenanceView.vue

@@ -1,10 +1,15 @@
 <script lang="ts" setup>
+import {onMounted} from "vue";
+import emitter from "@/utils/mitt.ts";
+import Alert from "@/components/alert/Alert.vue";
 
-import UnderMaintenance from "@/components/alert/UnderMaintenance.vue";
+onMounted(() => {
+  emitter.emit('startLoading', false)
+})
 </script>
 
 <template>
-  <under-maintenance/>
+  <alert title="建设中 🚧" message="此页面正在建设中，请稍后再来查看更新。"/>
 </template>
 
 <style scoped>

src/views/error/NotFoundView.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import Alert from "@/components/alert/Alert.vue";
+import {onMounted} from "vue";
+import emitter from "@/utils/mitt.ts";
+
+onMounted(() => {
+  emitter.emit('startLoading', false)
+})
+</script>
+
+<template>
+  <alert title="404 Not Found 🫥" message="你要访问页面或资源不存在"/>
+</template>
+
+<style scoped>
+
+</style>

src/views/home/HomeView.vue

@@ -34,10 +34,12 @@ const activitiesData = computed((): IActivity<IContent>[] => {
   if (!recentActivities.value) return [];
   return recentActivities.value.map(item => {
     try {
-      return {
+      if (item.op_type === "commit_repo")
-        ...item,
+        return {
-        content: JSON.parse(item.content)
+          ...item,
-      }
+          content: JSON.parse(item.content)
+        }
+      else return null
     } catch (e) {
       return null
     }
@@ -76,12 +78,10 @@ onMounted(async () => {
 </script>
 
 <template>
+  <!--  个人介绍  -->
   <full-screen-intro-card/>
 
   <div class="container mx-auto mt-8 xl:max-w-screen-xl">
-    <!--  个人介绍  -->
-    <!--    <intro-card/>-->
-
     <!-- 博客部分 -->
     <section class="w-full px-4 sm:px-0">
       <!-- 标题部分 -->