♻️ showSnackbar重构

2026-05-09 00:34:07 +08:00 · 2024-11-14 18:01:38 +08:00
parent 20b9631468
commit ac6dbe0cdf
69 changed files with 614 additions and 1098 deletions
--- a/src/pages/User/Abyss.vue
+++ b/src/pages/User/Abyss.vue
@@ -172,7 +172,7 @@ watch(
 async function toCombat(): Promise<void> {
  const check = await TSUserCombat.check();
  if (!check) {
-    showSnackbar({ text: "未检测到剧诗表，请更新数据库！", color: "warn" });
+    showSnackbar.warn("未检测到剧诗表，请更新数据库！");
    return;
  }
  await router.push({ name: "真境剧诗" });
@@ -191,7 +191,7 @@ async function loadAbyss(): Promise<void> {

 async function refreshAbyss(): Promise<void> {
  if (!userStore.cookie.value) {
-    showSnackbar({ text: "未登录", color: "error" });
+    showSnackbar.warn("未登录");
    await TGLogger.Warn("[UserAbyss][getAbyssData] 未登录");
    return;
  }
@@ -210,7 +210,7 @@ async function refreshAbyss(): Promise<void> {
      text: `用户${user.value.gameUid}与当前UID${uidCur.value}不一致`,
    });
    if (!confirm) {
-      showSnackbar({ text: "已取消深渊数据刷新", color: "cancel" });
+      showSnackbar.cancel("已取消深渊数据刷新");
      return;
    }
  }
@@ -219,30 +219,28 @@ async function refreshAbyss(): Promise<void> {
  loading.value = true;
  loadingTitle.value = `正在获取${user.value.gameUid}的上期深渊数据`;
  const resP = await TGRequest.User.byCookie.getAbyss(userStore.cookie.value, "2", user.value);
-  if (!("retcode" in resP)) {
-    await TGLogger.Info("[UserAbyss][getAbyssData] 成功获取上期深渊数据");
-    loadingTitle.value = `正在保存${user.value.gameUid}的上期深渊数据`;
-    await TSUserAbyss.saveAbyss(user.value.gameUid, resP);
-  } else {
-    showSnackbar({ text: `[${resP.retcode}]${resP.message}`, color: "error" });
+  if ("retcode" in resP) {
+    showSnackbar.error(`[${resP.retcode}]${resP.message}`);
    loading.value = false;
    await TGLogger.Error(`[UserAbyss][getAbyssData] 获取${user.value.gameUid}的上期深渊数据失败`);
    await TGLogger.Error(`[UserAbyss][getAbyssData] ${resP.retcode} ${resP.message}`);
    return;
  }
+  await TGLogger.Info("[UserAbyss][getAbyssData] 成功获取上期深渊数据");
+  loadingTitle.value = `正在保存${user.value.gameUid}的上期深渊数据`;
+  await TSUserAbyss.saveAbyss(user.value.gameUid, resP);
  loadingTitle.value = `正在获取${user.value.gameUid}的上期深渊数据`;
  const res = await TGRequest.User.byCookie.getAbyss(userStore.cookie.value, "1", user.value);
-  if (!("retcode" in res)) {
-    loadingTitle.value = `正在保存${user.value.gameUid}的本期深渊数据`;
-    await TSUserAbyss.saveAbyss(user.value.gameUid, res);
-    await TGLogger.Info(`[UserAbyss][getAbyssData] 成功获取${user.value.gameUid}的本期深渊数据`);
-  } else {
-    showSnackbar({ text: `[${res.retcode}]${res.message}`, color: "error" });
+  if ("retcode" in res) {
+    showSnackbar.error(`[${res.retcode}]${res.message}`);
    loading.value = false;
    await TGLogger.Error(`[UserAbyss][getAbyssData] 获取${user.value.gameUid}的本期深渊数据失败`);
    await TGLogger.Error(`[UserAbyss][getAbyssData] ${res.retcode} ${res.message}`);
    return;
  }
+  loadingTitle.value = `正在保存${user.value.gameUid}的本期深渊数据`;
+  await TSUserAbyss.saveAbyss(user.value.gameUid, res);
+  await TGLogger.Info(`[UserAbyss][getAbyssData] 成功获取${user.value.gameUid}的本期深渊数据`);
  loadingTitle.value = "正在加载深渊数据";
  uidList.value = await TSUserAbyss.getAllUid();
  uidCur.value = user.value.gameUid;
@@ -267,13 +265,13 @@ async function uploadAbyss(): Promise<void> {
  await TGLogger.Info("[UserAbyss][uploadAbyss] 上传深渊数据");
  const abyssData = localAbyss.value.find((item) => item.id === Math.max(...abyssIdList.value));
  if (!abyssData) {
-    showSnackbar({ text: "未找到深渊数据", color: "error" });
+    showSnackbar.warn("未找到深渊数据");
    await TGLogger.Warn("[UserAbyss][uploadAbyss] 未找到深渊数据");
    return;
  }
  const maxFloor = Number(abyssData.maxFloor.split("-")[0]);
  if (isNaN(maxFloor) || maxFloor <= 9) {
-    showSnackbar({ text: "尚未完成深渊，请完成深渊后重试！", color: "error" });
+    showSnackbar.warn("尚未完成深渊，请完成深渊后重试！");
    await TGLogger.Warn(`[UserAbyss][uploadAbyss] 尚未完成深渊 ${abyssData.maxFloor}`);
    return;
  }
@@ -281,7 +279,7 @@ async function uploadAbyss(): Promise<void> {
  const endTime = new Date(abyssData.endTime).getTime();
  const nowTime = new Date().getTime();
  if (nowTime < startTime || nowTime > endTime) {
-    showSnackbar({ text: "非最新深渊数据，请刷新深渊数据后重试！", color: "error" });
+    showSnackbar.warn("非最新深渊数据，请刷新深渊数据后重试！");
    await TGLogger.Warn("[UserAbyss][uploadAbyss] 非最新深渊数据");
    return;
  }
@@ -300,17 +298,17 @@ async function uploadAbyss(): Promise<void> {
    loadingTitle.value = "正在上传深渊数据";
    const res = await Hutao.Abyss.upload(transAbyss);
    loading.value = false;
-    if (res.retcode === 0) {
-      showSnackbar({ text: res.message ?? "上传深渊数据成功" });
-      await TGLogger.Info("[UserAbyss][uploadAbyss] 上传深渊数据成功");
-    } else {
-      showSnackbar({ text: `[${res.retcode}]${res.message}`, color: "error" });
+    if (res.retcode !== 0) {
+      showSnackbar.error(`[${res.retcode}]${res.message}`);
      await TGLogger.Error("[UserAbyss][uploadAbyss] 上传深渊数据失败");
      await TGLogger.Error(`[UserAbyss][uploadAbyss] ${res.retcode} ${res.message}`);
+      return;
    }
+    showSnackbar.success(res.message ?? "上传深渊数据成功");
+    await TGLogger.Info("[UserAbyss][uploadAbyss] 上传深渊数据成功");
  } catch (e) {
    if (e instanceof Error) {
-      showSnackbar({ text: e.message, color: "error" });
+      showSnackbar.error(e.message);
      await TGLogger.Error("[UserAbyss][uploadAbyss] 上传深渊数据失败");
      await TGLogger.Error(`[UserAbyss][uploadAbyss] ${e.message}`);
    }
@@ -320,7 +318,7 @@ async function uploadAbyss(): Promise<void> {

 async function deleteAbyss(): Promise<void> {
  if (uidCur.value === undefined || uidCur.value === "") {
-    showSnackbar({ text: "未找到符合条件的数据!", color: "error" });
+    showSnackbar.warn("未选择游戏UID");
    return;
  }
  const confirm = await showConfirm({
@@ -328,7 +326,7 @@ async function deleteAbyss(): Promise<void> {
    text: `将清除${uidCur.value}的所有深渊数据`,
  });
  if (!confirm) {
-    showSnackbar({ text: "已取消删除", color: "cancel" });
+    showSnackbar.cancel("已取消删除");
    return;
  }
  loadingTitle.value = `正在删除 ${uidCur.value} 的深渊数据`;
@@ -336,7 +334,7 @@ async function deleteAbyss(): Promise<void> {
  await TSUserAbyss.delAbyss(uidCur.value);
  await new Promise((resolve) => setTimeout(resolve, 1000));
  loading.value = false;
-  showSnackbar({ text: `已清除 ${uidCur.value} 的深渊数据`, color: "success" });
+  showSnackbar.success(`已清除 ${uidCur.value} 的深渊数据`);
  uidList.value = await TSUserAbyss.getAllUid();
  if (uidList.value.length > 0) uidCur.value = uidList.value[0];
  else uidCur.value = undefined;
--- a/src/pages/User/Characters.vue
+++ b/src/pages/User/Characters.vue
@@ -169,10 +169,10 @@ onMounted(async () => {

 watch(
  () => resetSelect.value,
-  (val) => {
-    if (val) {
+  () => {
+    if (resetSelect.value) {
      selectedList.value = getOrderedList(roleList.value);
-      showSnackbar({ text: "已重置筛选条件", color: "success" });
+      showSnackbar.success("已重置筛选条件");
      if (!dataVal.value) return;
      selectIndex.value = selectedList.value.indexOf(dataVal.value);
      if (selectIndex.value === -1) {
@@ -184,16 +184,16 @@ watch(
 );
 watch(
  () => showMode.value,
-  (val) => {
-    switch (val) {
+  () => {
+    switch (showMode.value) {
      case "classic":
-        showSnackbar({ text: "已切换至经典视图", color: "success" });
+        showSnackbar.success("已切换至经典视图");
        break;
      case "card":
-        showSnackbar({ text: "已切换至卡片视图（简略）", color: "success" });
+        showSnackbar.success("已切换至卡片视图（简略）");
        break;
      case "dev":
-        showSnackbar({ text: "已切换至卡片视图（详细）", color: "success" });
+        showSnackbar.success("已切换至卡片视图（详细）");
        break;
    }
  },
@@ -238,7 +238,7 @@ async function loadRole(): Promise<void> {
  isEmpty.value = roleList.value.length === 0;
  await TGLogger.Info(`[Character][loadRole][${uidCur.value}] 成功加载角色数据`);
  await TGLogger.Info(`[Character][loadRole][${uidCur.value}] 共获取到${roleData.length}个角色`);
-  showSnackbar({ text: `成功加载${roleData.length}个角色`, color: "success" });
+  showSnackbar.success(`成功加载${roleData.length}个角色`);
 }

 async function refresh(): Promise<void> {
@@ -266,7 +266,7 @@ async function refresh(): Promise<void> {
      text: `用户${user.value.gameUid}与当前UID${uidCur.value}不一致`,
    });
    if (!confirm) {
-      showSnackbar({ text: "已取消角色数据刷新", color: "cancel" });
+      showSnackbar.cancel("已取消角色数据刷新");
      return;
    }
  }
@@ -275,14 +275,14 @@ async function refresh(): Promise<void> {
  loading.value = true;
  loadData.value = true;
  if (!userStore.cookie.value) {
-    showSnackbar({ text: "请先登录", color: "error" });
+    showSnackbar.warn("请先登录");
    loading.value = false;
    loadData.value = false;
    return;
  }
  const indexRes = await TGRequest.User.byCookie.getAvatarIndex(userStore.cookie.value, user.value);
  if (indexRes.retcode !== 0) {
-    showSnackbar({ text: `[${indexRes.retcode}] ${indexRes.message}` });
+    showSnackbar.error(`[${indexRes.retcode}] ${indexRes.message}`);
    await TGLogger.Error(JSON.stringify(indexRes.message));
    loading.value = false;
    loadData.value = false;
@@ -290,7 +290,7 @@ async function refresh(): Promise<void> {
  }
  const listRes = await TGRequest.User.byCookie.getAvatarList(userStore.cookie.value, user.value);
  if (!Array.isArray(listRes)) {
-    showSnackbar({ text: `[${listRes.retcode}] ${listRes.message}`, color: "error" });
+    showSnackbar.error(`[${listRes.retcode}] ${listRes.message}`);
    await TGLogger.Error(`[Character][refreshRoles][${user.value.gameUid}] 获取角色列表失败`);
    await TGLogger.Error(
      `[Character][refreshRoles][${user.value.gameUid}] ${listRes.retcode} ${listRes.message}`,
@@ -308,7 +308,7 @@ async function refresh(): Promise<void> {
    idList,
  );
  if ("retcode" in res) {
-    showSnackbar({ text: `[${res.retcode}] ${res.message}`, color: "error" });
+    showSnackbar.error(`[${res.retcode}] ${res.message}`);
    await TGLogger.Error(`[Character][refreshRoles][${user.value.gameUid}] 获取角色数据失败`);
    await TGLogger.Error(
      `[Character][refreshRoles][${user.value.gameUid}] ${res.retcode} ${res.message}`,
@@ -331,7 +331,7 @@ async function refresh(): Promise<void> {

 async function share(): Promise<void> {
  if (!user.value || isEmpty.value) {
-    showSnackbar({ text: "暂无数据", color: "error" });
+    showSnackbar.warn("暂无数据");
    return;
  }
  await TGLogger.Info(`[Character][shareRoles][${user.value.gameUid}] 正在生成分享图片`);
@@ -350,7 +350,7 @@ async function share(): Promise<void> {

 async function deleteUid(): Promise<void> {
  if (!uidCur.value) {
-    showSnackbar({ text: "未找到当前UID", color: "error" });
+    showSnackbar.warn("未找到当前UID");
    return;
  }
  const confirm = await showConfirm({
@@ -358,11 +358,11 @@ async function deleteUid(): Promise<void> {
    text: `将删除${uidCur.value}对应的角色数据`,
  });
  if (!confirm) {
-    showSnackbar({ text: "已取消删除", color: "cancel" });
+    showSnackbar.cancel("已取消删除");
    return;
  }
  await TSUserAvatar.deleteUid(uidCur.value);
-  showSnackbar({ text: `成功删除${uidCur.value}的角色数据` });
+  showSnackbar.success(`成功删除${uidCur.value}的角色数据`);
  await loadUid();
  await loadRole();
 }
@@ -397,10 +397,10 @@ function handleSelect(val: SelectedCValue) {
    return val.area.includes(avatar.area);
  });
  if (filterC.length === 0) {
-    showSnackbar({ text: "未找到符合条件的角色", color: "warn" });
+    showSnackbar.warn("未找到符合条件的角色");
    return;
  }
-  showSnackbar({ text: `筛选出符合条件的角色 ${filterC.length} 个`, color: "success" });
+  showSnackbar.success(`筛选出符合条件的角色 ${filterC.length} 个`);
  const selectedId = filterC.map((item) => item.id);
  selectedList.value = roleList.value.filter((role) => selectedId.includes(role.cid));
  if (!dataVal.value) return;
--- a/src/pages/User/Combat.vue
+++ b/src/pages/User/Combat.vue
@@ -162,7 +162,7 @@ async function loadCombat(): Promise<void> {

 async function refreshCombat(): Promise<void> {
  if (!userStore.cookie.value) {
-    showSnackbar({ text: "未登录", color: "error" });
+    showSnackbar.error("未登录");
    await TGLogger.Warn("[UserCombat][getAbyssData] 未登录");
    return;
  }
@@ -181,7 +181,7 @@ async function refreshCombat(): Promise<void> {
      text: `用户${user.value.gameUid}与当前UID${uidCur.value}不一致`,
    });
    if (!confirm) {
-      showSnackbar({ text: "已取消剧诗数据刷新", color: "cancel" });
+      showSnackbar.cancel("已取消剧诗数据刷新");
      return;
    }
  }
@@ -192,11 +192,11 @@ async function refreshCombat(): Promise<void> {
  const res = await TGRequest.User.byCookie.getCombat(userStore.cookie.value, user.value);
  if (res === false) {
    loading.value = false;
-    showSnackbar({ text: "用户未解锁幻想真境剧诗!", color: "warn" });
+    showSnackbar.warn("用户未解锁幻想真境剧诗");
    return;
  }
  if ("retcode" in res) {
-    showSnackbar({ text: `[${res.retcode}]${res.message}`, color: "error" });
+    showSnackbar.error(`[${res.retcode}]${res.message}`);
    loading.value = false;
    await TGLogger.Error(`[UserCombat][getCombatData] 获取${user.value.gameUid}的剧诗数据失败`);
    await TGLogger.Error(`[UserCombat][getCombatData] ${res.retcode} ${res.message}`);
@@ -231,12 +231,12 @@ 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" });
+    showSnackbar.error("未找到剧诗数据");
    await TGLogger.Warn("[UserCombat][uploadCombat] 未找到深渊数据");
    return;
  }
  if (!combatData.hasDetailData) {
-    showSnackbar({ text: "未获取到详情数据", color: "error" });
+    showSnackbar.error("未获取到详情数据");
    await TGLogger.Warn(`[UserCombat][uploadCombat] 未获取到详细数据`);
    return;
  }
@@ -244,7 +244,7 @@ async function uploadCombat(): Promise<void> {
  const endTime = new Date(combatData.endTime).getTime();
  const nowTime = new Date().getTime();
  if (nowTime < startTime || nowTime > endTime) {
-    showSnackbar({ text: "非最新剧诗数据，请刷新剧诗数据后重试！", color: "error" });
+    showSnackbar.warn("非最新剧诗数据，请刷新剧诗数据后重试！");
    await TGLogger.Warn("[UserCombat][uploadCombat] 非最新剧诗数据");
    return;
  }
@@ -257,16 +257,16 @@ async function uploadCombat(): Promise<void> {
    const res = await Hutao.Combat.upload(transCombat);
    loading.value = false;
    if (res.retcode === 0) {
-      showSnackbar({ text: res.message ?? "上传剧诗数据成功" });
+      showSnackbar.success(res.message ?? "上传剧诗数据成功");
      await TGLogger.Info("[UserCombat][uploadCombat] 上传剧诗数据成功");
    } else {
-      showSnackbar({ text: `[${res.retcode}]${res.message}`, color: "error" });
+      showSnackbar.error(`[${res.retcode}]${res.message}`);
      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" });
+      showSnackbar.error(e.message);
      await TGLogger.Error("[UserCombat][uploadCombat] 上传剧诗数据失败");
      await TGLogger.Error(`[UserCombat][uploadCombat] ${e.message}`);
    }
@@ -276,7 +276,7 @@ async function uploadCombat(): Promise<void> {

 async function deleteCombat(): Promise<void> {
  if (uidCur.value === undefined || uidCur.value === "") {
-    showSnackbar({ text: "未找到符合条件的数据!", color: "error" });
+    showSnackbar.error("未找到符合条件的数据!");
    return;
  }
  const confirm = await showConfirm({
@@ -284,7 +284,7 @@ async function deleteCombat(): Promise<void> {
    text: `将清除${uidCur.value}的所有剧诗数据`,
  });
  if (!confirm) {
-    showSnackbar({ text: "已取消删除", color: "cancel" });
+    showSnackbar.cancel("已取消删除");
    return;
  }
  loadingTitle.value = `正在删除 ${uidCur.value} 的剧诗数据`;
@@ -292,7 +292,7 @@ async function deleteCombat(): Promise<void> {
  await TSUserCombat.delCombat(uidCur.value);
  await new Promise((resolve) => setTimeout(resolve, 1000));
  loading.value = false;
-  showSnackbar({ text: `已清除 ${uidCur.value} 的剧诗数据`, color: "success" });
+  showSnackbar.success(`已清除 ${uidCur.value} 的剧诗数据`);
  uidList.value = await TSUserCombat.getAllUid();
  if (uidList.value.length > 0) uidCur.value = uidList.value[0];
  else uidCur.value = undefined;
--- a/src/pages/User/Gacha.vue
+++ b/src/pages/User/Gacha.vue
@@ -97,7 +97,7 @@ watch(
  async (newUid) => {
    if (!newUid) return;
    gachaListCur.value = await TSUserGacha.getGachaRecords(newUid);
-    showSnackbar({ text: `成功获取 ${gachaListCur.value.length} 条祈愿数据` });
+    showSnackbar.success(`成功获取 ${gachaListCur.value.length} 条祈愿数据`);
    await TGLogger.Info(
      `[UserGacha][${newUid}][watch] 成功获取 ${gachaListCur.value.length} 条祈愿数据`,
    );
@@ -109,10 +109,7 @@ onMounted(async () => {
  loadingTitle.value = "正在获取祈愿 UID 列表";
  selectItem.value = await TSUserGacha.getUidList();
  if (selectItem.value.length === 0) {
-    showSnackbar({
-      color: "error",
-      text: "暂无祈愿数据，请先导入祈愿数据",
-    });
+    showSnackbar.error("暂无祈愿数据，请先导入祈愿数据");
    loading.value = false;
    await TGLogger.Warn("[UserGacha][onMounted] 暂无祈愿数据，请先导入祈愿数据");
    return;
@@ -125,9 +122,7 @@ onMounted(async () => {
  );
  loadingTitle.value = "正在渲染数据";
  loading.value = false;
-  showSnackbar({
-    text: `成功获取 ${gachaListCur.value.length} 条祈愿数据`,
-  });
+  showSnackbar.success(`成功获取 ${gachaListCur.value.length} 条祈愿数据`);
 });

 // 刷新按钮点击事件
@@ -148,14 +143,14 @@ async function confirmRefresh(force: boolean): Promise<void> {
      text: `用户${account.value.gameUid}与当前UID${uidCur.value}不一致`,
    });
    if (!confirm) {
-      showSnackbar({ text: "已取消祈愿数据刷新", color: "cancel" });
+      showSnackbar.cancel("已取消祈愿数据刷新");
      return;
    }
  }
  loadingTitle.value = "正在获取 authkey";
  loading.value = true;
  if (!userStore.cookie.value) {
-    showSnackbar({ color: "error", text: "请先登录" });
+    showSnackbar.error("请先登录");
    loading.value = false;
    await TGLogger.Warn("[UserGacha][${account.gameUid}][confirmRefresh] 未检测到 cookie");
    return;
@@ -165,7 +160,7 @@ async function confirmRefresh(force: boolean): Promise<void> {
    authkey.value = authkeyRes;
    await TGLogger.Info(`[UserGacha][${account.value.gameUid}][confirmRefresh] 成功获取 authkey`);
  } else {
-    showSnackbar({ color: "error", text: "获取 authkey 失败" });
+    showSnackbar.error("获取 authkey 失败");
    await TGLogger.Error(`[UserGacha][${account.value.gameUid}][confirmRefresh] 获取 authkey 失败`);
    await TGLogger.Error(
      `[UserGacha][${account.value.gameUid}][confirmRefresh] ${authkeyRes.retcode} ${authkeyRes.message}`,
@@ -225,11 +220,7 @@ async function getGachaLogs(pool: string, endId: string = "0", check?: string):
      `[UserGacha][${uid}][getGachaLogs] 成功获取到 ${gachaRes.length} 条祈愿数据`,
    );
    if (gachaRes.length === 0) {
-      await new Promise((resolve) => {
-        setTimeout(() => {
-          resolve("");
-        }, 1000);
-      });
+      await new Promise((resolve) => setTimeout(() => resolve(""), 1000));
      return;
    }
    const uigfList: TGApp.Plugins.UIGF.GachaItem[] = [];
@@ -273,7 +264,7 @@ async function getGachaLogs(pool: string, endId: string = "0", check?: string):
      await getGachaLogs(pool, gachaRes[gachaRes.length - 1].id, check);
    }
  } else {
-    showSnackbar({ color: "error", text: `[${pool}][${gachaRes.retcode}] ${gachaRes.message}` });
+    showSnackbar.error(`[${pool}][${gachaRes.retcode}] ${gachaRes.message}`);
    await TGLogger.Error(`[UserGacha][${uid}][getGachaLogs] 获取祈愿数据失败`);
    await TGLogger.Error(
      `[UserGacha][${uid}][getGachaLogs] ${gachaRes.retcode} ${gachaRes.message}`,
@@ -292,7 +283,7 @@ async function handleImportBtn(isV4: boolean): Promise<void> {
    directory: false,
  });
  if (selectedFile === null) {
-    showSnackbar({ color: "cancel", text: "已取消文件选择" });
+    showSnackbar.cancel("已取消文件选择");
    return;
  }
  const check = await verifyUigfData(selectedFile, isV4);
@@ -311,7 +302,7 @@ async function importUigf4(filePath: string): Promise<void> {
    text: `共 ${uidCount} 个 UID，${dataCount} 条数据`,
  });
  if (!res) {
-    showSnackbar({ color: "cancel", text: "已取消祈愿数据导入" });
+    showSnackbar.cancel("已取消祈愿数据导入");
    return;
  }
  loadingTitle.value = "正在导入祈愿数据(v4)";
@@ -321,13 +312,11 @@ async function importUigf4(filePath: string): Promise<void> {
    await TSUserGacha.mergeUIGF4(account);
  }
  loading.value = false;
-  showSnackbar({ text: `成功导入 ${uidCount} 个 UID 的 ${dataCount} 条祈愿数据` });
+  showSnackbar.success(`成功导入 ${uidCount} 个 UID 的 ${dataCount} 条祈愿数据`);
  await TGLogger.Info(
    `[UserGacha][importUigf4] 成功导入 ${uidCount} 个 UID，${dataCount} 条祈愿数据`,
  );
-  setTimeout(() => {
-    window.location.reload();
-  }, 1000);
+  setTimeout(() => window.location.reload(), 1000);
 }

 async function importUigf(filePath: string): Promise<void> {
@@ -337,25 +326,23 @@ async function importUigf(filePath: string): Promise<void> {
    text: `UID：${remoteData.info.uid}，共 ${remoteData.list.length} 条数据`,
  });
  if (!confirm) {
-    showSnackbar({ color: "cancel", text: "已取消祈愿数据导入" });
+    showSnackbar.cancel("已取消祈愿数据导入");
    return;
  }
  loadingTitle.value = "正在导入祈愿数据";
  loading.value = true;
  if (remoteData.list.length === 0) {
    loading.value = false;
-    showSnackbar({ color: "error", text: "导入的祈愿数据为空" });
+    showSnackbar.error("导入的祈愿数据为空");
    return;
  }
  await TSUserGacha.mergeUIGF(remoteData.info.uid, remoteData.list);
  loading.value = false;
-  showSnackbar({ text: `成功导入 ${remoteData.list.length} 条祈愿数据` });
+  showSnackbar.success(`成功导入 ${remoteData.list.length} 条祈愿数据`);
  await TGLogger.Info(
    `[UserGacha][importUigf] 成功导入 ${remoteData.info.uid} 的 ${remoteData.list.length} 条祈愿数据`,
  );
-  setTimeout(() => {
-    window.location.reload();
-  }, 1000);
+  setTimeout(() => window.location.reload(), 1000);
 }

 // 导出当前UID的祈愿数据
@@ -364,7 +351,7 @@ async function exportUigf(): Promise<void> {
  await TGLogger.Info(`[UserGacha][${uidCur.value}][exportUigf] 导出祈愿数据`);
  const gachaList = await TSUserGacha.getGachaRecords(uidCur.value);
  if (gachaList.length === 0) {
-    showSnackbar({ color: "error", text: `UID ${uidCur.value} 暂无祈愿数据` });
+    showSnackbar.error(`UID ${uidCur.value} 暂无祈愿数据`);
    return;
  }
  const res = await showConfirm({
@@ -372,7 +359,7 @@ async function exportUigf(): Promise<void> {
    text: `UID：${uidCur.value}，共 ${gachaList.length} 条数据`,
  });
  if (!res) {
-    showSnackbar({ color: "cancel", text: `已取消 UID ${uidCur.value} 的祈愿数据导出` });
+    showSnackbar.cancel(`已取消 UID ${uidCur.value} 的祈愿数据导出`);
    return;
  }
  const file = await save({
@@ -381,7 +368,7 @@ async function exportUigf(): Promise<void> {
    defaultPath: `${await path.downloadDir()}${path.sep()}UIGF_${uidCur.value}.json`,
  });
  if (!file) {
-    showSnackbar({ color: "cancel", text: "已取消文件保存" });
+    showSnackbar.cancel("已取消文件保存");
    return;
  }
  await TGLogger.Info(
@@ -391,7 +378,7 @@ async function exportUigf(): Promise<void> {
  loading.value = true;
  await exportUigfData(uidCur.value, gachaList, file);
  loading.value = false;
-  showSnackbar({ text: `成功导出 ${uidCur.value} 的祈愿数据` });
+  showSnackbar.success(`成功导出 ${uidCur.value} 的祈愿数据`);
  await TGLogger.Info(`[UserGacha][${uidCur.value}][exportUigf] 导出祈愿数据完成`);
 }

@@ -400,7 +387,7 @@ async function exportUigf4(): Promise<void> {
  if (!uidCur.value) return;
  const checkConfirm = await showConfirm({ title: "确定导出UIGFv4格式的祈愿数据？" });
  if (!checkConfirm) {
-    showSnackbar({ color: "cancel", text: "已取消 UIGF v4 格式导出" });
+    showSnackbar.cancel("已取消 UIGF v4 格式导出");
    return;
  }
  await TGLogger.Info(`[UserGacha][${uidCur.value}][exportUigf4] 导出祈愿数据(v4)`);
@@ -410,28 +397,23 @@ async function exportUigf4(): Promise<void> {
    text: "取消则只导出当前 UID 的祈愿数据",
  });
  if (allConfirm === undefined) {
-    showSnackbar({ color: "cancel", text: "已取消祈愿数据导出" });
+    showSnackbar.cancel("已取消 UIGF v4 格式导出");
    return;
  }
  if (!allConfirm) {
    const gachaList = await TSUserGacha.getGachaRecords(uidCur.value);
    if (gachaList.length === 0) {
-      showSnackbar({ color: "error", text: `UID ${uidCur.value} 暂无祈愿数据` });
+      showSnackbar.error(`UID ${uidCur.value} 暂无祈愿数据`);
      return;
    }
  }
  const file = await save({
    title: "选择导出祈愿数据的文件路径",
-    filters: [
-      {
-        name: "UIGF JSON",
-        extensions: ["json"],
-      },
-    ],
+    filters: [{ name: "UIGF JSON", extensions: ["json"] }],
    defaultPath: `${await path.downloadDir()}${path.sep()}UIGF4.json`,
  });
  if (!file) {
-    showSnackbar({ color: "cancel", text: "已取消文件保存" });
+    showSnackbar.cancel("已取消文件保存");
    return;
  }
  loadingTitle.value = "正在导出祈愿数据";
@@ -442,14 +424,14 @@ async function exportUigf4(): Promise<void> {
    await exportUigf4Data(file);
  }
  loading.value = false;
-  showSnackbar({ text: "祈愿数据已成功导出" });
+  showSnackbar.success("祈愿数据已成功导出");
  await TGLogger.Info(`[UserGacha][${uidCur.value}][exportUigf4] 导出祈愿数据完成`);
 }

 // 删除当前 UID 的祈愿数据
 async function deleteGacha(): Promise<void> {
  if (gachaListCur.value.length === 0 || !uidCur.value) {
-    showSnackbar({ color: "error", text: "暂无祈愿数据" });
+    showSnackbar.error("暂无祈愿数据");
    return;
  }
  await TGLogger.Info(`[UserGacha][${uidCur.value}][deleteGacha] 删除祈愿数据`);
@@ -458,7 +440,7 @@ async function deleteGacha(): Promise<void> {
    text: `UID：${uidCur.value}，共 ${gachaListCur.value.length} 条数据`,
  });
  if (!firstConfirm) {
-    showSnackbar({ color: "cancel", text: "已取消祈愿数据删除" });
+    showSnackbar.cancel("已取消祈愿数据删除");
    await TGLogger.Info(`[UserGacha][${uidCur.value}][deleteGacha] 已取消祈愿数据删除`);
    return;
  }
@@ -470,7 +452,7 @@ async function deleteGacha(): Promise<void> {
      text: `UID：${uidCur.value}，共 ${gachaListCur.value.length} 条数据`,
    });
    if (!secondConfirm) {
-      showSnackbar({ color: "cancel", text: "已取消祈愿数据删除" });
+      showSnackbar.cancel("已取消祈愿数据删除");
      await TGLogger.Info(`[UserGacha][${uidCur.value}][deleteGacha] 已取消祈愿数据删除`);
      return;
    }
@@ -479,13 +461,11 @@ async function deleteGacha(): Promise<void> {
  loading.value = true;
  await TSUserGacha.deleteGachaRecords(uidCur.value);
  loading.value = false;
-  showSnackbar({ text: `已成功删除 ${uidCur.value} 的祈愿数据` });
+  showSnackbar.success(`已成功删除 ${uidCur.value} 的祈愿数据`);
  await TGLogger.Info(
    `[UserGacha][${uidCur.value}][deleteGacha] 成功删除 ${gachaListCur.value.length} 条祈愿数据`,
  );
-  setTimeout(() => {
-    window.location.reload();
-  }, 1000);
+  setTimeout(() => window.location.reload(), 1000);
 }
 </script>
 <style lang="css" scoped>
--- a/src/pages/User/Record.vue
+++ b/src/pages/User/Record.vue
@@ -139,7 +139,7 @@ async function refreshRecord(): Promise<void> {
      text: `用户${user.value.gameUid}与当前UID${uidCur.value}不一致`,
    });
    if (!confirm) {
-      showSnackbar({ text: "已取消战绩数据刷新", color: "cancel" });
+      showSnackbar.cancel("已取消战绩数据刷新");
      return;
    }
  }
@@ -147,7 +147,7 @@ async function refreshRecord(): Promise<void> {
  loadingTitle.value = "正在获取战绩数据";
  loading.value = true;
  if (!userStore.cookie.value) {
-    showSnackbar({ text: "请先登录", color: "error" });
+    showSnackbar.warn("请先登录");
    loading.value = false;
    await TGLogger.Warn(`[UserRecord][refresh][${user.value.gameUid}] 未登录`);
    return;
@@ -167,7 +167,7 @@ async function refreshRecord(): Promise<void> {
    await loadRecord();
    if (recordData.value === undefined) await loadRecord();
  } else {
-    showSnackbar({ text: `[${res.retcode}] ${res.message}`, color: "error" });
+    showSnackbar.error(`[${res.retcode}] ${res.message}`);
    await TGLogger.Error(`[UserRecord][refresh][${user.value.gameUid}] 获取战绩数据失败`);
    await TGLogger.Error(
      `[UserRecord][refresh][${user.value.gameUid}] ${res.retcode} ${res.message}`,
@@ -178,7 +178,7 @@ async function refreshRecord(): Promise<void> {

 async function shareRecord(): Promise<void> {
  if (!recordData.value) {
-    showSnackbar({ text: "未找到战绩数据，请尝试刷新", color: "warn" });
+    showSnackbar.warn("未找到战绩数据，请尝试刷新");
    return;
  }
  await TGLogger.Info(`[UserRecord][shareRecord][${user.value.gameUid}] 生成分享图片`);
@@ -195,7 +195,7 @@ async function shareRecord(): Promise<void> {

 async function deleteRecord(): Promise<void> {
  if (!uidCur.value) {
-    showSnackbar({ text: "未找到当前UID", color: "error" });
+    showSnackbar.warn("未找到当前UID");
    return;
  }
  const confirm = await showConfirm({
@@ -203,11 +203,11 @@ async function deleteRecord(): Promise<void> {
    text: `将删除${uidCur.value}对应的战绩数据`,
  });
  if (!confirm) {
-    showSnackbar({ text: "已取消删除战绩数据", color: "cancel" });
+    showSnackbar.cancel("已取消删除战绩数据");
    return;
  }
  await TSUserRecord.deleteUid(uidCur.value);
-  showSnackbar({ text: `成功删除${uidCur.value}的战绩数据` });
+  showSnackbar.success(`成功删除${uidCur.value}的战绩数据`);
  await loadUid();
  await loadRecord();
 }
--- a/src/pages/WIKI/Character.vue
+++ b/src/pages/WIKI/Character.vue
@@ -61,7 +61,7 @@ onBeforeMount(() => {
    curItem.value = item;
    return;
  }
-  showSnackbar({ text: `角色 ${id} 不存在`, color: "warn" });
+  showSnackbar.warn(`角色 ${id} 不存在`);
  curItem.value = cardsInfo.value[0];
 });

@@ -78,10 +78,10 @@ function handleSelect(val: SelectedCValue) {
    return val.area.includes(item.area);
  });
  if (filterC.length === 0) {
-    showSnackbar({ text: "未找到符合条件的角色", color: "warn" });
+    showSnackbar.warn("未找到符合条件的角色");
    return;
  }
-  showSnackbar({ text: `筛选出符合条件的角色 ${filterC.length} 个` });
+  showSnackbar.success(`筛选出符合条件的角色 ${filterC.length} 个`);
  cardsInfo.value = filterC;
 }

@@ -96,7 +96,7 @@ async function switchC(item: TGApp.App.Character.WikiBriefInfo): Promise<void> {
 async function toOuter(item?: TGApp.App.Character.WikiBriefInfo): Promise<void> {
  if (!item) return;
  if (item.contentId === 0) {
-    showSnackbar({ text: `角色 ${item.name} 暂无观测枢页面`, color: "warn" });
+    showSnackbar.warn(`角色 ${item.name} 暂无观测枢页面`);
    return;
  }
  const confirm = await showConfirm({
@@ -104,7 +104,7 @@ async function toOuter(item?: TGApp.App.Character.WikiBriefInfo): Promise<void>
    text: "是否打开观测枢页面？",
  });
  if (!confirm) {
-    showSnackbar({ text: "已取消", color: "cancel" });
+    showSnackbar.cancel("已取消打开观测枢页面");
    return;
  }
  await createObc(item.contentId, item.name);
--- a/src/pages/WIKI/Material.vue
+++ b/src/pages/WIKI/Material.vue
@@ -102,7 +102,7 @@ onMounted(() => {
    }
  });
  sortData(WikiMaterialData);
-  showSnackbar({ text: `成功获取${sortMaterialsData.value.length}条数据` });
+  showSnackbar.success(`成功获取${sortMaterialsData.value.length}条数据`);
 });

 function getSelectMaterials(): TGApp.App.Material.WikiItem[] {
@@ -150,23 +150,22 @@ function searchMaterial() {
  let selectData = getSelectMaterials();
  if (search.value === undefined || search.value === "") {
    if (sortMaterialsData.value.length === selectData.length) {
-      showSnackbar({ text: "请输入搜索内容!", color: "warn" });
+      showSnackbar.warn("请输入搜索内容!");
      return;
-    } else {
-      sortData(selectData);
-      showSnackbar({ text: "已重置!" });
    }
+    sortData(selectData);
+    showSnackbar.success("已重置!");
    return;
  }
  selectData = selectData.filter(
    (i) => i.name.includes(search.value!) || i.description.includes(search.value!),
  );
  if (selectData.length === 0) {
-    showSnackbar({ text: "未找到符合条件的材料!", color: "warn" });
+    showSnackbar.warn("未找到符合条件的材料!");
    return;
  }
  sortData(selectData);
-  showSnackbar({ text: `找到 ${selectData.length} 条符合条件的内容` });
+  showSnackbar.success(`找到${selectData.length}条符合条件的材料`);
 }
 </script>
 <style lang="css" scoped>
--- a/src/pages/WIKI/Namecard.vue
+++ b/src/pages/WIKI/Namecard.vue
@@ -55,10 +55,7 @@ function sortData(data: TGApp.App.NameCard.Item[]) {
  curIndex.value = 0;
  total.value = sortNameCardsData.value.length;
  curNameCard.value = sortNameCardsData.value[curIndex.value];
-  showSnackbar({
-    text: `共搜索到 ${sortNameCardsData.value.length} 个结果`,
-    color: "success",
-  });
+  showSnackbar.success(`共搜索到 ${sortNameCardsData.value.length} 个结果`);
 }

 function toNameCard(item: TGApp.App.NameCard.Item) {
@@ -70,19 +67,13 @@ function toNameCard(item: TGApp.App.NameCard.Item) {
 function switchCard(isNext: boolean) {
  if (isNext) {
    if (curIndex.value === total.value - 1) {
-      showSnackbar({
-        text: "已经是最后一个了",
-        color: "warn",
-      });
+      showSnackbar.warn("已经是最后一个了");
      return;
    }
    curIndex.value++;
  } else {
    if (curIndex.value === 0) {
-      showSnackbar({
-        text: "已经是第一个了",
-        color: "warn",
-      });
+      showSnackbar.warn("已经是第一个了");
      return;
    }
    curIndex.value--;
@@ -95,10 +86,7 @@ function searchNamecard() {
    sortData(AppNameCardsData);
  } else if (search.value === "") {
    if (sortNameCardsData.value.length === AppNameCardsData.length) {
-      showSnackbar({
-        text: "请先输入搜索内容",
-        color: "warn",
-      });
+      showSnackbar.warn("请先输入搜索内容");
    } else {
      sortData(AppNameCardsData);
    }
--- a/src/pages/WIKI/Weapon.vue
+++ b/src/pages/WIKI/Weapon.vue
@@ -61,7 +61,7 @@ onBeforeMount(() => {
    curItem.value = item;
    return;
  }
-  showSnackbar({ text: `武器 ${id} 不存在`, color: "warn" });
+  showSnackbar.warn(`武器 ${id} 不存在`);
  curItem.value = cardsInfo.value[0];
 });

@@ -75,10 +75,10 @@ function handleSelectW(val: SelectedWValue) {
    return val.weapon.includes(match[1]);
  });
  if (filterW.length === 0) {
-    showSnackbar({ text: "未找到符合条件的武器", color: "warn" });
+    showSnackbar.warn("未找到符合条件的武器");
    return;
  }
-  showSnackbar({ text: `找到 ${filterW.length} 件符合条件的武器` });
+  showSnackbar.success(`找到 ${filterW.length} 件符合条件的武器`);
  cardsInfo.value = filterW;
 }

@@ -89,7 +89,7 @@ async function switchW(item: TGApp.App.Weapon.WikiBriefInfo): Promise<void> {
 async function toOuter(item?: TGApp.App.Weapon.WikiBriefInfo): Promise<void> {
  if (!item) return;
  if (item.contentId === 0) {
-    showSnackbar({ text: `武器 ${item.name} 暂无观测枢页面`, color: "warn" });
+    showSnackbar.warn(`武器 ${item.name} 暂无观测枢页面`);
    return;
  }
  const confirm = await showConfirm({
@@ -97,7 +97,7 @@ async function toOuter(item?: TGApp.App.Weapon.WikiBriefInfo): Promise<void> {
    text: "是否打开观测枢页面？",
  });
  if (!confirm) {
-    showSnackbar({ text: "已取消", color: "cancel" });
+    showSnackbar.cancel("已取消打开观测枢页面");
    return;
  }
  await createObc(item.contentId, item.name);
--- a/src/pages/common/Achievements.vue
+++ b/src/pages/common/Achievements.vue
@@ -98,7 +98,7 @@ let achiListener: UnlistenFn | null = null;
 async function switchHideFin() {
  const text = hideFin.value ? "显示已完成" : "隐藏已完成";
  hideFin.value = !hideFin.value;
-  showSnackbar({ text: `已${text}`, color: "success" });
+  showSnackbar.success(`已${text}`);
 }

 onMounted(async () => {
@@ -140,20 +140,12 @@ async function importJson(): Promise<void> {
  const selectedFile = await open({
    title: "选择 UIAF 数据文件",
    multiple: false,
-    filters: [
-      {
-        name: "UIAF JSON",
-        extensions: ["json"],
-      },
-    ],
+    filters: [{ name: "UIAF JSON", extensions: ["json"] }],
    defaultPath: await path.downloadDir(),
    directory: false,
  });
  if (selectedFile === null) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消文件选择",
-    });
+    showSnackbar.cancel("已取消文件选择");
    await TGLogger.Info("[Achievements][importJson] 已取消文件选择");
    return;
  }
@@ -166,12 +158,12 @@ async function importJson(): Promise<void> {
    input: uidCur.value.toString(),
  });
  if (uidInput === false) {
-    showSnackbar({ text: "已取消存档导入!", color: "cancel" });
+    showSnackbar.cancel("已取消存档导入");
    return;
  }
  if (uidInput === undefined) uidInput = uidCur.value.toString();
  else if (isNaN(Number(uidInput))) {
-    showSnackbar({ text: "请输入合法数字", color: "warn" });
+    showSnackbar.warn("请输入合法数字");
    return;
  }
  const remoteRaw = await readUiafData(selectedFile);
@@ -186,15 +178,13 @@ async function importJson(): Promise<void> {
  loadingTitle.value = "正在合并成就数据";
  await TSUserAchi.mergeUiaf(remoteRaw.list, Number(uidInput));
  loadingTitle.value = "即将刷新页面";
-  setTimeout(() => {
-    window.location.reload();
-  }, 1000);
+  setTimeout(() => window.location.reload(), 1000);
 }

 async function exportJson(): Promise<void> {
  await TGLogger.Info("[Achievements][exportJson] 导出 UIAF 数据");
  if (overview.value.fin === 0) {
-    showSnackbar({ color: "error", text: "没有可导出的数据" });
+    showSnackbar.warn("没有可导出的数据");
    await TGLogger.Warn("[Achievements][exportJson] 没有可导出的数据");
    return;
  }
@@ -205,21 +195,16 @@ async function exportJson(): Promise<void> {
  const fileName = `UIAF_${UiafData.info.export_app}_${UiafData.info.export_app_version}_${uidCur.value}`;
  const isSave = await save({
    title: "导出 UIAF 数据",
-    filters: [
-      {
-        name: "UIAF JSON",
-        extensions: ["json"],
-      },
-    ],
+    filters: [{ name: "UIAF JSON", extensions: ["json"] }],
    defaultPath: `${await path.downloadDir()}${path.sep()}${fileName}.json`,
  });
  if (isSave === null) {
-    showSnackbar({ color: "warn", text: "已取消导出" });
+    showSnackbar.cancel("已取消导出");
    await TGLogger.Info("[Achievements][exportJson] 已取消导出");
    return;
  }
  await writeTextFile(isSave, JSON.stringify(UiafData));
-  showSnackbar({ text: "导出成功", color: "success" });
+  showSnackbar.success("导出成功");
  await TGLogger.Info("[Achievements][exportJson] 导出成功");
  await TGLogger.Info(`[Achievements][exportJson] 导出路径：${isSave}`);
 }
@@ -231,10 +216,7 @@ async function handleImportOuter(app: string): Promise<void> {
    text: `来源APP：${app}`,
  });
  if (!confirm) {
-    showSnackbar({
-      color: "warn",
-      text: "已取消导入",
-    });
+    showSnackbar.cancel("已取消导入");
    await TGLogger.Info("[Achievements][handleImportOuter] 已取消导入");
    return;
  }
@@ -249,12 +231,12 @@ async function handleImportOuter(app: string): Promise<void> {
    input: uidCur.value.toString(),
  });
  if (uidInput === false) {
-    showSnackbar({ text: "已取消存档导入!", color: "cancel" });
+    showSnackbar.cancel("已取消存档导入");
    return;
  }
  if (uidInput === undefined) uidInput = uidCur.value.toString();
  else if (isNaN(Number(uidInput))) {
-    showSnackbar({ text: "请输入合法数字", color: "warn" });
+    showSnackbar.warn("请输入合法数字");
    return;
  }
  const data: TGApp.Plugins.UIAF.Data = JSON.parse(clipboard);
@@ -262,11 +244,9 @@ async function handleImportOuter(app: string): Promise<void> {
  loading.value = true;
  await TSUserAchi.mergeUiaf(data.list, Number(uidInput));
  loading.value = false;
-  showSnackbar({ color: "success", text: "导入成功，即将刷新页面" });
+  showSnackbar.success("导入成功，即将刷新页面");
  await TGLogger.Info("[Achievements][handleImportOuter] 导入成功");
-  setTimeout(async () => {
-    await router.push("/achievements");
-  }, 1500);
+  setTimeout(async () => await router.push("/achievements"), 1500);
 }

 async function createUid(): Promise<void> {
@@ -276,20 +256,20 @@ async function createUid(): Promise<void> {
    text: "UID:",
  });
  if (uidInput === undefined || uidInput === false) {
-    showSnackbar({ text: "已取消", color: "cancel" });
+    showSnackbar.cancel("已取消");
    return;
  }
  if (isNaN(Number(uidInput))) {
-    showSnackbar({ text: "请输入合法数字", color: "warn" });
+    showSnackbar.warn("请输入合法数字");
    return;
  }
  if (uidList.value.includes(Number(uidInput))) {
-    showSnackbar({ text: "该存档已存在！", color: "warn" });
+    showSnackbar.warn("该存档已存在！");
    return;
  }
  uidList.value.push(Number(uidInput));
  uidCur.value = Number(uidInput);
-  showSnackbar({ text: `切换到新存档 ${Number(uidInput)}`, color: "success" });
+  showSnackbar.success(`切换到新存档 ${Number(uidInput)}`);
 }

 async function deleteUid(): Promise<void> {
@@ -298,7 +278,7 @@ async function deleteUid(): Promise<void> {
    text: `确认则清空存档-${uidCur.value}对应数据`,
  });
  if (uidInput === undefined || !uidInput) {
-    showSnackbar({ text: "已取消删除存档", color: "cancel" });
+    showSnackbar.cancel("已取消删除存档");
    return;
  }
  await TSUserAchi.delUid(uidCur.value);
--- a/src/pages/common/Announcements.vue
+++ b/src/pages/common/Announcements.vue
@@ -116,21 +116,27 @@ const annoCards = ref<AnnoCard>({
  game: [],
 });

-watch(curRegion, async (value) => {
-  appStore.server = value;
-  const name = getRegionName(value);
-  await TGLogger.Info(`[Announcements][watch][curRegionName] 切换服务器：${name}`);
-  await loadData();
-  showSnackbar({ text: `服务器切换为：${name}`, color: "success" });
-});
+watch(
+  () => curRegion.value,
+  async () => {
+    appStore.server = curRegion.value;
+    const name = getRegionName(curRegion.value);
+    await TGLogger.Info(`[Announcements][watch][curRegionName] 切换服务器：${name}`);
+    await loadData();
+    showSnackbar.success(`服务器切换为：${name}`);
+  },
+);

-watch(curLang, async (value) => {
-  appStore.lang = value;
-  const name = getLangName(value);
-  await TGLogger.Info(`[Announcements][watch][curLangName] 切换语言：${name}`);
-  await loadData();
-  showSnackbar({ text: `语言切换为：${name}`, color: "success" });
-});
+watch(
+  () => curLang.value,
+  async () => {
+    appStore.lang = curLang.value;
+    const name = getLangName(curLang.value);
+    await TGLogger.Info(`[Announcements][watch][curLangName] 切换语言：${name}`);
+    await loadData();
+    showSnackbar.success(`语言切换为：${name}`);
+  },
+);

 onMounted(async () => {
  await TGLogger.Info("[Announcements][onMounted] 打开公告页面");
@@ -158,9 +164,7 @@ async function loadData(): Promise<void> {
    game: listCards.filter((item) => item.typeLabel === AnnoType.game),
  };
  loadingTitle.value = "正在渲染公告数据";
-  await nextTick(async () => {
-    loading.value = false;
-  });
+  await nextTick(() => (loading.value = false));
 }

 function getRegionName(value: AnnoServer): string {
--- a/src/pages/common/Config.vue
+++ b/src/pages/common/Config.vue
@@ -135,7 +135,7 @@ import TGRequest from "../../web/request/TGRequest.js";
 // Store
 const appStore = useAppStore();
 const homeStore = useHomeStore();
-
+// @ts-expect-error-next-line
 const isDevEnv = ref<boolean>(import.meta.env.MODE === "development");

 // loading
@@ -167,10 +167,7 @@ async function confirmBackup(): Promise<void> {
    text: "取消则自选路径，点击外部不做处理",
  });
  if (res === undefined) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消备份",
-    });
+    showSnackbar.cancel("已取消备份");
    return;
  }
  let saveDir = appStore.userDir;
@@ -181,10 +178,7 @@ async function confirmBackup(): Promise<void> {
      multiple: false,
    });
    if (dir === null) {
-      showSnackbar({
-        color: "error",
-        text: "路径不能为空!",
-      });
+      showSnackbar.error("路径不能为空!");
      return;
    }
    await TGLogger.Info(`[Config][confirmBackup] 选择备份路径 ${dir.toString()}`);
@@ -196,7 +190,7 @@ async function confirmBackup(): Promise<void> {
  loading.value = true;
  await backUpUserData(saveDir);
  loading.value = false;
-  showSnackbar({ text: "数据已备份!" });
+  showSnackbar.success("数据已备份!");
  await TGLogger.Info("[Config][confirmBackup] 备份完成");
 }

@@ -207,10 +201,7 @@ async function confirmRestore(): Promise<void> {
    text: "取消则自选路径，点击外部不做处理",
  });
  if (resConfirm === undefined) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消恢复",
-    });
+    showSnackbar.cancel("已取消恢复");
    return;
  }
  let saveDir = appStore.userDir;
@@ -221,10 +212,7 @@ async function confirmRestore(): Promise<void> {
      multiple: false,
    });
    if (dir === null) {
-      showSnackbar({
-        color: "error",
-        text: "路径不能为空!",
-      });
+      showSnackbar.error("路径不能为空!");
      return;
    }
    await TGLogger.Info(`[Config][confirmRestore] 选择恢复路径 ${dir.toString()}`);
@@ -233,25 +221,19 @@ async function confirmRestore(): Promise<void> {
    await TGLogger.Info(`[Config][confirmRestore] 恢复到默认路径 ${saveDir}`);
  }
  loadingTitle.value = "正在恢复数据...";
+  loadingSub.value = "请稍后...";
  loading.value = true;
-  loadingSub.value = "祈愿数据需单独恢复";
  await restoreUserData(saveDir);
  loading.value = false;
-  showSnackbar({ text: "数据已恢复!" });
+  showSnackbar.success("数据已恢复!");
  await TGLogger.Info("[Config][confirmRestore] 恢复完成");
 }

 // 更新数据
 async function confirmUpdate(title?: string): Promise<void> {
-  const res = await showConfirm({
-    title: title ?? "确认更新数据吗？",
-    text: "请确保存在备份数据",
-  });
+  const res = await showConfirm({ title: title ?? "确认更新数据吗？", text: "请确保存在备份数据" });
  if (!res) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消更新数据库",
-    });
+    showSnackbar.cancel("已取消更新数据库");
    return;
  }
  loadingTitle.value = "正在更新数据库...";
@@ -259,11 +241,8 @@ async function confirmUpdate(title?: string): Promise<void> {
  await TGSqlite.update();
  appStore.buildTime = getBuildTime();
  loading.value = false;
-  showSnackbar({
-    text: "数据库已更新!",
-  });
+  showSnackbar.success("数据库已更新!");
  await TGLogger.Info("[Config][confirmUpdate] 数据库更新完成");
-  // 刷新
  window.location.reload();
 }

@@ -276,25 +255,17 @@ async function confirmUpdateDevice(force?: boolean): Promise<void> {
      text: `DeviceFp:${appStore.deviceInfo.device_fp}`,
    });
    if (!resF) {
-      showSnackbar({
-        text: "已取消强制更新设备信息",
-        color: "cancel",
-      });
+      showSnackbar.cancel("已取消强制更新设备信息");
      await TGLogger.Info("[Config][confirmUpdateDevice][force] 取消强制更新设备信息");
      return;
    }
    appStore.deviceInfo = await TGRequest.Device.getFp();
    if (appStore.deviceInfo.device_fp === "0000000000000") {
      appStore.deviceInfo.device_fp = getRandomString(13, "hex");
-      showSnackbar({
-        text: `设备信息获取失败!已使用随机值 ${appStore.deviceInfo.device_fp} 代替`,
-        color: "warn",
-      });
+      showSnackbar.warn(`设备信息获取失败!已使用随机值${appStore.deviceInfo.device_fp}代替`);
      await TGLogger.Warn("[Config][confirmUpdateDevice][force] 设备信息获取失败!已使用随机值代替");
    } else {
-      showSnackbar({
-        text: "设备信息已更新! DeviceFp: " + appStore.deviceInfo.device_fp,
-      });
+      showSnackbar.success(`设备信息已更新! DeviceFp: ${appStore.deviceInfo.device_fp}`);
    }
    await TGSqlite.saveAppData("deviceInfo", JSON.stringify(appStore.deviceInfo));
    await TGLogger.Info("[Config][confirmUpdateDevice][force] 设备信息更新完成");
@@ -303,15 +274,9 @@ async function confirmUpdateDevice(force?: boolean): Promise<void> {
  await TGLogger.Info("[Config][confirmUpdateDevice] 开始更新设备信息");
  const localFp = getDeviceInfo("device_fp");
  if (localFp !== "0000000000000") {
-    const res = await showConfirm({
-      title: "确认更新设备信息吗？",
-      text: `DeviceFp:${localFp}`,
-    });
+    const res = await showConfirm({ title: "确认更新设备信息吗？", text: `DeviceFp:${localFp}` });
    if (!res) {
-      showSnackbar({
-        text: "已取消更新设备信息",
-        color: "cancel",
-      });
+      showSnackbar.cancel("已取消更新设备信息");
      await TGLogger.Info("[Config][confirmUpdateDevice] 取消更新设备信息");
      return;
    }
@@ -321,15 +286,11 @@ async function confirmUpdateDevice(force?: boolean): Promise<void> {
  console.log(appStore.deviceInfo);
  if (appStore.deviceInfo.device_fp === "0000000000000") {
    appStore.deviceInfo.device_fp = getRandomString(13, "hex");
-    showSnackbar({
-      text: "设备信息获取失败!已使用随机值代替",
-    });
+    showSnackbar.warn(`设备信息获取失败!已使用随机值${appStore.deviceInfo.device_fp}代替`);
    await TGLogger.Warn("[Config][confirmUpdateDevice] 设备信息获取失败!已使用随机值代替");
    return;
  }
-  showSnackbar({
-    text: "设备信息已更新! DeviceFp: " + appStore.deviceInfo.device_fp,
-  });
+  showSnackbar.success(`设备信息已更新! DeviceFp: ${appStore.deviceInfo.device_fp}`);
  await TGSqlite.saveAppData("deviceInfo", JSON.stringify(appStore.deviceInfo));
  await TGLogger.Info("[Config][confirmUpdateDevice] 设备信息更新完成");
 }
@@ -339,10 +300,7 @@ async function confirmDelCache(): Promise<void> {
  await TGLogger.Info("[Config][confirmDelCache] 开始清除缓存");
  const CacheDir = await getCacheDir();
  if (CacheDir === false) {
-    showSnackbar({
-      color: "error",
-      text: "不支持的平台!",
-    });
+    showSnackbar.error("不支持的平台!");
    return;
  }
  let cacheBSize: number = 0;
@@ -359,10 +317,7 @@ async function confirmDelCache(): Promise<void> {
    text: `当前缓存大小为 ${bytesToSize(cacheBSize)}`,
  });
  if (!res) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消清除缓存",
-    });
+    showSnackbar.cancel("已取消清除缓存");
    await TGLogger.Info("[Config][confirmDelCache] 取消清除缓存");
    return;
  }
@@ -373,35 +328,24 @@ async function confirmDelCache(): Promise<void> {
  }
  await TGLogger.Info("[Config][confirmDelCache] 缓存清除完成");
  loading.value = false;
-  showSnackbar({
-    text: "缓存已清除!即将退出应用！",
-  });
-  setTimeout(async () => {
-    await exit();
-  }, 1000);
+  showSnackbar.success("缓存已清除!即将退出应用！");
+  setTimeout(async () => await exit(), 1000);
 }

 // 恢复默认设置
 async function confirmResetApp(): Promise<void> {
  await TGLogger.Info("[Config][confirmResetApp] 开始恢复默认设置");
-  const res = await showConfirm({
-    title: "确认恢复默认设置吗？",
-  });
+  const res = await showConfirm({ title: "确认恢复默认设置吗？" });
  if (!res) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消恢复默认设置",
-    });
+    showSnackbar.cancel("已取消恢复默认设置");
    await TGLogger.Info("[Config][confirmResetApp] 取消恢复默认设置");
    return;
  }
  appStore.init();
  homeStore.init();
  await TGLogger.Info("[Config][confirmResetApp] 恢复默认设置完成");
-  showSnackbar({ text: "已恢复默认配置!即将刷新页面..." });
-  setTimeout(() => {
-    window.location.reload();
-  }, 1500);
+  showSnackbar.success("已恢复默认配置!即将刷新页面...");
+  setTimeout(() => window.location.reload(), 1500);
 }

 // 前置
@@ -412,25 +356,17 @@ async function tryShowReset(): Promise<void> {
    mode: "input",
  });
  if (!res) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消",
-    });
+    showSnackbar.cancel("已取消");
    return;
  }
  const time = getBuildTime();
  const code = time.startsWith("dev.") ? "dev" : time;
  if (res === code || res === "reset1128") {
    showReset.value = true;
-    showSnackbar({
-      text: "已开启重置数据库选项",
-    });
-  } else {
-    showSnackbar({
-      color: "error",
-      text: "验证失败",
-    });
+    showSnackbar.success("已开启重置数据库选项");
+    return;
  }
+  showSnackbar.error("验证失败");
 }

 // 重置数据库
@@ -441,10 +377,7 @@ async function confirmResetDB(title?: string): Promise<void> {
    text: "请确认已经备份关键数据",
  });
  if (!res) {
-    showSnackbar({
-      color: "cancel",
-      text: "已取消重置数据库",
-    });
+    showSnackbar.cancel("已取消重置数据库");
    await TGLogger.Info("[Config][confirmResetDB] 取消重置数据库");
    return;
  }
@@ -453,42 +386,34 @@ async function confirmResetDB(title?: string): Promise<void> {
  await TGSqlite.reset();
  await TGLogger.Info("[Config][confirmResetDB] 数据库重置完成");
  loading.value = false;
-  showSnackbar({
-    text: "数据库已重置!请进行再次检查。",
-  });
-  setTimeout(() => {
-    window.location.reload();
-  }, 1500);
+  showSnackbar.success("数据库已重置!请进行再次检查。");
+  setTimeout(() => window.location.reload(), 1500);
 }

 // 开启 dev 模式
 function submitDevMode(): void {
  if (appStore.devMode) {
-    showSnackbar({ text: "已关闭 dev 模式!" });
+    showSnackbar.success("已关闭 dev 模式!");
    return;
  }
-  showSnackbar({ text: "已开启 dev 模式!" });
+  showSnackbar.success("已开启 dev 模式!");
 }

 // 开启窗口回正
 function submitResize(): void {
  appStore.needResize = (!needResize.value).toString();
  if (needResize.value) {
-    showSnackbar({ text: "已关闭窗口回正!" });
+    showSnackbar.success("已关闭窗口回正!");
    return;
  }
-  showSnackbar({ text: "已开启窗口回正!" });
+  showSnackbar.success("已开启窗口回正!");
 }

 // 通过子组件的事件来控制 loading
 function loadHandle(params: TGApp.Component.Loading.EmitParams): void {
  loading.value = params.show;
-  if (params.title) {
-    loadingTitle.value = params.title;
-  }
-  if (params.text) {
-    loadingSub.value = params.text;
-  }
+  if (params.title) loadingTitle.value = params.title;
+  if (params.text) loadingSub.value = params.text;
 }
 </script>
 <style lang="css" scoped>
--- a/src/pages/common/Home.vue
+++ b/src/pages/common/Home.vue
@@ -71,6 +71,7 @@ const curGid = ref<string>(gameSelectList[0].gid);

 onMounted(async () => {
  loadingTitle.value = "正在加载首页";
+  // @ts-expect-error-next-line
  const isProdEnv = import.meta.env.MODE === "production";
  // 获取当前环境
  if (isProdEnv && appStore.devMode) {
@@ -101,21 +102,13 @@ onMounted(async () => {
 async function submitHome(): Promise<void> {
  const show = showHome.value;
  if (show.length < 1) {
-    showSnackbar({
-      color: "error",
-      text: "请至少选择一个!",
-    });
+    showSnackbar.warn("请至少选择一个!");
    return;
  }
  homeStore.setShowValue(show);
-  showSnackbar({
-    color: "success",
-    text: "设置成功!",
-  });
+  showSnackbar.success("设置成功!");
  await TGLogger.Info("[Home][submitHome] 首页设置成功，当前显示：" + show.join("、"));
-  setTimeout(() => {
-    window.location.reload();
-  }, 1000);
+  setTimeout(() => window.location.reload(), 1000);
 }

 // 组件加载完成
--- a/src/pages/common/News.vue
+++ b/src/pages/common/News.vue
@@ -171,10 +171,7 @@ async function switchAnno(): Promise<void> {
 async function loadMore(key: NewsKey): Promise<void> {
  loadingSub.value = true;
  if (rawData.value[key].isLast) {
-    showSnackbar({
-      text: "已经是最后一页了",
-      color: "warn",
-    });
+    showSnackbar.warn("已经是最后一页了");
    loadingSub.value = false;
    return;
  }
@@ -185,10 +182,7 @@ async function loadMore(key: NewsKey): Promise<void> {
  rawData.value[key].isLast = getData.is_last;
  postData.value[key] = postData.value[key].concat(getData.list);
  if (rawData.value[key].isLast) {
-    showSnackbar({
-      text: "已经是最后一页了",
-      color: "warn",
-    });
+    showSnackbar.warn("已经是最后一页了");
    loadingSub.value = false;
    loading.value = false;
    return;
@@ -201,10 +195,7 @@ async function loadMore(key: NewsKey): Promise<void> {

 async function searchPost(): Promise<void> {
  if (search.value === "") {
-    showSnackbar({
-      text: "请输入搜索内容",
-      color: "error",
-    });
+    showSnackbar.warn("请输入搜索内容");
    return;
  }
  const numCheck = Number(search.value);
--- a/src/pages/common/PostCollect.vue
+++ b/src/pages/common/PostCollect.vue
@@ -79,7 +79,7 @@
    <div class="pc-posts">
      <div v-for="item in getPageItems()" :key="item.post.post_id">
        <TPostCard
-          @update:selected="updateSelected"
+          @update:selected="selectedPost = $event"
          :model-value="item"
          :selected="selectedPost"
          :select-mode="selectedMode"
@@ -93,14 +93,13 @@
 import { event } from "@tauri-apps/api";
 import { UnlistenFn } from "@tauri-apps/api/event";
 import { storeToRefs } from "pinia";
-import { computed, onBeforeMount, onMounted, onUnmounted, ref, watch } from "vue";
+import { computed, onMounted, onUnmounted, ref, watch } from "vue";

 import showConfirm from "../../components/func/confirm.js";
 import showSnackbar from "../../components/func/snackbar.js";
 import TPostCard from "../../components/main/t-postcard.vue";
 import ToCollectPost from "../../components/overlay/to-collectPost.vue";
 import ToLoading from "../../components/overlay/to-loading.vue";
-import TGSqlite from "../../plugins/Sqlite/index.js";
 import TSUserCollection from "../../plugins/Sqlite/modules/userCollect.js";
 import { useUserStore } from "../../store/modules/user.js";
 import TGLogger from "../../utils/TGLogger.js";
@@ -128,18 +127,10 @@ const sortId = ref<boolean>(false);

 let collectListener: UnlistenFn | null = null;

-onBeforeMount(async () => {
-  if (!(await TGSqlite.checkTableExist("UFPost"))) {
-    await TGSqlite.update();
-    showSnackbar({
-      text: "数据库已更新",
-      color: "success",
-    });
-  }
+onMounted(async () => {
  collectListener = await event.listen("refreshCollect", async () => await load());
+  await load();
 });
-
-onMounted(async () => await load());
 onUnmounted(() => {
  if (collectListener !== null) {
    collectListener();
@@ -147,10 +138,6 @@ onUnmounted(() => {
  }
 });

-function updateSelected(v: string[]) {
-  selectedPost.value = v;
-}
-
 function sortPost(value: boolean) {
  let ori = sortId.value;
  sortId.value = value;
@@ -162,10 +149,7 @@ function sortPost(value: boolean) {
    }
  });
  if (ori !== sortId.value) {
-    showSnackbar({
-      text: `已${sortId.value ? "按帖子ID排序" : "按更新时间排序"}`,
-      color: "success",
-    });
+    showSnackbar.success(`已${sortId.value ? "按帖子ID排序" : "按更新时间排序"}`);
  }
 }

@@ -192,14 +176,14 @@ async function load(): Promise<void> {
 }

 function toSelect() {
-  if (!selectedMode.value) {
-    selectedPost.value = [];
-    selectedMode.value = true;
-  } else {
+  if (selectedMode.value) {
    selectedMode.value = false;
    if (selectedPost.value.length === 0) return;
    showOverlay.value = true;
+    return;
  }
+  selectedPost.value = [];
+  selectedMode.value = true;
 }

 async function addCollect(): Promise<void> {
@@ -211,17 +195,11 @@ async function addCollect(): Promise<void> {
  });
  if (titleC === undefined || titleC === false) return;
  if (titleC === "未分类") {
-    showSnackbar({
-      text: "分类名不可为未分类",
-      color: "error",
-    });
+    showSnackbar.warn("分类名不可为未分类");
    return;
  }
  if (collections.value.find((i) => i.title === titleC)) {
-    showSnackbar({
-      text: "分类已存在",
-      color: "error",
-    });
+    showSnackbar.warn("分类已存在");
    return;
  }
  title = titleC;
@@ -235,26 +213,17 @@ async function addCollect(): Promise<void> {
  else desc = descC;
  const res = await TSUserCollection.createCollect(title, desc);
  if (res) {
-    showSnackbar({
-      text: "新建成功",
-      color: "success",
-    });
+    showSnackbar.success("成功新建分类");
    await load();
-  } else {
-    showSnackbar({
-      text: "新建失败",
-      color: "error",
-    });
+    return;
  }
+  showSnackbar.error("新建失败");
 }

 async function toEdit(): Promise<void> {
  const collect = collections.value.find((c) => c.title === curSelect.value);
  if (collect === undefined) {
-    showSnackbar({
-      text: "未找到合集信息！",
-      color: "error",
-    });
+    showSnackbar.warn("未找到合集信息");
    return;
  }
  let cTc = await showConfirm({
@@ -264,25 +233,16 @@ async function toEdit(): Promise<void> {
    input: collect.title,
  });
  if (cTc === false) {
-    showSnackbar({
-      text: "取消修改分类信息",
-      color: "cancel",
-    });
+    showSnackbar.cancel("取消修改分类信息");
    return;
  }
  if (typeof cTc !== "string") cTc = collect.title;
  if (cTc === "未分类") {
-    showSnackbar({
-      text: "该名称为保留名称，不可用于作为分类名！",
-      color: "error",
-    });
+    showSnackbar.warn("分类名不可为未分类");
    return;
  }
  if (cTc !== collect.title && collections.value.find((c) => c.title === cTc)) {
-    showSnackbar({
-      text: "分类名称重复！",
-      color: "error",
-    });
+    showSnackbar.warn("分类名称重复");
    return;
  }
  let cTd = await showConfirm({
@@ -292,15 +252,9 @@ async function toEdit(): Promise<void> {
    input: collect.desc,
  });
  if (typeof cTd !== "string") cTd = collect.desc;
-  const cc = await showConfirm({
-    title: "确定修改？",
-    text: `[${cTc}] ${cTd}`,
-  });
+  const cc = await showConfirm({ title: "确定修改？", text: `[${cTc}] ${cTd}` });
  if (!cc) {
-    showSnackbar({
-      text: "取消修改分类信息",
-      color: "cancel",
-    });
+    showSnackbar.cancel("取消修改分类信息");
    return;
  }
  loadingTitle.value = "正在修改分类信息...";
@@ -308,32 +262,21 @@ async function toEdit(): Promise<void> {
  const check = await TSUserCollection.updateCollect(collect.title, cTc, cTd);
  loading.value = false;
  if (!check) {
-    showSnackbar({
-      text: "修改分类信息失败!",
-      color: "error",
-    });
+    showSnackbar.warn("修改分类信息失败");
    return;
  }
-  showSnackbar({
-    text: "成功修改分类信息！",
-  });
+  showSnackbar.success("成功修改分类信息！");
  await load();
 }

 async function deleteOper(force: boolean): Promise<void> {
-  if (selectedMode.value) {
-    await deletePost(force);
-  } else {
-    await deleteCollect(force);
-  }
+  if (selectedMode.value) await deletePost(force);
+  else await deleteCollect(force);
 }

 async function deletePost(force: boolean = false): Promise<void> {
  if (selectedPost.value.length === 0) {
-    showSnackbar({
-      text: "未选择帖子",
-      color: "error",
-    });
+    showSnackbar.warn("未选择帖子");
    return;
  }
  const title = force ? "删除帖子" : "移除帖子分类";
@@ -342,10 +285,7 @@ async function deletePost(force: boolean = false): Promise<void> {
    text: `共 ${selectedPost.value.length} 条帖子`,
  });
  if (!res) {
-    showSnackbar({
-      text: "取消操作",
-      color: "cancel",
-    });
+    showSnackbar.cancel("取消操作");
    return;
  }
  loadingTitle.value = `正在${title}...`;
@@ -353,30 +293,21 @@ async function deletePost(force: boolean = false): Promise<void> {
  let success = 0;
  for (const post of selectedPost.value) {
    const check = await TSUserCollection.deletePostCollect(post, force);
-    if (!check) {
-      showSnackbar({
-        text: `帖子 ${post} 操作失败`,
-        color: "error",
-      });
-      await new Promise((resolve) => setTimeout(resolve, 1500));
-    } else {
+    if (check) {
      success++;
+      continue;
    }
+    showSnackbar.warn(`帖子 ${post} 操作失败`);
+    await new Promise((resolve) => setTimeout(resolve, 1500));
  }
  loading.value = false;
-  showSnackbar({
-    text: `成功${title} ${success} 条`,
-    color: "success",
-  });
+  showSnackbar.success(`成功${title} ${success} 条`);
  await load();
 }

 async function deleteCollect(force: boolean): Promise<void> {
  if (curSelect.value === "未分类" && force) {
-    showSnackbar({
-      text: "未分类不可删除",
-      color: "error",
-    });
+    showSnackbar.warn("未分类不可删除");
    return;
  }
  const title = force ? "删除分类" : "清空分类";
@@ -385,10 +316,7 @@ async function deleteCollect(force: boolean): Promise<void> {
    text: `该分类下${selected.value.length}条帖子将被${force ? "删除" : "移除分类(未分类将被删除)"}`,
  });
  if (!res) {
-    showSnackbar({
-      text: "取消删除",
-      color: "cancel",
-    });
+    showSnackbar.cancel("取消操作");
    return;
  }
  let resD;
@@ -398,17 +326,11 @@ async function deleteCollect(force: boolean): Promise<void> {
    resD = await TSUserCollection.deleteUnCollectPost();
  }
  if (resD) {
-    showSnackbar({
-      text: `成功 ${title}`,
-      color: "success",
-    });
+    showSnackbar.success(`成功${title}`);
    await load();
-  } else {
-    showSnackbar({
-      text: `${title} 失败`,
-      color: "error",
-    });
+    return;
  }
+  showSnackbar.warn(`${title} 失败`);
 }

 // 根据合集筛选
@@ -427,10 +349,7 @@ async function freshPost(select: string | null): Promise<void> {
  }
  page.value = 1;
  loading.value = false;
-  showSnackbar({
-    text: `切换合集 ${select}，共 ${selected.value.length} 条帖子`,
-    color: "success",
-  });
+  showSnackbar.success(`切换合集 ${select}，共 ${selected.value.length} 条帖子`);
 }

 // 获取当前页的帖子
@@ -452,9 +371,10 @@ function getPageItems(): TGApp.Plugins.Mys.Post.FullData[] {
  return card;
 }

-watch(curSelect, async () => {
-  await freshPost(curSelect.value);
-});
+watch(
+  () => curSelect.value,
+  async () => await freshPost(curSelect.value),
+);

 async function freshOther(): Promise<void> {
  const input = await showConfirm({
@@ -464,27 +384,18 @@ async function freshOther(): Promise<void> {
  });
  if (typeof input === "string") {
    if (isNaN(Number(input))) {
-      showSnackbar({
-        text: "UID 格式错误，请输入数字",
-        color: "error",
-      });
+      showSnackbar.warn("UID 格式错误，请输入数字");
      return;
    }
    await freshUser(input);
    return;
  }
-  showSnackbar({
-    text: "取消导入",
-    color: "cancel",
-  });
+  showSnackbar.cancel("取消导入");
 }

 async function freshUser(uid?: string): Promise<void> {
  if (!userStore.cookie.value) {
-    showSnackbar({
-      text: "请先登录",
-      color: "error",
-    });
+    showSnackbar.warn("请先登录");
    return;
  }
  const cookie = {
@@ -494,43 +405,30 @@ async function freshUser(uid?: string): Promise<void> {
  loadingTitle.value = "获取用户收藏...";
  loading.value = true;
  let res = await TGRequest.User.getCollect(cookie, uid || userStore.briefInfo.value.uid);
-  let is_last = false;
-  while (!is_last) {
+  while (true) {
    if ("retcode" in res) {
      if (res.retcode === 1001) {
-        showSnackbar({
-          text: "用户收藏已设为私密，无法获取",
-          color: "error",
-        });
+        showSnackbar.warn("用户收藏已设为私密，无法获取");
      } else {
-        showSnackbar({
-          text: `[${res.retcode}] ${res.message}`,
-          color: "error",
-        });
+        showSnackbar.error(`[${res.retcode}] ${res.message}`);
      }
      loading.value = false;
-      return;
+      break;
    }
    let posts = res.list;
    loadingTitle.value = `合并收藏帖子 [offset]${res.next_offset}...`;
    await mergePosts(posts, uid || userStore.briefInfo.value.uid);
-    if (res.is_last) {
-      is_last = true;
-    } else {
-      loadingTitle.value = "获取用户收藏...";
-      loadingSub.value = `[offset]${res.next_offset} [is_last]${res.is_last}`;
-      res = await TGRequest.User.getCollect(
-        cookie,
-        uid || userStore.briefInfo.value.uid,
-        res.next_offset,
-      );
-    }
+    if (res.is_last) break;
+    loadingTitle.value = "获取用户收藏...";
+    loadingSub.value = `[offset]${res.next_offset} [is_last]${res.is_last}`;
+    res = await TGRequest.User.getCollect(
+      cookie,
+      uid || userStore.briefInfo.value.uid,
+      res.next_offset,
+    );
  }
  loading.value = false;
-  showSnackbar({
-    text: "获取用户收藏成功",
-    color: "success",
-  });
+  showSnackbar.success("获取用户收藏成功");
  window.location.reload();
 }

--- a/src/pages/common/Posts.vue
+++ b/src/pages/common/Posts.vue
@@ -64,7 +64,7 @@
  <ToPostSearch :gid="curGid.toString()" v-model="showSearch" :keyword="search" />
 </template>
 <script setup lang="ts">
-import { nextTick, onBeforeMount, onMounted, ref, watch } from "vue";
+import { onMounted, ref, watch } from "vue";
 import { useRoute } from "vue-router";

 import showSnackbar from "../../components/func/snackbar.js";
@@ -188,12 +188,9 @@ const posts = ref<TGApp.Plugins.Mys.Post.FullData[]>([]);
 const search = ref<string>("");
 const showSearch = ref<boolean>(false);

-onBeforeMount(async () => {
+onMounted(async () => {
  if (gid && typeof gid === "string") curGid.value = Number(gid);
  if (forum && typeof forum === "string") curForum.value = Number(forum);
-});
-
-onMounted(async () => {
  const gameLabel = getGameLabel(curGid.value);
  const forumLabel = getForumLabel(curGid.value, curForum.value);
  await TGLogger.Info(`[Posts][${gameLabel}][onMounted][${forumLabel}] 打开帖子列表`);
@@ -210,8 +207,7 @@ watch(
    const forumFind = forums.find((item) => item.text === curForumLabel.value);
    if (forumFind) curForum.value = forumFind.value;
    else curForum.value = forums[0].value;
-    await nextTick();
-    showSnackbar({ text: `已将分区切换到 ${getGameLabel(newVal)}`, color: "success" });
+    showSnackbar.success(`已将分区切换到 ${getGameLabel(newVal)}`);
  },
 );
 watch(
@@ -221,10 +217,7 @@ watch(
    const oldForumLabel = JSON.parse(JSON.stringify(curForumLabel.value));
    curForumLabel.value = getForumLabel(curGid.value, curForum.value);
    if (oldForumLabel !== curForumLabel.value) {
-      showSnackbar({
-        text: `已将版块切换到 ${curForumLabel.value}`,
-        color: "success",
-      });
+      showSnackbar.success(`已将版块切换到 ${curForumLabel.value}`);
    }
  },
 );
@@ -233,7 +226,7 @@ watch(
  async () => {
    await freshPostData();
    const sortLabel = getSortLabel(curSortType.value);
-    showSnackbar({ text: `已将排序切换到 ${sortLabel}`, color: "success" });
+    showSnackbar.success(`已将排序切换到 ${sortLabel}`);
  },
 );

@@ -248,14 +241,13 @@ async function freshPostData(): Promise<void> {
  loadingTitle.value = `正在加载 ${gameLabel}-${forumLabel}-${sortLabel} 数据`;
  const postsGet = await Mys.Post.getForumPostList(curForum.value, curSortType.value);
  posts.value = postsGet.list;
-  await nextTick();
  loading.value = false;
 }

 // 查询帖子
 function searchPost(): void {
  if (search.value === "") {
-    showSnackbar({ text: "请输入搜索内容", color: "error" });
+    showSnackbar.warn("请输入搜索内容");
    return;
  }
  const numCheck = Number(search.value);