♻️ 重构 userStore 用法

src/App.vue

@@ -12,6 +12,7 @@
 
 <script lang="ts" setup>
 import { app, event, fs, tauri, window as TauriWindow } from "@tauri-apps/api";
+import { storeToRefs } from "pinia";
 import { onBeforeMount, onMounted, ref } from "vue";
 import { useRouter } from "vue-router";
 
@@ -26,6 +27,7 @@ import { getBuildTime } from "./utils/TGBuild";
 import TGRequest from "./web/request/TGRequest";
 
 const appStore = useAppStore();
+const userStore = storeToRefs(useUserStore());
 const isMain = ref<boolean>(false);
 const theme = ref<string>(appStore.theme);
 const router = useRouter();
@@ -137,26 +139,26 @@ async function checkUserLoad(): Promise<void> {
   if (JSON.stringify(ckDB) !== "{}" && !appStore.isLogin) {
     appStore.isLogin = true;
   }
-  const userStore = useUserStore();
+
   const ckLocal = userStore.cookie;
   if (JSON.stringify(ckLocal) !== JSON.stringify(ckDB)) {
-    userStore.cookie = ckDB;
+    userStore.cookie.value = ckDB;
     console.info("cookie 数据已更新！");
   } else {
     console.info("cookie 数据已加载！");
   }
-  const infoLocal = userStore.getBriefInfo();
+  const infoLocal = userStore.briefInfo.value;
   const appData = await TGSqlite.getAppData();
   const infoDB = appData.find((item) => item.key === "userInfo")?.value;
   if (infoDB === undefined && JSON.stringify(infoLocal) !== "{}") {
-    await userStore.saveBriefInfo();
+    await TGSqlite.saveAppData("userInfo", JSON.stringify(infoLocal));
   } else if (infoDB !== undefined && infoLocal !== JSON.parse(infoDB)) {
-    userStore.setBriefInfo(JSON.parse(infoDB));
+    userStore.briefInfo.value = JSON.parse(infoDB);
     console.info("briefInfo 数据已更新！");
   } else {
     console.info("briefInfo 数据已加载！");
   }
-  const accountLocal = userStore.getCurAccount();
+  const accountLocal = userStore.account.value;
   const accountDB = await TGSqlite.getCurAccount();
   if (accountDB === false) {
     showSnackbar({
@@ -167,7 +169,7 @@ async function checkUserLoad(): Promise<void> {
     return;
   }
   if (accountDB !== accountLocal) {
-    userStore.setCurAccount(accountDB);
+    userStore.account.value = accountDB;
     console.info("curAccount 数据已更新！");
   } else {
     console.info("curAccount 数据已加载！");

src/components/app/t-sidebar.vue

@@ -131,7 +131,7 @@
               class="side-item-user"
               title="登录"
               @click="login"
-              v-show="userStore.cookie?.game_token === ''"
+              v-show="userStore.cookie.value?.game_token === ''"
             >
               <template #prepend>
                 <img src="/source/UI/defaultUser.webp" class="side-icon-user" alt="login" />
@@ -158,6 +158,7 @@
 
 <script lang="ts" setup>
 import { event, window as TauriWindow } from "@tauri-apps/api";
+import { storeToRefs } from "pinia";
 import { computed, onMounted, ref } from "vue";
 
 import { useAppStore } from "../../store/modules/app";
@@ -166,12 +167,12 @@ import mhyClient from "../../utils/TGClient";
 import showSnackbar from "../func/snackbar";
 
 const appStore = useAppStore();
-const userStore = useUserStore();
+const userStore = storeToRefs(useUserStore());
 
 const isDevEnv = ref<boolean>(import.meta.env.MODE === "development");
 
 const userInfo = computed(() => {
-  const info = userStore.getBriefInfo();
+  const info = userStore.briefInfo.value;
   if (info && info.nickname) return info;
   return {
     nickname: "未登录",

src/pages/User/Abyss.vue

@@ -66,6 +66,7 @@
   </div>
 </template>
 <script lang="ts" setup>
+import { storeToRefs } from "pinia";
 import { onMounted, ref } from "vue";
 
 import showSnackbar from "../../components/func/snackbar";
@@ -80,7 +81,7 @@ import { generateShareImg } from "../../utils/TGShare";
 import TGRequest from "../../web/request/TGRequest";
 
 // store
-const userStore = useUserStore();
+const userStore = storeToRefs(useUserStore());
 // loading
 const loading = ref<boolean>(true);
 const loadingTitle = ref<string>();
@@ -88,7 +89,7 @@ const loadingSub = ref<string>();
 
 // data
 const userTab = ref<number>(0);
-const user = ref<TGApp.Sqlite.Account.Game>(userStore.getCurAccount());
+const user = ref<TGApp.Sqlite.Account.Game>(userStore.account.value);
 
 const localAbyss = ref<TGApp.Sqlite.Abyss.SingleTable[]>([]);
 const localAbyssID = ref<number[]>([]);
@@ -114,7 +115,7 @@ async function initAbyssData(): Promise<void> {
 async function getAbyssData(): Promise<void> {
   loadingTitle.value = "正在获取深渊数据";
   loading.value = true;
-  if (!userStore.cookie) {
+  if (!userStore.cookie.value) {
     showSnackbar({
       text: "未登录",
       color: "error",
@@ -123,10 +124,10 @@ async function getAbyssData(): Promise<void> {
     return;
   }
   const cookie = {
-    account_id: userStore.cookie.account_id,
+    account_id: userStore.cookie.value.account_id,
-    cookie_token: userStore.cookie.cookie_token,
+    cookie_token: userStore.cookie.value.cookie_token,
-    ltoken: userStore.cookie.ltoken,
+    ltoken: userStore.cookie.value.ltoken,
-    ltuid: userStore.cookie.ltuid,
+    ltuid: userStore.cookie.value.ltuid,
   };
   loadingTitle.value = "正在获取上期深渊数据";
   const resP = await TGRequest.User.byCookie.getAbyss(cookie, "2", user.value);

src/pages/User/Characters.vue

@@ -54,6 +54,7 @@
   />
 </template>
 <script lang="ts" setup>
+import { storeToRefs } from "pinia";
 import { onMounted, ref } from "vue";
 
 import DucDetailOverlay from "../../components/devCharacter/duc-detail-overlay.vue";
@@ -67,8 +68,8 @@ import { generateShareImg } from "../../utils/TGShare";
 import TGRequest from "../../web/request/TGRequest";
 
 // store
-const userStore = useUserStore();
+const userStore = storeToRefs(useUserStore());
-const user = userStore.getCurAccount();
+const user = userStore.account.value;
 
 // loading
 const loading = ref<boolean>(false);
@@ -133,7 +134,7 @@ async function loadRole(): Promise<void> {
 async function refreshRoles(): Promise<void> {
   loadingTitle.value = "正在获取角色数据";
   loading.value = true;
-  if (!userStore.cookie) {
+  if (!userStore.cookie.value) {
     showSnackbar({
       text: "请先登录",
       color: "error",
@@ -142,10 +143,10 @@ async function refreshRoles(): Promise<void> {
     return;
   }
   const cookie = {
-    account_id: userStore.cookie.account_id,
+    account_id: userStore.cookie.value.account_id,
-    cookie_token: userStore.cookie.cookie_token,
+    cookie_token: userStore.cookie.value.cookie_token,
-    ltoken: userStore.cookie.ltoken,
+    ltoken: userStore.cookie.value.ltoken,
-    ltuid: userStore.cookie.ltuid,
+    ltuid: userStore.cookie.value.ltuid,
   };
   const res = await TGRequest.User.byLToken.getRoleList(cookie, user);
   if (Array.isArray(res)) {
@@ -166,7 +167,7 @@ async function refreshRoles(): Promise<void> {
 async function refreshTalent(): Promise<void> {
   loadingTitle.value = "正在获取天赋数据";
   loading.value = true;
-  if (!userStore.cookie) {
+  if (!userStore.cookie.value) {
     showSnackbar({
       text: "请先登录",
       color: "error",
@@ -178,8 +179,8 @@ async function refreshTalent(): Promise<void> {
     loadingTitle.value = `正在获取${role.name}的天赋数据`;
     loadingSub.value = `CID：${role.cid}`;
     const res = await TGRequest.User.calculate.getSyncAvatarDetail(
-      userStore.cookie.account_id,
+      userStore.cookie.value.account_id,
-      userStore.cookie.cookie_token,
+      userStore.cookie.value.cookie_token,
       user.gameUid,
       role.cid,
     );

src/pages/User/Gacha.vue

@@ -48,6 +48,7 @@
 </template>
 <script lang="ts" setup>
 import { dialog, fs, path } from "@tauri-apps/api";
+import { storeToRefs } from "pinia";
 import { computed, onMounted, ref, watch } from "vue";
 
 import showConfirm from "../../components/func/confirm";
@@ -63,9 +64,9 @@ import { backupUigfData, exportUigfData, readUigfData, verifyUigfData } from "..
 import TGRequest from "../../web/request/TGRequest";
 
 // store
-const userStore = useUserStore();
+const userStore = storeToRefs(useUserStore());
 const appStore = useAppStore();
-const account = userStore.getCurAccount();
+const account = userStore.account.value;
 const authkey = ref<string>("");
 
 // loading
@@ -119,7 +120,7 @@ async function confirmRefresh(): Promise<void> {
   }
   loadingTitle.value = "正在获取 authkey";
   loading.value = true;
-  if (!userStore.cookie) {
+  if (!userStore.cookie.value) {
     showSnackbar({
       color: "error",
       text: "请先登录",
@@ -128,10 +129,10 @@ async function confirmRefresh(): Promise<void> {
     return;
   }
   const cookie = {
-    stoken: userStore.cookie.stoken,
+    stoken: userStore.cookie.value.stoken,
-    mid: userStore.cookie.mid,
+    mid: userStore.cookie.value.mid,
   };
-  const gameUid = userStore.getCurAccount().gameUid;
+  const gameUid = account.gameUid;
   const authkeyRes = await TGRequest.User.getAuthkey(cookie, gameUid);
   if (typeof authkeyRes === "string") {
     authkey.value = authkeyRes;

src/pages/User/Record.vue

@@ -32,6 +32,7 @@
   </div>
 </template>
 <script lang="ts" setup>
+import { storeToRefs } from "pinia";
 import { onMounted, ref } from "vue";
 
 import showSnackbar from "../../components/func/snackbar";
@@ -47,8 +48,8 @@ import { generateShareImg } from "../../utils/TGShare";
 import TGRequest from "../../web/request/TGRequest";
 
 // store
-const userStore = useUserStore();
+const userStore = storeToRefs(useUserStore());
-const user = userStore.getCurAccount();
+const user = userStore.account.value;
 
 // loading
 const loading = ref<boolean>(false);
@@ -82,7 +83,7 @@ async function initUserRecordData(): Promise<void> {
 async function refresh(): Promise<void> {
   loadingTitle.value = "正在获取战绩数据";
   loading.value = true;
-  if (!userStore.cookie) {
+  if (!userStore.cookie.value) {
     showSnackbar({
       text: "请先登录",
       color: "error",
@@ -91,8 +92,8 @@ async function refresh(): Promise<void> {
     return;
   }
   const cookie = {
-    account_id: userStore.cookie.account_id,
+    account_id: userStore.cookie.value.account_id,
-    cookie_token: userStore.cookie.cookie_token,
+    cookie_token: userStore.cookie.value.cookie_token,
   };
   const res = await TGRequest.User.getRecord(cookie, user);
   if (!("retcode" in res)) {

src/pages/common/Config.vue

@@ -149,6 +149,7 @@
 
 <script lang="ts" setup>
 import { app, fs, invoke, os, process as TauriProcess } from "@tauri-apps/api";
+import { storeToRefs } from "pinia";
 import { computed, onMounted, ref } from "vue";
 
 import showConfirm from "../../components/func/confirm";
@@ -170,7 +171,7 @@ import { restoreAbyssData, restoreCookieData } from "../../web/utils/restoreData
 
 // Store
 const appStore = useAppStore();
-const userStore = useUserStore();
+const userStore = storeToRefs(useUserStore());
 const homeStore = useHomeStore();
 const achievementsStore = useAchievementsStore();
 
@@ -202,13 +203,13 @@ const showReset = ref<boolean>(false);
 // data
 const showHome = ref<string[]>(homeStore.getShowValue());
 const userInfo = computed(() => {
-  const info = userStore.getBriefInfo();
+  const info = userStore.briefInfo;
-  if (info && info.nickname) {
+  if (info.value && info.value.nickname) {
     return {
-      nickname: info.nickname,
+      nickname: info.value.nickname,
-      uid: info.uid,
+      uid: info.value.uid,
-      desc: info.desc,
+      desc: info.value.desc,
-      avatar: info.avatar,
+      avatar: info.value.avatar,
     };
   }
   return {
@@ -286,8 +287,8 @@ async function confirmRefreshUser(): Promise<void> {
     });
     return;
   }
-  const ck = userStore.cookie;
+  const ck = userStore.cookie.value;
-  if (JSON.stringify(ck) === "{}") {
+  if (ck === undefined || JSON.stringify(ck) === "{}") {
     showSnackbar({
       color: "error",
       text: "扫码登录后才能刷新用户信息!",
@@ -328,7 +329,8 @@ async function confirmRefreshUser(): Promise<void> {
     loadingTitle.value = "刷新失败!正在获取用户头像、昵称信息";
     failCount++;
   }
-  await userStore.saveCookie(ck);
+  userStore.cookie.value = ck;
+  await TGSqlite.saveAppData("cookie", JSON.stringify(ck));
   const infoRes = await TGRequest.User.byCookie.getUserInfo(ck.cookie_token, ck.account_id);
   if ("retcode" in infoRes) {
     console.error(infoRes);
@@ -341,7 +343,8 @@ async function confirmRefreshUser(): Promise<void> {
       avatar: infoRes.avatar_url,
       desc: infoRes.introduce,
     };
-    await userStore.saveBriefInfo(briefInfo);
+    userStore.briefInfo.value = briefInfo;
+    await TGSqlite.saveAppData("userInfo", JSON.stringify(briefInfo));
     loadingTitle.value = "获取成功!正在获取用户游戏账号信息";
   }
   const accountRes = await TGRequest.User.byCookie.getAccounts(ck.cookie_token, ck.account_id);
@@ -349,7 +352,7 @@ async function confirmRefreshUser(): Promise<void> {
     loadingTitle.value = "获取成功!正在保存到数据库!";
     await TGSqlite.saveAccount(accountRes);
     const curAccount = await TGSqlite.getCurAccount();
-    if (curAccount) userStore.setCurAccount(curAccount);
+    if (curAccount) userStore.account.value = curAccount;
   } else {
     console.error(accountRes);
     loadingTitle.value = "获取失败!";
@@ -434,7 +437,7 @@ async function confirmRestore(): Promise<void> {
   }
   loadingSub.value = "正在恢复祈愿数据";
   res = await restoreCookieData();
-  userStore.cookie = await TGSqlite.getCookie();
+  userStore.cookie.value = await TGSqlite.getCookie();
   if (!res) {
     fail.push("Cookie");
   }

src/store/modules/user.ts

@@ -1,153 +1,37 @@
 /**
  * @file store/modules/user.ts
  * @description 用户信息模块
- * @since Beta v0.3.8
+ * @since Beta v0.3.9
  */
 
 import { defineStore } from "pinia";
 import { ref } from "vue";
 
-import TGSqlite from "../../plugins/Sqlite";
-
 export const useUserStore = defineStore(
   "user",
   () => {
-    const briefInfo = ref<TGApp.App.Account.BriefInfo>(loadBriefInfo());
+    const briefInfo = ref<TGApp.App.Account.BriefInfo>({
-    const account = ref<TGApp.Sqlite.Account.Game>(loadAccount());
+      nickname: "",
+      avatar: "",
+      uid: "",
+      desc: "",
+    });
+    const account = ref<TGApp.Sqlite.Account.Game>({
+      gameBiz: "",
+      gameUid: "",
+      isChosen: 0,
+      isOfficial: 0,
+      level: "",
+      nickname: "",
+      region: "",
+      regionName: "",
+    });
     const cookie = ref<TGApp.User.Account.Cookie>();
 
-    /**
-     * @description 从本地加载用户信息
-     * @since Beta v0.3.8
-     * @function loadBriefInfo
-     * @memberof useUserStore
-     * @returns {TGApp.App.Account.BriefInfo}
-     */
-    function loadBriefInfo(): TGApp.App.Account.BriefInfo {
-      const info = window.localStorage.getItem("briefInfo");
-      if (info !== null && info !== undefined) {
-        console.log(JSON.parse(info).briefInfo);
-        return JSON.parse(info).briefInfo;
-      }
-      return {
-        nickname: "",
-        avatar: "",
-        uid: "",
-        desc: "",
-      };
-    }
-
-    /**
-     * @description 从本地加载当前用户信息
-     * @since Beta v0.3.8
-     * @function loadAccount
-     * @memberof useUserStore
-     * @returns {TGApp.Sqlite.Account.Game}
-     */
-    function loadAccount(): TGApp.Sqlite.Account.Game {
-      const info = window.localStorage.getItem("account");
-      if (info !== null && info !== undefined) {
-        console.log(JSON.parse(info).account);
-        return JSON.parse(info).account;
-      }
-      return {
-        gameBiz: "",
-        gameUid: "",
-        isChosen: 0,
-        isOfficial: 0,
-        level: "",
-        nickname: "",
-        region: "",
-        regionName: "",
-      };
-    }
-
-    /**
-     * @description 获取用户信息
-     * @since Beta v0.3.8
-     * @function getBriefInfo
-     * @memberof useUserStore
-     * @returns {TGApp.App.Account.BriefInfo}
-     */
-    function getBriefInfo(): TGApp.App.Account.BriefInfo {
-      return briefInfo.value;
-    }
-
-    /**
-     * @description 获取当前用户信息
-     * @since Beta v0.3.8
-     * @function getCurAccount
-     * @memberof useUserStore
-     * @returns {TGApp.Sqlite.Account.Game}
-     */
-    function getCurAccount(): TGApp.Sqlite.Account.Game {
-      return account.value;
-    }
-
-    /**
-     * @description 设置用户信息
-     * @param info
-     * @since Beta v0.3.8
-     * @function setBriefInfo
-     * @memberof useUserStore
-     * @param {TGApp.App.Account.BriefInfo} info - 用户信息
-     * @returns {void}
-     */
-    function setBriefInfo(info: TGApp.App.Account.BriefInfo): void {
-      briefInfo.value = info;
-    }
-
-    /**
-     * @description 设置当前用户信息
-     * @since Beta v0.3.8
-     * @function setCurAccount
-     * @memberof useUserStore
-     * @param {TGApp.Sqlite.Account.Game} user - 用户信息
-     * @returns {void}
-     */
-    function setCurAccount(user: TGApp.Sqlite.Account.Game): void {
-      account.value = user;
-    }
-
-    /**
-     * @description 保存cookie到本地
-     * @since Beta v0.3.8
-     * @function saveCookie
-     * @memberof useUserStore
-     * @param {TGApp.User.Account.Cookie} ck - cookie对象
-     * @returns {Promise<void>}
-     */
-    async function saveCookie(ck?: TGApp.User.Account.Cookie): Promise<void> {
-      if (ck) {
-        cookie.value = ck;
-      }
-      await TGSqlite.saveAppData("cookie", JSON.stringify(cookie.value));
-    }
-
-    /**
-     * @description 保存用户信息到本地
-     * @since Beta v0.3.8
-     * @function saveBriefInfo
-     * @memberof useUserStore
-     * @param {TGApp.App.Account.BriefInfo} info - 用户信息
-     * @returns {Promise<void>}
-     */
-    async function saveBriefInfo(info?: TGApp.App.Account.BriefInfo): Promise<void> {
-      if (info) {
-        setBriefInfo(info);
-        localStorage.setItem("briefInfo", JSON.stringify({ briefInfo: info }));
-      }
-      await TGSqlite.saveAppData("userInfo", JSON.stringify(briefInfo.value));
-    }
-
     return {
       cookie,
-      getBriefInfo,
+      briefInfo,
-      setBriefInfo,
+      account,
-      setCurAccount,
-      getCurAccount,
-      saveCookie,
-      saveBriefInfo,
     };
   },
   {