From 1ce8c1fddf30e1bf43b0eed5202ee6b39eb30a3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Tue, 1 Apr 2025 14:54:29 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E4=BC=98=E5=8C=96=E6=88=90?=
 =?UTF-8?q?=E5=B0=B1=E4=BF=A1=E6=81=AF=E5=B1=95=E7=A4=BA=E5=92=8C=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/userAchi/tua-achi-list.vue  |  7 ++--
 src/components/userAchi/tua-achi.vue       | 46 +++++++++++++---------
 src/components/userCombat/tuc-overview.vue |  2 +
 3 files changed, 32 insertions(+), 23 deletions(-)

diff --git a/src/components/userAchi/tua-achi-list.vue b/src/components/userAchi/tua-achi-list.vue
index b54ba841..5e1a4a88 100644
--- a/src/components/userAchi/tua-achi-list.vue
+++ b/src/components/userAchi/tua-achi-list.vue
@@ -54,13 +54,16 @@ type TuaAchiListEmits = {
 
 const props = defineProps<TuaAchiListProps>();
 const emits = defineEmits<TuaAchiListEmits>();
+
 const nameCard = ref<string>();
 const showNc = ref<boolean>(false);
 const showOverlay = ref<boolean>(false);
 const isFinish = ref<boolean>(false);
+
 const ncData = shallowRef<TGApp.App.NameCard.Item>();
 const achievements = shallowRef<Array<TGApp.Sqlite.Achievement.RenderAchi>>([]);
 const selectedAchi = shallowRef<TGApp.Sqlite.Achievement.RenderAchi>();
+
 const renderAchi = computed<Array<TGApp.Sqlite.Achievement.RenderAchi>>(() => {
   if (props.hideFin) return achievements.value.filter((a) => !a.isCompleted);
   return achievements.value;
@@ -183,8 +186,4 @@ function switchAchiInfo(next: boolean): void {
 .dark .card-arrow {
   filter: invert(11%) sepia(73%) saturate(11%) hue-rotate(139deg) brightness(97%) contrast(81%);
 }
-
-.unfinish {
-  filter: grayscale(1);
-}
 </style>
diff --git a/src/components/userAchi/tua-achi.vue b/src/components/userAchi/tua-achi.vue
index 62ce7b7e..030b8beb 100644
--- a/src/components/userAchi/tua-achi.vue
+++ b/src/components/userAchi/tua-achi.vue
@@ -11,11 +11,13 @@
         </v-icon>
       </div>
       <div class="achi-pre-info">
-        <span>
+        <div class="achi-pre-info__title">
           <span>{{ data.name }}</span>
-          <span v-if="data.progress !== 0">{{ data.progress }}</span>
-        </span>
-        <span>{{ data.description }}</span>
+          <span v-if="data.progress !== 0" class="achi-pre-info__progress">
+            {{ data.progress }}
+          </span>
+        </div>
+        <div class="achi-pre-info__desc">{{ data.description }}</div>
       </div>
     </div>
     <div class="achi-append">
@@ -155,24 +157,30 @@ async function setAchiStat(stat: boolean): Promise<void> {
   align-items: flex-start;
   justify-content: center;
   text-align: left;
-}
 
-.achi-pre-info :nth-child(1) {
-  display: flex;
-  align-items: flex-end;
-  column-gap: 4px;
-  font-family: var(--font-title);
-  font-size: 14px;
-}
+  &__title {
+    display: flex;
+    align-items: flex-end;
+    column-gap: 4px;
+    font-family: var(--font-title);
+    font-size: 14px;
+  }
 
-.achi-pre-info :nth-child(1) :nth-child(2) {
-  color: var(--tgc-blue-2);
-  font-size: 12px;
-}
+  &__desc {
+    font-size: 12px;
+    opacity: 0.8;
+  }
 
-.achi-pre-info :nth-child(2) {
-  font-size: 12px;
-  opacity: 0.8;
+  &__progress {
+    @include github-styles.github-tag-dark-gen(#00aeec);
+    padding: 0 4px;
+    border-radius: 4px;
+    height: 21px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 12px;
+  }
 }
 
 .achi-append-icon span {
diff --git a/src/components/userCombat/tuc-overview.vue b/src/components/userCombat/tuc-overview.vue
index d3f76f7e..9de3c3a1 100644
--- a/src/components/userCombat/tuc-overview.vue
+++ b/src/components/userCombat/tuc-overview.vue
@@ -23,6 +23,8 @@ const props = defineProps<TucOverviewProps>();
 
 function getTitle(): string {
   switch (props.data.difficulty_id) {
+    case 0:
+      return "未选择";
     case 1:
       return "轻简模式";
     case 2: