首页列表展示

RuoYi-App/pages/novel/list.vue

@@ -154,26 +154,10 @@ export default {
   methods: {
     async initData() {
       try {
-        // 确保所有方法都已绑定
-        if (
-          typeof this.loadCategories !== 'function' ||
-          typeof this.loadHotNovels !== 'function' ||
-          typeof this.loadNovels !== 'function' ||
-          typeof this.loadAds !== 'function'
-        ) {
-          console.error('一个或多个方法未绑定!');
-          this.error = '系统初始化失败，请刷新页面';
-          this.loading = false;
-          return;
-        }
-        
-        // 并行加载数据以提高性能
-        await Promise.all([
-          this.loadCategories(),
-          this.loadHotNovels(),
-          this.loadNovels(),
-          this.loadAds()
-        ]);
+        // 改为顺序加载，便于调试
+        await this.loadCategories();
+        await this.loadHotNovels();
+        await this.loadNovels();
       } catch (e) {
         console.error('初始化失败', e);
         this.error = '初始化失败，请检查网络连接';
@@ -182,22 +166,70 @@ export default {
       }
     },
 
-    // 修复API请求逻辑
+    // 修复响应解析方法
+    parseResponse(res) {
+      console.log('原始响应对象:', res);
+      
+      // 处理不同的响应格式
+      let responseData = {};
+      
+      // 如果res有arg属性，使用arg作为响应数据
+      if (res && res.arg) {
+        responseData = res.arg;
+        console.log('使用res.arg作为响应数据:', responseData);
+      }
+      // 如果res有data属性，使用data作为响应数据
+      else if (res && res.data) {
+        responseData = res.data;
+        console.log('使用res.data作为响应数据:', responseData);
+      }
+      // 如果res本身就是响应数据
+      else {
+        responseData = res;
+        console.log('使用res本身作为响应数据:', responseData);
+      }
+      
+      return responseData;
+    },
+
+    // 修复分类加载逻辑
     async loadCategories() {
       try {
         const res = await this.$http.get('/category/tree', {
-          header: { isToken: false }
+          header: { isToken: false },
+          timeout: 10000
         });
         
-        console.log('分类API响应:', res);
+        console.log('分类API完整响应:', res);
+        
+        // 使用统一的响应解析方法
+        const responseData = this.parseResponse(res);
+        console.log('处理后的分类响应数据:', responseData);
         
-        // 确保正确解析API响应
-        if (res && res.data && res.data.code === 200 && Array.isArray(res.data.data)) {
-          // 提取所有子分类（第二级分类）
+        // 修复: 检查不同的响应格式
+        let categoriesData = [];
+        
+        if (responseData.code === 200 && Array.isArray(responseData.data)) {
+          categoriesData = responseData.data;
+        } else if (Array.isArray(responseData)) {
+          categoriesData = responseData;
+        } else if (responseData.code === 200 && Array.isArray(responseData.rows)) {
+          categoriesData = responseData.rows;
+        }
+        
+        if (categoriesData.length > 0) {
           let subCategories = [];
-          res.data.data.forEach(parent => {
-            if (parent.children && Array.isArray(parent.children)) {
-              subCategories = subCategories.concat(parent.children);
+          categoriesData.forEach(parent => {
+            if (parent && parent.children && Array.isArray(parent.children)) {
+              // 确保每个子分类都有必要的字段
+              const validChildren = parent.children.filter(child => 
+                child && child.id && (child.title || child.name)
+              ).map(child => ({
+                id: child.id,
+                name: child.title || child.name // 使用title或name作为分类名称
+              }));
+              
+              subCategories = [...subCategories, ...validChildren];
             }
           });
           
@@ -206,33 +238,45 @@ export default {
             { id: 0, name: '全部' }, 
             ...subCategories
           ];
+          
+          console.log('处理后的分类:', this.categories);
         } else {
-          console.warn('分类数据结构异常，使用默认分类');
+          console.warn('分类数据结构异常，使用默认分类', responseData);
           this.categories = [{ id: 0, name: '全部' }];
-        }
+        }   
       } catch (e) {
         console.error('加载分类失败', e);
         this.categories = [{ id: 0, name: '全部' }];
       }
     },
 
+    // 修复热门小说加载逻辑
     async loadHotNovels() {
       try {
         const res = await this.$http.get('/novel/hot', {
-          header: { isToken: false }
+          header: { isToken: false },
+          timeout: 10000
         });
         
-        console.log('热门小说API响应:', res);
+        console.log('热门小说API完整响应:', res);
+        
+        // 使用统一的响应解析方法
+        const responseData = this.parseResponse(res);
+        console.log('处理后的热门小说响应:', responseData);
         
-        // 处理不同API响应格式
-        if (res && res.data) {
-          if (res.data.code === 200 && Array.isArray(res.data.rows)) {
-            this.hotNovels = res.data.rows;
-          } else if (Array.isArray(res.data)) {
-            this.hotNovels = res.data;
+        // 处理API返回的数据格式
+        if (responseData.code === 200) {
+          if (Array.isArray(responseData.rows)) {
+            this.hotNovels = responseData.rows;
+          } else if (Array.isArray(responseData.data)) {
+            this.hotNovels = responseData.data;
           } else {
-            console.error('热门小说数据结构异常');
+            console.warn('热门小说数据格式异常', responseData);
+            this.hotNovels = this.mockHotNovels;
           }
+        } else {
+          console.warn('热门小说API返回异常状态码', responseData);
+          this.hotNovels = this.mockHotNovels;
         }
         
         // 只在真实数据不可用时使用模拟数据
@@ -246,6 +290,7 @@ export default {
       }
     },
 
+    // 修复小说列表加载逻辑
     async loadNovels(reset = false) {
       if (reset) {
         this.page = 1;
@@ -265,47 +310,73 @@ export default {
             pageSize: this.pageSize,
             categoryId: this.activeCategory
           },
-          header: { isToken: false }
+          header: { isToken: false },
+          timeout: 15000
         });
         
-        console.log('小说列表API响应:', res);
+        console.log('小说列表API完整响应:', res);
+        
+        // 使用统一的响应解析方法
+        const responseData = this.parseResponse(res);
+        console.log('处理后的小说列表响应:', responseData);
         
         let newNovels = [];
         let total = 0;
         
-        // 处理不同API响应格式
-        if (res && res.data) {
-          if (res.data.code === 200 && Array.isArray(res.data.rows)) {
-            newNovels = res.data.rows;
-            total = res.data.total;
-          } 
-          else if (Array.isArray(res.data)) {
-            newNovels = res.data;
-            total = res.data.length;
+        // 处理API返回的数据格式
+        if (responseData.code === 200) {
+          if (Array.isArray(responseData.rows)) {
+            newNovels = responseData.rows;
+            total = responseData.total || 0;
+          } else if (Array.isArray(responseData.data)) {
+            newNovels = responseData.data;
+            total = responseData.total || newNovels.length;
           }
+        } else if (responseData.code === 500) {
+          // 处理服务器错误
+          console.error('服务器内部错误:', responseData.msg);
+          throw new Error('服务器内部错误，请稍后重试');
         }
         
         if (newNovels.length > 0) {
           this.novels = [...this.novels, ...newNovels];
           this.hasMore = this.novels.length < total;
           this.page++;
+          
+          // 修复: 确保图片URL正确
+          this.novels.forEach(novel => {
+            if (novel.coverImg) {
+              novel.coverImg = this.getCoverUrl(novel.coverImg);
+            }
+          });
         } else if (this.page === 1) {
-          console.warn('小说列表为空');
-          this.novels = [];
+          console.warn('小说列表为空，使用模拟数据');
+          this.novels = this.mockNovels; // 使用模拟数据
         }
       } catch (e) {
         console.error('加载小说失败', e);
-        this.error = '加载失败，请重试';
-        if (this.novels.length === 0) {
-          this.novels = this.mockNovels;
+        if (e.errMsg && e.errMsg.includes('timeout')) {
+          this.error = '网络请求超时，请检查网络连接';
+        } else if (e.message && e.message.includes('服务器内部错误')) {
+          this.error = '服务器暂时不可用，请稍后重试';
+        } else {
+          this.error = '加载失败，请重试';
         }
+        this.novels = this.mockNovels; // 回退到模拟数据
       } finally {
         this.loading = false;
       }
     },
 
+    // 暂时禁用广告加载，避免404错误
     async loadAds() {
       try {
+        console.log('广告功能暂未开放');
+        this.topAds = [];
+        this.bottomAds = [];
+        
+        // 以下是原有的广告加载代码，暂时注释掉
+        /*
         // 使用Promise.all并行请求
         const [topRes, bottomRes] = await Promise.all([
           this.$http.get('/ad/position?code=TOP_BANNER', {
@@ -319,21 +390,27 @@ export default {
         // 处理广告响应
         this.topAds = this.parseAdResponse(topRes);
         this.bottomAds = this.parseAdResponse(bottomRes);
+        */
       } catch (e) {
         console.error('加载广告失败', e);
+        this.topAds = [];
+        this.bottomAds = [];
       }
     },
     
-    // 新增：广告响应解析方法
+    // 广告响应解析方法 - 简化逻辑
     parseAdResponse(response) {
       if (!response || !response.data) return [];
       
-      if (response.data.code === 200 && Array.isArray(response.data.data)) {
-        return response.data.data;
-      } else if (Array.isArray(response.data)) {
-        return response.data;
-      } else if (Array.isArray(response.data.rows)) {
-        return response.data.rows;
+      const responseData = response.data;
+      
+      // 统一处理可能的响应格式
+      if (responseData.code === 200 && Array.isArray(responseData.data)) {
+        return responseData.data;
+      } else if (Array.isArray(responseData)) {
+        return responseData;
+      } else if (responseData.code === 200 && Array.isArray(responseData.rows)) {
+        return responseData.rows;
       }
       
       return [];
@@ -342,13 +419,22 @@ export default {
     // 修复封面URL处理
     getCoverUrl(cover) {
       if (!cover) return '/static/default-cover.jpg';
+      
+      // 如果已经是完整URL，直接返回
       if (cover.startsWith('http')) return cover;
-      if (cover.startsWith('/')) return cover;
-      return `${process.env.VUE_APP_BASE_URL || ''}${cover}`;
+      
+      // 如果是相对路径，添加基础URL
+      if (cover.startsWith('/')) {
+        return `${process.env.VUE_APP_BASE_URL || ''}${cover}`;
+      }
+      
+      // 其他情况，直接返回
+      return cover;
     },
     
     // 添加图片错误处理
     handleImageError(event) {
+      console.log('图片加载失败:', event);
       event.target.src = '/static/default-cover.jpg';
     },