From da4a095618f4988708339239d267745c4859f493 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Mon, 11 Nov 2024 15:09:21 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20=E7=9C=9F=E5=A2=83=E5=89=A7?=
 =?UTF-8?q?=E8=AF=97=E9=80=82=E9=85=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

close #113
---
 public/icon/star/combat0.webp               | Bin 0 -> 1040 bytes
 public/icon/star/combat1.webp               | Bin 0 -> 2286 bytes
 public/source/UI/combatCrown.webp           | Bin 0 -> 1572 bytes
 public/source/UI/userCombat.webp            | Bin 0 -> 2502 bytes
 src/components/userCombat/tuc-avatars.vue   |  47 +++
 src/components/userCombat/tuc-buffs.vue     |  68 ++++
 src/components/userCombat/tuc-cards.vue     |  50 +++
 src/components/userCombat/tuc-fight.vue     |  88 ++++
 src/components/userCombat/tuc-overview.vue  |  55 +++
 src/components/userCombat/tuc-round.vue     |  86 ++++
 src/components/userCombat/tuc-sub.vue       |  32 ++
 src/components/userCombat/tuc-tile.vue      |  62 +++
 src/pages/User/Abyss.vue                    |  29 +-
 src/pages/User/Combat.vue                   | 424 ++++++++++++++++++++
 src/plugins/Hutao/utils/combatUtil.ts       |  14 +-
 src/plugins/Sqlite/modules/userCombat.ts    | 159 ++++++++
 src/plugins/Sqlite/sql/createTable.sql      |  17 +-
 src/plugins/Sqlite/utils/transUserCombat.ts |  27 ++
 src/router/modules/user.ts                  |   7 +-
 src/types/Game/Combat.d.ts                  |   2 +-
 src/types/Sqlite/Combat.d.ts                |  61 +++
 src/utils/dataBS.ts                         |  13 +-
 src/web/request/TGRequest.ts                |   4 +-
 23 files changed, 1227 insertions(+), 18 deletions(-)
 create mode 100644 public/icon/star/combat0.webp
 create mode 100644 public/icon/star/combat1.webp
 create mode 100644 public/source/UI/combatCrown.webp
 create mode 100644 public/source/UI/userCombat.webp
 create mode 100644 src/components/userCombat/tuc-avatars.vue
 create mode 100644 src/components/userCombat/tuc-buffs.vue
 create mode 100644 src/components/userCombat/tuc-cards.vue
 create mode 100644 src/components/userCombat/tuc-fight.vue
 create mode 100644 src/components/userCombat/tuc-overview.vue
 create mode 100644 src/components/userCombat/tuc-round.vue
 create mode 100644 src/components/userCombat/tuc-sub.vue
 create mode 100644 src/components/userCombat/tuc-tile.vue
 create mode 100644 src/pages/User/Combat.vue
 create mode 100644 src/plugins/Sqlite/modules/userCombat.ts
 create mode 100644 src/plugins/Sqlite/utils/transUserCombat.ts
 create mode 100644 src/types/Sqlite/Combat.d.ts

diff --git a/public/icon/star/combat0.webp b/public/icon/star/combat0.webp
new file mode 100644
index 0000000000000000000000000000000000000000..2f52fc46556db874a8c6088412456a11cc033400
GIT binary patch
literal 1040
zcmV+r1n>J&Nk&Ep1ONb6MM6+kP&il$0000G0000#002J#06|PpNV5X~00E!`ZT}L<
z;VT$+BP0K~j8FHh`?B$jF_T*F>OcRu+r-`Nm~e^<ad&qksT{LeJt-S^C2kb;I{-gu
zqQ{7s0PTNI0Qg5c%@=>I8;F8x$-p+ABqI8JI@l%H`GC0{W{P-;Qa_)c(%e3GxVa2_
zN~vlCeE?pi%&#jDbC*de<%|-TQc9)NUcjSKR<u!|S0;x`(4mw%@W3(MxSH5Lu+O1~
zN-538?UmA|A454^v@T4vH*TS-Egb9Cr~j6R7NUFMGAZXa%-qfdbX{Ldxr0^!Fq?}*
zrePSBy+-e&0`FWrqunqJWELZ=le{;-qK1ZRpKu*Z6jD9O3#hd5=EuhK1ytrZjyLCf
zsi>8Y7eYi2<-3BlGGv_OaKeq8v-8<3S2$06pVrnEriGr37dd<7+x9n30AQ;{w|`Ic
zxTZZ$M4wzY1VH@B_}s_`pA*kV@+Kl1u!!g+O#?7aOb-Q|#JVNrZCVKcD~WDNd6nZ7
zAz0rgDiJvehbU~*01+`l6oDr=u?>h<BOj?g(c^8vILFHa02PcxSwv49=!F#QsHL`V
zj^l4#XC*N$2ms)i0}|NCA)?R~TBf-0+nCrsgfow4+DcX+S-vBHEC7zrvQc%^UM9n|
zm68%zm$BvI?R6jrATA0rRsxQrlx=1WD5dK44xEv3RYlVZfVe2*bad3~N~wXYz7$|>
z2GQ#$i9F&YpR(5iiQ0Bqn5k5KD(b`zy(*{jSWN6Xrq)$$XD~3J>MdBo30D%4n{{Cv
z$FwqJtUya$b%510V!@*9IKB|V4e27JUO*IHB;YZ~g4M2Z0W=ACECIkFswOHCkp;lw
zcz~7%5FzI^Bm;UP@n}Rok^v(u<Rs#Zr#wMa1w<6lMJX<WoE%B`91?(G%zuf<g>gO+
z-8#7mfW>*p$R~*V1YqC%IT29+<8w-GaV=my<D&vjVtHOjnRbn`1MgV|_2hek#eU)?
zM$RMh1w|F_<*T|usX{j&0PD&P<p_P(1`2^;bg66J_^=Tlzjf2e3v?YQA{#(+#l9uZ
z7vHj=-vppFT1?v61c2A_y`$?o%<Xn=m?@=PW>+9S%oFzO{i8Ld`WmJUODP?vf*C*Z
z{v6e}SIOqaO;$=txqL^AL=opCG%u7=sfAkOn^WW>ff3F{z^F{jDFFsj<cPq?j~N#M
zwoKWj3>}HFnF7G9k5WzqM0GH+P%Gv1{+%XhsSrL<XhTa*XrDbiy&PNs7x`7B{Uwq4
z&-LFJ09H^qAT9s^0FVO!odGI906+jfZ8n%mBqJiBA_xG04T)(001!7*Pz88}xc~tE
K`yqe;0001m^~#6<

literal 0
HcmV?d00001

diff --git a/public/icon/star/combat1.webp b/public/icon/star/combat1.webp
new file mode 100644
index 0000000000000000000000000000000000000000..463bef33b60ca1ab1e20538f9af380a486e1279f
GIT binary patch
literal 2286
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
I6lT*v0Aj^*>Hq)$

literal 0
HcmV?d00001

diff --git a/public/source/UI/combatCrown.webp b/public/source/UI/combatCrown.webp
new file mode 100644
index 0000000000000000000000000000000000000000..a17b990944e60d6b5f08ede5e71d350b85e3ec30
GIT binary patch
literal 1572
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
WvaBFbX0T+89x&OSFLmGm0000>3<kvj

literal 0
HcmV?d00001

diff --git a/public/source/UI/userCombat.webp b/public/source/UI/userCombat.webp
new file mode 100644
index 0000000000000000000000000000000000000000..e2b10a1a48439341a1ff82d10d0cfe11ce0cf76c
GIT binary patch
literal 2502
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
Q$T^S4w19rbGX=GP0KL2WQUCw|

literal 0
HcmV?d00001

diff --git a/src/components/userCombat/tuc-avatars.vue b/src/components/userCombat/tuc-avatars.vue
new file mode 100644
index 00000000..66d7e248
--- /dev/null
+++ b/src/components/userCombat/tuc-avatars.vue
@@ -0,0 +1,47 @@
+<template>
+  <div class="tuca-box">
+    <TItembox v-for="(item, idx) in props.modelValue" :key="idx" :model-value="getItemBox(item)" />
+  </div>
+</template>
+<script lang="ts" setup>
+import { computed } from "vue";
+
+import { getZhElement } from "../../utils/toolFunc.js";
+import TItembox, { TItemBoxData } from "../main/t-itembox.vue";
+
+interface TucAvatarsProps {
+  modelValue: TGApp.Game.Combat.Avatar[];
+}
+
+const props = defineProps<TucAvatarsProps>();
+const columnCnt = computed<number>(() => {
+  if (props.modelValue.length % 2 === 1) return (props.modelValue.length + 1) / 2;
+  return props.modelValue.length / 2;
+});
+
+function getItemBox(item: TGApp.Game.Combat.Avatar): TItemBoxData {
+  return {
+    bg: `/icon/bg/${item.rarity === 105 ? 5 : item.rarity}-BGC.webp`,
+    clickable: false,
+    display: "inner",
+    height: "80px",
+    icon: `/WIKI/character/${item.avatar_id}.webp`,
+    innerHeight: item.avatar_type !== 1 ? 20 : 0,
+    innerText: item.avatar_type === 2 ? "试用角色" : item.avatar_type === 3 ? "助演角色" : "",
+    lt: `/icon/element/${getZhElement(item.element)}元素.webp`,
+    ltSize: "20px",
+    innerBlur: "5px",
+    rt: "",
+    rtSize: "",
+    size: "80px",
+  };
+}
+</script>
+<style lang="css" scoped>
+.tuca-box {
+  display: grid;
+  width: 100%;
+  grid-gap: 10px;
+  grid-template-columns: repeat(v-bind(columnCnt), 1fr);
+}
+</style>
diff --git a/src/components/userCombat/tuc-buffs.vue b/src/components/userCombat/tuc-buffs.vue
new file mode 100644
index 00000000..146f02e2
--- /dev/null
+++ b/src/components/userCombat/tuc-buffs.vue
@@ -0,0 +1,68 @@
+<template>
+  <div class="tuc-buff-box">
+    <div class="tuc-buff-item">
+      <img alt="total" src="/source/UI/combatCrown.webp" />
+      <span>{{ props.modelValue.summary.total_level }}</span>
+    </div>
+    <div
+      class="tuc-buff-item"
+      v-for="(item, idx) in props.modelValue.buffs"
+      :key="idx"
+      :title="item.name"
+    >
+      <img :alt="item.name" :src="item.icon" />
+      <span>{{ item.level }}</span>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { computed } from "vue";
+
+interface TucBuffProps {
+  modelValue: TGApp.Game.Combat.SplendourBuff;
+}
+
+const props = defineProps<TucBuffProps>();
+const columnCnt = computed<number>(() => {
+  const len = props.modelValue.buffs.length;
+  if ((len + 1) % 2 === 1) return len / 2 + 1;
+  return (len + 1) / 2;
+});
+</script>
+<style lang="css" scoped>
+.tuc-buff-box {
+  display: grid;
+  width: 100%;
+  grid-gap: 5px;
+  grid-template-columns: repeat(v-bind(columnCnt), 1fr);
+}
+
+.tuc-buff-item {
+  position: relative;
+  display: flex;
+  width: 80px;
+  height: 80px;
+  align-items: center;
+  justify-content: center;
+
+  img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  span {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    padding: 0 5px;
+    background: var(--common-shadow-2);
+    border-bottom-right-radius: 5px;
+    border-top-left-radius: 5px;
+    color: var(--tgc-white-2);
+    font-family: var(--font-title);
+    font-size: 14px;
+    text-shadow: 0 0 5px rgb(0 0 0 / 20%);
+  }
+}
+</style>
diff --git a/src/components/userCombat/tuc-cards.vue b/src/components/userCombat/tuc-cards.vue
new file mode 100644
index 00000000..facf971d
--- /dev/null
+++ b/src/components/userCombat/tuc-cards.vue
@@ -0,0 +1,50 @@
+<template>
+  <div class="tuc-cards-box">
+    <div
+      class="tuc-cards-item"
+      v-for="(card, idx) in props.modelValue"
+      :key="idx"
+      :title="card.name"
+    >
+      <img :src="card.icon" :alt="card.name" />
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+interface TucCardsProps {
+  modelValue: TGApp.Game.Combat.Card[];
+}
+
+const props = defineProps<TucCardsProps>();
+</script>
+<style lang="css" scoped>
+.tuc-cards-box {
+  display: flex;
+  width: 100%;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  justify-content: flex-start;
+  gap: 5px;
+}
+
+.tuc-cards-item {
+  position: relative;
+  display: flex;
+  width: 50px;
+  align-items: center;
+  justify-content: center;
+  aspect-ratio: 1;
+
+  img {
+    max-width: 100%;
+    filter: invert(1);
+    object-fit: cover;
+  }
+}
+
+.dark .tuc-cards-item {
+  img {
+    filter: none;
+  }
+}
+</style>
diff --git a/src/components/userCombat/tuc-fight.vue b/src/components/userCombat/tuc-fight.vue
new file mode 100644
index 00000000..216046bd
--- /dev/null
+++ b/src/components/userCombat/tuc-fight.vue
@@ -0,0 +1,88 @@
+<template>
+  <div class="tucfi-box">
+    <div class="tucfi-label">
+      <slot name="label">{{ props.label }}</slot>
+    </div>
+    <div v-if="!Array.isArray(props.data)" class="tucfi-data">
+      <TItembox :model-value="getBox()" />
+    </div>
+    <div class="tucfi-icons" v-else>
+      <div v-for="(item, idx) in props.data" :key="idx" class="tucfi-icon">
+        <TItembox :model-value="getBox2(item)" />
+      </div>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import TItembox, { TItemBoxData } from "../main/t-itembox.vue";
+
+interface TucFightProps {
+  label: string;
+  data: TGApp.Game.Combat.AvatarMini | TGApp.Game.Combat.AvatarMini[];
+}
+
+const props = defineProps<TucFightProps>();
+
+function getBox(): TItemBoxData {
+  const role = <TGApp.Game.Combat.AvatarMini>props.data;
+  return {
+    bg: `/icon/bg/${role.rarity === 105 ? 5 : role.rarity}-BGC.webp`,
+    clickable: false,
+    display: "inner",
+    height: "60px",
+    icon: `/WIKI/character/${role.avatar_id}.webp`,
+    innerText: role.value,
+    innerHeight: 20,
+    innerBlur: "5px",
+    lt: "",
+    ltSize: "0",
+    size: "60px",
+  };
+}
+
+function getBox2(item: TGApp.Game.Combat.AvatarMini): TItemBoxData {
+  return {
+    bg: `/icon/bg/${item.rarity === 105 ? 5 : item.rarity}-BGC.webp`,
+    clickable: false,
+    display: "inner",
+    height: "60px",
+    icon: `/WIKI/character/${item.avatar_id}.webp`,
+    innerText: "",
+    lt: "",
+    ltSize: "0",
+    size: "60px",
+  };
+}
+</script>
+<style lang="css" scoped>
+.tucfi-box {
+  display: flex;
+  width: 100%;
+  height: auto;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 10px;
+  border-radius: 5px;
+  background: var(--box-bg-1);
+}
+
+.tucfi-label {
+  color: var(--box-text-4);
+  font-family: var(--font-title);
+  font-size: 20px;
+}
+
+.tucfi-data {
+  color: var(--tgc-yellow-1);
+  font-family: var(--font-text);
+  font-size: 20px;
+}
+
+.tucfi-icons {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  column-gap: 10px;
+}
+</style>
diff --git a/src/components/userCombat/tuc-overview.vue b/src/components/userCombat/tuc-overview.vue
new file mode 100644
index 00000000..7a06afdf
--- /dev/null
+++ b/src/components/userCombat/tuc-overview.vue
@@ -0,0 +1,55 @@
+<template>
+  <div class="tuco-box">
+    <TucTile title="最佳记录" :val="props.data.max_round_id" />
+    <TucTile :title="`获得星章-${props.data.medal_num}`" :val="props.data.get_medal_round_list" />
+    <TucTile :title="getTitle()" :val="`第${props.data.max_round_id}幕`" />
+    <TucTile title="消耗幻剧之花" :val="props.data.coin_num" />
+    <TucFight label="最快完成演出" :data="props.fights.shortest_avatar_list" />
+    <TucTile title="总耗时" :val="getTime()" />
+    <!--    <TucTile title="助演角色支援" :val="`${props.data.rent_cnt}次`" />-->
+    <!--    <TucTile title="场外声援" :val="`${props.data.avatar_bonus_num}次`" />-->
+    <TucFight label="击败最多敌人" :data="props.fights.max_defeat_avatar" />
+    <TucFight label="最高伤害输出" :data="props.fights.max_damage_avatar" />
+    <TucFight label="最高承受伤害" :data="props.fights.max_take_damage_avatar" />
+  </div>
+</template>
+<script lang="ts" setup>
+import TucFight from "./tuc-fight.vue";
+import TucTile from "./tuc-tile.vue";
+
+interface TucOverviewProps {
+  data: TGApp.Game.Combat.Stat;
+  fights: TGApp.Game.Combat.FightStatisic;
+}
+
+const props = defineProps<TucOverviewProps>();
+
+function getTitle(): string {
+  switch (props.data.difficulty_id) {
+    case 1:
+      return "轻简模式";
+    case 2:
+      return "普通模式";
+    case 3:
+      return "困难模式";
+    case 4:
+      return "卓越模式";
+    default:
+      return `未知模式${props.data.difficulty_id}`;
+  }
+}
+
+function getTime(): string {
+  const sec = props.fights.total_use_time % 60;
+  const min = (props.fights.total_use_time - sec) / 60;
+  return `${min}分${sec}秒`;
+}
+</script>
+<style lang="css" scoped>
+.tuco-box {
+  display: grid;
+  width: 100%;
+  grid-gap: 10px;
+  grid-template-columns: repeat(3, 1fr);
+}
+</style>
diff --git a/src/components/userCombat/tuc-round.vue b/src/components/userCombat/tuc-round.vue
new file mode 100644
index 00000000..77aa6124
--- /dev/null
+++ b/src/components/userCombat/tuc-round.vue
@@ -0,0 +1,86 @@
+<template>
+  <div class="tucr-box">
+    <div class="tucr-title">
+      <img :src="`/icon/star/combat${props.modelValue.is_get_medal ? 1 : 0}.webp`" alt="combat" />
+      <span class="main">第{{ props.modelValue.round_id }}幕</span>
+      <span class="sub">{{ timestampToDate(Number(props.modelValue.finish_time) * 1000) }}</span>
+    </div>
+    <div class="tucr-content">
+      <TucSub title="出演角色" class="main">
+        <TucAvatars :model-value="props.modelValue.avatars" />
+      </TucSub>
+      <TucSub title="辉彩祝福" class="main">
+        <TucBuffs :model-value="props.modelValue.splendour_buff" />
+      </TucSub>
+      <TucSub :title="`神秘收获(${props.modelValue.choice_cards.length})`" class="sub">
+        <TucCards :model-value="props.modelValue.choice_cards" />
+      </TucSub>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { timestampToDate } from "../../utils/toolFunc.js";
+
+import TucAvatars from "./tuc-avatars.vue";
+import TucBuffs from "./tuc-buffs.vue";
+import TucCards from "./tuc-cards.vue";
+import TucSub from "./tuc-sub.vue";
+
+interface TucRoundProps {
+  modelValue: TGApp.Game.Combat.RoundData;
+}
+
+const props = defineProps<TucRoundProps>();
+</script>
+<style lang="css" scoped>
+.tucr-box {
+  display: flex;
+  width: 100%;
+  height: fit-content;
+  flex-direction: column;
+  align-items: center;
+  padding: 5px;
+  border-radius: 5px;
+  background: var(--box-bg-1);
+  row-gap: 5px;
+}
+
+.tucr-title {
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+  margin-right: auto;
+  column-gap: 5px;
+
+  img {
+    width: 30px;
+    aspect-ratio: 1;
+  }
+
+  .main {
+    color: var(--common-text-title);
+    font-family: var(--font-title);
+    font-size: 20px;
+  }
+
+  .sub {
+    opacity: 0.8;
+  }
+}
+
+.tucr-content {
+  display: flex;
+  width: 100%;
+  align-items: flex-start;
+  justify-content: flex-start;
+  column-gap: 10px;
+
+  .main {
+    width: 180px;
+  }
+
+  .sub {
+    width: 100%;
+  }
+}
+</style>
diff --git a/src/components/userCombat/tuc-sub.vue b/src/components/userCombat/tuc-sub.vue
new file mode 100644
index 00000000..d28a8cad
--- /dev/null
+++ b/src/components/userCombat/tuc-sub.vue
@@ -0,0 +1,32 @@
+<template>
+  <div class="tuc-sub-box">
+    <div class="tuc-sub-title">{{ props.title }}</div>
+    <slot name="default" />
+  </div>
+</template>
+<script lang="ts" setup>
+interface TucSubProps {
+  title: string;
+}
+
+const props = defineProps<TucSubProps>();
+</script>
+<style lang="css" scoped>
+.tuc-sub-box {
+  position: relative;
+  display: flex;
+  height: 200px;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+  padding: 5px;
+  border-radius: 5px;
+  background: var(--box-bg-2);
+}
+
+.tuc-sub-title {
+  margin-right: auto;
+  color: var(--box-text-2);
+  font-family: var(--font-title);
+}
+</style>
diff --git a/src/components/userCombat/tuc-tile.vue b/src/components/userCombat/tuc-tile.vue
new file mode 100644
index 00000000..0f24a651
--- /dev/null
+++ b/src/components/userCombat/tuc-tile.vue
@@ -0,0 +1,62 @@
+<template>
+  <div class="tuct-box">
+    <div class="tuct-title">
+      <slot name="title">{{ props.title }}</slot>
+    </div>
+    <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="(val, idx) in props.val"
+        :key="idx"
+        :src="`/icon/star/combat${val}.webp`"
+        :alt="`${val}`"
+      />
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+interface TucTileProps {
+  title: string;
+  val: string | number | number[];
+}
+
+const props = defineProps<TucTileProps>();
+</script>
+<style lang="css" scoped>
+.tuct-box {
+  display: flex;
+  width: 100%;
+  height: auto;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 10px;
+  border-radius: 5px;
+  background: var(--box-bg-1);
+}
+
+.tuct-title {
+  color: var(--box-text-4);
+  font-family: var(--font-title);
+  font-size: 20px;
+}
+
+.tuct-text {
+  color: var(--tgc-yellow-1);
+  font-family: var(--font-text);
+  font-size: 20px;
+}
+
+.tuct-icons {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  img {
+    height: 30px;
+    aspect-ratio: 1;
+  }
+}
+</style>
diff --git a/src/pages/User/Abyss.vue b/src/pages/User/Abyss.vue
index e12731c3..0fb35110 100644
--- a/src/pages/User/Abyss.vue
+++ b/src/pages/User/Abyss.vue
@@ -12,6 +12,18 @@
           :hide-details="true"
           title="游戏UID"
         />
+        <v-btn :rounded="true" class="ua-btn" @click="toCombat()">
+          <template #prepend>
+            <img src="/source/UI/userCombat.webp" alt="combat" />
+          </template>
+          <span>幻想真境剧诗</span>
+        </v-btn>
+        <v-btn :rounded="true" class="ua-btn" @click="toWiki()">
+          <template #prepend>
+            <img src="/source/UI/wikiAbyss.webp" alt="wiki" />
+          </template>
+          <span>深渊数据库</span>
+        </v-btn>
       </div>
     </template>
     <template #append>
@@ -61,7 +73,7 @@
               <span>更新于</span>
               <span>{{ item.updated }}</span>
             </div>
-            <div class="uaw-share">Render by TeyvatGuide v{{ version }}</div>
+            <div class="uaw-share">深境螺旋 | Render by TeyvatGuide v{{ version }}</div>
           </div>
           <TSubLine>统计周期 {{ item.startTime }} ~ {{ item.endTime }}</TSubLine>
           <div class="uaw-o-box">
@@ -101,6 +113,7 @@
 import { getVersion } from "@tauri-apps/api/app";
 import { storeToRefs } from "pinia";
 import { onMounted, ref, watch, computed } from "vue";
+import { useRouter } from "vue-router";
 
 import showConfirm from "../../components/func/confirm.js";
 import showSnackbar from "../../components/func/snackbar.js";
@@ -130,6 +143,7 @@ const user = computed<TGApp.Sqlite.Account.Game>(() => userStore.account.value);
 const localAbyss = ref<TGApp.Sqlite.Abyss.SingleTable[]>([]);
 const abyssRef = ref<HTMLElement>(<HTMLElement>{});
 const version = ref<string>();
+const router = useRouter();
 
 const uidList = ref<string[]>();
 const uidCur = ref<string>();
@@ -154,6 +168,14 @@ watch(
   async () => await loadAbyss(),
 );
 
+async function toCombat(): Promise<void> {
+  await router.push({ name: "真境剧诗" });
+}
+
+async function toWiki(): Promise<void> {
+  await router.push({ name: "深渊数据库" });
+}
+
 async function loadAbyss(): Promise<void> {
   localAbyss.value = [];
   if (uidCur.value === undefined || uidCur.value === "") return;
@@ -330,10 +352,13 @@ async function deleteAbyss(): Promise<void> {
   }
 
   span {
-    color: var(--common-text-title);
     font-family: var(--font-title);
     font-size: 20px;
   }
+
+  span :first-child {
+    color: var(--common-text-title);
+  }
 }
 
 .uat-right {
diff --git a/src/pages/User/Combat.vue b/src/pages/User/Combat.vue
new file mode 100644
index 00000000..c177e552
--- /dev/null
+++ b/src/pages/User/Combat.vue
@@ -0,0 +1,424 @@
+<template>
+  <ToLoading v-model="loading" :title="loadingTitle" :subtitle="loadingSub" />
+  <v-app-bar>
+    <template #prepend>
+      <div class="uct-left">
+        <img alt="icon" src="/source/UI/userCombat.webp" />
+        <span>幻想真境剧诗</span>
+        <v-select
+          variant="outlined"
+          v-model="uidCur"
+          :items="uidList"
+          :hide-details="true"
+          title="游戏UID"
+        />
+        <v-btn :rounded="true" class="uc-btn" @click="toAbyss()">
+          <template #prepend>
+            <img src="/source/UI/userAbyss.webp" alt="abyss" />
+          </template>
+          <span>深境螺旋</span>
+        </v-btn>
+      </div>
+    </template>
+    <template #append>
+      <div class="uct-right">
+        <v-btn
+          class="uc-btn"
+          @click="shareCombat()"
+          :rounded="true"
+          :disabled="localCombat.length === 0"
+        >
+          <v-icon>mdi-share</v-icon>
+          <span>分享</span>
+        </v-btn>
+        <v-btn class="uc-btn" @click="refreshCombat()" :rounded="true">
+          <v-icon>mdi-refresh</v-icon>
+          <span>刷新</span>
+        </v-btn>
+        <v-btn class="uc-btn" @click="uploadCombat()" :rounded="true">
+          <v-icon>mdi-cloud-upload</v-icon>
+          <span>上传</span>
+        </v-btn>
+        <v-btn class="uc-btn" @click="deleteCombat()" :rounded="true">
+          <v-icon>mdi-delete</v-icon>
+          <span>删除</span>
+        </v-btn>
+      </div>
+    </template>
+  </v-app-bar>
+  <div class="uc-box">
+    <v-tabs v-model="userTab" direction="vertical" class="uc-tabs-box" center-active>
+      <v-tab v-for="item in localCombat" :key="item.id" :value="item.id"> 第{{ item.id }}期</v-tab>
+    </v-tabs>
+    <v-window v-model="userTab" class="uc-window">
+      <v-window-item
+        v-for="item in localCombat"
+        :key="item.id"
+        :value="item.id"
+        class="uc-window-item"
+      >
+        <div :id="`user-combat-${item.id}`" class="ucw-i-ref">
+          <div class="ucw-top">
+            <div class="ucw-title">
+              <span>第</span>
+              <span>{{ item.id }}</span>
+              <span>期 UID</span>
+              <span>{{ uidCur }}</span>
+              <span>更新于</span>
+              <span>{{ item.updated }}</span>
+            </div>
+            <div class="ucw-share">真境剧诗 | Render by TeyvatGuide v{{ version }}</div>
+          </div>
+          <TSubLine>统计周期 {{ item.startTime }} ~ {{ item.endTime }}</TSubLine>
+          <TucOverview :data="item.stat" :fights="item.detail.fight_statisic" />
+          <TSubLine>使用角色</TSubLine>
+          <TucAvatars :model-value="item.detail.backup_avatars" />
+          <TSubLine>详情</TSubLine>
+          <div class="ucw-rounds">
+            <TucRound
+              v-for="(round, idx) in item.detail.rounds_data"
+              :key="idx"
+              :model-value="round"
+            />
+          </div>
+        </div>
+      </v-window-item>
+    </v-window>
+    <div v-show="localCombat.length === 0" class="user-empty">
+      <img src="/source/UI/empty.webp" alt="empty" />
+      <span>暂无数据，请尝试刷新</span>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { getVersion } from "@tauri-apps/api/app";
+import { storeToRefs } from "pinia";
+import { onMounted, ref, watch, computed } from "vue";
+import { useRouter } from "vue-router";
+
+import showConfirm from "../../components/func/confirm.js";
+import showSnackbar from "../../components/func/snackbar.js";
+import TSubLine from "../../components/main/t-subline.vue";
+import ToLoading from "../../components/overlay/to-loading.vue";
+import TucAvatars from "../../components/userCombat/tuc-avatars.vue";
+import TucOverview from "../../components/userCombat/tuc-overview.vue";
+import TucRound from "../../components/userCombat/tuc-round.vue";
+import Hutao from "../../plugins/Hutao/index.js";
+import TSUserCombat from "../../plugins/Sqlite/modules/userCombat.js";
+import { useUserStore } from "../../store/modules/user.js";
+import TGLogger from "../../utils/TGLogger.js";
+import { generateShareImg } from "../../utils/TGShare.js";
+import TGRequest from "../../web/request/TGRequest.js";
+
+// store
+const userStore = storeToRefs(useUserStore());
+// loading
+const loading = ref<boolean>(true);
+const loadingTitle = ref<string>();
+const loadingSub = ref<string>();
+
+// data
+const userTab = ref<number>(0);
+const user = computed<TGApp.Sqlite.Account.Game>(() => userStore.account.value);
+
+const localCombat = ref<TGApp.Sqlite.Combat.SingleTable[]>([]);
+const combatRef = ref<HTMLElement>(<HTMLElement>{});
+const version = ref<string>();
+const router = useRouter();
+
+const uidList = ref<string[]>();
+const uidCur = ref<string>();
+const combatIdList = computed<number[]>(() => {
+  return localCombat.value.map((combat) => combat.id);
+});
+
+onMounted(async () => {
+  version.value = await getVersion();
+  await TGLogger.Info("[UserCombat][onMounted] 打开真境剧诗页面");
+  loadingTitle.value = "正在加载剧诗数据";
+  uidList.value = await TSUserCombat.getAllUid();
+  if (uidList.value.includes(user.value.gameUid)) uidCur.value = user.value.gameUid;
+  else if (uidList.value.length > 0) uidCur.value = uidList.value[0];
+  else uidCur.value = "";
+  await loadCombat();
+  loading.value = false;
+});
+
+watch(
+  () => uidCur.value,
+  async () => await loadCombat(),
+);
+
+async function toAbyss(): Promise<void> {
+  await router.push({ name: "深渊记录" });
+}
+
+async function loadCombat(): Promise<void> {
+  localCombat.value = [];
+  if (uidCur.value === undefined || uidCur.value === "") return;
+  localCombat.value = await TSUserCombat.getCombat(uidCur.value);
+  if (localCombat.value.length > 0) userTab.value = localCombat.value[0].id;
+}
+
+async function refreshCombat(): Promise<void> {
+  if (!userStore.cookie.value) {
+    showSnackbar({ text: "未登录", color: "error" });
+    await TGLogger.Warn("[UserCombat][getAbyssData] 未登录");
+    return;
+  }
+  if (uidCur.value && uidCur.value !== user.value.gameUid) {
+    const confirmSwitch = await showConfirm({
+      title: "是否切换游戏账户",
+      text: `确认则尝试切换至 ${uidCur.value}`,
+    });
+    if (confirmSwitch) {
+      await useUserStore().switchGameAccount(uidCur.value);
+      await refreshCombat();
+      return;
+    }
+    const confirm = await showConfirm({
+      title: "确定刷新？",
+      text: `用户${user.value.gameUid}与当前UID${uidCur.value}不一致`,
+    });
+    if (!confirm) {
+      showSnackbar({ text: "已取消剧诗数据刷新", color: "cancel" });
+      return;
+    }
+  }
+  await TGLogger.Info("[UserCombat][getCombatData] 更新剧诗数据");
+  loadingTitle.value = `正在获取${user.value.gameUid}的深渊数据`;
+  loading.value = true;
+  loadingTitle.value = `正在获取${user.value.gameUid}的剧诗数据`;
+  const res = await TGRequest.User.byCookie.getCombat(userStore.cookie.value, user.value);
+  if (res === false) {
+    loading.value = false;
+    showSnackbar({ text: "用户未解锁幻想真境剧诗!", color: "warn" });
+    return;
+  }
+  if ("retcode" in res) {
+    showSnackbar({ text: `[${res.retcode}]${res.message}`, color: "error" });
+    loading.value = false;
+    await TGLogger.Error(`[UserCombat][getCombatData] 获取${user.value.gameUid}的剧诗数据失败`);
+    await TGLogger.Error(`[UserCombat][getCombatData] ${res.retcode} ${res.message}`);
+    return;
+  }
+  loadingTitle.value = `正在保存剧诗数据`;
+  for (const combat of res) {
+    loadingSub.value = `正在保存第${combat.schedule.schedule_id}期数据`;
+    await TSUserCombat.saveCombat(user.value.gameUid, combat);
+  }
+  loadingTitle.value = "正在加载剧诗数据";
+  uidList.value = await TSUserCombat.getAllUid();
+  uidCur.value = user.value.gameUid;
+  await loadCombat();
+  loading.value = false;
+}
+
+async function shareCombat(): Promise<void> {
+  await TGLogger.Info(`[UserCombat][shareCombat][${userTab.value}] 生成剧诗数据分享图片`);
+  const fileName = `【剧诗数据】${userTab.value}-${user.value.gameUid}`;
+  loadingTitle.value = "正在生成图片";
+  loadingSub.value = `${fileName}.png`;
+  loading.value = true;
+  combatRef.value = <HTMLElement>document.getElementById(`user-combat-${userTab.value}`);
+  await generateShareImg(fileName, combatRef.value);
+  loadingSub.value = "";
+  loading.value = false;
+  await TGLogger.Info(`[UserCombat][shareCombat][${userTab.value}] 生成剧诗数据分享图片成功`);
+}
+
+async function uploadCombat(): Promise<void> {
+  await TGLogger.Info("[UserCombat][uploadCombat] 上传剧诗数据");
+  const combatData = localCombat.value.find((item) => item.id === Math.max(...combatIdList.value));
+  if (!combatData) {
+    showSnackbar({ text: "未找到剧诗数据", color: "error" });
+    await TGLogger.Warn("[UserCombat][uploadCombat] 未找到深渊数据");
+    return;
+  }
+  if (!combatData.hasDetailData) {
+    showSnackbar({ text: "未获取到详情数据", color: "error" });
+    await TGLogger.Warn(`[UserCombat][uploadCombat] 未获取到详细数据`);
+    return;
+  }
+  const startTime = new Date(combatData.startTime).getTime();
+  const endTime = new Date(combatData.endTime).getTime();
+  const nowTime = new Date().getTime();
+  if (nowTime < startTime || nowTime > endTime) {
+    showSnackbar({ text: "非最新剧诗数据，请刷新剧诗数据后重试！", color: "error" });
+    await TGLogger.Warn("[UserCombat][uploadCombat] 非最新剧诗数据");
+    return;
+  }
+  try {
+    loadingTitle.value = "正在转换剧诗数据";
+    loadingSub.value = "";
+    loading.value = true;
+    const transCombat = Hutao.Combat.trans(combatData);
+    loadingTitle.value = "正在上传剧诗数据";
+    const res = await Hutao.Combat.upload(transCombat);
+    loading.value = false;
+    if (res.retcode === 0) {
+      showSnackbar({ text: res.message ?? "上传剧诗数据成功" });
+      await TGLogger.Info("[UserCombat][uploadCombat] 上传剧诗数据成功");
+    } else {
+      showSnackbar({ text: `[${res.retcode}]${res.message}`, color: "error" });
+      await TGLogger.Error("[UserCombat][uploadCombat] 上传剧诗数据失败");
+      await TGLogger.Error(`[UserCombat][uploadCombat] ${res.retcode} ${res.message}`);
+    }
+  } catch (e) {
+    if (e instanceof Error) {
+      showSnackbar({ text: e.message, color: "error" });
+      await TGLogger.Error("[UserCombat][uploadCombat] 上传剧诗数据失败");
+      await TGLogger.Error(`[UserCombat][uploadCombat] ${e.message}`);
+    }
+  }
+  if (loading.value) loading.value = false;
+}
+
+async function deleteCombat(): Promise<void> {
+  if (uidCur.value === undefined || uidCur.value === "") {
+    showSnackbar({ text: "未找到符合条件的数据!", color: "error" });
+    return;
+  }
+  const confirm = await showConfirm({
+    title: "确定删除数据？",
+    text: `将清除${uidCur.value}的所有剧诗数据`,
+  });
+  if (!confirm) {
+    showSnackbar({ text: "已取消删除", color: "cancel" });
+    return;
+  }
+  loadingTitle.value = `正在删除 ${uidCur.value} 的剧诗数据`;
+  loading.value = true;
+  await TSUserCombat.delCombat(uidCur.value);
+  await new Promise((resolve) => setTimeout(resolve, 1000));
+  loading.value = false;
+  showSnackbar({ text: `已清除 ${uidCur.value} 的剧诗数据`, color: "success" });
+  uidList.value = await TSUserCombat.getAllUid();
+  if (uidList.value.length > 0) uidCur.value = uidList.value[0];
+  else uidCur.value = undefined;
+  await loadCombat();
+}
+</script>
+<style lang="css" scoped>
+.uct-left {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  justify-content: center;
+  padding: 10px;
+  gap: 10px;
+
+  img {
+    width: 32px;
+    height: 32px;
+  }
+
+  span {
+    font-family: var(--font-title);
+    font-size: 20px;
+  }
+
+  span :first-child {
+    color: var(--common-text-title);
+  }
+}
+
+.uct-right {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  justify-content: center;
+  padding: 10px;
+  gap: 10px;
+}
+
+.uc-btn {
+  background: var(--tgc-btn-1);
+  color: var(--btn-text);
+  font-family: var(--font-text);
+}
+
+.uc-box {
+  display: flex;
+  height: calc(100vh - 100px);
+  align-items: flex-start;
+  justify-content: center;
+  border: 1px solid var(--common-shadow-4);
+  border-radius: 5px;
+}
+
+.uc-tabs-box {
+  max-height: 100%;
+  overflow-y: auto;
+}
+
+.uc-window {
+  overflow: hidden;
+  width: calc(100% - 100px);
+  height: 100%;
+  padding: 10px;
+}
+
+.uc-window-item {
+  height: 100%;
+  padding: 10px;
+  border-radius: 5px;
+  overflow-y: auto;
+}
+
+.ucw-i-ref {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+}
+
+.ucw-top {
+  display: flex;
+  width: 100%;
+  align-items: flex-end;
+  justify-content: space-between;
+}
+
+.ucw-title {
+  display: flex;
+  align-items: center;
+  color: var(--common-text-title);
+  font-family: var(--font-title);
+  font-size: 20px;
+}
+
+.ucw-title :nth-child(2n) {
+  margin-right: 10px;
+  margin-left: 10px;
+  color: var(--tgc-yellow-1);
+}
+
+.ucw-share {
+  z-index: -1;
+  font-size: 12px;
+  opacity: 0.8;
+}
+
+.user-empty {
+  position: absolute;
+  top: calc(50vh - 200px);
+  left: calc(50vw - 400px);
+  display: flex;
+  width: 800px;
+  height: 400px;
+  flex-direction: column;
+  align-items: center;
+  border-radius: 5px;
+  background: var(--common-shadow-t-2);
+  box-shadow: 0 0 5px var(--common-shadow-2);
+  color: var(--common-text-title);
+  font-family: var(--font-title);
+  font-size: 1.5rem;
+}
+
+.ucw-rounds {
+  display: grid;
+  gap: 10px;
+  grid-template-columns: repeat(2, 1fr);
+}
+</style>
diff --git a/src/plugins/Hutao/utils/combatUtil.ts b/src/plugins/Hutao/utils/combatUtil.ts
index ff470bee..9505c761 100644
--- a/src/plugins/Hutao/utils/combatUtil.ts
+++ b/src/plugins/Hutao/utils/combatUtil.ts
@@ -7,21 +7,17 @@
 /**
  * @description 将本地数据转为上传用的数据
  * @since Beta v0.6.3
- * @param {number[]} avatars 角色
- * @param {number} schedule 期数
- * @param {number} uid UID
+ * @param {TGApp.Sqlite.Combat.SingleTable} data 数据
  * @returns {TGApp.Plugins.Hutao.Combat.UploadData} 上传用的数据
  */
 export function transCombatLocal(
-  avatars: number[],
-  schedule: number,
-  uid: string,
+  data: TGApp.Sqlite.Combat.SingleTable,
 ): TGApp.Plugins.Hutao.Combat.UploadData {
   return {
     Version: 1,
-    Uid: uid,
+    Uid: data.uid,
     Identity: "TeyvatGuide",
-    BackupAvatars: avatars,
-    ScheduleId: schedule,
+    BackupAvatars: data.detail.backup_avatars.map((i) => i.avatar_id),
+    ScheduleId: data.id,
   };
 }
diff --git a/src/plugins/Sqlite/modules/userCombat.ts b/src/plugins/Sqlite/modules/userCombat.ts
new file mode 100644
index 00000000..bd2745e2
--- /dev/null
+++ b/src/plugins/Sqlite/modules/userCombat.ts
@@ -0,0 +1,159 @@
+/**
+ * @file plugins/Sqlite/modules/userCombat.ts
+ * @description Sqlite-幻想真境剧诗模块
+ * @since Beta v0.6.3
+ */
+
+import { path } from "@tauri-apps/api";
+import { exists, mkdir, readTextFile, writeTextFile } from "@tauri-apps/plugin-fs";
+
+import TGLogger from "../../../utils/TGLogger.js";
+import { timestampToDate } from "../../../utils/toolFunc.js";
+import TGSqlite from "../index.js";
+import { transUserCombat } from "../utils/transUserCombat.js";
+
+/**
+ * @description 直接插入数据
+ * @since Beta v0.6.3
+ * @param {string} uid 用户UID
+ * @param {TGApp.Sqlite.Combat.SingleTable} data 剧诗数据
+ * @returns {string}
+ */
+function getInsertSql(data: TGApp.Sqlite.Combat.SingleTable, uid?: string): string {
+  const timeNow = timestampToDate(new Date().getTime());
+  const hasData = data.hasData ? 1 : 0;
+  const hasDetailData = data.hasDetailData ? 1 : 0;
+  return `
+      INSERT INTO RoleCombat(uid, id, startTime, endTime, hasData, hasDetailData, stat, detail, updated)
+      VALUES ('${uid ?? data.uid}', ${data.id}, '${data.startTime}', '${data.endTime}', ${hasData}, ${hasDetailData},
+              '${JSON.stringify(data.stat)}', '${JSON.stringify(data.detail)}', '${timeNow}')
+      ON CONFLICT(uid,id) DO UPDATE
+          SET startTime     = '${data.startTime}',
+              endTime       = '${data.endTime}',
+              hasData       = ${hasData},
+              hasDetailData = ${hasDetailData},
+              stat          = '${JSON.stringify(data.stat)}',
+              detail        = '${JSON.stringify(data.detail)}',
+              updated       = '${timeNow}'
+  `;
+}
+
+/**
+ * @description 获取所有有数据的UID
+ * @since Beta v0.6.3
+ * @returns {Promise<void>}
+ */
+async function getAllUid(): Promise<Array<string>> {
+  const db = await TGSqlite.getDB();
+  type resType = Array<{ uid: string }>;
+  const res = await db.select<resType>("SELECT DISTINCT uid FROM RoleCombat;");
+  return res.map((i) => i.uid);
+}
+
+/**
+ * @description 获取剧诗数据
+ * @since Beta v0.6.3
+ * @param {string} uid - 游戏UID
+ * @returns {Promise<TGApp.Sqlite.Abyss.SingleTable[]>}
+ */
+async function getCombat(uid?: string): Promise<TGApp.Sqlite.Combat.SingleTable[]> {
+  const db = await TGSqlite.getDB();
+  let resR: TGApp.Sqlite.Combat.RawTable[];
+  if (uid === undefined) {
+    resR = await db.select<TGApp.Sqlite.Combat.RawTable[]>(
+      "SELECT * FROM RoleCombat order by id DESC;",
+    );
+  } else {
+    resR = await db.select<TGApp.Sqlite.Combat.RawTable[]>(
+      "SELECT * FROM RoleCombat WHERE uid = ? order by id DESC;",
+      [uid],
+    );
+  }
+  const res: TGApp.Sqlite.Combat.SingleTable[] = [];
+  for (const raw of resR) {
+    res.push({
+      uid: raw.uid,
+      detail: JSON.parse(raw.detail),
+      endTime: raw.endTime,
+      hasData: raw.hasData === 1,
+      hasDetailData: raw.hasDetailData === 1,
+      id: raw.id,
+      startTime: raw.startTime,
+      stat: JSON.parse(raw.stat),
+      updated: raw.updated,
+    });
+  }
+  return res;
+}
+
+/**
+ * @description 保存剧诗数据
+ * @since Beta v0.6.3
+ * @param {string} uid - 游戏UID
+ * @param {TGApp.Game.Abyss.FullData} data - 深渊数据
+ * @returns {Promise<void>}
+ */
+async function saveCombat(uid: string, data: TGApp.Game.Combat.Combat): Promise<void> {
+  const db = await TGSqlite.getDB();
+  await db.execute(getInsertSql(transUserCombat(data), uid));
+}
+
+/**
+ * @description 删除指定UID存档的数据
+ * @since Beta v0.6.3
+ * @param {string} uid - 游戏UID
+ * @returns {Promise<void>}
+ */
+async function delCombat(uid: string): Promise<void> {
+  const db = await TGSqlite.getDB();
+  await db.execute("DELETE FROM RoleCombat WHERE uid = ?;", [uid]);
+}
+
+/**
+ * @description 备份剧诗数据
+ * @since Beta v0.6.3
+ * @param {string} dir - 备份目录
+ * @returns {Promise<void>}
+ */
+async function backupCombat(dir: string): Promise<void> {
+  if (!(await exists(dir))) {
+    await mkdir(dir, { recursive: true });
+    await TGLogger.Warn(`未检测到备份目录，已创建`);
+  }
+  const data = await getCombat();
+  await writeTextFile(`${dir}${path.sep()}combat.json`, JSON.stringify(data));
+}
+
+/**
+ * @description 恢复剧诗数据
+ * @since Beta v0.6.3
+ * @param {string} dir - 备份文件目录
+ * @returns {Promise<boolean>}
+ */
+async function restoreCombat(dir: string): Promise<boolean> {
+  const filePath = `${dir}${path.sep()}combat.json`;
+  if (!(await exists(filePath))) return false;
+  try {
+    const data: TGApp.Sqlite.Combat.SingleTable[] = JSON.parse(await readTextFile(filePath));
+    const db = await TGSqlite.getDB();
+    for (const abyss of data) {
+      await db.execute(getInsertSql(abyss));
+    }
+    return true;
+  } catch (e) {
+    await TGLogger.Error(`恢复剧诗数据失败${filePath}`);
+    await TGLogger.Error(`${e}`);
+    return false;
+  }
+}
+
+const TSUserCombat = {
+  getAllUid,
+  getCombat,
+  saveCombat,
+  delCombat,
+  backupCombat,
+  restoreCombat,
+};
+
+export default TSUserCombat;
diff --git a/src/plugins/Sqlite/sql/createTable.sql b/src/plugins/Sqlite/sql/createTable.sql
index 565d8d4c..3cc3f5ba 100644
--- a/src/plugins/Sqlite/sql/createTable.sql
+++ b/src/plugins/Sqlite/sql/createTable.sql
@@ -1,6 +1,6 @@
 -- @file plugins/Sqlite/sql/createTable.sql
 -- @brief sqlite数据库创建表语句
--- @since Beta v0.6.1
+-- @since Beta v0.6.3
 
 -- @brief 创建成就数据表
 create table if not exists Achievements
@@ -71,6 +71,21 @@ create table if not exists SpiralAbyss
     primary key (uid, id)
 );
 
+-- @brief 创建幻想真境剧诗数据表
+create table if not exists RoleCombat
+(
+    uid           text,
+    id            integer,
+    startTime     text,
+    endTime       text,
+    hasData       boolean,
+    hasDetailData boolean,
+    stat          text,
+    detail        text,
+    updated       text,
+    primary key (uid, id)
+);
+
 -- @brief 创建战绩数据表
 create table if not exists UserRecord
 (
diff --git a/src/plugins/Sqlite/utils/transUserCombat.ts b/src/plugins/Sqlite/utils/transUserCombat.ts
new file mode 100644
index 00000000..06403e44
--- /dev/null
+++ b/src/plugins/Sqlite/utils/transUserCombat.ts
@@ -0,0 +1,27 @@
+/**
+ * @file plugins/Sqlite/utils/transUserCombat.ts
+ * @description Sqlite 数据转换-幻想真境剧诗
+ * @since Beta v0.6.3
+ */
+
+import { timestampToDate } from "../../../utils/toolFunc.js";
+
+/**
+ * @description 将通过 api 获取到的数据转换为数据库中的数据
+ * @since Beta v0.6.3
+ * @param {TGApp.Game.Combat.Combat} data - 剧诗数据
+ * @returns {TGApp.Sqlite.Combat.SingleTable} 转换后端数据
+ */
+export function transUserCombat(data: TGApp.Game.Combat.Combat): TGApp.Sqlite.Combat.SingleTable {
+  return {
+    uid: "",
+    detail: data.detail,
+    endTime: timestampToDate(Number(data.schedule.end_time) * 1000),
+    hasData: data.has_data,
+    hasDetailData: data.has_detail_data,
+    id: data.schedule.schedule_id,
+    startTime: timestampToDate(Number(data.schedule.start_time) * 1000),
+    stat: data.stat,
+    updated: timestampToDate(new Date().getTime()),
+  };
+}
diff --git a/src/router/modules/user.ts b/src/router/modules/user.ts
index 0c6501bb..d110890f 100644
--- a/src/router/modules/user.ts
+++ b/src/router/modules/user.ts
@@ -1,7 +1,7 @@
 /**
  * @file router modules user.ts
  * @description user 路由模块
- * @since Beta v0.3.3
+ * @since Beta v0.6.3
  */
 
 const userRoutes = [
@@ -10,6 +10,11 @@ const userRoutes = [
     name: "深渊记录",
     component: async () => await import("../../pages/User/Abyss.vue"),
   },
+  {
+    path: "/user/combat",
+    name: "真境剧诗",
+    component: async () => await import("../../pages/User/Combat.vue"),
+  },
   {
     path: "/user/characters",
     name: "我的角色",
diff --git a/src/types/Game/Combat.d.ts b/src/types/Game/Combat.d.ts
index 338e0a32..6f768a0d 100644
--- a/src/types/Game/Combat.d.ts
+++ b/src/types/Game/Combat.d.ts
@@ -43,7 +43,7 @@ declare namespace TGApp.Game.Combat {
    * @interface Avatar
    * @since Beta v0.6.3
    * @property {number} avatar_id 角色id
-   * @property {number} avatar_type 角色武器类型 // todo
+   * @property {number} avatar_type 角色类型 // 0-自己角色，1-试用角色，2-助演角色
    * @property {string} name 角色名称
    * @property {string} element 角色元素 // todo Dendro
    * @property {string} image 角色图像
diff --git a/src/types/Sqlite/Combat.d.ts b/src/types/Sqlite/Combat.d.ts
new file mode 100644
index 00000000..690ac02b
--- /dev/null
+++ b/src/types/Sqlite/Combat.d.ts
@@ -0,0 +1,61 @@
+/**
+ * @file types/Sqlite/Combat.d.ts
+ * @description 幻想真境剧诗类型定义文件
+ * @since Beta v0.6.3
+ */
+
+declare namespace TGApp.Sqlite.Combat {
+  /**
+   * @description 数据库-幻想真境剧诗表
+   * @since Beta v0.6.3
+   * @interface SingleTable
+   * @property {string} uid - 用户 UID
+   * @property {number} id - 剧诗 ID
+   * @property {string} startTime - 开始时间
+   * @property {string} endTime - 结束时间
+   * @property {boolean} hasData - 是否有数据
+   * @property {boolean} hasDetailData - 是否有详细数据
+   * @property {TGApp.Game.Combat.Stat} stat - 概况
+   * @property {TGApp.Game.Combat.Detail} detail - 详情
+   * @property {string} updated - 更新时间
+   * @return SingleTable
+   */
+  interface RawTable {
+    uid: string;
+    id: number;
+    startTime: string;
+    endTime: string;
+    hasData: 0 | 1;
+    hasDetailData: 0 | 1;
+    stat: string;
+    detail: string;
+    updated: string;
+  }
+
+  /**
+   * @description 数据库-幻想真境剧诗表
+   * @since Beta v0.6.3
+   * @interface SingleTable
+   * @property {string} uid - 用户 UID
+   * @property {number} id - 剧诗 ID
+   * @property {string} startTime - 开始时间
+   * @property {string} endTime - 结束时间
+   * @property {boolean} hasData - 是否有数据
+   * @property {boolean} hasDetailData - 是否有详细数据
+   * @property {TGApp.Game.Combat.Stat} stat - 概况
+   * @property {TGApp.Game.Combat.Detail} detail - 详情
+   * @property {string} updated - 更新时间
+   * @return SingleTable
+   */
+  interface SingleTable {
+    uid: string;
+    id: number;
+    startTime: string;
+    endTime: string;
+    hasData: boolean;
+    hasDetailData: boolean;
+    stat: TGApp.Game.Combat.Stat;
+    detail: TGApp.Game.Combat.Detail;
+    updated: string;
+  }
+}
diff --git a/src/utils/dataBS.ts b/src/utils/dataBS.ts
index 5af1b64f..ab3c06bd 100644
--- a/src/utils/dataBS.ts
+++ b/src/utils/dataBS.ts
@@ -1,7 +1,7 @@
 /**
  * @file utils/dataBS.ts
  * @description 用户数据的备份、恢复、迁移
- * @since Beta v0.6.0
+ * @since Beta v0.6.3
  */
 import { exists, mkdir } from "@tauri-apps/plugin-fs";
 
@@ -9,13 +9,14 @@ import showSnackbar from "../components/func/snackbar.js";
 import TSUserAbyss from "../plugins/Sqlite/modules/userAbyss.js";
 import TSUserAccount from "../plugins/Sqlite/modules/userAccount.js";
 import TSUserAchi from "../plugins/Sqlite/modules/userAchi.js";
+import TSUserCombat from "../plugins/Sqlite/modules/userCombat.js";
 import TSUserGacha from "../plugins/Sqlite/modules/userGacha.js";
 
 import TGLogger from "./TGLogger.js";
 
 /**
  * @description 备份用户数据
- * @since Beta v0.6.0
+ * @since Beta v0.6.3
  * @param {string} dir 备份目录路径
  * @returns {Promise<void>}
  */
@@ -27,12 +28,13 @@ export async function backUpUserData(dir: string): Promise<void> {
   await TSUserAchi.backupUiaf(dir);
   await TSUserAccount.account.backup(dir);
   await TSUserAbyss.backupAbyss(dir);
+  await TSUserCombat.backupCombat(dir);
   await TSUserGacha.backUpUigf(dir);
 }
 
 /**
  * @description 恢复用户数据
- * @since Beta v0.6.0
+ * @since Beta v0.6.3
  * @param {string} dir 备份目录路径
  * @returns {Promise<void>}
  */
@@ -57,6 +59,11 @@ export async function restoreUserData(dir: string): Promise<void> {
     showSnackbar({ text: "深渊数据恢复失败", color: "error" });
     errNum++;
   }
+  const restoreCombat = await TSUserCombat.restoreCombat(dir);
+  if (!restoreCombat) {
+    showSnackbar({ text: "真境剧诗数据恢复失败", color: "error" });
+    errNum++;
+  }
   const restoreGacha = await TSUserGacha.restoreUigf(dir);
   if (!restoreGacha) {
     showSnackbar({ text: "祈愿数据恢复失败", color: "error" });
diff --git a/src/web/request/TGRequest.ts b/src/web/request/TGRequest.ts
index 62b87d58..4e33310b 100644
--- a/src/web/request/TGRequest.ts
+++ b/src/web/request/TGRequest.ts
@@ -1,7 +1,7 @@
 /**
  * @file web/request/TGRequest.ts
  * @description 应用用到的请求函数
- * @since Beta v0.6.2
+ * @since Beta v0.6.3
  */
 
 import { genAuthkey, genAuthkey2 } from "./genAuthkey.js";
@@ -17,6 +17,7 @@ import { getGachaLog } from "./getGachaLog.js";
 import { getGameAccountsByCookie, getGameAccountsBySToken } from "./getGameAccounts.js";
 import { getGameRecord } from "./getGameRecord.js";
 import { getLTokenBySToken } from "./getLToken.js";
+import { getRoleCombat } from "./getRoleCombat.js";
 import { getStokenByGameToken, getTokenBySToken } from "./getStoken.js";
 import { getUserCollect } from "./getUserCollect.js";
 import { getUserInfoByCookie } from "./getUserInfo.js";
@@ -45,6 +46,7 @@ const TGRequest = {
       getAvatarIndex,
       getAvatarList,
       getAvatarDetail,
+      getCombat: getRoleCombat,
     },
     bySToken: {
       update: getTokenBySToken,