diff --git a/src/components/app/top-nameCard.vue b/src/components/app/top-nameCard.vue
index 3d65526a..306842cf 100644
--- a/src/components/app/top-nameCard.vue
+++ b/src/components/app/top-nameCard.vue
@@ -1,5 +1,10 @@
 <template>
-  <v-list class="top-nc-box" @click="emit('selected', props.data)" :class="{ grey: isGrey }">
+  <v-list
+    class="top-nc-box"
+    @click="emit('selected', props.data)"
+    :class="{ grey: !props.finish }"
+    :title.attr="props.data.name"
+  >
     <v-list-item :title="props.data.name">
       <template #subtitle>
         <span class="desc" :title="props.data.desc">{{ props.data.desc }}</span>
@@ -17,20 +22,18 @@
 <script lang="ts" setup>
 import { computed } from "vue";
 
-type TopNameCardProps = { data: TGApp.App.NameCard.Item; finish?: boolean };
+type TopNameCardProps = { data: TGApp.App.NameCard.Item; finish: boolean };
 type TopNameCardEmits = (e: "selected", v: TGApp.App.NameCard.Item) => void;
 
-const props = defineProps<TopNameCardProps>();
+const props = withDefaults(defineProps<TopNameCardProps>(), {
+  finish: true,
+});
 const emit = defineEmits<TopNameCardEmits>();
 
 const bgImage = computed<string>(() => {
   if (props.data.name === "原神·印象") return "none;";
   return `url("/WIKI/nameCard/bg/${props.data.name}.webp")`;
 });
-const isGrey = computed<boolean>(() => {
-  if (props.finish === undefined) return false;
-  return !props.finish;
-});
 </script>
 <style lang="scss" scoped>
 @use "@styles/github.styles.scss" as github-styles;