feat：订阅分享搜索功能

src/pages/subscribe.vue

@@ -11,9 +11,22 @@ const route = useRoute()
 const subType = route.meta.subType?.toString()
 const subId = ref(route.query.id as string)
 const activeTab = ref(route.query.tab)
+const shareViewKey = ref(0)
 
-// 弹窗
+// 默认订阅设置弹窗
 const subscribeEditDialog = ref(false)
+
+// 搜索订阅分享弹窗
+const searchShareDialog = ref(false)
+
+// 分享订阅过滤词
+const shareFilter = ref('')
+
+// 触发搜索订阅
+const searchShares = () => {
+  searchShareDialog.value = false
+  shareViewKey.value++
+}
 </script>
 
 <template>
@@ -21,6 +34,7 @@ const subscribeEditDialog = ref(false)
     <VHeaderTab :items="subType == '电影' ? SubscribeMovieTabs : SubscribeTvTabs" v-model="activeTab">
       <template #append>
         <VBtn
+          v-if="activeTab === '我的订阅'"
           icon="mdi-clipboard-edit-outline"
           variant="text"
           color="primary"
@@ -28,6 +42,39 @@ const subscribeEditDialog = ref(false)
           class="settings-icon-button"
           @click="subscribeEditDialog = true"
         />
+        <VMenu
+          v-if="activeTab === '订阅分享'"
+          v-model="searchShareDialog"
+          width="35rem"
+          :close-on-content-click="false"
+        >
+          <template #activator="{ props }">
+            <VBtn
+              icon="mdi-movie-search-outline"
+              variant="text"
+              color="primary"
+              size="default"
+              class="settings-icon-button"
+              v-bind="props"
+            />
+          </template>
+          <VCard>
+            <VCardItem>
+              <VCardTitle>
+                <VIcon icon="mdi-movie-search-outline" class="mr-2" />
+                搜索订阅分享
+              </VCardTitle>
+              <DialogCloseBtn @click="searchShareDialog = false" />
+            </VCardItem>
+            <VCardText>
+              <VTextField v-model="shareFilter" label="搜索关键词" clearable>
+                <template #append>
+                  <VBtn prepend-icon="mdi-magnify" color="primary" @click="searchShares">搜索</VBtn>
+                </template>
+              </VTextField>
+            </VCardText>
+          </VCard>
+        </VMenu>
       </template>
     </VHeaderTab>
 
@@ -49,7 +96,7 @@ const subscribeEditDialog = ref(false)
       <VWindowItem value="订阅分享">
         <transition name="fade-slide" appear>
           <div>
-            <SubscribeShareView />
+            <SubscribeShareView :keyword="shareFilter" :key="shareViewKey" />
           </div>
         </transition>
       </VWindowItem>

src/views/subscribe/SubscribeShareView.vue

@@ -4,6 +4,12 @@ import type { SubscribeShare } from '@/api/types'
 import NoDataFound from '@/components/NoDataFound.vue'
 import SubscribeShareCard from '@/components/cards/SubscribeShareCard.vue'
 
+// 定义输入参数
+const props = defineProps({
+  // 过滤关键字
+  keyword: String,
+})
+
 // 判断是否有滚动条
 function hasScroll() {
   return document.body.scrollHeight - (window.innerHeight || document.documentElement.clientHeight) > 2
@@ -30,6 +36,7 @@ function getParams() {
   let params = {
     page: page.value,
     count: 30,
+    name: props.keyword,
   }
   return params
 }
@@ -118,7 +125,9 @@ function removeData(id: number) {
       v-if="dataList.length === 0 && isRefreshed"
       error-code="404"
       error-title="没有数据"
-      error-description="未获取到共享订阅数据，未开启数据分享或服务器无法连接。"
+      :error-description="
+        keyword ? '没有搜索到相关内容，请更换搜索关键词' : '未获取到分享订阅数据，未开启数据分享或服务器无法连接。'
+      "
     />
   </VInfiniteScroll>
 </template>