diff --git a/src/components/home/t-calendar-birth.vue b/src/components/home/t-calendar-birth.vue
index 98195d5f..3bbc33a9 100644
--- a/src/components/home/t-calendar-birth.vue
+++ b/src/components/home/t-calendar-birth.vue
@@ -1,11 +1,13 @@
+<!-- todo ui 优化。结合 birth_calendar/birth_role 数据 -->
 <template>
   <div class="tcb-container">
     <img v-if="!isBirthday" src="/source/UI/empty.webp" alt="empty" />
     <img @click="toPost()" v-else src="/source/UI/act_birthday.png" alt="empty" class="active" />
-    <span>{{
-      isBirthday ? `今天是 ${cur.map((i) => i.name).join("、")} 的生日！` : "没有角色今天过生日哦~"
-    }}</span>
-    <span v-if="next.length > 0"
+    <span v-if="isBirthday" class="tcb-label" @click="toBirth('today')">
+      今天是{{ cur.map((i) => i.name).join("、") }}的生日哦~
+    </span>
+    <span v-else>今天没有角色过生日哦~</span>
+    <span v-if="next.length > 0" @click="toBirth('next')" class="tcb-label"
       >即将到来：{{ next[0].birthday[0] }}月{{ next[0].birthday[1] }}日</span
     >
     <span v-if="next.length > 0">{{ next.map((i) => i.name).join("、") }}</span>
@@ -34,6 +36,21 @@ onBeforeMount(async () => {
 async function toPost() {
   await router.push("/news/2");
 }
+
+function toBirth(type: "today" | "next") {
+  let dateStr;
+  if (type === "today") {
+    const date = new Date();
+    const month = date.getMonth() + 1;
+    const day = date.getDate();
+    dateStr = `${month}/${day}`;
+  } else {
+    const month = next.value[0].birthday[0];
+    const day = next.value[0].birthday[1];
+    dateStr = `${month}/${day}`;
+  }
+  router.push({ name: "留影叙佳期", params: { date: dateStr } });
+}
 </script>
 <style lang="css" scoped>
 .tcb-container {
@@ -61,4 +78,10 @@ span {
   margin-top: 10px;
   text-align: center;
 }
+
+.tcb-label {
+  flex-wrap: wrap;
+  cursor: pointer;
+  word-break: break-all;
+}
 </style>
diff --git a/src/pages/Archive/Birthday.vue b/src/pages/Archive/Birthday.vue
index 2ded9390..7e86bffd 100644
--- a/src/pages/Archive/Birthday.vue
+++ b/src/pages/Archive/Birthday.vue
@@ -4,12 +4,10 @@
       <div @click="toAct" class="ab-draw-act" title="前往网页活动">
         <img src="/source/UI/act_birthday.png" alt="archive_birthday_icon" class="side-icon" />
       </div>
-      <v-switch
-        class="ab-draw-switch"
-        v-model="isAether"
-        center-affix
-        :label="isAether ? '空' : '荧'"
-      />
+      <v-switch class="ab-draw-switch" v-model="isAether" />
+      {{ isAether ? "空" : "荧" }}
+      <v-btn @click="resetData" size="small" title="重置" v-if="canReset" icon="mdi-reload" />
+      <!-- todo 根据角色筛选 -->
     </div>
     <div class="ab-draw-grid">
       <div v-for="item in selectedItem" :key="item.op_id" class="ab-draw">
@@ -28,30 +26,58 @@
 </template>
 <script lang="ts" setup>
 import { onMounted, ref, watch, watchEffect } from "vue";
+import { useRoute, useRouter } from "vue-router";
 
+import showSnackbar from "../../components/func/snackbar";
 import ToArcBrith from "../../components/overlay/to-arcBrith.vue";
 import { ArcBirDraw } from "../../data";
 import TGClient from "../../utils/TGClient";
 
 const page = ref(1);
 const length = ref(0);
+const visible = ref(0);
+const renderItems = ref<TGApp.Archive.Birth.DrawItem[]>([]);
 const selectedItem = ref<TGApp.Archive.Birth.DrawItem[]>(ArcBirDraw);
 const current = ref<TGApp.Archive.Birth.DrawItem>();
 const isAether = ref<boolean>(false);
 const showOverlay = ref(false);
 
+const route = useRoute();
+const router = useRouter();
+const canReset = ref(false);
+
 watch(page, (val) => {
   const start = (val - 1) * 12;
   const end = start + 12;
-  selectedItem.value = ArcBirDraw.slice(start, end);
+  selectedItem.value = renderItems.value.slice(start, end);
 });
 
 watchEffect(() => {
-  selectedItem.value = ArcBirDraw.slice(0, 12);
+  selectedItem.value = renderItems.value.slice(0, 12);
+  visible.value = length.value > 5 ? 5 : length.value;
 });
 
 onMounted(() => {
-  length.value = Math.ceil(ArcBirDraw.length / 12);
+  const { date } = route.params;
+  let errLabel;
+  if (date) {
+    renderItems.value = ArcBirDraw.filter((item) => item.birthday.toString() === date);
+    errLabel = `没有找到生日为 ${date} 的角色数据`;
+    canReset.value = true;
+  } else {
+    renderItems.value = ArcBirDraw;
+    errLabel = "没有找到角色数据";
+  }
+  if (renderItems.value.length === 0) {
+    showSnackbar({
+      text: errLabel,
+      color: "error",
+    });
+    renderItems.value = ArcBirDraw;
+  }
+  length.value = Math.ceil(renderItems.value.length / 12);
+  visible.value = length.value > 5 ? 5 : length.value;
+  page.value = 1;
 });
 
 function showImg(item: TGApp.Archive.Birth.DrawItem) {
@@ -62,6 +88,10 @@ function showImg(item: TGApp.Archive.Birth.DrawItem) {
 async function toAct(): Promise<void> {
   await TGClient.open("birthday");
 }
+
+async function resetData(): Promise<void> {
+  await router.push({ name: "留影叙佳期" });
+}
 </script>
 <style lang="css" scoped>
 .ab-container {
diff --git a/src/plugins/Sqlite/modules/avatarBirth.ts b/src/plugins/Sqlite/modules/avatarBirth.ts
index 2a593d1a..ea927058 100644
--- a/src/plugins/Sqlite/modules/avatarBirth.ts
+++ b/src/plugins/Sqlite/modules/avatarBirth.ts
@@ -48,7 +48,7 @@ function getNextAvatarBirth(date?: [number, number]): TGApp.App.Character.WikiBr
     if (item.birthday[0] === 0) {
       continue;
     }
-    if (item.birthday[0] < month || (item.birthday[0] === month && item.birthday[1] < day)) {
+    if (item.birthday[0] < month || (item.birthday[0] === month && item.birthday[1] <= day)) {
       birthDateList.push(new Date(year + 1, item.birthday[0] - 1, item.birthday[1]));
     } else {
       birthDateList.push(new Date(year, item.birthday[0] - 1, item.birthday[1]));
diff --git a/src/router/modules/archive.ts b/src/router/modules/archive.ts
index 70ac1d51..58210afe 100644
--- a/src/router/modules/archive.ts
+++ b/src/router/modules/archive.ts
@@ -1,12 +1,12 @@
 /**
  * @file router/modules/archive.ts
  * @description 存档路由模块
- * @since Beta v0.4.4
+ * @since Beta v0.4.5
  */
 
 const archiveRoutes = [
   {
-    path: "/archive/birthday",
+    path: "/archive/birthday/:date?",
     name: "留影叙佳期",
     component: async () => await import("../../pages/Archive/Birthday.vue"),
   },