✨ wiki 页添加子页面入口

src/pages/WIKI/Weapon.vue

@@ -1,40 +1,68 @@
 <template>
+  <!-- todo 排布优化  -->
   <div class="cards-grid">
     <div v-for="item in cardsInfo" :key="item.id" class="card-box" @click="toOuter(item)">
-      <TibWikiWeapon size="128px" :model-value="item" />
+      <TItemBox :model-value="getBox(item)" />
     </div>
-    <v-snackbar v-model="snackbar" timeout="1500" color="error"> 该武器暂无详情 </v-snackbar>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { ref, computed } from "vue";
+import { computed } from "vue";
 
-import TibWikiWeapon from "../../components/itembox/tib-wiki-weapon.vue";
+import showConfirm from "../../components/func/confirm";
+import showSnackbar from "../../components/func/snackbar";
+import TItemBox, { TItemBoxData } from "../../components/main/t-itembox.vue";
 import { AppWeaponData } from "../../data";
 import Mys from "../../plugins/Mys";
-import { useAppStore } from "../../store/modules/app";
 import { createTGWindow, createWiki } from "../../utils/TGWindow";
 
-// snackbar
-const snackbar = ref<boolean>(false);
-// data
 const cardsInfo = computed(() => AppWeaponData);
-const appStore = useAppStore();
 
-function toOuter(item: TGApp.App.Weapon.WikiBriefInfo): void {
-  if (item.contentId === 0) {
-    snackbar.value = true;
+async function toOuter(item: TGApp.App.Weapon.WikiBriefInfo): Promise<void> {
+  const confirm = await showConfirm({
+    title: "是否打开 Wiki 页面？",
+    text: "取消则跳转至观测枢",
+  });
+  if (confirm === undefined) {
+    showSnackbar({
+      text: "已取消",
+      color: "cancel",
+    });
     return;
   }
-  // 如果是调试环境，打开 wiki 页面
-  if (appStore.devMode) {
+  if (confirm) {
     createWiki("Weapon", item.id.toString());
     return;
   }
+  if (item.contentId === 0) {
+    showSnackbar({
+      text: "该武器暂无观测枢页面，将跳转至 Wiki 页面",
+      color: "warn",
+    });
+    setTimeout(() => {
+      createWiki("Weapon", item.id.toString());
+    }, 1000);
+    return;
+  }
   const url = Mys.Api.Obc.replace("{contentId}", item.contentId.toString());
   createTGWindow(url, "Sub_window", `Content_${item.contentId} ${item.name}`, 1200, 800, true);
 }
+
+function getBox(item: TGApp.App.Weapon.WikiBriefInfo): TItemBoxData {
+  return {
+    bg: item.bg,
+    icon: item.icon,
+    clickable: true,
+    size: "128px",
+    height: "128px",
+    display: "inner",
+    lt: item.weaponIcon,
+    ltSize: "40px",
+    innerText: item.name,
+    innerHeight: 30,
+  };
+}
 </script>
 <style scoped>
 .cards-grid {