From 7fa5a279def6094c5e37f4a554f627aed904247b Mon Sep 17 00:00:00 2001
From: BTMuli <BT-Muli@outlook.com>
Date: Mon, 26 Jun 2023 23:12:16 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20=E8=A7=A3=E5=86=B3=E6=8E=A7?=
 =?UTF-8?q?=E5=88=B6=E5=8F=B0=E6=8A=A5=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/userAbyss/tua-detail-level.vue |  6 +++++-
 src/components/userAbyss/tua-detail-title.vue |  4 +---
 src/components/userAbyss/tua-overview.vue     | 10 +++++-----
 src/pages/User/Abyss.vue                      |  2 +-
 4 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/components/userAbyss/tua-detail-level.vue b/src/components/userAbyss/tua-detail-level.vue
index f43b5000..3021e96c 100644
--- a/src/components/userAbyss/tua-detail-level.vue
+++ b/src/components/userAbyss/tua-detail-level.vue
@@ -1,6 +1,10 @@
 <template>
   <div class="tud-dl-divider" />
-  <TuaDetailTitle :val="props.modelValue.winStar" :name="`第${props.modelValue.id}间`" />
+  <TuaDetailTitle
+    :val="props.modelValue.winStar"
+    :name="`第${props.modelValue.id}间`"
+    mode="level"
+  />
   <TuaDetailBattle :model-value="props.modelValue.upBattle" />
   <TuaDetailBattle :model-value="props.modelValue.downBattle" />
 </template>
diff --git a/src/components/userAbyss/tua-detail-title.vue b/src/components/userAbyss/tua-detail-title.vue
index de34061d..885c54fb 100644
--- a/src/components/userAbyss/tua-detail-title.vue
+++ b/src/components/userAbyss/tua-detail-title.vue
@@ -23,9 +23,7 @@ interface TuaDetailTitleProps {
   mode: "floor" | "level";
 }
 
-const props = withDefaults(defineProps<TuaDetailTitleProps>(), {
-  mode: "level",
-});
+const props = defineProps<TuaDetailTitleProps>();
 
 const getFont: ComputedRef<string> = computed(() => {
   return props.mode === "level" ? "var(--font-text)" : "var(--font-title)";
diff --git a/src/components/userAbyss/tua-overview.vue b/src/components/userAbyss/tua-overview.vue
index 7b190b5c..5f4db6b2 100644
--- a/src/components/userAbyss/tua-overview.vue
+++ b/src/components/userAbyss/tua-overview.vue
@@ -23,18 +23,18 @@
 </template>
 <script lang="ts" setup>
 // vue
+import { computed } from "vue";
 import TibAbyssOverview from "../itembox/tib-abyss-overview.vue";
 
 interface TAOProps {
   title: string;
   valText?: string | number;
   valIcons?: string;
-  iconNum: number;
+  multi4?: boolean;
 }
 
-const props = withDefaults(defineProps<TAOProps>(), {
-  iconNum: 1,
-});
+const props = defineProps<TAOProps>();
+const getIconNum = computed(() => (props.multi4 ? 4 : 1));
 </script>
 <style lang="css" scoped>
 .tuao-box {
@@ -70,6 +70,6 @@ const props = withDefaults(defineProps<TAOProps>(), {
 .tuao-val-icons {
   display: grid;
   column-gap: 10px;
-  grid-template-columns: repeat(v-bind(iconNum), 1fr);
+  grid-template-columns: repeat(v-bind(getIconNum), 1fr);
 }
 </style>
diff --git a/src/pages/User/Abyss.vue b/src/pages/User/Abyss.vue
index 56369fa9..ef3745c0 100644
--- a/src/pages/User/Abyss.vue
+++ b/src/pages/User/Abyss.vue
@@ -41,7 +41,7 @@
             <TuaOverview title="最多承伤" :val-icons="item.takeDamageRank" />
             <TuaOverview title="最强一击" :val-icons="item.damageRank" />
             <TuaOverview title="元素战技" :val-icons="item.normalSkillRank" />
-            <TuaOverview title="出战次数" :val-icons="item.revealRank" :icon-num="4" />
+            <TuaOverview title="出战次数" :val-icons="item.revealRank" :multi4="true" />
             <TuaOverview title="元素爆发" :val-icons="item.energySkillRank" />
           </div>
           <TSubLine>详情</TSubLine>