优化组件结构，调整 VCard 使用，提升界面一致性和可读性

src/components/FileBrowser.vue

@@ -187,7 +187,7 @@ const fileListStyle = computed(() => {
 </script>
 
 <template>
-  <VCard class="mx-auto" :loading="loading > 0">
+  <div class="mx-auto" :loading="loading > 0">
     <div v-if="activeStorage && item">
       <FileToolbar
         :item="item"
@@ -229,5 +229,5 @@ const fileListStyle = computed(() => {
         />
       </div>
     </div>
-  </VCard>
+  </div>
 </template>

src/components/dialog/AddDownloadDialog.vue

@@ -120,7 +120,7 @@ onMounted(() => {
 <template>
   <VDialog max-width="35rem" scrollable>
     <VCard>
-      <VCardTitle class="py-3">
+      <VCardTitle class="py-3 me-12">
         <VIcon icon="mdi-download" class="me-2" />
         <span v-if="title">{{ torrent?.site_name }} - {{ title }}</span>
         <span v-else>确认下载</span>

src/components/filebrowser/FileList.vue

@@ -533,7 +533,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <VCard class="d-flex flex-column w-full h-full">
+  <VCard class="d-flex flex-column w-full h-full rounded-t-0 rounded-s-0">
     <VToolbar v-if="!loading" density="compact" flat color="gray">
       <VTextField
         v-if="!isFile"

src/components/filebrowser/FileNavigator.vue

@@ -259,7 +259,7 @@ function getIndentLevel(path: string, ancestorPath: string) {
 </script>
 
 <template>
-  <div class="file-navigator" v-if="!isMobile">
+  <VCard class="file-navigator rounded-t-0 rounded-e-0" v-if="!isMobile">
     <div class="tree-container">
       <!-- 根目录项 -->
       <div
@@ -382,20 +382,19 @@ function getIndentLevel(path: string, ancestorPath: string) {
         </div>
       </template>
     </div>
-  </div>
+  </VCard>
 </template>
 
 <style lang="scss" scoped>
 .file-navigator {
   width: 240px;
-  border-right: 1px solid rgba(0, 0, 0, 0.08);
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow: hidden;
-  background-color: var(--v-theme-surface);
   flex-shrink: 0;
   border-bottom-left-radius: 12px;
+  background: rgb(var(--v-table-header-background));
 }
 
 .navigator-header {
@@ -403,7 +402,6 @@ function getIndentLevel(path: string, ancestorPath: string) {
   display: flex;
   align-items: center;
   border-bottom: 1px solid rgba(0, 0, 0, 0.08);
-  background-color: var(--v-theme-surface);
 }
 
 .tree-container {

src/components/filebrowser/FileToolbar.vue

@@ -115,7 +115,7 @@ const sortIcon = computed(() => {
 </script>
 
 <template>
-  <VToolbar flat dense>
+  <VToolbar flat dense class="rounded-t-lg border-b">
     <VToolbarItems class="overflow-hidden">
       <VMenu v-if="inProps.storages?.length || 0 > 1" offset-y>
         <template #activator="{ props }">

src/pages/resource.vue

@@ -4,11 +4,6 @@ import api from '@/api'
 import type { Context } from '@/api/types'
 import TorrentCardListView from '@/views/torrent/TorrentCardListView.vue'
 import TorrentRowListView from '@/views/torrent/TorrentRowListView.vue'
-import { useDisplay } from 'vuetify'
-
-// APP
-const display = useDisplay()
-const appMode = inject('pwaMode') && display.mdAndDown.value
 
 // 路由参数
 const route = useRoute()
@@ -204,7 +199,7 @@ onUnmounted(() => {
     </VFadeTransition>
 
     <!-- 精简标题栏 -->
-    <div v-if="isRefreshed" class="search-header d-flex align-center mb-4">
+    <VCard v-if="isRefreshed" class="search-header d-flex align-center mb-4">
       <div class="search-info-container d-flex align-center flex-wrap">
         <div class="search-title text-primary">资源搜索结果</div>
         <div class="search-tags d-flex flex-wrap">
@@ -216,9 +211,7 @@ onUnmounted(() => {
           <VChip v-if="season" class="search-tag" color="primary" size="small" variant="flat"> 季: {{ season }} </VChip>
         </div>
       </div>
-
       <VSpacer />
-
       <!-- 重新设计的视图切换按钮 -->
       <div class="view-toggle-container">
         <div class="view-toggle-buttons">
@@ -230,7 +223,7 @@ onUnmounted(() => {
           </button>
         </div>
       </div>
-    </div>
+    </VCard>
 
     <!-- 视图切换加载状态 -->
     <VFadeTransition>
@@ -261,10 +254,7 @@ onUnmounted(() => {
 
     <!-- 无数据显示 -->
     <div v-else-if="isRefreshed && !isViewChanging" class="d-flex flex-column align-center justify-center py-8">
-      <NoDataFound
+      <NoDataFound :errorTitle="errorTitle" :errorDescription="errorDescription" />
-        :errorTitle="errorTitle"
-        :errorDescription="errorDescription"
-      />
       <VBtn class="mt-4" color="primary" prepend-icon="mdi-magnify" to="/"> 返回首页 </VBtn>
     </div>
 
@@ -356,7 +346,6 @@ onUnmounted(() => {
 .search-header {
   padding: 12px 16px;
   background-color: rgb(var(--v-theme-surface));
-  border-radius: 12px;
   border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
 }

src/plugins/vuetify/defaults.ts

@@ -30,7 +30,7 @@ export default {
     color: 'primary',
   },
   VCard: {
-    elevation: 2,
+    elevation: 1,
   },
   VChip: {
     elevation: 0,

src/views/torrent/TorrentCardListView.vue

@@ -397,12 +397,11 @@ function loadMore({ done }: { done: any }) {
 <template>
   <div class="search-header d-none d-sm-flex">
     <!-- 页面头部和筛选栏 -->
-    <div class="view-header bg-surface rounded-xl">
+    <VCard class="view-header rounded-xl">
       <div class="d-flex align-center flex-wrap pa-3">
         <VChip color="primary" variant="elevated" size="small" class="search-count me-3" prepend-icon="mdi-magnify">
           {{ props.items?.length || 0 }} 个资源
         </VChip>
-
         <!-- 排序选择 -->
         <div class="sort-container me-4">
           <VSelect
@@ -438,7 +437,7 @@ function loadMore({ done }: { done: any }) {
             <VMenu activator="parent" :close-on-content-click="false">
               <VCard max-width="25rem">
                 <VCardText class="filter-menu-content">
-                  <div class="text-end">
+                  <div class="flex justify-between">
                     <VBtn variant="text" size="small" color="primary" @click="selectAll(key)"> 全选 </VBtn>
                     <VBtn
                       v-if="filterForm[key].length > 0"
@@ -504,13 +503,13 @@ function loadMore({ done }: { done: any }) {
           </template>
         </div>
       </div>
-    </div>
+    </VCard>
   </div>
 
   <!-- 移动端头部和筛选区域 -->
-  <div class="d-block d-sm-none search-header-mobile">
+  <VCard class="d-block d-sm-none search-header-mobile rounded-lg">
     <!-- 移动端头部 -->
-    <div class="view-header mb-2">
+    <div class="view-header">
       <div class="d-flex align-center flex-wrap pa-2">
         <div class="d-flex align-center w-100 mb-2">
           <VChip
@@ -563,7 +562,7 @@ function loadMore({ done }: { done: any }) {
         </div>
       </div>
     </div>
-  </div>
+  </VCard>
 
   <!-- 筛选菜单 -->
   <VDialog v-model="filterMenuOpen" max-width="25rem" max-height="80%" location="center">
@@ -632,7 +631,6 @@ function loadMore({ done }: { done: any }) {
 
 .view-header {
   background-color: rgb(var(--v-theme-surface));
-  border-radius: 12px;
   border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
   overflow: hidden;
 }

src/views/torrent/TorrentRowListView.vue

@@ -344,12 +344,11 @@ function toggleFilterMenu(key: string) {
     <!-- 搜索头部容器 - 新增，用于固定在顶部 -->
     <div class="search-header d-none d-sm-block">
       <!-- PC端页面头部和筛选栏 -->
-      <div class="view-header mb-3">
+      <VCard class="view-header mb-3 rounded-lg">
         <div class="d-flex align-center flex-wrap pa-3">
           <VChip color="primary" variant="flat" size="small" class="search-count me-3" prepend-icon="mdi-magnify">
             {{ dataList.length }} 个资源
           </VChip>
-
           <div class="filter-bar">
             <!-- 排序选择 -->
             <VSelect
@@ -364,9 +363,7 @@ function toggleFilterMenu(key: string) {
               prepend-icon="mdi-sort"
             >
             </VSelect>
-
             <div class="filter-divider"></div>
-
             <!-- 筛选按钮 -->
             <VBtn
               v-for="(title, key) in filterTitles"
@@ -430,6 +427,7 @@ function toggleFilterMenu(key: string) {
             </VBtn>
           </div>
         </div>
+
         <!-- 已选择的过滤项显示 -->
         <div v-if="getFilterCount > 0" class="selected-filters">
           <div class="d-flex flex-wrap align-center">
@@ -450,15 +448,15 @@ function toggleFilterMenu(key: string) {
             </template>
           </div>
         </div>
-      </div>
+      </VCard>
     </div>
 
     <!-- 移动端头部和筛选区域 -->
-    <div class="d-block d-sm-none search-header-mobile">
+    <VCard class="d-block d-sm-none search-header-mobile rounded-lg mb-3">
       <!-- 移动端头部 -->
-      <div class="view-header mb-2">
+      <div class="view-header">
         <div class="d-flex align-center flex-wrap pa-2">
-          <div class="d-flex align-center w-100 mb-2">
+          <div class="d-flex align-center w-100">
             <VChip
               color="primary"
               variant="elevated"
@@ -484,7 +482,7 @@ function toggleFilterMenu(key: string) {
           </div>
 
           <!-- 筛选图标按钮区域 -->
-          <div class="filter-buttons-grid w-100">
+          <div class="filter-buttons-grid w-100 mt-2">
             <VBtn
               v-for="(title, key) in filterTitles"
               v-show="filterOptions[key].length > 0"
@@ -509,7 +507,7 @@ function toggleFilterMenu(key: string) {
           </div>
         </div>
       </div>
-    </div>
+    </VCard>
 
     <!-- 筛选菜单 -->
     <VDialog v-model="filterMenuOpen" max-width="25rem" max-height="80%" location="center">
@@ -583,7 +581,6 @@ function toggleFilterMenu(key: string) {
   z-index: 10;
   background-color: rgba(var(--v-theme-background), 0.95);
   backdrop-filter: blur(10px);
-  
 }
 
 .search-header-mobile {
@@ -596,7 +593,6 @@ function toggleFilterMenu(key: string) {
 
 .view-header {
   background-color: rgb(var(--v-theme-surface));
-  border-radius: 12px;
   border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
   box-shadow: none;
   overflow: hidden;