✨ 帖子搜索集成

fix #103

src/components/main/t-postcard.vue

@@ -38,7 +38,7 @@
         </div>
       </div>
     </div>
-    <div class="tpc-forum" :title="`频道: ${card.forum.name}`">
+    <div class="tpc-forum" v-if="card.forum.icon !== ''" :title="`频道: ${card.forum.name}`">
       <img :src="card.forum.icon" :alt="card.forum.name" />
       <span>{{ card.forum.name }}</span>
     </div>
@@ -179,7 +179,11 @@ function getCommonCard(item: TGApp.Plugins.Mys.Post.FullData): TGApp.Plugins.Mys
 
 function getPostCard(item: TGApp.Plugins.Mys.Post.FullData): TGApp.Plugins.Mys.News.RenderCard {
   const commonCard = getCommonCard(item);
-  if (item.news_meta !== null && item.news_meta.start_at_sec !== "0") {
+  if (
+    item.news_meta !== undefined &&
+    item.news_meta !== null &&
+    item.news_meta.start_at_sec !== "0"
+  ) {
     isAct.value = true;
     const startTime = new Date(Number(item.news_meta.start_at_sec) * 1000).toLocaleDateString();
     const endTime = new Date(Number(item.news_meta.end_at_sec) * 1000).toLocaleDateString();

src/components/overlay/to-achiInfo.vue

@@ -4,7 +4,9 @@
       <slot name="left"></slot>
       <div class="toai-box">
         <div class="toai-top">
-          <span class="toai-click" @click="search(props.data.name)">{{ props.data.name }}</span>
+          <span class="toai-click" @click="searchDirect(props.data.name)">{{
+            props.data.name
+          }}</span>
           <span>{{ props.data.description }}</span>
         </div>
         <div v-if="achiLC">
@@ -24,7 +26,7 @@
           </div>
           <div class="toai-mid-item" v-for="item in achiLC.trigger.task" :key="item.questId">
             <v-icon>mdi-alert-decagram</v-icon>
-            <span class="toai-click" @click="search(item.name)">{{ item.name }}</span>
+            <span class="toai-click" @click="searchDirect(item.name)">{{ item.name }}</span>
             <span>（{{ item.type }}）</span>
           </div>
         </div>
@@ -49,6 +51,7 @@
       <slot name="right"></slot>
     </div>
   </TOverlay>
+  <ToPostSearch gid="2" v-model="showSearch" :keyword="search" />
 </template>
 <script lang="ts" setup>
 import { computed, onMounted, ref, watch } from "vue";
@@ -56,6 +59,7 @@ import { computed, onMounted, ref, watch } from "vue";
 import { AppAchievementsData, AppAchievementSeriesData } from "../../data";
 import TGLogger from "../../utils/TGLogger";
 import TOverlay from "../main/t-overlay.vue";
+import ToPostSearch from "../post/to-postSearch.vue";
 
 interface ToAchiInfoProps {
   modelValue: boolean;
@@ -70,6 +74,8 @@ interface ToAchiInfoEmits {
 
 const props = defineProps<ToAchiInfoProps>();
 const emits = defineEmits<ToAchiInfoEmits>();
+const showSearch = ref(false);
+const search = ref("");
 
 const visible = computed({
   get: () => props.modelValue,
@@ -98,11 +104,10 @@ function onCancel() {
 }
 
 // 查找
-async function search(word: string): Promise<void> {
+async function searchDirect(word: string): Promise<void> {
   await TGLogger.Info(`[ToAchiInfo][${props.data?.id}][Search] 查询 ${word}`);
-  const str = encodeURIComponent(word);
-  const url = `https://www.miyoushe.com/ys/search?keyword=${str}`;
-  window.open(url, "_blank");
+  search.value = word;
+  showSearch.value = true;
 }
 </script>
 <style lang="css" scoped>

src/components/post/to-postSearch.vue

@@ -0,0 +1,161 @@
+<template>
+  <TOverlay v-model="visible" hide :to-click="onCancel" blur-val="20px">
+    <div class="tops-box">
+      <div class="tops-top">查找：{{ search }}</div>
+      <div class="tops-act">
+        <span>分区：{{ getGidLabel() }}</span>
+        <v-btn size="small" class="tops-btn" @click="searchPosts()" rounded>
+          加载更多({{ results.length }})
+        </v-btn>
+      </div>
+      <div class="tops-list">
+        <div v-for="item in results" :key="item.post.post_id">
+          <TPostCard :model-value="item" />
+        </div>
+      </div>
+    </div>
+  </TOverlay>
+</template>
+<script lang="ts" setup>
+import { computed, onMounted, ref, watch } from "vue";
+
+import Mys from "../../plugins/Mys";
+import TOverlay from "../main/t-overlay.vue";
+import TPostCard from "../main/t-postcard.vue";
+
+// data
+const search = ref("");
+const game = ref("2");
+const lastId = ref("");
+const isLast = ref(false);
+const results = ref<TGApp.Plugins.Mys.Post.FullData[]>([]);
+
+interface ToPostSearchProps {
+  modelValue: boolean;
+  gid: string;
+  keyword: string;
+}
+
+interface ToPostSearchEmits {
+  (e: "update:modelValue", value: boolean): void;
+
+  (e: "cancel"): void;
+}
+
+const props = defineProps<ToPostSearchProps>();
+const emits = defineEmits<ToPostSearchEmits>();
+
+const gameList: Record<string, string> = {
+  "1": "崩坏3",
+  "2": "原神",
+  "3": "崩坏2",
+  "4": "未定事件簿",
+  "5": "大别野",
+  "6": "崩坏：星穹铁道",
+  "8": "绝区零",
+};
+// overlay
+const visible = computed({
+  get: () => props.modelValue,
+  set: (value) => {
+    emits("update:modelValue", value);
+  },
+});
+
+function onCancel() {
+  visible.value = false;
+}
+
+onMounted(async () => {
+  search.value = props.keyword;
+  game.value = props.gid;
+});
+
+watch(
+  () => props.modelValue,
+  async (value) => {
+    if (value && results.value.length === 0) {
+      await searchPosts();
+    } else {
+      visible.value = value;
+    }
+  },
+);
+
+watch(
+  () => props.keyword,
+  async (value) => {
+    search.value = value;
+    results.value = [];
+    lastId.value = "";
+    isLast.value = false;
+  },
+);
+
+async function searchPosts() {
+  if (!props.gid || !props.keyword) {
+    return;
+  }
+  if (isLast.value) {
+    return;
+  }
+  const res = await Mys.Posts.search(game.value, search.value, lastId.value);
+  if (lastId.value === "") {
+    results.value = res.posts;
+  } else {
+    results.value = results.value.concat(res.posts);
+  }
+  lastId.value = res.last_id;
+  isLast.value = res.is_last;
+}
+
+function getGidLabel(): string {
+  if (gameList[game.value]) {
+    return gameList[game.value];
+  }
+  return "未知";
+}
+</script>
+<style lang="css" scoped>
+.tops-box {
+  padding: 10px;
+  border-radius: 5px;
+  background-color: var(--box-bg-1);
+}
+
+.tops-top {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: flex-start;
+  color: var(--common-text-title);
+  font-family: var(--font-title);
+  font-size: 20px;
+  word-break: break-all;
+}
+
+.tops-act {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 5px;
+  border-bottom: 1px solid var(--common-shadow-2);
+  margin-bottom: 10px;
+}
+
+.tops-list {
+  display: flex;
+  width: 400px;
+  max-height: 400px;
+  flex-direction: column;
+  padding-right: 10px;
+  overflow-y: auto;
+  row-gap: 10px;
+}
+
+.tops-btn {
+  width: fit-content;
+  background: var(--tgc-btn-1);
+  color: var(--btn-text);
+}
+</style>

src/components/post/tp-avatar.vue

@@ -4,7 +4,7 @@
       <div>{{ props.data.nickname }}</div>
       <div :title="getAuthorDesc()">{{ getAuthorDesc() }}</div>
     </div>
-    <div class="tpa-img" @click="toAuthor()" title="点击前往用户主页">
+    <div class="tpa-img">
       <img :src="props.data.avatar_url" alt="avatar" class="tpa-icon" />
       <img
         :src="props.data.pendant"
@@ -34,11 +34,6 @@ function getAuthorDesc(): string {
   return props.data.introduce;
 }
 
-async function toAuthor(): Promise<void> {
-  const url = `https://www.miyoushe.com/ys/#/accountCenter/0?id=${props.data.uid}`;
-  window.open(url, "_blank");
-}
-
 const flexAlign = props.position === "left" ? "flex-start" : "flex-end";
 const textAlign = props.position;
 </script>
@@ -83,7 +78,6 @@ const textAlign = props.position;
   position: relative;
   width: 50px;
   height: 50px;
-  cursor: pointer;
 }
 
 .tpa-icon {