From 46efb8fa7dfb7f630f56493d12a33b9a088b7493 Mon Sep 17 00:00:00 2001
From: BTMuli <bt-muli@outlook.com>
Date: Sat, 31 Jan 2026 00:36:15 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E8=B0=83=E6=95=B4=E6=88=98?=
 =?UTF-8?q?=E7=BB=A9=E6=95=B0=E6=8D=AE=E6=80=BB=E8=A7=88=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=EF=BC=8C=E6=9B=B4=E4=B8=BA=E7=B4=A7=E5=87=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../userRecord/tur-overview-grid.vue          | 22 ++++++++++++-------
 .../userRecord/tur-overview-sub.vue           | 14 +++++++-----
 src/pages/User/Record.vue                     | 13 +++++------
 3 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/src/components/userRecord/tur-overview-grid.vue b/src/components/userRecord/tur-overview-grid.vue
index 85ad8d8e..42e1d145 100644
--- a/src/components/userRecord/tur-overview-grid.vue
+++ b/src/components/userRecord/tur-overview-grid.vue
@@ -1,7 +1,7 @@
 <template>
   <div v-if="!modelValue">暂无数据</div>
   <div v-else>
-    <div class="tur-og-box">
+    <div class="tur-og-box grid4">
       <TurOverviewSub
         :text="modelValue.activeDays"
         icon="/source/UI/userRecord.webp"
@@ -83,6 +83,8 @@
         icon="/icon/material/107028.webp"
         title="火神瞳"
       />
+    </div>
+    <div class="tur-og-box grid5">
       <TurOverviewSub :text="modelValue.luxuriousChest" title="华丽宝箱数" />
       <TurOverviewSub :text="modelValue.preciousChest" title="珍贵宝箱数" />
       <TurOverviewSub :text="modelValue.exquisiteChest" title="精致宝箱数" />
@@ -102,13 +104,17 @@ defineProps<{ modelValue: TGApp.Sqlite.Record.Stats }>();
   width: 100%;
   gap: 8px;
   grid-template-columns: repeat(3, 0.33fr);
-}
 
-.tur-og-box-3 {
-  display: grid;
-  width: 100%;
-  margin-bottom: 8px;
-  gap: 8px;
-  grid-template-columns: repeat(3, 1fr);
+  &.grid4 {
+    grid-template-columns: repeat(4, 0.25fr);
+  }
+
+  &.grid5 {
+    grid-template-columns: repeat(5, 0.2fr);
+  }
+
+  & + & {
+    margin-top: 8px;
+  }
 }
 </style>
diff --git a/src/components/userRecord/tur-overview-sub.vue b/src/components/userRecord/tur-overview-sub.vue
index 711e6717..be7dcdda 100644
--- a/src/components/userRecord/tur-overview-sub.vue
+++ b/src/components/userRecord/tur-overview-sub.vue
@@ -8,7 +8,7 @@
       </div>
       <slot name="val-text">{{ props.text }}</slot>
     </div>
-    <div class="tur-os-title">
+    <div class="tur-os-label">
       <slot name="title">{{ props.title }}</slot>
     </div>
   </div>
@@ -22,10 +22,10 @@ const props = defineProps<TAOProps>();
 </script>
 <style lang="css" scoped>
 .tur-os-box {
+  position: relative;
   display: flex;
   width: 100%;
   height: auto;
-  flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: 8px;
@@ -34,9 +34,13 @@ const props = defineProps<TAOProps>();
   background: var(--box-bg-1);
 }
 
-.tur-os-title {
+.tur-os-label {
+  position: absolute;
+  right: 2px;
+  bottom: 0;
   color: var(--box-text-4);
-  font-family: var(--font-title);
+  font-family: var(--font-text);
+  font-size: 12px;
 }
 
 .tur-os-text {
@@ -45,7 +49,7 @@ const props = defineProps<TAOProps>();
   justify-content: center;
   color: var(--tgc-yellow-1);
   column-gap: 4px;
-  font-family: var(--font-text);
+  font-family: var(--font-title);
   font-size: 18px;
   line-height: 24px;
 }
diff --git a/src/pages/User/Record.vue b/src/pages/User/Record.vue
index 6a71085a..2be048ce 100644
--- a/src/pages/User/Record.vue
+++ b/src/pages/User/Record.vue
@@ -51,20 +51,17 @@
       <TurRoleInfo :role="recordData.role" :uid="uidCur ?? 0" />
       <span class="sign">TeyvatGuide v{{ version }} | {{ recordData.updated }}</span>
     </div>
-    <PhCompCard>
-      <template #title>数据总览</template>
+    <PhCompCard title="数据总览">
       <TurOverviewGrid :model-value="recordData.stats" />
     </PhCompCard>
-    <PhCompCard>
-      <template #title>角色信息</template>
+    <PhCompCard title="角色信息">
       <TurAvatarGrid :model-value="recordData.avatars" />
     </PhCompCard>
-    <PhCompCard>
-      <template #title>世界探索</template>
+    <PhCompCard title="世界探索">
       <TurWorldGrid :worlds="recordData.worldExplore" />
     </PhCompCard>
-    <PhCompCard>
-      <template #title>尘歌壶</template>
+    <!-- TODO: 优化UI -->
+    <PhCompCard title="尘歌壶">
       <TurHomeGrid :model-value="recordData.homes" />
     </PhCompCard>
   </div>