mirror of
https://github.com/BTMuli/TeyvatGuide.git
synced 2025-12-12 09:18:14 +08:00
✨ 剧诗统计浮窗
This commit is contained in:
@@ -33,7 +33,7 @@ import { onMounted, ref } from "vue";
|
||||
|
||||
import { AppCharacterData } from "../../data/index.js";
|
||||
import { AbyssDataItem } from "../../pages/WIKI/Abyss.vue";
|
||||
import TItemBox, { TItemBoxData } from "../app/t-item-box.vue";
|
||||
import TItemBox, { type TItemBoxData } from "../app/t-item-box.vue";
|
||||
|
||||
interface HtaTabHoldProps {
|
||||
data: AbyssDataItem<TGApp.Plugins.Hutao.Abyss.AvatarHold[]>;
|
||||
|
||||
@@ -35,7 +35,7 @@ interface HtaTabUpProps {
|
||||
|
||||
interface HtaTabUpData {
|
||||
Floor: number;
|
||||
Ranks: Array<AbyssDataItem<{ Item: number; Rate: number }>>;
|
||||
Ranks: Array<AbyssDataItem<TGApp.Plugins.Hutao.Base.Rate>>;
|
||||
}
|
||||
|
||||
const props = defineProps<HtaTabUpProps>();
|
||||
@@ -49,7 +49,7 @@ onMounted(async () => {
|
||||
const floorLast = props.data.last.find((f) => f.Floor === floor.Floor);
|
||||
const floorRank = {
|
||||
Floor: floor.Floor,
|
||||
Ranks: <Array<AbyssDataItem<{ Item: number; Rate: number }>>>[],
|
||||
Ranks: <Array<AbyssDataItem<TGApp.Plugins.Hutao.Base.Rate>>>[],
|
||||
};
|
||||
floor.Ranks.sort((a, b) => b.Rate - a.Rate);
|
||||
for (const rank of floor.Ranks) {
|
||||
|
||||
@@ -9,14 +9,14 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, computed } from "vue";
|
||||
import { computed, onMounted, ref } from "vue";
|
||||
|
||||
import { AppCharacterData } from "../../data/index.js";
|
||||
import { AbyssDataItem } from "../../pages/WIKI/Abyss.vue";
|
||||
import TItemBox, { type TItemBoxData } from "../app/t-item-box.vue";
|
||||
|
||||
interface TibWikiAbyssProps {
|
||||
modelValue: AbyssDataItem<{ Item: number; Rate: number }>;
|
||||
export interface TibWikiAbyssProps {
|
||||
modelValue: AbyssDataItem<TGApp.Plugins.Hutao.Base.Rate>;
|
||||
}
|
||||
|
||||
const props = defineProps<TibWikiAbyssProps>();
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
<div class="tc-content">
|
||||
<TCalendarBirth />
|
||||
<div class="calendar-grid">
|
||||
<TItemBoxData
|
||||
<TItemBox
|
||||
v-for="item in renderItems"
|
||||
:key="item.id"
|
||||
@click="selectItem(item)"
|
||||
@@ -57,7 +57,7 @@ import { onMounted, ref, watch } from "vue";
|
||||
|
||||
import { AppCalendarData } from "../../data/index.js";
|
||||
import { timestampToDate } from "../../utils/toolFunc.js";
|
||||
import type { TItemBoxData } from "../app/t-item-box.vue";
|
||||
import TItemBox, { type TItemBoxData } from "../app/t-item-box.vue";
|
||||
|
||||
import TCalendarBirth from "./ph-calendar-birth.vue";
|
||||
import ToCalendar from "./ph-calendar-overlay.vue";
|
||||
|
||||
126
src/components/userCombat/tuc-overlay.vue
Normal file
126
src/components/userCombat/tuc-overlay.vue
Normal file
@@ -0,0 +1,126 @@
|
||||
<template>
|
||||
<TOverlay v-model="visible" hide :to-click="onCancel" blur-val="20px">
|
||||
<div class="tuc-overlay-box" v-if="data">
|
||||
<div class="tuc-overlay-top">
|
||||
<span class="tuc-overlay-title" @click="share()">
|
||||
真境剧诗统计-第{{ data.ScheduleId }}期
|
||||
</span>
|
||||
<span class="tuc-overlay-sub">
|
||||
<span>共{{ data.RecordTotal }}条数据 | </span>
|
||||
<span>更新于{{ timestampToDate(data.Timestamp) }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="tuc-overlay-content">
|
||||
<TItemBox v-for="(item, index) in raw" :key="index" :model-value="getBoxData(item)" />
|
||||
</div>
|
||||
</div>
|
||||
</TOverlay>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { computed } from "vue";
|
||||
|
||||
import { AppCharacterData } from "../../data/index.js";
|
||||
import { generateShareImg } from "../../utils/TGShare.js";
|
||||
import { timestampToDate } from "../../utils/toolFunc.js";
|
||||
import TItemBox, { TItemBoxData } from "../app/t-item-box.vue";
|
||||
import TOverlay from "../app/t-overlay.vue";
|
||||
import showLoading from "../func/loading.js";
|
||||
|
||||
interface TucOverlayProps {
|
||||
modelValue: boolean;
|
||||
data: TGApp.Plugins.Hutao.Combat.Data | undefined;
|
||||
}
|
||||
|
||||
type TucOverlayEmits = (e: "update:modelValue", v: boolean) => void;
|
||||
const props = defineProps<TucOverlayProps>();
|
||||
const emits = defineEmits<TucOverlayEmits>();
|
||||
|
||||
const visible = computed<boolean>({
|
||||
get: () => props.modelValue,
|
||||
set: (v) => emits("update:modelValue", v),
|
||||
});
|
||||
const raw = computed<TGApp.Plugins.Hutao.Base.Rate[]>(() => {
|
||||
const res: TGApp.Plugins.Hutao.Base.Rate[] = props.data.BackupAvatarRates;
|
||||
return res.sort((a, b) => b.Rate - a.Rate);
|
||||
});
|
||||
|
||||
function onCancel(): void {
|
||||
visible.value = false;
|
||||
}
|
||||
|
||||
function getBoxData(item: TGApp.Plugins.Hutao.Base.Rate): TItemBoxData {
|
||||
const avatar = AppCharacterData.find((i) => i.id === item.Item);
|
||||
return {
|
||||
bg: `/icon/bg/${avatar?.star}-Star.webp`,
|
||||
clickable: false,
|
||||
display: "outer",
|
||||
icon: `/WIKI/character/${item.Item}.webp`,
|
||||
innerHeight: 20,
|
||||
innerText: avatar?.name ?? "旅行者",
|
||||
outerText: `${(item.Rate * 100).toFixed(3)}%`,
|
||||
outerHeight: 25,
|
||||
lt:
|
||||
avatar === undefined
|
||||
? ""
|
||||
: avatar.element !== ""
|
||||
? `/icon/element/${avatar.element}元素.webp`
|
||||
: `/icon/weapon/${avatar.weapon}.webp`,
|
||||
ltSize: "15px",
|
||||
size: "75px",
|
||||
height: "100px",
|
||||
};
|
||||
}
|
||||
|
||||
async function share(): Promise<void> {
|
||||
showLoading.start("正在生成分享图");
|
||||
const element = <HTMLElement>document.querySelector(".tuc-overlay-box");
|
||||
const fileName = `真境剧诗_${new Date().getTime()}.png`;
|
||||
await generateShareImg(fileName, element, 1.2, true);
|
||||
showLoading.end();
|
||||
}
|
||||
</script>
|
||||
<style lang="css" scoped>
|
||||
.tuc-overlay-box {
|
||||
display: flex;
|
||||
width: 800px;
|
||||
height: 600px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding: 10px;
|
||||
border: 1px solid var(--common-shadow-2);
|
||||
border-radius: 10px;
|
||||
background: var(--app-page-bg);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.tuc-overlay-top {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
align-items: flex-end;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.tuc-overlay-title {
|
||||
cursor: pointer;
|
||||
font-family: var(--font-title);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.tuc-overlay-sub {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
opacity: 0.8;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.tuc-overlay-content {
|
||||
display: grid;
|
||||
width: 100%;
|
||||
padding-right: 10px;
|
||||
gap: 10px;
|
||||
grid-template-columns: repeat(auto-fill, minmax(75px, 1fr));
|
||||
}
|
||||
</style>
|
||||
@@ -102,7 +102,7 @@
|
||||
<script lang="ts" setup>
|
||||
import { getVersion } from "@tauri-apps/api/app";
|
||||
import { storeToRefs } from "pinia";
|
||||
import { onMounted, ref, watch, computed } from "vue";
|
||||
import { computed, onMounted, ref, watch } from "vue";
|
||||
|
||||
import showDialog from "../../components/func/dialog.js";
|
||||
import showLoading from "../../components/func/loading.js";
|
||||
@@ -112,7 +112,6 @@ import TuaAvatarBox from "../../components/userAvatar/tua-avatar-box.vue";
|
||||
import TuaDetailOverlay from "../../components/userAvatar/tua-detail-overlay.vue";
|
||||
import { AppCharacterData } from "../../data/index.js";
|
||||
import TSUserAvatar from "../../plugins/Sqlite/modules/userAvatar.js";
|
||||
import TSUserRecord from "../../plugins/Sqlite/modules/userRecord.js";
|
||||
import { useUserStore } from "../../store/modules/user.js";
|
||||
import TGLogger from "../../utils/TGLogger.js";
|
||||
import { generateShareImg } from "../../utils/TGShare.js";
|
||||
@@ -277,17 +276,14 @@ async function refresh(): Promise<void> {
|
||||
loadData.value = false;
|
||||
return;
|
||||
}
|
||||
showLoading.update("正在更新角色数据...", "正在获取战绩数据");
|
||||
const indexRes = await TakumiRecordGenshinApi.index(userStore.cookie.value, user.value);
|
||||
showLoading.update("正在更新角色数据...", "正在刷新首页数据");
|
||||
const indexRes = await TakumiRecordGenshinApi.index(userStore.cookie.value, user.value, 1);
|
||||
if ("retcode" in indexRes) {
|
||||
showSnackbar.error(`[${indexRes.retcode}] ${indexRes.message}`);
|
||||
await TGLogger.Error(JSON.stringify(indexRes.message));
|
||||
showLoading.end();
|
||||
loadData.value = false;
|
||||
return;
|
||||
} else {
|
||||
showLoading.update("正在更新角色数据...", "正在保存战绩数据");
|
||||
await TSUserRecord.saveRecord(Number(user.value.gameUid), indexRes);
|
||||
}
|
||||
showLoading.update("正在更新角色数据...", "正在获取角色列表");
|
||||
const listRes = await TakumiRecordGenshinApi.character.list(userStore.cookie.value, user.value);
|
||||
|
||||
@@ -17,6 +17,12 @@
|
||||
</template>
|
||||
<span>深境螺旋</span>
|
||||
</v-btn>
|
||||
<v-btn :rounded="true" class="uc-btn" @click="loadWiki()">
|
||||
<template #prepend>
|
||||
<img src="/source/UI/wikiAbyss.webp" alt="abyss" />
|
||||
</template>
|
||||
<span>统计数据</span>
|
||||
</v-btn>
|
||||
</div>
|
||||
</template>
|
||||
<template #append>
|
||||
@@ -88,11 +94,12 @@
|
||||
<span>暂无数据,请尝试刷新</span>
|
||||
</div>
|
||||
</div>
|
||||
<TucOverlay v-model="showData" :data="cloudCombat" />
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { getVersion } from "@tauri-apps/api/app";
|
||||
import { storeToRefs } from "pinia";
|
||||
import { onMounted, ref, watch, computed } from "vue";
|
||||
import { computed, onMounted, ref, watch } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
|
||||
import TSubLine from "../../components/app/t-subline.vue";
|
||||
@@ -100,6 +107,7 @@ import showDialog from "../../components/func/dialog.js";
|
||||
import showLoading from "../../components/func/loading.js";
|
||||
import showSnackbar from "../../components/func/snackbar.js";
|
||||
import TucAvatars from "../../components/userCombat/tuc-avatars.vue";
|
||||
import TucOverlay from "../../components/userCombat/tuc-overlay.vue";
|
||||
import TucOverview from "../../components/userCombat/tuc-overview.vue";
|
||||
import TucRound from "../../components/userCombat/tuc-round.vue";
|
||||
import Hutao from "../../plugins/Hutao/index.js";
|
||||
@@ -118,6 +126,8 @@ const user = computed<TGApp.Sqlite.Account.Game>(() => userStore.account.value);
|
||||
|
||||
const localCombat = ref<TGApp.Sqlite.Combat.SingleTable[]>([]);
|
||||
const combatRef = ref<HTMLElement>(<HTMLElement>{});
|
||||
const cloudCombat = ref<TGApp.Plugins.Hutao.Combat.Data>();
|
||||
const showData = ref<boolean>(false);
|
||||
const version = ref<string>();
|
||||
const router = useRouter();
|
||||
|
||||
@@ -156,6 +166,16 @@ async function loadCombat(): Promise<void> {
|
||||
if (localCombat.value.length > 0) userTab.value = localCombat.value[0].id;
|
||||
}
|
||||
|
||||
async function loadWiki(): Promise<void> {
|
||||
showLoading.start("正在加载统计数据...");
|
||||
const res = await Hutao.Combat.data();
|
||||
if (res === undefined) showSnackbar.error("未获取到剧诗数据");
|
||||
else cloudCombat.value = <TGApp.Plugins.Hutao.Combat.Data>res;
|
||||
showLoading.end();
|
||||
showSnackbar.success("成功获取统计数据");
|
||||
showData.value = true;
|
||||
}
|
||||
|
||||
async function refreshCombat(): Promise<void> {
|
||||
if (!userStore.cookie.value) {
|
||||
showSnackbar.error("未登录");
|
||||
|
||||
@@ -156,7 +156,7 @@ async function refreshRecord(): Promise<void> {
|
||||
}
|
||||
await TGLogger.Info(`[UserRecord][refresh][${user.value.gameUid}] 获取战绩数据成功`);
|
||||
await TGLogger.Info(`[UserRecord][refresh][${user.value.gameUid}]`, false);
|
||||
await TGLogger.Info(JSON.stringify(res), false);
|
||||
console.log(res);
|
||||
showLoading.update("正在保存战绩数据");
|
||||
await TSUserRecord.saveRecord(Number(user.value.gameUid), res);
|
||||
showLoading.update("正在加载战绩数据");
|
||||
|
||||
@@ -15,7 +15,7 @@ const CombatUrl = "https://homa.snapgenshin.com/RoleCombat/";
|
||||
*/
|
||||
export async function getCombatStatistic(
|
||||
isLast: boolean = false,
|
||||
): Promise<TGApp.Plugins.Hutao.Combat.Data> {
|
||||
): Promise<TGApp.Plugins.Hutao.Combat.Data | undefined> {
|
||||
const url = `${CombatUrl}Statistics`;
|
||||
const resp = await TGHttp<TGApp.Plugins.Hutao.Combat.Response>(url, {
|
||||
method: "GET",
|
||||
|
||||
4
src/plugins/Hutao/types/Combat.d.ts
vendored
4
src/plugins/Hutao/types/Combat.d.ts
vendored
@@ -49,12 +49,16 @@ declare namespace TGApp.Plugins.Hutao.Combat {
|
||||
* @description 数据
|
||||
* @since Beta v0.6.3
|
||||
* @interface Data
|
||||
* @property {string} ScheduleId 期数
|
||||
* @property {number} RecordTotal 总数
|
||||
* @property {number} Timestamp 时间戳
|
||||
* @property {Array<TGApp.Plugins.Hutao.Base.Rate>} BackupAvatarRates 使用率
|
||||
* @return Data
|
||||
*/
|
||||
interface Data {
|
||||
ScheduleId: string;
|
||||
RecordTotal: number;
|
||||
Timestamp: number;
|
||||
BackupAvatarRates: Array<TGApp.Plugins.Hutao.Base.Rate>;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -65,15 +65,17 @@ async function characterList(
|
||||
* @since Beta v0.6.3
|
||||
* @param {TGApp.App.Account.Cookie} cookie Cookie
|
||||
* @param {TGApp.Sqlite.Account.Game} user 用户
|
||||
* @param {number} listType 列表类型
|
||||
* @returns {Promise<TGApp.Game.Record.FullData | TGApp.BBS.Response.Base>}
|
||||
*/
|
||||
async function index(
|
||||
cookie: TGApp.App.Account.Cookie,
|
||||
user: TGApp.Sqlite.Account.Game,
|
||||
listType: number = 0,
|
||||
): Promise<TGApp.Game.Record.FullData | TGApp.BBS.Response.Base> {
|
||||
const url = `${trgAbu}index`;
|
||||
const ck = { account_id: cookie.account_id, cookie_token: cookie.cookie_token };
|
||||
const params = { avatar_list_type: 1, role_id: user.gameUid, server: user.region };
|
||||
const params = { avatar_list_type: listType, role_id: user.gameUid, server: user.region };
|
||||
const header = getRequestHeader(ck, "GET", params, "common");
|
||||
const resp = await TGHttp<TGApp.Game.Record.Response | TGApp.BBS.Response.Base>(url, {
|
||||
method: "GET",
|
||||
|
||||
Reference in New Issue
Block a user