✨ 前瞻兑换码查看

src/components/main/t-gamenav.vue

@@ -4,19 +4,25 @@
       <img alt="navIcon" :src="navItem.icon" />
       <span>{{ navItem.name }}</span>
     </div>
+    <div v-if="props.modelValue === 2 && hasNav" class="tgn-nav">
+      <v-btn size="25" @click="tryGetCode" title="查看兑换码" icon="mdi-code-tags-check"></v-btn>
+    </div>
+    <ToLivecode v-model="showOverlay" :data="codeData" />
   </div>
 </template>
 <script lang="ts" setup>
 import { emit } from "@tauri-apps/api/event";
-import { onMounted, ref, watch } from "vue";
+import { computed, onMounted, ref, watch } from "vue";
 
 import Mys from "../../plugins/Mys/index.js";
 import { useAppStore } from "../../store/modules/app.js";
 import TGClient from "../../utils/TGClient.js";
 import TGLogger from "../../utils/TGLogger.js";
 import { createPost } from "../../utils/TGWindow.js";
+import TGRequest from "../../web/request/TGRequest.js";
 import showConfirm from "../func/confirm.js";
 import showSnackbar from "../func/snackbar.js";
+import ToLivecode from "../overlay/to-livecode.vue";
 
 interface TGameNavProps {
   modelValue: number;
@@ -28,6 +34,13 @@ const props = withDefaults(defineProps<TGameNavProps>(), {
 
 const appStore = useAppStore();
 const nav = ref<TGApp.BBS.Navigator.Navigator[]>([]);
+const codeData = ref<TGApp.BBS.Navigator.CodeData[]>([]);
+const showOverlay = ref<boolean>(false);
+
+const hasNav = computed<boolean>(() => {
+  if (props.modelValue !== 2) return false;
+  return nav.value.find((item) => item.name === "前瞻直播") !== undefined;
+});
 
 onMounted(async () => await loadNav());
 
@@ -40,6 +53,34 @@ async function loadNav(): Promise<void> {
   nav.value = await Mys.Posts.nav(props.modelValue);
 }
 
+async function tryGetCode(): Promise<void> {
+  if (props.modelValue !== 2) return;
+  const navFind = nav.value.find((item) => item.name === "前瞻直播");
+  if (!navFind) return;
+  const actId = new URL(navFind.app_path).searchParams.get("act_id");
+  if (!actId) {
+    showSnackbar({
+      text: "未找到活动ID",
+      color: "warn",
+    });
+    return;
+  }
+  const res = await TGRequest.Nav.getCode(actId);
+  if (!Array.isArray(res)) {
+    showSnackbar({
+      text: `[${res.retcode}] ${res.message}`,
+      color: "warn",
+    });
+    return;
+  }
+  codeData.value = res;
+  showSnackbar({
+    text: "获取兑换码成功",
+    color: "success",
+  });
+  showOverlay.value = true;
+}
+
 async function toNav(item: TGApp.BBS.Navigator.Navigator): Promise<void> {
   if (!appStore.isLogin) {
     showSnackbar({

src/components/overlay/to-livecode.vue

@@ -0,0 +1,72 @@
+<template>
+  <TOverlay v-model="visible" hide :to-click="onCancel" blur-val="20px">
+    <div class="tolc-box">
+      <div class="tolc-title">兑换码</div>
+      <v-list-item v-for="(item, index) in props.data" :key="index">
+        <template #title>
+          {{ item.code }}
+        </template>
+        <template #subtitle>
+          <div v-html="item.title"></div>
+          <span>{{ timestampToDate(Number(item.to_get_time) * 1000) }} 过期</span>
+        </template>
+        <template #prepend>
+          <img :src="item.img" alt="icon" />
+        </template>
+        <template #append>
+          <v-btn @click="copy(item.code)" icon="mdi-content-copy" variant="outlined"></v-btn>
+        </template>
+      </v-list-item>
+    </div>
+  </TOverlay>
+</template>
+<script setup lang="ts">
+import { computed } from "vue";
+
+import { timestampToDate } from "../../utils/toolFunc.js";
+import showSnackbar from "../func/snackbar.js";
+import TOverlay from "../main/t-overlay.vue";
+
+interface ToLiveCodeProps {
+  data: TGApp.BBS.Navigator.CodeData[];
+  modelValue: boolean;
+}
+
+type ToLiveCodeEmits = (e: "update:modelValue", value: boolean) => void;
+
+const props = withDefaults(defineProps<ToLiveCodeProps>(), {
+  data: <TGApp.BBS.Navigator.CodeData[]>[],
+  modelValue: false,
+});
+const emits = defineEmits<ToLiveCodeEmits>();
+
+const visible = computed<boolean>({
+  get: () => props.modelValue,
+  set: (value) => {
+    emits("update:modelValue", value);
+  },
+});
+
+function onCancel(): void {
+  visible.value = false;
+}
+
+function copy(code: string): void {
+  navigator.clipboard.writeText(code);
+  showSnackbar({ text: "已复制到剪贴板", color: "success" });
+}
+</script>
+<style lang="css" scoped>
+.tolc-box {
+  padding: 10px;
+  border-radius: 10px;
+  background: var(--app-page-bg);
+}
+
+.tolc-title {
+  color: var(--common-text-title);
+  font-family: var(--font-title);
+  font-size: 20px;
+  text-align: center;
+}
+</style>

src/pages/common/Test.vue

@@ -13,65 +13,9 @@
         </div>
       </div>
     </div>
-    <h1>数据请求测试</h1>
-    <div class="btn-list">
-      <v-btn class="test-btn" @click="tryGetList">获取角色列表</v-btn>
-      <v-btn class="test-btn" @click="tryGetDetail">获取角色详情</v-btn>
-    </div>
-    <div class="test-grid">
-      <TuaAvatarBox v-for="avatar in avatarList" :key="avatar.base.id" :model-value="avatar" />
-    </div>
   </div>
 </template>
-<script lang="ts" setup>
-import { ref } from "vue";
-
-import showSnackbar from "../../components/func/snackbar.js";
-import TuaAvatarBox from "../../components/userAvatar/tua-avatar-box.vue";
-import TSUserAvatar from "../../plugins/Sqlite/modules/userAvatar.js";
-import { useUserStore } from "../../store/modules/user.js";
-import TGRequest from "../../web/request/TGRequest.js";
-
-const userStore = useUserStore();
-const avatarList = ref<TGApp.Game.Avatar.DetailList[]>();
-
-async function tryGetList(): Promise<void> {
-  const ck = userStore.cookie;
-  if (!userStore.cookie) {
-    showSnackbar({ text: "请先登录！", color: "warn" });
-    return;
-  }
-  const cookie = { account_id: ck!.account_id, cookie_token: ck!.cookie_token };
-  const account = userStore.account;
-  const res = await TGRequest.User.byCookie.getAvatarList(cookie, account.gameUid);
-  if (!Array.isArray(res)) {
-    showSnackbar({ text: `[${res.retcode}] ${res.message}`, color: "error" });
-    return;
-  }
-  console.log(res);
-  showSnackbar({ text: "获取成功！", color: "success" });
-}
-
-async function tryGetDetail(): Promise<void> {
-  const ck = userStore.cookie;
-  if (!userStore.cookie) {
-    showSnackbar({ text: "请先登录！", color: "warn" });
-    return;
-  }
-  const cookie = { account_id: ck!.account_id, cookie_token: ck!.cookie_token };
-  const account = userStore.account;
-  const idList = await TSUserAvatar.getAllAvatarId();
-  const res = await TGRequest.User.byCookie.getAvatarDetail(cookie, account.gameUid, idList);
-  if ("retcode" in res) {
-    showSnackbar({ text: `[${res.retcode}] ${res.message}`, color: "error" });
-    return;
-  }
-  console.log(res);
-  showSnackbar({ text: "获取成功！", color: "success" });
-  userStore.propMap = res.property_map;
-  avatarList.value = res.list;
-}
-</script>
+<script lang="ts" setup></script>
 <style lang="css" scoped>
 .test-box {
   display: flex;
@@ -127,10 +71,4 @@ async function tryGetDetail(): Promise<void> {
 .test-4 {
   background: var(--box-bg-4);
 }
-
-.test-grid {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 10px;
-}
 </style>

src/types/BBS/Navigator.d.ts

@@ -264,4 +264,35 @@ declare namespace TGApp.BBS.Navigator {
       user_status: unknown;
     };
   }
+
+  /**
+   * @description 兑换码接口返回数据
+   * @interface CodeResponse
+   * @since Beta v0.5.3
+   * @extends TGApp.BBS.Response.BaseWithData
+   * @property {CodeData[]} data.code_list - 兑换码数据
+   * @return CodeResponse
+   */
+  interface CodeResponse extends TGApp.BBS.Response.BaseWithData {
+    data: {
+      code_list: CodeData[];
+    };
+  }
+
+  /**
+   * @description 兑换码数据
+   * @interface CodeData
+   * @since Beta v0.5.3
+   * @property {string} title - 兑换码标题，为html字符串
+   * @property {string} code - 兑换码
+   * @property {string} img - 兑换码图片
+   * @property {string} to_get_time - 过期时间，时间戳（单位：秒）
+   * @return CodeData
+   */
+  interface CodeData {
+    title: string;
+    code: string;
+    img: string;
+    to_get_time: string;
+  }
 }

src/web/request/TGRequest.ts

@@ -9,6 +9,7 @@ import { getAbyss } from "./getAbyss.js";
 import { getActionTicketBySToken } from "./getActionTicket.js";
 import { getAnnoContent, getAnnoList } from "./getAnno.js";
 import { getAvatarList, getAvatarDetail } from "./getAvatarDetail.js";
+import getCode from "./getCode.js";
 import { getCookieTokenByGameToken, getCookieTokenBySToken } from "./getCookieToken.js";
 import { getDeviceFp } from "./getDeviceFp.js";
 import { getGachaLog } from "./getGachaLog.js";
@@ -64,6 +65,9 @@ const TGRequest = {
       getSyncAvatarDetail,
     },
   },
+  Nav: {
+    getCode,
+  },
 };
 
 export default TGRequest;

src/web/request/getCode.ts

@@ -0,0 +1,28 @@
+/**
+ * @file web/request/getCode.ts
+ * @description 获取兑换码相关请求
+ * @since Beta v0.5.3
+ */
+
+import TGHttp from "../../utils/TGHttp.js";
+
+/**
+ * @description 获取兑换码请求
+ * @since Beta v0.5.3
+ * @param {string} act_id - 活动 id
+ * @return {Promise<TGApp.BBS.Navigator.CodeData[]|TGApp.BBS.Response.Base>}
+ */
+async function getCode(
+  act_id: string,
+): Promise<TGApp.BBS.Navigator.CodeData[] | TGApp.BBS.Response.Base> {
+  const url = "https://api-takumi-static.mihoyo.com/event/miyolive/refreshCode";
+  const header = { "x-rpc-act_id": act_id };
+  const res = await TGHttp<TGApp.BBS.Navigator.CodeResponse | TGApp.BBS.Response.Base>(url, {
+    method: "GET",
+    headers: header,
+  });
+  if (res.retcode !== 0) return <TGApp.BBS.Response.Base>res;
+  return res.data.code_list;
+}
+
+export default getCode;