eslint style fix

2025-01-13 21:51:37 +08:00 · 2025-01-13 21:51:37 +08:00 · 101f2e082b
commit 101f2e082b
parent 1946e3a10e
45 changed files with 1014 additions and 764 deletions
--- a/app.vue
+++ b/app.vue
@ -1,12 +1,13 @@
 <script setup lang="ts">
-const loading = ref<HTMLDivElement | null>(null)
-const {$mitt} = useNuxtApp()
+const loading = ref<HTMLDivElement | null>(null),
+  { $mitt } = useNuxtApp()

-$mitt.on('startLoading', on => {
+$mitt.on('startLoading', (on) => {
  if (on) {
    loading.value?.classList.remove('stop')
    removeMobileTopColor()
-  } else {
+  }
+  else {
    loading.value?.classList.add('stop')
    setMobileTopColor()
  }
@ -14,11 +15,14 @@ $mitt.on('startLoading', on => {
 </script>

 <template>
-  <div ref="loading" class="loading"></div>
+  <div
+    ref="loading"
+    class="loading"
+  />
  <div class="relative flex min-h-screen flex-col overflow-hidden bg-blue-50">
-    <nav-bar/>
-    <nuxt-page/>
-    <footer-main/>
-    <alert-notification/>
+    <nav-bar />
+    <nuxt-page />
+    <footer-main />
+    <alert-notification />
  </div>
 </template>
--- a/components/alert/Alert.vue
+++ b/components/alert/Alert.vue
@ -10,11 +10,18 @@ defineProps<{
  <div class="flex flex-grow flex-col items-center justify-center p-4 text-center min-h-[30rem]">
    <div class="w-full max-w-md rounded-xl bg-white p-6 shadow-lg">
      <div class="mb-4 text-6xl">
-        <span v-if="icon" class="block text-blue-500">{{ icon }}</span>
+        <span
+          v-if="icon"
+          class="block text-blue-500"
+        >{{ icon }}</span>
        <span v-else>❓</span>
      </div>
-      <h1 class="mb-2 text-2xl font-bold">{{ title }}</h1>
-      <p class="mb-6 text-gray-600">{{ message }}</p>
+      <h1 class="mb-2 text-2xl font-bold">
+        {{ title }}
+      </h1>
+      <p class="mb-6 text-gray-600">
+        {{ message }}
+      </p>
      <router-link
        to="/"
        class="inline-block rounded-lg bg-blue-500 px-6 py-2 text-white shadow transition duration-200 hover:bg-blue-600"
--- a/components/alert/Notification.vue
+++ b/components/alert/Notification.vue
@ -1,29 +1,28 @@
 <script lang="ts" setup>
-const {$mitt} = useNuxtApp()
-const notifications = ref<INotification[]>([]);
-const typeClasses = {
+const { $mitt } = useNuxtApp(),
+  notifications = ref<INotification[]>([]),
+  typeClasses = {
    success: 'bg-green-100 text-green-800 border border-green-400',
    error: 'bg-red-100 text-red-800 border border-red-400',
    warning: 'bg-yellow-100 text-yellow-800 border border-yellow-400',
    info: 'bg-blue-100 text-blue-800 border border-blue-400',
-};
+  },

-const addNotification = (notification: INotification) => {
-  notifications.value.push(notification);
+  addNotification = (notification: INotification) => {
+    notifications.value.push(notification)

    // 自动移除通知
    setTimeout(() => {
-    notifications.value.shift();
-  }, 5000);
+      notifications.value.shift()
+    }, 5000)
    console.log(1)
-
-};
+  }

 $mitt.on('eventBus', addNotification)

 onBeforeUnmount(() => {
-  $mitt.off('eventBus', addNotification);
-});
+  $mitt.off('eventBus', addNotification)
+})
 </script>

 <template>
@ -33,10 +32,12 @@ onBeforeUnmount(() => {
      :key="index"
      :class="[
        'p-4 rounded-lg shadow-lg transition-all duration-300',
-        typeClasses[notification.level]
+        typeClasses[notification.level],
      ]"
    >
-      <h3 class="text-lg font-bold">{{ notification.title }}</h3>
+      <h3 class="text-lg font-bold">
+        {{ notification.title }}
+      </h3>
      <p>{{ notification.message }}</p>
    </div>
  </div>
--- a/components/card/ArticleCard.vue
+++ b/components/card/ArticleCard.vue
@ -1,30 +1,35 @@
 <script lang="ts" setup>
-import {computed} from "vue";
-import {pos} from "ipx";
+import { computed } from 'vue'
+import { pos } from 'ipx'

 const props = defineProps<{
    post: IPost
-}>()
+  }>(),

-const pid = useAsyncData('pid', async () => (Math.floor(Math.random() * (7 - 1 + 1)) + 1).toString())
+  pid = useAsyncData('pid', async () => (Math.floor(Math.random() * (7 - 1 + 1)) + 1).toString()),

-const thumbUrl = computed(() => props.post.fields.thumb.value)
-
-const randomId = computed(() => pid.data.value!)
+  thumbUrl = computed(() => props.post.fields.thumb.value),

+  randomId = computed(() => pid.data.value!)
 </script>

 <template>
-  <nuxt-link :title="post.title"
+  <nuxt-link
+    :title="post.title"
    class="container relative overflow-hidden rounded-2xl bg-white transition-all duration-300 ease-in-out h-[31rem] hover:-translate-y-2 hover:cursor-pointer hover:shadow"
-       :to="{name: 'article-cid', params: {cid: post.cid}}">
+    :to="{ name: 'article-cid', params: { cid: post.cid } }"
+  >
    <!-- 图片 -->
    <div class="relative">
      <!-- 渐变 -->
-      <div class="absolute top-0 right-0 bottom-0 left-0 bg-gradient-to-t from-white"></div>
-      <img v-if="thumbUrl" :src="thumbUrl" alt=""
-           class="aspect-video w-full h-auto object-cover object-center">
-      <card-article-default-image :id="randomId"/>
+      <div class="absolute top-0 right-0 bottom-0 left-0 bg-gradient-to-t from-white" />
+      <img
+        v-if="thumbUrl"
+        :src="thumbUrl"
+        alt=""
+        class="aspect-video w-full h-auto object-cover object-center"
+      >
+      <card-article-default-image :id="randomId" />
    </div>
    <!-- 文字部分 -->
    <div class="px-5">
--- a/components/card/ArticleDefaultImage.vue
+++ b/components/card/ArticleDefaultImage.vue
@ -5,13 +5,41 @@ defineProps<{
 </script>

 <template>
-  <img src="~/assets/images/common/1.jpg" alt="" v-if="id === '1'"/>
-  <img src="~/assets/images/common/2.jpg" alt="" v-else-if="id === '2'"/>
-  <img src="~/assets/images/common/3.jpg" alt="" v-else-if="id === '3'"/>
-  <img src="~/assets/images/common/4.jpg" alt="" v-else-if="id === '4'"/>
-  <img src="~/assets/images/common/5.jpg" alt="" v-else-if="id === '5'"/>
-  <img src="~/assets/images/common/6.jpg" alt="" v-else-if="id === '6'"/>
-  <img src="~/assets/images/common/7.jpg" alt="" v-else-if="id === '7'"/>
+  <img
+    v-if="id === '1'"
+    src="~/assets/images/common/1.jpg"
+    alt=""
+  >
+  <img
+    v-else-if="id === '2'"
+    src="~/assets/images/common/2.jpg"
+    alt=""
+  >
+  <img
+    v-else-if="id === '3'"
+    src="~/assets/images/common/3.jpg"
+    alt=""
+  >
+  <img
+    v-else-if="id === '4'"
+    src="~/assets/images/common/4.jpg"
+    alt=""
+  >
+  <img
+    v-else-if="id === '5'"
+    src="~/assets/images/common/5.jpg"
+    alt=""
+  >
+  <img
+    v-else-if="id === '6'"
+    src="~/assets/images/common/6.jpg"
+    alt=""
+  >
+  <img
+    v-else-if="id === '7'"
+    src="~/assets/images/common/7.jpg"
+    alt=""
+  >
 </template>

 <style scoped>
--- a/components/card/ArticleDigestViewer.vue
+++ b/components/card/ArticleDigestViewer.vue
@ -1,22 +1,22 @@
 <script lang="ts" setup>
-import {computed, onMounted, onUnmounted, ref} from "vue";
+import { computed, onMounted, onUnmounted, ref } from 'vue'

-const currentPost = ref<IPost | null>(null)
+const currentPost = ref<IPost | null>(null),

-const onOpenPost = (e: IPost) => {
-  currentPost.value = e;
-}
+  onOpenPost = (e: IPost) => {
+    currentPost.value = e
+  },

-const onClosePost = () => {
+  onClosePost = () => {
    currentPost.value = null
-}
+  },

-const thumbUrl = computed(() => {
+  thumbUrl = computed(() => {
    if (currentPost.value && currentPost.value.fields.thumb.value) {
      return currentPost.value.fields.thumb.value
    }
    return getAssetURL(`${Math.floor(Math.random() * (7 - 1 + 1)) + 1}.jpg`)
-})
+  })

 onMounted(() => {
  emitter.on('openPost', onOpenPost)
@ -28,18 +28,29 @@ onUnmounted(() => {
 </script>

 <template>
-  <div v-if="currentPost" class="fixed top-0 right-0 bottom-0 left-0 z-20 bg-black bg-opacity-60">
+  <div
+    v-if="currentPost"
+    class="fixed top-0 right-0 bottom-0 left-0 z-20 bg-black bg-opacity-60"
+  >
    <div class="container mx-auto my-10 max-h-full overflow-hidden overscroll-y-contain rounded-3xl bg-white">
      <!-- 标题栏 -->
      <div class="relative w-full border-b-2 border-b-gray-200">
        <!-- 文章头图 -->
        <div class="min-h-52">
-          <img :src="thumbUrl" alt="" class="max-h-64 w-full object-cover object-center"/>
+          <img
+            :src="thumbUrl"
+            alt=""
+            class="max-h-64 w-full object-cover object-center"
+          >
        </div>
        <!-- 预览标题 -->
        <div
-            class="absolute top-0 right-0 left-0 h-12 truncate bg-black bg-opacity-60 pr-16 pl-8 text-white backdrop-blur-3xl py-1.5">
-          <span :title="currentPost.title" class="text-3xl font-bold">
+          class="absolute top-0 right-0 left-0 h-12 truncate bg-black bg-opacity-60 pr-16 pl-8 text-white backdrop-blur-3xl py-1.5"
+        >
+          <span
+            :title="currentPost.title"
+            class="text-3xl font-bold"
+          >
            文章预览 /
          </span>
        </div>
@ -48,11 +59,17 @@ onUnmounted(() => {
          class="absolute top-0 right-2 flex h-9 w-9 cursor-pointer items-center justify-center rounded-full text-white transition-all my-1.5 hover:bg-gray-200 hover:text-black"
          @click="onClosePost"
        >
-          <font-awesome-icon :icon="['fas', 'xmark']" class="p-2"/>
+          <font-awesome-icon
+            :icon="['fas', 'xmark']"
+            class="p-2"
+          />
        </div>
      </div>
      <!-- 正文 -->
-      <div class="container overflow-y-auto p-8 h-[60vh] preview" v-html="currentPost.digest"></div>
+      <div
+        class="container overflow-y-auto p-8 h-[60vh] preview"
+        v-html="currentPost.digest"
+      />
    </div>
  </div>
 </template>
--- a/components/card/CardTitle.vue
+++ b/components/card/CardTitle.vue
@ -7,12 +7,13 @@ defineProps<{

 <template>
  <div class="my-16 relative">
-      <h3 class="text-5xl font-bold text-blue-400 relative z-10">{{ title }}</h3>
+    <h3 class="text-5xl font-bold text-blue-400 relative z-10">
+      {{ title }}
+    </h3>
    <div class="h-12 w-auto text-5xl text-blue-200 absolute left-48 top-0 -translate-y-6">
-        <font-awesome-icon :icon="icon"/>
+      <font-awesome-icon :icon="icon" />
    </div>
  </div>
-
 </template>

 <style scoped>
--- a/components/card/FullScreenIntroCard.vue
+++ b/components/card/FullScreenIntroCard.vue
@ -1,48 +1,48 @@
 <script lang="ts" setup>
-import {computed, ref} from "vue";
+import { computed, ref } from 'vue'

 // 使用 ref 跟踪鼠标的 x 和 y 坐标
-const mouseX = ref(0)
-const mouseY = ref(0)
-const characterUrl = ref("")
+const mouseX = ref(0),
+  mouseY = ref(0),
+  characterUrl = ref(''),

-const typedString = ['Hello, Welcome to this site!^1000', '欢迎访问本网站！^1000']
-const littleWidget = [
+  typedString = ['Hello, Welcome to this site!^1000', '欢迎访问本网站！^1000'],
+  littleWidget = [
    {
      icon: ['fab', 'qq'],
-    url: "https://qm.qq.com/q/9fhtO8JJt0",
-    title: "QQ",
+      url: 'https://qm.qq.com/q/9fhtO8JJt0',
+      title: 'QQ',
    },
    {
      icon: ['fab', 'github-alt'],
-    url: "https://github.com/Aurora1949",
-    title: "Github",
+      url: 'https://github.com/Aurora1949',
+      title: 'Github',
    },
    {
      icon: ['fab', 'weibo'],
-    url: "https://weibo.com/u/7923648952",
-    title: "微博"
+      url: 'https://weibo.com/u/7923648952',
+      title: '微博',
    },
    {
      icon: ['fab', 'steam-symbol'],
-    url: "https://steamcommunity.com/id/cantyonion/",
-    title: "Steam"
-  }
-]
+      url: 'https://steamcommunity.com/id/cantyonion/',
+      title: 'Steam',
+    },
+  ],

-// 监听鼠标移动
-const handleMouseMove = (event: MouseEvent) => {
+  // 监听鼠标移动
+  handleMouseMove = (event: MouseEvent) => {
  // 根据窗口大小计算鼠标相对于中心位置的偏移比例
    mouseX.value = -(event.clientX / window.innerWidth - 0.5) * 100
    mouseY.value = -(event.clientY / window.innerHeight - 0.5) * 100
-}
+  },

-const debouncedMouseMove = debounce(handleMouseMove, 5)
+  debouncedMouseMove = debounce(handleMouseMove, 5),

-// 根据鼠标位置动态调整背景图像的位置
-const backgroundStyle = computed(() => ({
-  backgroundPosition: `${mouseX.value}px ${mouseY.value}px`
-}))
+  // 根据鼠标位置动态调整背景图像的位置
+  backgroundStyle = computed(() => ({
+    backgroundPosition: `${mouseX.value}px ${mouseY.value}px`,
+  }))

 onMounted(() => {
  characterUrl.value = getAssetURL('common/hoshino.png')
@ -50,36 +50,54 @@ onMounted(() => {
 </script>

 <template>
-  <div :style="backgroundStyle"
+  <div
+    :style="backgroundStyle"
    class="relative flex h-screen w-full items-center justify-center bg-blue-400 bg-fixed bg min-h-[40rem]"
    @mousemove="debouncedMouseMove"
  >
-    <div class="relative mx-4 w-full rounded-xl bg-white p-8 transition-transform duration-300 min-h-96
+    <div
+      class="relative mx-4 w-full rounded-xl bg-white p-8 transition-transform duration-300 min-h-96
                md:mx-0 md:max-w-screen-md"
    >
-      <p class="text-gray-500">你好！欢迎来到</p>
+      <p class="text-gray-500">
+        你好！欢迎来到
+      </p>
      <div class="relative mt-4 h-72 text-5xl text-blue-400 transition-all md:text-6xl lg:text-7xl">
-        <h1 style="font-family: BaconyScript,sans-serif">CantyOni_on's</h1>
-        <h1 class="font-bold">超级基地</h1>
+        <h1 style="font-family: BaconyScript,sans-serif">
+          CantyOni_on's
+        </h1>
+        <h1 class="font-bold">
+          超级基地
+        </h1>
        <div class="absolute -z-10 text-blue-100 top-[3px] left-[3px]">
-          <h1 class="" style="font-family: BaconyScript,sans-serif">CantyOni_on's</h1>
-          <h1 class="font-bold">超级基地</h1>
+          <h1
+            class=""
+            style="font-family: BaconyScript,sans-serif"
+          >
+            CantyOni_on's
+          </h1>
+          <h1 class="font-bold">
+            超级基地
+          </h1>
        </div>
      </div>

      <!-- TypedJS -->
      <div class="flex flex-row text-gray-500">
-        <vue-typed :auto-insert-css="true" :backSpeed="30"
+        <vue-typed
+          :auto-insert-css="true"
+          :back-speed="30"
          :loop="true"
-                   :showCursor="true"
+          :show-cursor="true"
          :strings="typedString"
-                   :typeSpeed="50"
+          :type-speed="50"
        />
      </div>

      <!-- 社交媒体组件 -->
      <div class="flex flex-row text-gray-500">
-        <widget-social-media-widget v-for="item in littleWidget"
+        <widget-social-media-widget
+          v-for="item in littleWidget"
          :key="item.url"
          :icon="item.icon"
          :title="item.title"
@ -89,14 +107,24 @@ onMounted(() => {
      </div>

      <!-- 人物背景 -->
-      <div class="invisible absolute top-0 -right-6 -bottom-6 opacity-0 transition-all
+      <div
+        class="invisible absolute top-0 -right-6 -bottom-6 opacity-0 transition-all
                  sm:visible sm:opacity-100 lg:-top-28 lg:-right-28 lg:-bottom-10"
      >
-        <img :src="characterUrl" alt="" class="float-right h-full" draggable="false"/>
+        <img
+          :src="characterUrl"
+          alt=""
+          class="float-right h-full"
+          draggable="false"
+        >
      </div>
    </div>
    <!-- 下箭头 -->
-    <font-awesome-icon :icon="['fas', 'chevron-down']" beat class="absolute bottom-12 h-auto w-6 text-white"/>
+    <font-awesome-icon
+      :icon="['fas', 'chevron-down']"
+      beat
+      class="absolute bottom-12 h-auto w-6 text-white"
+    />
  </div>
 </template>

--- a/components/card/GitCard.vue
+++ b/components/card/GitCard.vue
@ -1,66 +1,73 @@
 <script lang="ts" setup>
-import {computed} from "vue";
+import { computed } from 'vue'

 const props = defineProps<{
    commit: IActivity<IContent>
-}>()
+  }>(),

-const icon = computed(() => {
+  icon = computed(() => {
    switch (props.commit.op_type) {
-    case "merge_pull_request":
+      case 'merge_pull_request':
        return ['fas', 'code-merge']
-    case "create_repo":
+      case 'create_repo':
        return ['fab', 'git-alt']
-    case "commit_repo":
+      case 'commit_repo':
      default:
        return ['fas', 'code-commit']
    }
-})
+  }),

-const time = computed(() => timeDifference(props.commit.created))
+  time = computed(() => timeDifference(props.commit.created)),

-const timeDifference = (dateString: string): string => {
-  const targetDate = new Date(dateString);
-  const currentDate = new Date();
+  timeDifference = (dateString: string): string => {
+    const targetDate = new Date(dateString),
+      currentDate = new Date(),

-  const diffInMillis = currentDate.getTime() - targetDate.getTime();
+      diffInMillis = currentDate.getTime() - targetDate.getTime(),

-  const minutes = Math.floor(diffInMillis / (1000 * 60));
-  const hours = Math.floor(diffInMillis / (1000 * 60 * 60));
-  const days = Math.floor(diffInMillis / (1000 * 60 * 60 * 24));
-  const months = Math.floor(diffInMillis / (1000 * 60 * 60 * 24 * 30));
-  const years = Math.floor(diffInMillis / (1000 * 60 * 60 * 24 * 365));
+      minutes = Math.floor(diffInMillis / (1000 * 60)),
+      hours = Math.floor(diffInMillis / (1000 * 60 * 60)),
+      days = Math.floor(diffInMillis / (1000 * 60 * 60 * 24)),
+      months = Math.floor(diffInMillis / (1000 * 60 * 60 * 24 * 30)),
+      years = Math.floor(diffInMillis / (1000 * 60 * 60 * 24 * 365))

    if (minutes < 60) {
-    return `${minutes} 分钟前`;
-  } else if (hours < 24) {
-    return `${hours} 小时前`;
-  } else if (days < 30) {
-    return `${days} 天前`;
-  } else if (months < 12) {
-    return `${months} 个月前`;
-  } else {
-    return `${years} 年前`;
+      return `${minutes} 分钟前`
+    }
+    else if (hours < 24) {
+      return `${hours} 小时前`
+    }
+    else if (days < 30) {
+      return `${days} 天前`
+    }
+    else if (months < 12) {
+      return `${months} 个月前`
    }
-}

-const handleClick = () => {
+    return `${years} 年前`
+  },
+
+  handleClick = () => {
    window.open(props.commit.repo.html_url, '_self')
-}
-
+  }
 </script>

 <template>
-  <div class="group container relative flex h-36 w-full overflow-hidden rounded-2xl transition-all
+  <div
+    class="group container relative flex h-36 w-full overflow-hidden rounded-2xl transition-all
              hover:cursor-pointer hover:shadow-md"
    @click="handleClick"
  >
    <!-- 提交图标 -->
-    <div class="before:absolute relative before:top-0 before:right-0 before:bottom-0 flex h-36 before:w-2 w-36
+    <div
+      class="before:absolute relative before:top-0 before:right-0 before:bottom-0 flex h-36 before:w-2 w-36
                items-center justify-center bg-pink-300 before:bg-pink-300 text-5xl text-white before:opacity-0
                before:blur before:transition-all group-hover:before:opacity-100"
    >
-      <font-awesome-icon :icon="icon" class="transition-all group-hover:scale-110"/>
+      <font-awesome-icon
+        :icon="icon"
+        class="transition-all group-hover:scale-110"
+      />
    </div>
    <!-- 内容 -->
    <div class="flex-1 overflow-hidden bg-white p-4">
@ -73,7 +80,10 @@ const handleClick = () => {
      </span>

      <span class="absolute right-0 bottom-0 m-4 rounded bg-gray-300 px-2">
-        <font-awesome-icon :icon="['far', 'clock']" class="mr-1 text-sm"/>
+        <font-awesome-icon
+          :icon="['far', 'clock']"
+          class="mr-1 text-sm"
+        />
        {{ time }}
      </span>
    </div>
--- a/components/card/IntroCard.vue
+++ b/components/card/IntroCard.vue
@ -4,29 +4,29 @@ type Widget = {
  url: string
  title: string
 }
-// const welcomeWords = ['你好👋，很高兴认识你！']
+// Const welcomeWords = ['你好👋，很高兴认识你！']

 const littleWidget: Widget[] = [
  {
    icon: ['fab', 'qq'],
-    url: "tencent://message/?uin=1922471905&Site=&Menu=yes",
-    title: "QQ",
+    url: 'tencent://message/?uin=1922471905&Site=&Menu=yes',
+    title: 'QQ',
  },
  {
    icon: ['fab', 'github-alt'],
-    url: "https://github.com/Aurora1949",
-    title: "Github",
+    url: 'https://github.com/Aurora1949',
+    title: 'Github',
  },
  {
    icon: ['fab', 'weibo'],
-    url: "https://weibo.com/u/7923648952",
-    title: "微博"
+    url: 'https://weibo.com/u/7923648952',
+    title: '微博',
  },
  {
    icon: ['fab', 'steam-symbol'],
-    url: "https://steamcommunity.com/id/cantyonion/",
-    title: "Steam"
-  }
+    url: 'https://steamcommunity.com/id/cantyonion/',
+    title: 'Steam',
+  },
 ]
 </script>

@ -34,21 +34,32 @@ const littleWidget: Widget[] = [
  <div class="container my-16 flex w-full">
    <!-- 头像部分 -->
    <div class="hidden h-32 w-32 overflow-hidden rounded-full bg-white hover:animate-pulse sm:block">
-      <img alt="" src="https://q.qlogo.cn/g?b=qq&nk=1922471905&s=640">
+      <img
+        alt=""
+        src="https://q.qlogo.cn/g?b=qq&nk=1922471905&s=640"
+      >
    </div>

    <!--  文字部分  -->
    <div class="container flex flex-1 flex-col justify-between px-4 sm:px-8">
-      <div class="text-4xl">Jeffrey Hsu</div>
-      <div class="text-2xl text-gray-400">你好👋，很高兴认识你！</div>
-      <!--      <vue-typed-js :strings="['First text', 'Second Text']">-->
-      <!--        <h1 class="typing"></h1>-->
-      <!--      </vue-typed-js>-->
+      <div class="text-4xl">
+        Jeffrey Hsu
+      </div>
+      <div class="text-2xl text-gray-400">
+        你好👋，很高兴认识你！
+      </div>
+      <!--      <vue-typed-js :strings="['First text', 'Second Text']"> -->
+      <!--        <h1 class="typing"></h1> -->
+      <!--      </vue-typed-js> -->
      <div class="flex gap-4 text-xl">
-        <a v-for="item in littleWidget"
-           :key="item.url" :href=item.url :title=item.title
-           class="flex h-10 w-10 items-center justify-center rounded-full bg-green-400 text-white transition-all hover:scale-125">
-          <font-awesome-icon :icon="item.icon"/>
+        <a
+          v-for="item in littleWidget"
+          :key="item.url"
+          :href="item.url"
+          :title="item.title"
+          class="flex h-10 w-10 items-center justify-center rounded-full bg-green-400 text-white transition-all hover:scale-125"
+        >
+          <font-awesome-icon :icon="item.icon" />
        </a>
      </div>
    </div>
--- a/components/card/SectionCard.vue
+++ b/components/card/SectionCard.vue
@ -6,46 +6,89 @@ defineProps<{
  errMsg?: object
 }>()

-const emit = defineEmits(['reload'])
+const emit = defineEmits(['reload']),

-const handleReload = () => {
+  handleReload = () => {
    emit('reload')
-}
+  }
 </script>

 <template>
-  <div :class="{'justify-center': (empty || error)}" class="container flex">
+  <div
+    :class="{ 'justify-center': (empty || error) }"
+    class="container flex"
+  >
    <!-- 加载骨架 -->
-    <div v-if="loading" class="h-56 w-full text-2xl font-bold">
+    <div
+      v-if="loading"
+      class="h-56 w-full text-2xl font-bold"
+    >
      <slot name="skeleton">
        <div class="grid w-full grid-cols-1 gap-4 overflow-hidden sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
-          <div v-for="index of 3" :key="index" class="h-56 animate-pulse rounded-2xl bg-gray-200"></div>
+          <div
+            v-for="index of 3"
+            :key="index"
+            class="h-56 animate-pulse rounded-2xl bg-gray-200"
+          />
        </div>
      </slot>
    </div>
-    <div v-else class="w-full">
+    <div
+      v-else
+      class="w-full"
+    >
      <!-- 错误处理 -->
-      <div v-if="error" @click="handleReload">
+      <div
+        v-if="error"
+        @click="handleReload"
+      >
        <div class="flex items-center justify-center gap-8">
-          <p class="text-2xl text-gray-700 border-2 border-black py-2 px-8 rounded-full rounded-br-lg">载入错误</p>
-          <img class="h-32 w-auto relative" src="~/assets/images/common/plana_e.png" alt="">
+          <p class="text-2xl text-gray-700 border-2 border-black py-2 px-8 rounded-full rounded-br-lg">
+            载入错误
+          </p>
+          <img
+            class="h-32 w-auto relative"
+            src="~/assets/images/common/plana_e.png"
+            alt=""
+          >
        </div>
-        <div v-if="errMsg" class="bg-white mt-4 p-4 border border-dashed rounded-md" style="font-family: 'LXGW WenKai Mono', monospace">
+        <div
+          v-if="errMsg"
+          class="bg-white mt-4 p-4 border border-dashed rounded-md"
+          style="font-family: 'LXGW WenKai Mono', monospace"
+        >
          {{ errMsg }}
        </div>
-        <p class="text-right text-xs">(点击重试)</p>
+        <p class="text-right text-xs">
+          (点击重试)
+        </p>
      </div>
      <div v-else>
        <!-- 正式内容 -->
        <div v-if="empty">
-          <div v-if="empty" class="flex items-center justify-center gap-8" @click="handleReload">
-            <p class="text-2xl text-gray-700 border-2 border-black py-2 px-8 rounded-full rounded-br-lg">最近没有动态~</p>
-            <img class="h-32 w-auto relative" src="~/assets/images/common/plana_e.png" alt="">
+          <div
+            v-if="empty"
+            class="flex items-center justify-center gap-8"
+            @click="handleReload"
+          >
+            <p class="text-2xl text-gray-700 border-2 border-black py-2 px-8 rounded-full rounded-br-lg">
+              最近没有动态~
+            </p>
+            <img
+              class="h-32 w-auto relative"
+              src="~/assets/images/common/plana_e.png"
+              alt=""
+            >
          </div>
-          <p class="text-right text-xs">(点击重试)</p>
+          <p class="text-right text-xs">
+            (点击重试)
+          </p>
        </div>

-        <slot v-else name="default"/>
+        <slot
+          v-else
+          name="default"
+        />
      </div>
    </div>
  </div>
--- a/components/footer/Main.vue
+++ b/components/footer/Main.vue
@ -8,22 +8,41 @@
      <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/images/logo/c.png">
-            <div class="text-4xl leading-7 text-gray-500" style="font-family: BaconyScript, sans-serif">
+            <img
+              alt=""
+              class="h-20 w-20"
+              src="~/assets/images/logo/c.png"
+            >
+            <div
+              class="text-4xl leading-7 text-gray-500"
+              style="font-family: BaconyScript, sans-serif"
+            >
              <p>CantyOni_on's</p>
              <p>Index</p>
            </div>
          </div>
-          <p class="mt-20 leading-8 text-gray-500">&copy;2024 All rights reserved.</p>
+          <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>
+        <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/images/common/beian.png"/>
-          <a class="hover:text-black" href="https://beian.mps.gov.cn/#/query/webSearch?code=32050602011641/"
-             target="_blank">苏公网安备32050602011641</a>
+          <img
+            alt=""
+            class="inline-block w-4 pb-1"
+            src="~/assets/images/common/beian.png"
+          >
+          <a
+            class="hover:text-black"
+            href="https://beian.mps.gov.cn/#/query/webSearch?code=32050602011641/"
+            target="_blank"
+          >苏公网安备32050602011641</a>
        </div>
      </div>
    </div>
--- a/components/loader/LoaderView.vue
+++ b/components/loader/LoaderView.vue
@ -14,32 +14,33 @@
        d="M787.009641 293.979897c21.792821-0.183795 51.922051-0.459487 53.39241-0.722051a12.826256 12.826256 0 0 0 6.642872-3.610256l58.092308-57.737846a12.589949 12.589949 0 0 0 3.662769-6.603488c0.393846-2.376205-0.131282-4.424205-1.496615-5.802666l-67.872821-67.413334c-1.352205-1.378462-3.452718-1.890462-5.77641-1.522871a12.616205 12.616205 0 0 0-6.695385 3.610256l-58.092307 57.737846a12.826256 12.826256 0 0 0-3.675898 6.669128c-0.236308 1.575385 4.030359 35.997538 3.977846 57.803488-54.350769-40.539897-114.346667-68.096-184.595692-78.336V116.36841h25.915077c2.691282 0 10.660103-3.990974 12.524308-5.356307 2.021744-1.378462 8.388923-6.445949 8.388923-8.375795V7.286154c0-1.929846-6.419692-3.807179-8.310154-5.172513-1.929846-1.352205-9.885538-2.113641-12.603077-2.113641H419.052308c-2.743795 0-11.106462 0.774564-13.049436 2.139897-1.890462 1.352205-8.756513 3.21641-8.756513 5.146257v95.310769c0 1.969231 6.892308 7.036718 8.795897 8.402051 1.929846 1.339077 10.266256 5.369436 13.036308 5.369436h24.996103v81.657436C256.761436 227.511795 91.897436 400.108308 91.897436 608.518564 91.897436 837.618872 281.888821 1024 512.380718 1024 742.859487 1024 931.577436 837.632 931.577436 608.518564c-0.026256-125.702564-55.492923-238.316308-144.567795-314.538667z m-67.413333 146.116924L530.825846 627.698872a25.665641 25.665641 0 0 1-35.551179-0.590769 25.337436 25.337436 0 0 1-0.577641-35.341129l188.783589-187.602051a25.521231 25.521231 0 0 1 18.064411-7.443692 25.665641 25.665641 0 0 1 18.051282 7.443692 25.403077 25.403077 0 0 1 0 35.905641z"
        fill="#ffffff"
        p-id="1167"
-      ></path>
+      />
    </svg>
  </div>
 </template>

 <script lang="ts" setup>
-import {watch} from "vue";
+import { watch } from 'vue'

 const props = defineProps({
  loading: {
    type: Boolean,
    default: false,
  },
-});
+})

 watch(
  () => props.loading,
  (v) => {
-      const el: HTMLElement = document.querySelector("body") as HTMLElement;
+    const el: HTMLElement = document.querySelector('body') as HTMLElement
    if (v) {
-        el.classList.add("loading");
-      } else {
-        el.classList.remove("loading");
+      el.classList.add('loading')
    }
+    else {
+      el.classList.remove('loading')
    }
-);
+  },
+)
 </script>

 <style scoped>
--- a/components/markdown/Section.vue
+++ b/components/markdown/Section.vue
@ -5,10 +5,12 @@ defineProps<{
 </script>

 <template>
-  <div class="markdown-body" v-html="$mdRender.render(content)"/>
+  <div
+    class="markdown-body"
+    v-html="$mdRender.render(content)"
+  />
 </template>

-
 <style lang="scss">
 .markdown-body {
  font-family: "LXGW WenKai", sans-serif;
--- a/components/nav/NavBar.vue
+++ b/components/nav/NavBar.vue
@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import {computed, onMounted, onUnmounted, ref} from "vue";
+import { computed, onMounted, onUnmounted, ref } from 'vue'

 type Widget = {
  icon: string[]
@ -10,40 +10,40 @@ type Widget = {
 const props = defineProps({
    navColor: {
      default: false,
-    type: Boolean
-  }
-})
-// 使用 ref 跟踪是否滚动
-const scrolled = ref(false)
-const littleWidget: Widget[] = [
+      type: Boolean,
+    },
+  }),
+  // 使用 ref 跟踪是否滚动
+  scrolled = ref(false),
+  littleWidget: Widget[] = [
    {
      icon: ['fas', 'gauge'],
-    url: "/netdata/",
-    title: "Pi Dashboard",
+      url: '/netdata/',
+      title: 'Pi Dashboard',
    },
    {
      icon: ['fas', 'cloud'],
-    url: "/nas/",
-    title: "Nextcloud",
+      url: '/nas/',
+      title: 'Nextcloud',
    },
    {
      icon: ['fas', 'code-branch'],
-    url: "/git/",
-    title: "Git Repository"
-  }
-]
-//const logoUrl = getAssetURL("w.png")
-const logoType: string = "logo";
-const showLogo = computed(() => logoType === 'text')
-const isExpended = ref<boolean>(false)
-const route = useRoute()
+      url: '/git/',
+      title: 'Git Repository',
+    },
+  ],
+  // Const logoUrl = getAssetURL("w.png")
+  logoType: string = 'logo',
+  showLogo = computed(() => logoType === 'text'),
+  isExpended = ref<boolean>(false),
+  route = useRoute(),

-const entry = [
+  entry = [
    {
      title: '主页',
      icon: ['fas', 'home'],
      entry: [],
-    to: 'index'
+      to: 'index',
    },
    {
      title: '文章',
@ -52,12 +52,12 @@ const entry = [
        {
          title: '博客',
          url: false,
-        to: 'article'
+          to: 'article',
        },
        {
          title: '日记',
          url: false,
-        to: 'diary'
+          to: 'diary',
        },
      ],
    },
@ -68,12 +68,12 @@ const entry = [
        {
          title: '软件',
          url: false,
-        to: 'soft'
+          to: 'soft',
        },
        {
          title: '仓库',
          url: true,
-        to: 'https://cantyonion.site/git/'
+          to: 'https://cantyonion.site/git/',
        },
      ],
    },
@ -81,26 +81,26 @@ const entry = [
      title: '杂谈',
      icon: ['fas', 'chess-rook'],
      entry: [],
-    to: 'talk'
-  }
-]
+      to: 'talk',
+    },
+  ],

-const menuExpanded = () => {
+  menuExpanded = () => {
    isExpended.value = !isExpended.value
-}
+  },

-const menuClose = () => {
+  menuClose = () => {
    isExpended.value = false
-}
+  },

-// 监听 scroll 事件
-const handleScroll = () => {
+  // 监听 scroll 事件
+  handleScroll = () => {
    scrolled.value = window.scrollY > 0
-}
+  },

-const debouncedScroll = debounce(handleScroll, 10)
+  debouncedScroll = debounce(handleScroll, 10),

-const alwaysBlueBackground = computed(() => route.name !== 'index' || props.navColor)
+  alwaysBlueBackground = computed(() => route.name !== 'index' || props.navColor)

 // 在组件挂载和卸载时添加和移除事件监听
 onMounted(() => {
@ -113,55 +113,82 @@ onUnmounted(() => {
 </script>

 <template>
-  <nav :class="{'bg-transparent': !scrolled && !alwaysBlueBackground,
+  <nav
+    :class="{ 'bg-transparent': !scrolled && !alwaysBlueBackground,
              'bg-blue-400': scrolled || alwaysBlueBackground,
-                'shadow': scrolled}"
+              'shadow': scrolled }"
    class="fixed top-0 z-20 h-16 w-full text-white transition-all duration-300"
  >
    <div class="container mx-auto flex h-16 w-full items-center justify-between px-4 md:px-0 xl:max-w-screen-xl">
      <!-- 下拉菜单按钮 -->
-      <div class="flex h-8 w-10 items-center justify-center rounded-md border-gray-600 md:hidden"
+      <div
+        class="flex h-8 w-10 items-center justify-center rounded-md border-gray-600 md:hidden"
        @click="menuExpanded"
      >
-        <font-awesome-icon :icon="['fas', 'bars']" class="h-6"/>
+        <font-awesome-icon
+          :icon="['fas', 'bars']"
+          class="h-6"
+        />
      </div>
      <!--  Logo  -->
      <div class="absolute left-1/2 -translate-x-1/2 md:relative md:left-0 md:translate-x-0">
        <!-- 文字模式 -->
-        <div v-if="showLogo" class="h-full text-4xl min-w-16 logo py-3.5">
+        <div
+          v-if="showLogo"
+          class="h-full text-4xl min-w-16 logo py-3.5"
+        >
          <span>CantyOni_on's Index</span>
        </div>
        <!-- 图片模式 -->
-        <div v-else class="py-2">
-          <img src="~/assets/images/logo/w.png" alt="" class="h-12 w-12"/>
+        <div
+          v-else
+          class="py-2"
+        >
+          <img
+            src="~/assets/images/logo/w.png"
+            alt=""
+            class="h-12 w-12"
+          >
        </div>
      </div>

      <!--  Entry  -->
-      <div :class="{'h-screen opacity-100 visible': isExpended, 'h-0 opacity-0 invisible': !isExpended}"
+      <div
+        :class="{ 'h-screen opacity-100 visible': isExpended, 'h-0 opacity-0 invisible': !isExpended }"
        class="absolute top-full right-0 left-0 bg-white transition-all md:visible md:relative md:top-0 md:flex
               md:h-auto md:bg-transparent md:opacity-100"
      >
-        <nav-bar-entry-item v-for="item in entry" :key="item.title"
-                            :entry="item.entry" :icon="item.icon"
-                            :title="item.title" :to="item.to"
+        <nav-bar-entry-item
+          v-for="item in entry"
+          :key="item.title"
+          :entry="item.entry"
+          :icon="item.icon"
+          :title="item.title"
+          :to="item.to"
          @on-go="menuClose"
        />
      </div>

      <!--  快速跳转小组件  -->
      <div class="flex items-center justify-between gap-4 text-xl">
-        <a v-for="item in littleWidget"
-           :key="item.url" :href=item.url :title=item.title
-           class="transition-all hover:scale-125">
-          <font-awesome-icon :icon="item.icon"/>
+        <a
+          v-for="item in littleWidget"
+          :key="item.url"
+          :href="item.url"
+          :title="item.title"
+          class="transition-all hover:scale-125"
+        >
+          <font-awesome-icon :icon="item.icon" />
        </a>
      </div>
    </div>
  </nav>

  <!-- 用于隔开元素 -->
-  <div class="h-16 w-full" v-if="alwaysBlueBackground"></div>
+  <div
+    v-if="alwaysBlueBackground"
+    class="h-16 w-full"
+  />
 </template>

 <style scoped>
--- a/components/nav/NavBarEntryItem.vue
+++ b/components/nav/NavBarEntryItem.vue
@ -1,14 +1,14 @@
 <script lang="ts" setup>
 const router = useRouter()
 type Entry = {
-  title: string,
-  url: boolean,
-  to: string,
+  title: string
+  url: boolean
+  to: string
 }

 const emit = defineEmits<{
  (e: 'onGo'): void
-}>();
+}>()

 defineProps<{
  title: string
@ -18,25 +18,29 @@ defineProps<{
 }>()

 const onClick = (to: string | undefined, url: boolean) => {
-  if (to === undefined)
-    return
+  if (to === undefined) { return }

-  if (url)
-    window.open(to)
+  if (url) { window.open(to) }
  emit('onGo')
-  router.push({name: to})
+  router.push({ name: to })
 }
 </script>

 <template>
-  <div class="container relative w-full max-w-max flex-auto shrink-0 cursor-pointer group md:w-16 md:hover:w-full"
+  <div
+    class="container relative w-full max-w-max flex-auto shrink-0 cursor-pointer group md:w-16 md:hover:w-full"
    @click="onClick(to, false)"
  >
-    <div class="my-1 flex h-14 w-screen items-center rounded-md pr-4 pl-2 text-gray-500
+    <div
+      class="my-1 flex h-14 w-screen items-center rounded-md pr-4 pl-2 text-gray-500
             md:w-auto md:text-white md:group-hover:bg-gray-100 md:group-hover:bg-opacity-30"
    >
-      <font-awesome-icon :icon="icon" class="mx-2 h-5 w-5 md:h-8 md:w-8"/>
-      <span class="w-full max-w-max overflow-hidden text-lg transition-all duration-300 text-nowrap font-bold
+      <font-awesome-icon
+        :icon="icon"
+        class="mx-2 h-5 w-5 md:h-8 md:w-8"
+      />
+      <span
+        class="w-full max-w-max overflow-hidden text-lg transition-all duration-300 text-nowrap font-bold
               md:font-normal md:w-0 md:text-xl md:group-hover:w-full"
      >
        {{ title }}
@ -44,18 +48,20 @@ const onClick = (to: string | undefined, url: boolean) => {
    </div>

    <!-- 下拉菜单 -->
-    <div v-if="entry"
+    <div
+      v-if="entry"
      class="grid grid-cols-2 overflow-hidden transition-all duration-300 min-w-32 item md:invisible md:absolute
             md:top-full md:left-1/2 md:block md:rounded-xl md:bg-white md:opacity-0 md:shadow-md
             md:group-hover:visible md:group-hover:-translate-x-1/2 md:group-hover:opacity-100"
    >
-      <div v-for="item in entry" :key="item.title"
+      <div
+        v-for="item in entry"
+        :key="item.title"
        class="px-11 py-2 text-gray-500 text-md md:px-0 md:text-center md:text-lg md:hover:bg-gray-100"
        @click="onClick(item.to, item.url)"
      >
        {{ item.title }}
      </div>
-
    </div>
  </div>
 </template>
--- a/components/sponer/upyun.vue
+++ b/components/sponer/upyun.vue
@ -3,8 +3,15 @@
 </script>

 <template>
-  <a class="flex items-center justify-center" href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral">
-    本网站由<img :src="getAssetURL('upyun.png')" alt="又拍云" class="h-8 w-auto">提供CDN加速/云储存服务
+  <a
+    class="flex items-center justify-center"
+    href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral"
+  >
+    本网站由<img
+      :src="getAssetURL('upyun.png')"
+      alt="又拍云"
+      class="h-8 w-auto"
+    >提供CDN加速/云储存服务
  </a>
 </template>

--- a/components/widget/SocialMediaWidget.vue
+++ b/components/widget/SocialMediaWidget.vue
@ -8,9 +8,13 @@ defineProps<{

 <template>
  <div class="flex gap-4 text-xl">
-    <a :key="url" :href=url :title=title
-       class="flex items-center justify-center transition-all hover:scale-125">
-      <font-awesome-icon :icon="icon"/>
+    <a
+      :key="url"
+      :href="url"
+      :title="title"
+      class="flex items-center justify-center transition-all hover:scale-125"
+    >
+      <font-awesome-icon :icon="icon" />
    </a>
  </div>
 </template>
--- a/composables/function.ts
+++ b/composables/function.ts
@ -1,8 +1,7 @@
 export const getAssetURL = (image: string) => {
  // 参数一: 相对路径
  // 参数二: 当前路径的URL
-  if (import.meta.client)
-    return new URL(`../assets/images/${image}`, import.meta.url).href
+  if (import.meta.client) { return new URL(`../assets/images/${image}`, import.meta.url).href }
  return `/_nuxt/assets/images/${image}`
 }

@ -17,20 +16,20 @@ export const debounce = (fn: Function, delay: number) => {
 }

 export const setMobileTopColor = () => {
-  const lightMeta = document.createElement('meta');
-  lightMeta.setAttribute('name', 'theme-color');
-  lightMeta.setAttribute('media', '(prefers-color-scheme: light)');
-  lightMeta.setAttribute('content', '#60a5fa');
+  const lightMeta = document.createElement('meta')
+  lightMeta.setAttribute('name', 'theme-color')
+  lightMeta.setAttribute('media', '(prefers-color-scheme: light)')
+  lightMeta.setAttribute('content', '#60a5fa')

-  const darkMeta = document.createElement('meta');
-  darkMeta.setAttribute('name', 'theme-color');
-  darkMeta.setAttribute('media', '(prefers-color-scheme: dark)');
-  darkMeta.setAttribute('content', '#60a5fa');
+  const darkMeta = document.createElement('meta')
+  darkMeta.setAttribute('name', 'theme-color')
+  darkMeta.setAttribute('media', '(prefers-color-scheme: dark)')
+  darkMeta.setAttribute('content', '#60a5fa')

-  document.head.appendChild(lightMeta);
-  document.head.appendChild(darkMeta);
+  document.head.appendChild(lightMeta)
+  document.head.appendChild(darkMeta)
 }

 export const removeMobileTopColor = () => {
-  document.querySelectorAll('meta[name="theme-color"]').forEach(meta => meta.remove());
+  document.querySelectorAll('meta[name="theme-color"]').forEach(meta => meta.remove())
 }
--- a/composables/network.ts
+++ b/composables/network.ts
@ -1,28 +1,26 @@
 import type { AsyncData, UseFetchOptions } from '#app'

 export function requestCore<DataT>(url: string, options: UseFetchOptions<DataT>) {
-  // const config = useRuntimeConfig()
-  const {$mitt} = useNuxtApp()
+  // Const config = useRuntimeConfig()
+  const { $mitt } = useNuxtApp()
  return useFetch(url, {
-    baseURL: "https://cantyonion.site",
+    baseURL: 'https://cantyonion.site',
    retry: false,
    timeout: 3000,
    onRequest({ options }) {
-      let token: string = ""
+      let token: string = ''
      if (import.meta.client) {
-        token = localStorage.getItem("token") || ""
+        token = localStorage.getItem('token') || ''
      }
-      if (!options.headers.get('Authorization'))
-        options.headers.set('Authorization', `Bearer ${token}`)
+      if (!options.headers.get('Authorization')) { options.headers.set('Authorization', `Bearer ${token}`) }
    },
    onResponse({ response }) {
      // HTTP状态码2XX/3XX执行，否则不执行
      if (response.status < 200 || response.status >= 400) {
        console.error(`HTTP 错误: ${response.status}`)
-        return
      }
      // 业务code状态码判断
-      // if (response._data.code !== 200) {
+      // If (response._data.code !== 200) {
      //
      // }
    },
@ -30,10 +28,10 @@ export function requestCore<DataT>(url: string, options: UseFetchOptions<DataT>)
      $mitt.emit('eventBus', {
        level: 'error',
        title: `HTTP错误：${response.status}`,
-        message: response.statusText
+        message: response.statusText,
      })
    },
-    ...options
+    ...options,
  })
 }

@ -43,8 +41,7 @@ export function get<DataT, ErrorT>(url: string, options?: UseFetchOptions<DataT>
  return async (): Promise<DataT> => {
    if (result != null) {
      await result.refresh()
-      if (result.status.value === 'success')
-        return result.data.value
+      if (result.status.value === 'success') { return result.data.value }
      throw result.error
    }

--- a/error.vue
+++ b/error.vue
@ -3,33 +3,33 @@ import type { NuxtError } from '#app'
 import { setMobileTopColor } from '~/composables/function'

 const props = defineProps({
-  error: Object as () => NuxtError
-})
+    error: Object as () => NuxtError,
+  }),

-const {$mitt} = useNuxtApp()
+  { $mitt } = useNuxtApp(),

-const errorMessages: Record<string, { icon: string; title: string; message: string }> = {
-  '400': {
+  errorMessages: Record<string, { icon: string, title: string, message: string }> = {
+    400: {
      icon: '❓',
      title: '哦豁！请求有点问题',
      message: '请求似乎有点小问题，服务器君有点摸不着头脑呢！',
    },
-  '403': {
+    403: {
      icon: '🔒',
      title: '哎呀！大门被锁住了',
      message: '你没有权限访问这个角落，试试返回首页吧！',
    },
-  '404': {
+    404: {
      icon: '🌌',
      title: '哎呀！你发现了超级基地的秘密角落',
      message: '看起来你找的页面藏到了未知的时空层里！',
    },
-  '500': {
+    500: {
      icon: '🚀',
      title: '糟糕！超级基地出了一点故障',
      message: '服务器君正在努力解决问题，请稍等片刻！',
    },
-  '502': {
+    502: {
      icon: '👽',
      title: '糟糕！基地信号被外星人拦截了',
      message: '网络通道似乎遇到了问题，请稍后再试！',
@ -39,13 +39,13 @@ const errorMessages: Record<string, { icon: string; title: string; message: stri
      title: '哦豁！此时遇到了点小麻烦',
      message: '请求在穿越洋葱星球时迷路了，请返回首页重新探索！',
    },
-};
+  },

-const errorContent = computed(() => errorMessages[props.error!.statusCode] || errorMessages['default']);
+  errorContent = computed(() => errorMessages[props.error!.statusCode] || errorMessages.default)
 console.error(props.error)

 onMounted(() => {
-  $mitt.emit("startLoading", false)
+  $mitt.emit('startLoading', false)
  setMobileTopColor()
 })

@ -56,10 +56,14 @@ onUnmounted(() => {

 <template>
  <div class="relative flex min-h-screen flex-col overflow-hidden bg-blue-50">
-    <nav-bar :nav-color="true"/>
-    <alert :title="errorContent.title" :message="errorContent.message" :icon="errorContent.icon"/>
-    <footer-main/>
-    <alert-notification/>
+    <nav-bar :nav-color="true" />
+    <alert
+      :title="errorContent.title"
+      :message="errorContent.message"
+      :icon="errorContent.icon"
+    />
+    <footer-main />
+    <alert-notification />
  </div>
 </template>

--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@ -1,5 +1,7 @@
+import js from '@eslint/js'
 import withNuxt from './.nuxt/eslint.config.mjs'

-export default withNuxt({
-  files: ['**/*.ts', '**/*.tsx']
-})
+export default withNuxt([
+  js.configs.all,
+  { files: ['**/*.ts', '**/*.tsx'] },
+])
--- a/middleware/00.loading.global.ts
+++ b/middleware/00.loading.global.ts
@ -1,4 +1,4 @@
 export default defineNuxtRouteMiddleware(() => {
-  const {$mitt} = useNuxtApp()
+  const { $mitt } = useNuxtApp()
  $mitt.emit('startLoading', true)
 })
--- a/middleware/maintenance.global.ts
+++ b/middleware/maintenance.global.ts
@ -1,5 +1,4 @@
 export default defineNuxtRouteMiddleware((to, _) => {
-  if (to.meta.maintenance === true && import.meta.env.DEV)
-    return navigateTo('/error/maintenance')
+  if (to.meta.maintenance === true && import.meta.env.DEV) { return navigateTo('/error/maintenance') }
  return true
 })
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@ -1,12 +1,12 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config

-// see https://blog.csdn.net/m0_53022813/article/details/137379480
-import eslintPlugin from "vite-plugin-eslint";
+// See https://blog.csdn.net/m0_53022813/article/details/137379480
+import eslintPlugin from 'vite-plugin-eslint'

 export default defineNuxtConfig({
-  compatibilityDate: '2024-04-03',
-  devtools: { enabled: true },
  modules: ['@pinia/nuxt', '@pinia-plugin-persistedstate/nuxt', '@nuxt/image', '@nuxt/eslint'],
+  components: true,
+  devtools: { enabled: true },
  app: {
    head: {
      title: 'CANTYONION.SITE',
@ -18,50 +18,50 @@ export default defineNuxtConfig({
      ],
      link: [
        { rel: 'icon', href: '/favicon.png' },
-      ]
-    }
+      ],
+    },
  },
-  components: true,
  css: [
    '@fortawesome/fontawesome-svg-core/styles.css',
    'github-markdown-css/github-markdown-light.css',
-    '~/assets/css/main.scss'
+    '~/assets/css/main.scss',
  ],
+  runtimeConfig: {
+    public: {
+      gitApiKey: 'fb8aec429ea7d0a36f7238dbffda9d2d66c7b045',
+      baseURL: 'https://cantyonion.site',
+    },
+  },
+  build: {
+    transpile: ['@fortawesome/vue-fontawesome', 'vue3-typed-js', 'pinia-plugin-persistedstate'],
+  },
+  devServer: {
+    host: '0.0.0.0',
+  },
+  compatibilityDate: '2024-04-03',
+  vite: {
+    plugins: [
+      eslintPlugin({
+        include: ['**/*.ts', '**/*.vue'],
+      }),
+    ],
+    css: {
+      preprocessorOptions: {
+        scss: {
+          api: 'modern-compiler', // Or "modern"
+        },
+      },
+    },
+  },
  postcss: {
    plugins: {
      tailwindcss: {},
      autoprefixer: {},
    },
  },
-  build: {
-    transpile: ['@fortawesome/vue-fontawesome', 'vue3-typed-js', 'pinia-plugin-persistedstate']
-  },
-  vite: {
-    plugins: [
-      eslintPlugin({
-        include: ['**/*.ts', '**/*.vue']
-      })
-    ],
-    css: {
-      preprocessorOptions: {
-        scss: {
-          api: 'modern-compiler' // or "modern"
-        }
-      }
-    },
-  },
-  runtimeConfig: {
-    public: {
-      gitApiKey: 'fb8aec429ea7d0a36f7238dbffda9d2d66c7b045',
-      baseURL: 'https://cantyonion.site'
-    }
-  },
-  devServer: {
-    host: '0.0.0.0'
-  },
  eslint: {
    config: {
-      stylistic: true
-    }
-  }
+      stylistic: true,
+    },
+  },
 })
--- a/pages/[...default].vue
+++ b/pages/[...default].vue
@ -1,9 +1,8 @@
 <script setup lang="ts">
-navigateTo("/error/404")
+navigateTo('/error/404')
 </script>

 <template>
-  
 </template>

 <style scoped>
--- a/pages/article.vue
+++ b/pages/article.vue
@ -1,13 +1,13 @@
 <script setup lang="ts">
-const {$mitt} = useNuxtApp()
+const { $mitt } = useNuxtApp()

-onMounted( () => {
+onMounted(() => {
  $mitt.emit('startLoading', false)
 })
 </script>

 <template>
-  <nuxt-page/>
+  <nuxt-page />
 </template>

 <style scoped>
--- a/pages/article/[cid].vue
+++ b/pages/article/[cid].vue
@ -1,23 +1,23 @@
 <script setup lang="ts">
-const route = useRoute()
-const cid = route.params.cid as string
-const content = ref<IBlogResponse<IPostFull>>()
+const route = useRoute(),
+  cid = route.params.cid as string,
+  content = ref<IBlogResponse<IPostFull>>(),

-const getPost = get<IBlogResponse<IPostFull>, any>('/blog/index.php/api/post', {
+  getPost = get<IBlogResponse<IPostFull>, any>('/blog/index.php/api/post', {
    params: {
-    cid: cid,
-    md: false
-  }
-})
+      cid,
+      md: false,
+    },
+  }),

-const title = computed(() => content.value?.data.title || 'Can not see me... can not see me...')
-const text = computed(() => content.value?.data.text || '## Ops!')
-const date = computed(() => new Date((content.value?.data.date.timeStamp || 0) * 1000)
+  title = computed(() => content.value?.data.title || 'Can not see me... can not see me...'),
+  text = computed(() => content.value?.data.text || '## Ops!'),
+  date = computed(() => new Date((content.value?.data.date.timeStamp || 0) * 1000)
    .toISOString()
-    .split('T')[0]
-)
-const category = computed(() => content.value?.data.category || 'default')
-const url = computed(() => content.value?.data.url || '/error/404')
+    .split('T')[0],
+  ),
+  category = computed(() => content.value?.data.category || 'default'),
+  url = computed(() => content.value?.data.url || '/error/404')

 content.value = await getPost()
 </script>
@ -25,7 +25,9 @@ content.value = await getPost()
 <template>
  <section class="container m-4 mx-auto rounded-xl bg-white p-8 shadow-md lg:max-w-screen-lg">
    <div class="mb-4 border-b-2 border-dashed border-gray-200 pb-4">
-      <h1 class="text-center text-3xl font-bold">{{ title }}</h1>
+      <h1 class="text-center text-3xl font-bold">
+        {{ title }}
+      </h1>
      <div class="flex w-full items-center justify-center gap-4 text-gray-600">
        <!-- 日期 -->
        <div class="flex items-center gap-2">
@ -43,7 +45,7 @@ content.value = await getPost()
        </div>
      </div>
    </div>
-    <markdown-section :content="text"/>
+    <markdown-section :content="text" />
  </section>
 </template>

--- a/pages/article/index.vue
+++ b/pages/article/index.vue
@ -1,11 +1,11 @@
 <script setup lang="ts">
 definePageMeta({
-  maintenance: true
+  maintenance: true,
 })
 </script>

 <template>
-  <NuxtWelcome/>
+  <NuxtWelcome />
 </template>

 <style scoped>
--- a/pages/auth.vue
+++ b/pages/auth.vue
@ -3,7 +3,6 @@
 </script>

 <template>
-
 </template>

 <style scoped>
--- a/pages/diary.vue
+++ b/pages/diary.vue
@ -1,11 +1,11 @@
 <script setup lang="ts">
 definePageMeta({
-  maintenance: true
+  maintenance: true,
 })
 </script>

 <template>
-  <NuxtWelcome/>
+  <NuxtWelcome />
 </template>

 <style scoped>
--- a/pages/error/[code].vue
+++ b/pages/error/[code].vue
@ -1,18 +1,16 @@
 <script setup lang="ts">
-const route = useRoute()
-const errorCode = parseInt(route.params.code as string, 10)
+const route = useRoute(),
+  errorCode = parseInt(route.params.code as string, 10)

-if (import.meta.server)
+if (import.meta.server) {
  throw createError({
    statusCode: errorCode,
  })
-else
-  showError({statusCode: errorCode})
-
+}
+else { showError({ statusCode: errorCode }) }
 </script>

 <template>
-
 </template>

 <style scoped>
--- a/pages/error/maintenance.vue
+++ b/pages/error/maintenance.vue
@ -1,13 +1,17 @@
 <script setup lang="ts">
-const {$mitt} = useNuxtApp()
+const { $mitt } = useNuxtApp()

 onMounted(() => {
-  $mitt.emit("startLoading", false)
+  $mitt.emit('startLoading', false)
 })
 </script>

 <template>
-<alert icon="🚧" title="建设中" message="此页面正在建设中，请稍后再来查看更新。"/>
+  <alert
+    icon="🚧"
+    title="建设中"
+    message="此页面正在建设中，请稍后再来查看更新。"
+  />
 </template>

 <style scoped>
--- a/pages/index.vue
+++ b/pages/index.vue
@ -1,96 +1,98 @@
 <script lang="ts" setup>
-import {computed, onMounted, ref} from "vue";
+import { computed, onMounted, ref } from 'vue'

 type errObj = {
-  blog?: object,
+  blog?: object
  git?: object
 }

-const {$mitt} = useNuxtApp()
-const recentPosts = ref<IPost[] | null>(null);
-const recentActivities = ref<IActivity[] | null>(null);
-const isLoading = ref({
+const { $mitt } = useNuxtApp(),
+  recentPosts = ref<IPost[] | null>(null),
+  recentActivities = ref<IActivity[] | null>(null),
+  isLoading = ref({
    blog: true,
-  git: true
-});
-const isError = ref({
+    git: true,
+  }),
+  isError = ref({
    blog: false,
-  git: false
-});
-const errMsg = ref<errObj>({
+    git: false,
+  }),
+  errMsg = ref<errObj>({
    blog: undefined,
-  git: undefined
-})
+    git: undefined,
+  }),

-const config = useRuntimeConfig()
-const getBlogRecentPost = get<IBlogResponse<IPostsData>, any>('/blog/index.php/api/posts', {
+  config = useRuntimeConfig(),
+  getBlogRecentPost = get<IBlogResponse<IPostsData>, any>('/blog/index.php/api/posts', {
    params: {
-    showDigest: "excerpt",
-    limit: 100
-  }
-})
-const getActivity = get<IActivity[], any>('/git/api/v1/users/cantyonion/activities/feeds', {
+      showDigest: 'excerpt',
+      limit: 100,
+    },
+  }),
+  getActivity = get<IActivity[], any>('/git/api/v1/users/cantyonion/activities/feeds', {
    headers: {
-    Authorization: ` ${config.public.gitApiKey}`
+      Authorization: ` ${config.public.gitApiKey}`,
    },
    params: {
      limit: 10,
-  }
-})
+    },
+  }),

-const hasPosts = computed(() => (recentPosts.value ?? []).length > 0);
-const hasActivities = computed(() => (recentActivities.value ?? []).length > 0);
-const postsData = computed(() => {
-  if (!recentPosts.value) return [];
-  if (recentPosts.value.length > 4)
-    return recentPosts.value.slice(0, 4)
+  hasPosts = computed(() => (recentPosts.value ?? []).length > 0),
+  hasActivities = computed(() => (recentActivities.value ?? []).length > 0),
+  postsData = computed(() => {
+    if (!recentPosts.value) { return [] }
+    if (recentPosts.value.length > 4) { return recentPosts.value.slice(0, 4) }
    return recentPosts.value
-})
-const activitiesData = computed((): IActivity<IContent>[] => {
-  if (!Array.isArray(recentActivities.value)) return [];
-  return recentActivities.value.map(item => {
+  }),
+  activitiesData = computed((): IActivity<IContent>[] => {
+    if (!Array.isArray(recentActivities.value)) { return [] }
+    return recentActivities.value.map((item) => {
      try {
-      if (item.op_type === "commit_repo")
+        if (item.op_type === 'commit_repo') {
          return {
            ...item,
-          content: JSON.parse(item.content)
+            content: JSON.parse(item.content),
          }
-      else return null
-    } catch (e) {
+        }
+        return null
+      }
+      catch (e) {
        return null
      }
    }).filter(item => item !== null)
-})
+  }),

-const reloadPosts = async () => {
+  reloadPosts = async () => {
    try {
      isLoading.value.blog = true
      isError.value.blog = false
      const postData = await getBlogRecentPost()
-    if (postData !== null)
-      recentPosts.value = postData.data.dataSet
-  } catch (e) {
+      if (postData !== null) { recentPosts.value = postData.data.dataSet }
+    }
+    catch (e) {
      isError.value.blog = true
      errMsg.value.blog = e as object
    }
    finally {
      isLoading.value.blog = false
    }
-}
+  },

-const reloadActivities = async () => {
+  reloadActivities = async () => {
    try {
      isLoading.value.git = true
      isError.value.git = false
      recentActivities.value = await getActivity()
-  } catch (e) {
+    }
+    catch (e) {
      isError.value.git = true
      errMsg.value.git = e as object
    }
    finally {
      isLoading.value.git = false
    }
-}
+  }

 await Promise.allSettled([reloadPosts(), reloadActivities()])

@ -101,18 +103,31 @@ onMounted(() => {

 <template>
  <!--  个人介绍  -->
-  <card-full-screen-intro-card/>
+  <card-full-screen-intro-card />

  <div class="container mx-auto xl:max-w-screen-xl">
    <!-- 博客部分 -->
    <section class="w-full px-4 sm:px-0">
      <!-- 标题部分 -->
-      <card-title :icon="['fas', 'blog']"  title="最近文章"/>
+      <card-title
+        :icon="['fas', 'blog']"
+        title="最近文章"
+      />

-      <card-section-card :empty="!hasPosts" :error="isError.blog" :loading="isLoading.blog" @reload="reloadPosts" :err-msg="errMsg.blog">
-        <template v-slot:default>
+      <card-section-card
+        :empty="!hasPosts"
+        :error="isError.blog"
+        :loading="isLoading.blog"
+        :err-msg="errMsg.blog"
+        @reload="reloadPosts"
+      >
+        <template #default>
          <div class="grid w-full grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
-            <card-article-card v-for="item in postsData" :key="item.cid" :post="item"/>
+            <card-article-card
+              v-for="item in postsData"
+              :key="item.cid"
+              :post="item"
+            />
          </div>
        </template>
      </card-section-card>
@ -120,12 +135,25 @@ onMounted(() => {

    <!-- Git部分 -->
    <section class="my-4 w-full px-4 sm:px-0">
-      <card-title :icon="['fas', 'code']" title="最近活动"/>
+      <card-title
+        :icon="['fas', 'code']"
+        title="最近活动"
+      />

-      <card-section-card :empty="!hasActivities" :error="isError.git" :loading="isLoading.git" @reload="reloadActivities" :err-msg="errMsg.git">
-        <template v-slot:default>
+      <card-section-card
+        :empty="!hasActivities"
+        :error="isError.git"
+        :loading="isLoading.git"
+        :err-msg="errMsg.git"
+        @reload="reloadActivities"
+      >
+        <template #default>
          <div class="grid w-full grid-cols-1 gap-4 lg:grid-cols-2">
-            <card-git-card v-for="item in activitiesData" :key="item.id" :commit="item"/>
+            <card-git-card
+              v-for="item in activitiesData"
+              :key="item.id"
+              :commit="item"
+            />
          </div>
        </template>
      </card-section-card>
--- a/pages/soft.vue
+++ b/pages/soft.vue
@ -1,11 +1,11 @@
 <script setup lang="ts">
 definePageMeta({
-  maintenance: true
+  maintenance: true,
 })
 </script>

 <template>
-  <NuxtWelcome/>
+  <NuxtWelcome />
 </template>

 <style scoped>
--- a/pages/talk.vue
+++ b/pages/talk.vue
@ -1,11 +1,11 @@
 <script setup lang="ts">
 definePageMeta({
-  maintenance: true
+  maintenance: true,
 })
 </script>

 <template>
-  <NuxtWelcome/>
+  <NuxtWelcome />
 </template>

 <style scoped>
--- a/plugins/fontawsome.ts
+++ b/plugins/fontawsome.ts
@ -1,24 +1,24 @@
-import {library, config} from '@fortawesome/fontawesome-svg-core'
-import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
-import {faClock, faFolder} from '@fortawesome/free-regular-svg-icons'
+import { config, library } from '@fortawesome/fontawesome-svg-core'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faClock, faFolder } from '@fortawesome/free-regular-svg-icons'
 import {
-  faXmark,
+  faBars,
  faBlog,
-  faGauge,
-  faCodeBranch,
-  faCloud,
-  faChevronRight,
-  faCodeCommit,
-  faCode,
-  faHouse,
-  faPen,
  faBrush,
  faChessRook,
-  faBars,
  faChevronDown,
-  faLink
+  faChevronRight,
+  faCloud,
+  faCode,
+  faCodeBranch,
+  faCodeCommit,
+  faGauge,
+  faHouse,
+  faLink,
+  faPen,
+  faXmark,
 } from '@fortawesome/free-solid-svg-icons'
-import {faWeibo, faQq, faGithubAlt, faSteamSymbol} from '@fortawesome/free-brands-svg-icons'
+import { faGithubAlt, faQq, faSteamSymbol, faWeibo } from '@fortawesome/free-brands-svg-icons'

 // 因为默认添加了 nuxt会造成一些错误，所以不自动添加样式
 config.autoAddCss = false
@ -26,7 +26,7 @@ config.autoAddCss = false
 export default defineNuxtPlugin((nuxtApp) => {
  library.add(
    faClock, faXmark, faBlog, faGauge, faCodeBranch, faCloud, faWeibo, faQq, faGithubAlt, faSteamSymbol, faChevronRight,
-    faCodeCommit, faCode, faHouse, faPen, faBrush, faChessRook, faBars, faChevronDown, faFolder, faLink
+    faCodeCommit, faCode, faHouse, faPen, faBrush, faChessRook, faBars, faChevronDown, faFolder, faLink,
  )

  nuxtApp.vueApp.component('font-awesome-icon', FontAwesomeIcon)
--- a/plugins/markdown-it.ts
+++ b/plugins/markdown-it.ts
@ -1,6 +1,7 @@
 import md, { type Options } from 'markdown-it'
 // @ts-ignore
 import mm from 'markdown-it-mathjax3'
+
 const options: Options = {
  // Enable HTML tags in source
  html: true,
@ -13,7 +14,7 @@ const options: Options = {
  breaks: true,

  // CSS language prefix for fenced blocks. Can be
-    // useful for external highlighters.
+  // Useful for external highlighters.
  langPrefix: 'language-',

  // Autoconvert URL-like text to links
@ -24,16 +25,16 @@ const options: Options = {
  typographer: true,

  // Double + single quotes replacement pairs, when typographer enabled,
-    // and smartquotes on. Could be either a String or an Array.
+  // And smartquotes on. Could be either a String or an Array.
  //
  // For example, you can use '«»„“' for Russian, '„“‚‘' for German,
-    // and ['«\xA0', '\xA0»', '‹\xA0', '\xA0›'] for French (including nbsp).
+  // And ['«\xA0', '\xA0»', '‹\xA0', '\xA0›'] for French (including nbsp).
  quotes: '“”‘’',

  // Highlighter function. Should return escaped HTML,
-    // or '' if the source string is not changed and should be escaped externally.
+  // Or '' if the source string is not changed and should be escaped externally.
  // If result starts with <pre... internal wrapper is skipped.
-    highlight: function (/*str, lang*/) { return ''; }
+  highlight(/* Str, lang */) { return '' },
 }

 export default defineNuxtPlugin(() => {
@ -42,7 +43,7 @@ export default defineNuxtPlugin(() => {
    })
  return {
    provide: {
-            mdRender: render
-        }
+      mdRender: render,
+    },
  }
 })
--- a/plugins/mitt.ts
+++ b/plugins/mitt.ts
@ -6,14 +6,12 @@ type Events = {
  eventBus: INotification
 }

-
-
 export default defineNuxtPlugin(() => {
  const emitter = mitt<Events>()

  return {
    provide: {
-            mitt: emitter
-        }
+      mitt: emitter,
+    },
  }
 })
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@ -2,16 +2,15 @@ import type { Config } from 'tailwindcss'

 export default {
  content: [
-    "./components/**/*.{js,vue,ts}",
-    "./layouts/**/*.vue",
-    "./pages/**/*.vue",
-    "./plugins/**/*.{js,ts}",
-    "./app.vue",
-    "./error.vue",
+    './components/**/*.{js,vue,ts}',
+    './layouts/**/*.vue',
+    './pages/**/*.vue',
+    './plugins/**/*.{js,ts}',
+    './app.vue',
+    './error.vue',
  ],
  theme: {
    extend: {},
  },
  plugins: [],
 } satisfies Config
-
--- a/types/git.d.ts
+++ b/types/git.d.ts
@ -1,5 +1,5 @@
 declare interface IActivity<T = string> {
-  id: string;
+  id: string
  content: T
  op_type: string
  repo: {
@ -17,11 +17,11 @@ declare interface IContent {
 }

 declare interface ICommit {
-  Sha1: string,
-  Message: string,
-  AuthorEmail: string,
-  AuthorName: string,
-  CommitterEmail: string,
-  CommitterName: string,
+  Sha1: string
+  Message: string
+  AuthorEmail: string
+  AuthorName: string
+  CommitterEmail: string
+  CommitterName: string
  Timestamp: string
 }