fix: 修复下面的bug

1. 默认图片不存在会无限请求问题
2. 详情页返回后不是之前的来源分类/搜索页问题
3. 分类或者搜索由于内容没撑起来高度导致的无法翻页问题

Author: Taois

dashboard/src/App.vue

@@ -6,13 +6,25 @@
 </template>
 
 <script>
+import { onMounted } from 'vue';
 import Layout from './components/Layout.vue';
+import { useVisitedStore } from './stores/visitedStore';
 
 export default {
   name: 'App',
   components: {
     Layout,
   },
+  setup() {
+    const visitedStore = useVisitedStore();
+    
+    // 应用启动时加载访问记录
+    onMounted(() => {
+      visitedStore.loadFromStorage();
+    });
+    
+    return {};
+  }
 };
 </script>
 

dashboard/src/components/SearchResults.vue

@@ -100,9 +100,13 @@
 import { ref, nextTick, onMounted, onBeforeUnmount, watch } from 'vue'
 import { useRouter } from 'vue-router'
 import { usePaginationStore } from '@/stores/paginationStore'
+import { usePageStateStore } from '@/stores/pageStateStore'
+import { useVisitedStore } from '@/stores/visitedStore'
 
 const router = useRouter()
 const paginationStore = usePaginationStore()
+const pageStateStore = usePageStateStore()
+const visitedStore = useVisitedStore()
 
 // Props
 const props = defineProps({
@@ -133,6 +137,16 @@ const props = defineProps({
   hasMore: {
     type: Boolean,
     default: false
+  },
+  // 新增：来源页面信息
+  sourceRoute: {
+    type: Object,
+    default: () => ({})
+  },
+  // 新增：滚动位置
+  scrollPosition: {
+    type: Number,
+    default: 0
   }
 })
 
@@ -179,7 +193,14 @@ const updateScrollAreaHeight = () => {
       const searchHeader = document.querySelector('.search-header');
       const headerHeight = searchHeader ? searchHeader.offsetHeight : 60;
 
-      const newHeight = Math.max(containerHeight - headerHeight, 400);
+      // 根据搜索结果动态调整高度减值
+      // 如果没有结果或结果很少，减去100px强制触发滚动条
+      // 如果有足够搜索结果，只减去少量padding空间
+      const hasEnoughContent = props.videos && props.videos.length >= 17;
+      const heightReduction = hasEnoughContent ? 4 : 100;
+      
+      const newHeight = Math.max(containerHeight - headerHeight - heightReduction, 400);
+      console.log(`搜索结果数量: ${props.videos?.length || 0}, 内容充足: ${hasEnoughContent}, 高度减值: ${heightReduction}, 最终高度: ${newHeight}`);
       scrollAreaHeight.value = newHeight;
     }, 100); // 延迟确保DOM完全渲染
   });
@@ -239,6 +260,31 @@ const checkTextOverflow = () => {
 // 视频点击处理
 const handleVideoClick = (video) => {
   if (video && video.vod_id) {
+    // 记录最后点击的视频
+    visitedStore.setLastClicked(video.vod_id, video.vod_name)
+    
+    // 保存当前搜索状态
+    if (props.keyword) {
+      // 正确获取滚动位置
+      const scrollContainer = scrollbarRef.value?.$el?.querySelector('.arco-scrollbar-container');
+      const currentScrollPosition = scrollContainer?.scrollTop || 0;
+      
+      pageStateStore.saveSearchState(
+        props.keyword,
+        props.currentPage,
+        props.videos,
+        props.hasMore,
+        props.loading,
+        currentScrollPosition
+      );
+      console.log('保存搜索状态:', {
+        keyword: props.keyword,
+        currentPage: props.currentPage,
+        videosCount: props.videos.length,
+        scrollPosition: currentScrollPosition
+      });
+    }
+    
     router.push({
         name: 'VideoDetail',
         params: { id: video.vod_id },
@@ -251,7 +297,12 @@ const handleVideoClick = (video) => {
           remarks: video.vod_remarks,
           content: video.vod_content,
           actor: video.vod_actor,
-          director: video.vod_director
+          director: video.vod_director,
+          // 添加来源页面信息
+          sourceRouteName: props.sourceRoute?.name,
+          sourceRouteParams: JSON.stringify(props.sourceRoute?.params || {}),
+          sourceRouteQuery: JSON.stringify(props.sourceRoute?.query || {}),
+          fromSearch: 'true' // 标识来自搜索结果
         }
       });
   }
@@ -269,6 +320,24 @@ onMounted(() => {
   updateScrollAreaHeight()
   updateGlobalStats()
   window.addEventListener('resize', updateScrollAreaHeight)
+  
+  // 恢复滚动位置
+  if (props.scrollPosition > 0) {
+    nextTick(() => {
+      // 使用requestAnimationFrame确保DOM已渲染
+      requestAnimationFrame(() => {
+        const scrollContainer = scrollbarRef.value?.$el?.querySelector('.arco-scrollbar-container');
+        if (scrollContainer) {
+          // 使用平滑滚动
+          scrollContainer.scrollTo({
+            top: props.scrollPosition,
+            behavior: 'smooth'
+          });
+          console.log('SearchResults恢复滚动位置:', props.scrollPosition);
+        }
+      });
+    });
+  }
 })
 
 onBeforeUnmount(() => {

dashboard/src/components/VideoCard.vue

@@ -1,6 +1,7 @@
 <template>
   <div
     class="video-card"
+    :class="{ 'last-clicked': isLastClicked }"
     @click="handleCardClick"
   >
     <div class="card-poster">
@@ -71,6 +72,7 @@ import {
   IconHeartFill,
   IconDelete
 } from '@arco-design/web-vue/es/icon'
+import { useVisitedStore } from '@/stores/visitedStore'
 
 const props = defineProps({
   item: {
@@ -86,6 +88,9 @@ const props = defineProps({
 
 const emit = defineEmits(['card-click', 'image-click', 'action-click'])
 
+// 访问状态管理
+const visitedStore = useVisitedStore()
+
 // 计算属性
 const showHistoryInfo = computed(() => props.type === 'history')
 
@@ -122,6 +127,12 @@ const cardTitle = computed(() => {
   return props.type === 'video' ? props.item.vod_name : props.item.name
 })
 
+// 检查是否是最后点击的视频
+const isLastClicked = computed(() => {
+  const videoId = props.type === 'video' ? props.item.vod_id : props.item.id
+  return visitedStore.isLastClicked(videoId)
+})
+
 // 事件处理
 const handleCardClick = () => {
   emit('card-click', props.item)
@@ -136,7 +147,8 @@ const handleActionClick = () => {
 }
 
 const handleImageError = (event) => {
-  event.target.src = '/default-poster.svg'
+  // 使用相对路径，适配子目录部署
+  event.target.src = './default-poster.svg'
   event.target.style.objectFit = 'contain'
   event.target.style.backgroundColor = '#f7f8fa'
 }
@@ -167,6 +179,11 @@ const formatDate = (dateString) => {
   border-color: var(--color-primary-light-3);
 }
 
+/* 最后点击的视频样式 */
+.video-card.last-clicked .card-title {
+  color: var(--color-primary-6);
+}
+
 .card-poster {
   position: relative;
   width: 100%;
@@ -292,4 +309,9 @@ const formatDate = (dateString) => {
   box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
   backdrop-filter: blur(4px);
 }
+
+/* 最后点击的视频样式 */
+.video-card.last-clicked .card-title {
+  color: var(--color-primary);
+}
 </style>

dashboard/src/components/VideoGrid.vue

@@ -55,6 +55,7 @@
 <script setup>
 import { onMounted, nextTick, ref, onBeforeUnmount, watch } from 'vue';
 import { useRouter } from 'vue-router';
+import { useVisitedStore } from '@/stores/visitedStore';
 
 const props = defineProps({
   videos: {
@@ -68,33 +69,57 @@ const props = defineProps({
   hasMore: {
     type: Boolean,
     default: false
+  },
+  statsText: {
+    type: String,
+    default: ''
+  },
+  showStats: {
+    type: Boolean,
+    default: false
+  },
+  // 新增：来源页面信息
+  sourceRoute: {
+    type: Object,
+    default: () => ({})
   }
 });
 
 const emit = defineEmits(['load-more', 'scroll-bottom']);
 
 const router = useRouter();
+const visitedStore = useVisitedStore();
 const containerRef = ref(null);
 const scrollbarRef = ref(null);
 const scrollAreaHeight = ref(0);
 
+
 // 视频点击处理
 const handleVideoClick = (video) => {
   if (video && video.vod_id) {
+    // 记录最后点击的视频
+    visitedStore.setLastClicked(video.vod_id, video.vod_name)
+    
+    const routeQuery = {
+      name: video.vod_name,
+      pic: video.vod_pic,
+      year: video.vod_year,
+      area: video.vod_area,
+      type: video.vod_type,
+      remarks: video.vod_remarks,
+      content: video.vod_content,
+      actor: video.vod_actor,
+      director: video.vod_director,
+      // 添加来源页面信息
+      sourceRouteName: props.sourceRoute?.name || '',
+      sourceRouteParams: JSON.stringify(props.sourceRoute?.params || {}),
+      sourceRouteQuery: JSON.stringify(props.sourceRoute?.query || {})
+    }
+    
     router.push({
         name: 'VideoDetail',
         params: { id: video.vod_id },
-        query: {
-          name: video.vod_name,
-          pic: video.vod_pic,
-          year: video.vod_year,
-          area: video.vod_area,
-          type: video.vod_type,
-          remarks: video.vod_remarks,
-          content: video.vod_content,
-          actor: video.vod_actor,
-          director: video.vod_director
-        }
+        query: routeQuery
       });
   }
 };
@@ -116,7 +141,14 @@ const updateScrollAreaHeight = () => {
         containerHeight = Math.max(window.innerHeight - 120, 500);
       }
 
-      const newHeight = Math.max(containerHeight - footerHeight, 400); // 移除硬编码的32px减值，让scrollbar占满容器
+      // 根据视频内容动态调整高度减值
+      // 如果没有视频或视频很少，减去100px强制触发滚动条
+      // 如果有足够视频内容，只减去少量padding空间
+      const hasEnoughContent = props.videos && props.videos.length >= 17;
+      const heightReduction = hasEnoughContent ? 4 : 100;
+      
+      const newHeight = Math.max(containerHeight - footerHeight - heightReduction, 400);
+      console.log(`视频数量: ${props.videos?.length || 0}, 内容充足: ${hasEnoughContent}, 高度减值: ${heightReduction}, 最终高度: ${newHeight}`);
       scrollAreaHeight.value = newHeight;
     }, 100); // 增加延迟确保DOM完全渲染
   });
@@ -175,9 +207,38 @@ watch(() => [props.videos, props.showStats], () => {
   checkTextOverflow();
 });
 
+// 滚动位置恢复方法
+const restoreScrollPosition = (scrollPosition) => {
+  if (scrollPosition && scrollbarRef.value) {
+    // 使用requestAnimationFrame确保DOM已渲染
+    requestAnimationFrame(() => {
+      const scrollContainer = scrollbarRef.value?.$el?.querySelector('.arco-scrollbar-container');
+      if (scrollContainer) {
+        // 使用平滑滚动
+        scrollContainer.scrollTo({
+          top: scrollPosition,
+          behavior: 'smooth'
+        });
+        console.log('VideoGrid恢复滚动位置:', scrollPosition);
+      }
+    });
+  }
+};
+
+// 获取当前滚动位置
+const getCurrentScrollPosition = () => {
+  if (scrollbarRef.value) {
+    const scrollContainer = scrollbarRef.value?.$el?.querySelector('.arco-scrollbar-container');
+    return scrollContainer?.scrollTop || 0;
+  }
+  return 0;
+};
+
 // 暴露方法给父组件
 defineExpose({
-  checkTextOverflow
+  checkTextOverflow,
+  restoreScrollPosition,
+  getCurrentScrollPosition
 });
 </script>
 
@@ -197,7 +258,7 @@ defineExpose({
 .video-scroll-container {
   width: 100%;
   flex: 1; /* 使用flex让scrollbar占满剩余空间 */
-  padding: 16px 20px 8px 16px; /* 上右下左：减少下padding */
+  padding: 2px 20px 2px 16px; /* 大幅减少上下padding，让scrollbar占用更多空间 */
 }
 
 .video_list_hover {