🔊 完善基础页面的 log #83

src/App.vue

@@ -13,7 +13,7 @@
 <script lang="ts" setup>
 import { app, event, fs, tauri, window as TauriWindow } from "@tauri-apps/api";
 import { storeToRefs } from "pinia";
-import { computed, onBeforeMount, onMounted, ref } from "vue";
+import { computed, onBeforeMount, onMounted, onUnmounted, ref } from "vue";
 import { useRouter } from "vue-router";
 
 import TBackTop from "./components/app/t-backTop.vue";
@@ -36,6 +36,8 @@ const vuetifyTheme = computed(() => {
   return appStore.theme === "dark" ? "dark" : "light";
 });
 
+let themeListener: () => void;
+
 onBeforeMount(async () => {
   const win = TauriWindow.getCurrent();
   isMain.value = win.label === "TeyvatGuide";
@@ -49,19 +51,14 @@ onBeforeMount(async () => {
 
 onMounted(async () => {
   document.documentElement.className = theme.value;
-  await listenOnTheme();
-});
-
-// 监听主题变化
-async function listenOnTheme(): Promise<void> {
-  await event.listen("readTheme", async (e) => {
+  themeListener = await event.listen("readTheme", async (e) => {
     const themeGet = <string>e.payload;
     if (theme.value !== themeGet) {
       theme.value = themeGet;
       document.documentElement.className = theme.value;
     }
   });
-}
+});
 
 // 启动后只执行一次的监听
 async function listenOnInit(): Promise<void> {
@@ -230,6 +227,10 @@ async function checkUpdate(): Promise<void> {
     window.open("https://app.btmuli.ink/docs/Changelogs.html");
   }
 }
+
+onUnmounted(() => {
+  themeListener();
+});
 </script>
 <style lang="css">
 .app-container {

src/components/app/t-sidebar.vue

@@ -228,11 +228,12 @@
 <script lang="ts" setup>
 import { event, window as TauriWindow } from "@tauri-apps/api";
 import { storeToRefs } from "pinia";
-import { computed, onMounted, ref } from "vue";
+import { computed, onMounted, ref, watch } from "vue";
 
 import { useAppStore } from "../../store/modules/app";
 import { useUserStore } from "../../store/modules/user";
 import mhyClient from "../../utils/TGClient";
+import TGLogger from "../../utils/TGLogger";
 import showSnackbar from "../func/snackbar";
 
 const appStore = useAppStore();
@@ -262,6 +263,10 @@ const themeTitle = computed(() => {
   return themeGet.value === "default" ? "夜间模式" : "日间模式";
 });
 
+watch(themeTitle, async (val) => {
+  await TGLogger.Info(`[App][theme] 已切换到${val}`);
+});
+
 function collapse(): void {
   rail.value = !rail.value;
   appStore.sidebar.collapse = rail.value;

src/components/config/tc-dataDir.vue

@@ -162,7 +162,7 @@ async function openPath(type: "db" | "user" | "log"): Promise<void> {
       break;
   }
   await dialog.open({
-    directory: type !== "db",
+    directory: false,
     defaultPath: targetPath,
     multiple: false,
   });

src/components/main/t-shareBtn.vue

@@ -7,6 +7,7 @@
 </template>
 <script lang="ts" setup>
 // utils
+import TGLogger from "../../utils/TGLogger";
 import { generateShareImg } from "../../utils/TGShare";
 
 interface TShareBtnProps {
@@ -21,6 +22,7 @@ const props = defineProps<TShareBtnProps>();
 const emit = defineEmits<TShareBtnEmits>();
 
 async function shareContent(): Promise<void> {
+  await TGLogger.Info("[TShareBtn][shareContent] 开始生成分享图片");
   emit("update:loading", true);
   props.modelValue.querySelectorAll("details").forEach((item) => {
     if (item.open) {
@@ -38,6 +40,7 @@ async function shareContent(): Promise<void> {
     }
   });
   emit("update:loading", false);
+  await TGLogger.Info("[TShareBtn][shareContent] 生成分享图片完成");
 }
 </script>
 <style lang="css" scoped>

src/components/post/tp-unknown.vue

@@ -4,7 +4,9 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { toRaw } from "vue";
+import { onMounted, toRaw } from "vue";
+
+import TGLogger from "../../utils/TGLogger";
 
 interface TpUnknownProps {
   data: TGApp.Plugins.Mys.SctPost.Empty;
@@ -13,6 +15,12 @@ interface TpUnknownProps {
 const props = defineProps<TpUnknownProps>();
 
 console.warn("tpUnknown", toRaw(props.data.insert));
+
+onMounted(async () => {
+  await TGLogger.Warn(
+    `[tpUnknown][onMounted] 未知的插件数据 ${JSON.stringify(toRaw(props.data))}}`,
+  );
+});
 </script>
 <style lang="css" scoped>
 .tp-unknown-box {

src/pages/common/Achievements.vue

@@ -114,6 +114,7 @@ import ToNamecard from "../../components/overlay/to-namecard.vue";
 import { AppAchievementSeriesData, AppNameCardsData } from "../../data";
 import TGSqlite from "../../plugins/Sqlite";
 import { useAchievementsStore } from "../../store/modules/achievements";
+import TGLogger from "../../utils/TGLogger";
 import { getNowStr } from "../../utils/toolFunc";
 import { getUiafHeader, readUiafData, verifyUiafData } from "../../utils/UIAF";
 
@@ -145,10 +146,6 @@ const renderSelect = computed(() => {
 const route = useRoute();
 const router = useRouter();
 
-onBeforeMount(async () => {
-  await flushOverview();
-});
-
 // 更改是否隐藏已完成
 async function switchHideFin() {
   const text = hideFin.value ? "显示已完成" : "隐藏已完成";
@@ -177,8 +174,12 @@ async function flushOverview(): Promise<void> {
 }
 
 onMounted(async () => {
+  await TGLogger.Info("[Achievements][onMounted] 打开成就页面");
+  await TGLogger.Info(`[Achievements][onMounted] 当前版本：${achievementsStore.lastVersion}`);
   loading.value = true;
   loadingTitle.value = "正在获取成就系列数据";
+  await flushOverview();
+  await TGLogger.Info(`[Achievements][onMounted] ${title.value}`);
   allSeriesData.value = await getSeriesData();
   achievementsStore.lastVersion = await TGSqlite.getLatestAchievementVersion();
   loadingTitle.value = "正在获取成就数据";
@@ -247,10 +248,10 @@ async function searchCard(): Promise<void> {
   selectedSeries.value = -1;
   loadingTitle.value = "正在搜索";
   loading.value = true;
+  await TGLogger.Info(`[Achievements][searchCard] 搜索内容：${search.value}`);
   selectedAchievement.value = await getAchiData("search", search.value);
   await nextTick(() => {
     loading.value = false;
-    // 等 500ms 动画
     setTimeout(() => {
       if (renderSelect.value.length === 0) {
         showSnackbar({
@@ -264,10 +265,12 @@ async function searchCard(): Promise<void> {
       });
     }, 500);
   });
+  await TGLogger.Info(`[Achievements][searchCard] 搜索到 ${renderSelect.value.length} 条成就数据`);
 }
 
 // 导入 UIAF 数据，进行数据合并、刷新
 async function importJson(): Promise<void> {
+  await TGLogger.Info("[Achievements][importJson] 导入 UIAF 数据");
   const selectedFile = await dialog.open({
     title: "选择 UIAF 数据文件",
     multiple: false,
@@ -285,16 +288,23 @@ async function importJson(): Promise<void> {
       color: "cancel",
       text: "已取消文件选择",
     });
+    await TGLogger.Info("[Achievements][importJson] 已取消文件选择");
     return;
   }
   if (!(await verifyUiafData(<string>selectedFile))) {
     showSnackbar({
       color: "error",
       text: "读取 UIAF 数据失败，请检查文件是否符合规范",
     });
+    await TGLogger.Error("[Achievements][importJson] 读取 UIAF 数据失败，请检查文件是否符合规范");
     return;
   }
   const remoteRaw = await readUiafData(<string>selectedFile);
+  await TGLogger.Info("[Achievements][importJson] 读取 UIAF 数据成功");
+  await TGLogger.Info(`[Achievements][importJson] 导入来源：${remoteRaw.info.export_app}`);
+  await TGLogger.Info(`[Achievements][importJson] 导入版本：${remoteRaw.info.export_app_version}`);
+  await TGLogger.Info(`[Achievements][importJson] 导入时间：${remoteRaw.info.export_timestamp}`);
+  await TGLogger.Info(`[Achievements][importJson] 导入数据：${remoteRaw.list.length} 条`);
   loadingTitle.value = "正在解析数据";
   loading.value = true;
   loadingTitle.value = "正在合并成就数据";
@@ -307,12 +317,14 @@ async function importJson(): Promise<void> {
 
 // 导出
 async function exportJson(): Promise<void> {
+  await TGLogger.Info("[Achievements][exportJson] 导出 UIAF 数据");
   // 判断是否有数据
   if (achievementsStore.finAchievements === 0) {
     showSnackbar({
       color: "error",
       text: "没有可导出的数据",
     });
+    await TGLogger.Warn("[Achievements][exportJson] 没有可导出的数据");
     return;
   }
   // 获取本地数据
@@ -331,15 +343,18 @@ async function exportJson(): Promise<void> {
     ],
     defaultPath: `${await path.downloadDir()}${path.sep}${fileName}.json`,
   });
-  if (isSave) {
-    await fs.writeTextFile(isSave, JSON.stringify(UiafData));
-    showSnackbar({ text: "导出成功" });
-  } else {
+  if (isSave === null) {
     showSnackbar({
       color: "warn",
-      text: "导出已取消",
+      text: "已取消导出",
     });
+    await TGLogger.Info("[Achievements][exportJson] 已取消导出");
+    return;
   }
+  await fs.writeTextFile(isSave, JSON.stringify(UiafData));
+  showSnackbar({ text: "导出成功" });
+  await TGLogger.Info("[Achievements][exportJson] 导出成功");
+  await TGLogger.Info(`[Achievements][exportJson] 导出路径：${isSave}`);
 }
 
 function getIcon(series: number): string | undefined {
@@ -348,6 +363,7 @@ function getIcon(series: number): string | undefined {
 
 // 处理外部导入
 async function handleImportOuter(app: string): Promise<void> {
+  await TGLogger.Info(`[Achievements][handleImportOuter] 导入来源：${app}`);
   const confirm = await showConfirm({
     title: "是否导入祈愿数据？",
     text: `来源APP：${app}`,
@@ -357,6 +373,7 @@ async function handleImportOuter(app: string): Promise<void> {
       color: "warn",
       text: "已取消导入",
     });
+    await TGLogger.Info("[Achievements][handleImportOuter] 已取消导入");
     return;
   }
   // 读取 剪贴板
@@ -373,8 +390,11 @@ async function handleImportOuter(app: string): Promise<void> {
       color: "success",
       text: "导入成功，即将刷新页面",
     });
+    await TGLogger.Info("[Achievements][handleImportOuter] 导入成功");
   } catch (e) {
-    console.error(e);
+    if (e instanceof Error)
+      await TGLogger.Error(`[Achievements][handleImportOuter] 导入失败 ${e.name}: ${e.message}`);
+    else console.error(e);
     showSnackbar({
       color: "error",
       text: "读取 UIAF 数据失败，请检查文件是否符合规范",
@@ -411,6 +431,11 @@ async function setAchi(
       target ? "已完成" : "未完成"
     }`,
   });
+  await TGLogger.Info(
+    `[Achievements][setAchi] 已将成就 ${newAchievement.name}[${newAchievement.id}] 标记为 ${
+      target ? "已完成" : "未完成"
+    }`,
+  );
 }
 
 /* 以下为数据库操作 */

src/pages/common/Announcements.vue

@@ -42,6 +42,7 @@ import { nextTick, onMounted, ref } from "vue";
 import { useRouter } from "vue-router";
 
 import ToLoading from "../../components/overlay/to-loading.vue";
+import TGLogger from "../../utils/TGLogger";
 import { createTGWindow } from "../../utils/TGWindow";
 import TGRequest from "../../web/request/TGRequest";
 import TGUtils from "../../web/utils/TGUtils";
@@ -74,6 +75,7 @@ const annoCards = ref<AnnoCard>({
 const annoData = ref<TGApp.BBS.Announcement.ListData>(<TGApp.BBS.Announcement.ListData>{});
 
 onMounted(async () => {
+  await TGLogger.Info("[Announcements][onMounted] 打开公告页面");
   loadingTitle.value = "正在获取公告数据";
   loading.value = true;
   annoData.value = await TGRequest.Anno.getList();
@@ -84,7 +86,7 @@ onMounted(async () => {
     game: listCards.filter((item) => item.typeLabel === AnnoType.game),
   };
   loadingTitle.value = "正在渲染公告数据";
-  await nextTick(() => {
+  await nextTick(async () => {
     loading.value = false;
   });
 });
@@ -96,13 +98,16 @@ function parseTitle(title: string): string {
 }
 
 async function switchNews(): Promise<void> {
+  await TGLogger.Info("[Announcements][switchNews] 切换米游社咨讯");
   await router.push("/news/2");
 }
 
 function createAnno(item: TGApp.App.Announcement.ListCard): void {
   const annoPath = `/anno_detail/${item.id}`;
   const annoTitle = `Anno_${item.id} ${item.title}`;
-  createTGWindow(annoPath, "Sub_window", annoTitle, 960, 720, false, false);
+  TGLogger.Info(`[Announcements][createAnno][${item.id}] 打开公告窗口`).then(() =>
+    createTGWindow(annoPath, "Sub_window", annoTitle, 960, 720, false, false),
+  );
 }
 </script>