🐛 调整部分UI，修复角色详情刷新异常

BTMuli · Dec 11, 2024 · 45debc8 · 45debc8
1 parent 702fda9
commit 45debc8
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 53 deletions.
diff --git a/src/components/app/t-item-box.vue b/src/components/app/t-item-box.vue
@@ -51,11 +51,6 @@ export type TItemBoxData = {
 type TItemBoxProps = { modelValue: TItemBoxData };
 
 const props = defineProps<TItemBoxProps>();
-const size = props.modelValue.size;
-const height = props.modelValue.height;
-const cursor = props.modelValue.clickable ? "pointer" : "default";
-const sizeLt = props.modelValue.ltSize;
-const sizeRt = props.modelValue.rtSize;
 const sizeInner = `${props.modelValue.innerHeight ?? 0}px`;
 const fontSizeInner = props.modelValue.innerHeight ? `${props.modelValue.innerHeight / 2}px` : "0";
 const sizeOuter = `${props.modelValue.outerHeight ?? 0}px`;
@@ -65,18 +60,18 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
 <style lang="css" scoped>
 .tib-box {
   position: relative;
-  width: v-bind(size);
-  height: v-bind(height);
-  cursor: v-bind(cursor);
+  width: v-bind("props.modelValue.size");
+  height: v-bind("props.modelValue.height");
+  cursor: v-bind('props.modelValue.clickable ? "pointer" : "default"');
 }
 
 .tib-bg {
   position: absolute;
   top: 0;
   left: 0;
   overflow: hidden;
-  width: v-bind(size);
-  height: v-bind(size);
+  width: v-bind("props.modelValue.size");
+  height: v-bind("props.modelValue.size");
   border-radius: 5px;
 }
 
@@ -89,8 +84,8 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
 .tib-icon {
   position: relative;
   overflow: hidden;
-  width: v-bind(size);
-  height: v-bind(size);
+  width: v-bind("props.modelValue.size");
+  height: v-bind("props.modelValue.size");
   border-radius: 5px;
 }
 
@@ -105,8 +100,8 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
   top: 0;
   left: 0;
   display: flex;
-  width: v-bind(size);
-  height: v-bind(size);
+  width: v-bind("props.modelValue.size");
+  height: v-bind("props.modelValue.size");
   flex-direction: column;
   align-items: center;
   justify-content: center;
@@ -118,8 +113,8 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
   top: 3%;
   left: 3%;
   display: flex;
-  width: v-bind(sizeLt);
-  height: v-bind(sizeLt);
+  width: v-bind("props.modelValue.ltSize");
+  height: v-bind("props.modelValue.ltSize");
   align-items: center;
   justify-content: center;
 }
@@ -135,8 +130,8 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
   top: 0;
   right: 0;
   display: flex;
-  width: v-bind(sizeRt);
-  height: v-bind(sizeRt);
+  width: v-bind("props.modelValue.rtSize");
+  height: v-bind("props.modelValue.rtSize");
   align-items: center;
   justify-content: center;
   background: rgb(0 0 0 / 40%);
@@ -152,7 +147,7 @@ const innerBlur = props.modelValue.innerBlur ?? "0";
   left: 0;
   display: flex;
   width: 100%;
-  height: v-bind(sizeInner);
+  height: v-bind("props.modelValue.innerHeight ?? 0") px;
   align-items: center;
   justify-content: center;
   -webkit-backdrop-filter: blur(v-bind(innerBlur));

diff --git a/src/components/pageConfig/tc-userBadge.vue b/src/components/pageConfig/tc-userBadge.vue
@@ -532,6 +532,7 @@ async function clearUser(user: TGApp.App.Account.User): Promise<void> {
 .tcu-box {
   border-radius: 10px;
   background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
+  color: var(--tgc-white-1);
 }
 
 .tcu-btn {

diff --git a/src/components/userAvatar/tua-avatar-box.vue b/src/components/userAvatar/tua-avatar-box.vue
@@ -130,8 +130,10 @@ function getWeaponTitle(): string {
   title.push(`${weapon.rarity}星 精炼${weapon.affix_level} Lv.${weapon.level}`);
   const propMain = userStore.getProp(weapon.main_property.property_type);
   title.push(`${propMain !== false ? propMain.name : "未知属性"} - ${weapon.main_property.final}`);
-  const propSub = userStore.getProp(weapon.sub_property.property_type);
-  title.push(`${propSub !== false ? propSub.name : "未知属性"} - ${weapon.sub_property.final}`);
+  if (weapon.sub_property !== null) {
+    const propSub = userStore.getProp(weapon.sub_property.property_type);
+    title.push(`${propSub !== false ? propSub.name : "未知属性"} - ${weapon.sub_property.final}`);
+  }
   return title.join("\n");
 }
 </script>
@@ -144,6 +146,7 @@ function getWeaponTitle(): string {
   border: 1px inset var(--common-shadow-2);
   border-radius: 5px;
   background: var(--box-bg-2);
+  color: var(--tgc-white-1);
   cursor: pointer;
   row-gap: 5px;
 }

diff --git a/src/pages/User/Characters.vue b/src/pages/User/Characters.vue
@@ -118,9 +118,7 @@ import { generateShareImg } from "../../utils/TGShare.js";
 import { timestampToDate } from "../../utils/toolFunc.js";
 import TakumiRecordGenshinApi from "../../web/request/recordReq.js";
 
-// store
-const userStore = storeToRefs(useUserStore());
-const user = computed<TGApp.Sqlite.Account.Game>(() => userStore.account.value);
+const { cookie, account, propMap } = storeToRefs(useUserStore());
 
 // loading
 const loadData = ref<boolean>(false);
@@ -214,9 +212,9 @@ function getOrderedList(
 
 async function loadUid(): Promise<void> {
   uidList.value = await TSUserAvatar.getAllUid();
-  if (uidList.value.length === 0) uidList.value = [user.value.gameUid];
-  if (uidList.value.includes(user.value.gameUid)) {
-    uidCur.value = user.value.gameUid;
+  if (uidList.value.length === 0) uidList.value = [account.value.gameUid];
+  if (uidList.value.includes(account.value.gameUid)) {
+    uidCur.value = account.value.gameUid;
   } else {
     uidCur.value = uidList.value[0];
   }
@@ -239,7 +237,10 @@ async function loadRole(): Promise<void> {
 }
 
 async function refresh(): Promise<void> {
-  if (!user.value) return;
+  if (!account.value) {
+    showSnackbar.warn("未获取到游戏账户");
+    return;
+  }
   if (showSelect.value) {
     showSelect.value = false;
     await new Promise((resolve) => setTimeout(resolve, 500));
@@ -248,7 +249,7 @@ async function refresh(): Promise<void> {
     showOverlay.value = false;
     await new Promise((resolve) => setTimeout(resolve, 500));
   }
-  if (uidCur.value && uidCur.value !== user.value.gameUid) {
+  if (uidCur.value && uidCur.value !== account.value.gameUid) {
     const switchCheck = await showDialog.check(
       "是否切换游戏账户",
       `确认则尝试切换至${uidCur.value}`,
@@ -260,24 +261,24 @@ async function refresh(): Promise<void> {
     }
     const freshCheck = await showDialog.check(
       "是否刷新角色数据",
-      `用户${user.value.gameUid}与当前UID${uidCur.value}不一致`,
+      `用户${account.value.gameUid}与当前UID${uidCur.value}不一致`,
     );
     if (!freshCheck) {
       showSnackbar.cancel("已取消角色数据刷新");
       return;
     }
   }
-  await TGLogger.Info(`[Character][refreshRoles][${user.value.gameUid}] 正在更新角色数据`);
-  showLoading.start("正在更新角色数据...", `UID: ${user.value.gameUid}`);
+  await TGLogger.Info(`[Character][refreshRoles][${account.value.gameUid}] 正在更新角色数据`);
+  showLoading.start("正在更新角色数据...", `UID: ${account.value.gameUid}`);
   loadData.value = true;
-  if (!userStore.cookie.value) {
+  if (!cookie.value) {
     showLoading.end();
     showSnackbar.warn("请先登录");
     loadData.value = false;
     return;
   }
   showLoading.update("正在更新角色数据...", "正在刷新首页数据");
-  const indexRes = await TakumiRecordGenshinApi.index(userStore.cookie.value, user.value, 1);
+  const indexRes = await TakumiRecordGenshinApi.index(cookie.value, account.value, 1);
   if ("retcode" in indexRes) {
     showSnackbar.error(`[${indexRes.retcode}] ${indexRes.message}`);
     await TGLogger.Error(JSON.stringify(indexRes.message));
@@ -286,60 +287,57 @@ async function refresh(): Promise<void> {
     return;
   }
   showLoading.update("正在更新角色数据...", "正在获取角色列表");
-  const listRes = await TakumiRecordGenshinApi.character.list(userStore.cookie.value, user.value);
+  const listRes = await TakumiRecordGenshinApi.character.list(cookie.value, account.value);
   if (!Array.isArray(listRes)) {
     showSnackbar.error(`[${listRes.retcode}] ${listRes.message}`);
-    await TGLogger.Error(`[Character][refreshRoles][${user.value.gameUid}] 获取角色列表失败`);
+    await TGLogger.Error(`[Character][refreshRoles][${account.value.gameUid}] 获取角色列表失败`);
     await TGLogger.Error(
-      `[Character][refreshRoles][${user.value.gameUid}] ${listRes.retcode} ${listRes.message}`,
+      `[Character][refreshRoles][${account.value.gameUid}] ${listRes.retcode} ${listRes.message}`,
     );
     showLoading.end();
     loadData.value = false;
     return;
   }
   const idList = listRes.map((i) => i.id.toString());
   showLoading.update("正在更新角色数据...", `共${idList.length}个角色`);
-  const res = await TakumiRecordGenshinApi.character.detail(
-    userStore.cookie.value,
-    user.value,
-    idList,
-  );
+  const res = await TakumiRecordGenshinApi.character.detail(cookie.value, account.value, idList);
   if ("retcode" in res) {
     showSnackbar.error(`[${res.retcode}] ${res.message}`);
-    await TGLogger.Error(`[Character][refreshRoles][${user.value.gameUid}] 获取角色数据失败`);
+    await TGLogger.Error(`[Character][refreshRoles][${account.value.gameUid}] 获取角色数据失败`);
     await TGLogger.Error(
-      `[Character][refreshRoles][${user.value.gameUid}] ${res.retcode} ${res.message}`,
+      `[Character][refreshRoles][${account.value.gameUid}] ${res.retcode} ${res.message}`,
     );
     showLoading.end();
     loadData.value = false;
     return;
   }
-  userStore.propMap.value = res.property_map;
+  propMap.value = res.property_map;
   showLoading.update("正在更新角色数据...", "正在保存角色数据");
-  await TSUserAvatar.saveAvatars(user.value.gameUid, res.list);
-  await TGLogger.Info(`[Character][refreshRoles][${user.value.gameUid}] 成功更新角色数据`);
+  await TSUserAvatar.saveAvatars(account.value.gameUid, res.list);
+  await TGLogger.Info(`[Character][refreshRoles][${account.value.gameUid}] 成功更新角色数据`);
   await TGLogger.Info(
-    `[Character][refreshRoles][${user.value.gameUid}] 共更新${res.list.length}个角色`,
+    `[Character][refreshRoles][${account.value.gameUid}] 共更新${res.list.length}个角色`,
   );
+  await loadUid();
   await loadRole();
   showLoading.end();
   loadData.value = false;
 }
 
 async function share(): Promise<void> {
-  if (!user.value || isEmpty.value) {
+  if (!account.value || isEmpty.value) {
     showSnackbar.warn("暂无数据");
     return;
   }
-  await TGLogger.Info(`[Character][shareRoles][${user.value.gameUid}] 正在生成分享图片`);
+  await TGLogger.Info(`[Character][shareRoles][${account.value.gameUid}] 正在生成分享图片`);
   const rolesBox = <HTMLElement>document.querySelector(".uc-box");
-  const fileName = `【角色列表】-${user.value.gameUid}`;
+  const fileName = `【角色列表】-${account.value.gameUid}`;
   showLoading.start("正在生成图片", `${fileName}.png`);
   loadShare.value = true;
   await generateShareImg(fileName, rolesBox);
   showLoading.end();
   loadShare.value = false;
-  await TGLogger.Info(`[Character][shareRoles][${user.value.gameUid}] 生成分享图片成功`);
+  await TGLogger.Info(`[Character][shareRoles][${account.value.gameUid}] 生成分享图片成功`);
 }
 
 async function deleteUid(): Promise<void> {

diff --git a/src/types/Game/Avatar.d.ts b/src/types/Game/Avatar.d.ts
@@ -175,7 +175,7 @@ declare namespace TGApp.Game.Avatar {
     desc: string;
     affix_level: number;
     main_property: Prop;
-    sub_property: Prop;
+    sub_property: Prop | null;
   }
 
   /**