From f890165894df3a4ef0fa147d1ec72e872ee3d690 Mon Sep 17 00:00:00 2001
From: BTMuli <bt-muli@outlook.com>
Date: Fri, 17 Oct 2025 17:50:27 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E5=BE=AE=E8=B0=83=E6=9C=88?=
 =?UTF-8?q?=E8=B0=95=E6=A8=A1=E5=BC=8Fui?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/userCombat/tuc-round.vue |  5 +++--
 src/components/userCombat/tuc-tile.vue  | 23 +++++++++++++++-----
 src/pages/User/Combat.vue               |  2 +-
 src/request/recordReq.ts                |  4 ++--
 src/types/Game/Combat.d.ts              | 29 ++++++++++++++++++++++++-
 5 files changed, 51 insertions(+), 12 deletions(-)

diff --git a/src/components/userCombat/tuc-round.vue b/src/components/userCombat/tuc-round.vue
index 6195f2e8..f92f3643 100644
--- a/src/components/userCombat/tuc-round.vue
+++ b/src/components/userCombat/tuc-round.vue
@@ -1,3 +1,4 @@
+<!-- 真境剧诗，单轮次卡片组件 -->
 <template>
   <div class="tucr-box">
     <div class="tucr-title">
@@ -57,8 +58,8 @@ function getIcon(): string {
   column-gap: 4px;
 
   img {
-    width: 30px;
-    aspect-ratio: 1;
+    height: 30px;
+    object-fit: contain;
   }
 
   .main {
diff --git a/src/components/userCombat/tuc-tile.vue b/src/components/userCombat/tuc-tile.vue
index 26e8eaf2..c1845a94 100644
--- a/src/components/userCombat/tuc-tile.vue
+++ b/src/components/userCombat/tuc-tile.vue
@@ -1,18 +1,29 @@
+<!-- 真境剧诗概况卡片组件 -->
 <template>
   <div class="tuct-box">
     <div class="tuct-title">
-      <slot name="title">{{ title }}</slot>
+      <slot name="title">{{ props.title }}</slot>
     </div>
-    <div class="tuct-text" v-if="!Array.isArray(val)">
-      <slot name="text">{{ val }}</slot>
+    <div class="tuct-text" v-if="!Array.isArray(props.val)">
+      <slot name="text">{{ props.val }}</slot>
     </div>
     <div class="tuct-icons" v-else>
-      <img v-for="(v, idx) in val" :key="idx" :src="`/icon/combat/star_${v}.webp`" :alt="`${v}`" />
+      <template v-for="(v, idx) in props.val" :key="idx">
+        <img
+          v-if="idx < 10"
+          :src="`/icon/combat/star_${v}.webp`"
+          :alt="`${v}`"
+          :title="`第${idx + 1}幕`"
+        />
+        <img v-else :src="`/icon/combat/tarot_${v}.webp`" :alt="`${v}`" :title="`圣牌${idx - 9}`" />
+      </template>
     </div>
   </div>
 </template>
 <script lang="ts" setup>
-defineProps<{ title: string; val: string | number | Array<number> }>();
+type TucTileProps = { title: string; val: string | number | Array<number> };
+
+const props = defineProps<TucTileProps>();
 </script>
 <style lang="css" scoped>
 .tuct-box {
@@ -47,7 +58,7 @@ defineProps<{ title: string; val: string | number | Array<number> }>();
 
   img {
     height: 30px;
-    aspect-ratio: 1;
+    object-fit: contain;
   }
 }
 </style>
diff --git a/src/pages/User/Combat.vue b/src/pages/User/Combat.vue
index 82d89874..76f33ca3 100644
--- a/src/pages/User/Combat.vue
+++ b/src/pages/User/Combat.vue
@@ -1,4 +1,4 @@
-<!-- TODO: 重构UI -->
+<!-- 真境剧诗页面 TODO: 重构UI -->
 <template>
   <v-app-bar>
     <template #prepend>
diff --git a/src/request/recordReq.ts b/src/request/recordReq.ts
index bc1551b9..47884666 100644
--- a/src/request/recordReq.ts
+++ b/src/request/recordReq.ts
@@ -84,12 +84,12 @@ async function index(
  * @since Beta v0.6.3
  * @param {TGApp.App.Account.Cookie} cookie Cookie
  * @param {TGApp.Sqlite.Account.Game} user 用户
- * @returns {Promise<TGApp.Game.Combat.Combat[] | TGApp.BBS.Response.Base|false>}
+ * @returns {Promise<Array<TGApp.Game.Combat.Combat> | TGApp.BBS.Response.Base|false>}
  */
 async function roleCombat(
   cookie: TGApp.App.Account.Cookie,
   user: TGApp.Sqlite.Account.Game,
-): Promise<TGApp.Game.Combat.Combat[] | TGApp.BBS.Response.Base | false> {
+): Promise<Array<TGApp.Game.Combat.Combat> | TGApp.BBS.Response.Base | false> {
   const ck = {
     account_id: cookie.account_id,
     cookie_token: cookie.cookie_token,
diff --git a/src/types/Game/Combat.d.ts b/src/types/Game/Combat.d.ts
index fa204e8a..2640211c 100644
--- a/src/types/Game/Combat.d.ts
+++ b/src/types/Game/Combat.d.ts
@@ -21,8 +21,14 @@ declare namespace TGApp.Game.Combat {
    * @property {boolean} is_unlock 是否解锁
    * @property {Record<string,string>} links 相关链接
    * @property {Array<Combat>} data 挑战数据
+   * @property {TarotState} tarot_card_state 塔罗牌状态
    */
-  type FullData = { is_unlock: boolean; links: Record<string, string>; data: Array<Combat> };
+  type FullData = {
+    is_unlock: boolean;
+    links: Record<string, string>;
+    data: Array<Combat>;
+    tarot_card_state: TarotState;
+  };
 
   /**
    * @description 角色数据
@@ -252,4 +258,25 @@ declare namespace TGApp.Game.Combat {
     start_date_time: TGApp.Game.Base.DateTime;
     end_date_time: TGApp.Game.Base.DateTime;
   };
+
+  /**
+   * @description 塔罗牌状态
+   * @since Beta v0.8.3
+   * @interface TarotState
+   * @property {number} total_num 总数
+   * @property {number} curr_num 当前数
+   * @property {Array<TarotCard>} list 卡片列表
+   */
+  type TarotState = { total_num: number; curr_num: number; list: Array<TarotCard> };
+
+  /**
+   * @description 塔罗牌
+   * @interface TarotCard
+   * @since Beta v0.8.3
+   * @property {string} icon 图标
+   * @property {string} name 名称
+   * @property {boolean} is_unlocked 是否解锁
+   * @property {number} unlock_num 解锁数
+   */
+  type TarotCard = { icon: string; name: string; is_unlocked: boolean; unlock_num: number };
 }