Refactor SeoKeywordsRankList component to enhance data fetching reliability and ensure default values for rank info are properly initialized. Added hidden debug output for rankInfo and improved error handling in API calls.

src/views/adweb/seo/SeoKeywordsRankList.vue

@@ -61,22 +61,25 @@
             <a-spin tip="加载中..."></a-spin>
           </div>
           <template v-else>
+            <div style="display: none;">
+              rankInfo: {{ JSON.stringify(rankInfo) }}
+            </div>
             <div class="content">
               <div class="d1"><img src="../../../assets/seo/NO1.svg" />1-10位</div>
               <div class="d2">
-                <a @click="getTableInfoRank(3, 1)">{{ rankInfo.appointKeyword && rankInfo.appointKeyword.firstNum || 0 }}</a>个
+                <a @click="getTableInfoRank(3, 1)">{{ (rankInfo.appointKeyword && rankInfo.appointKeyword.firstNum) || 0 }}</a>个
               </div>
             </div>
             <div class="content">
               <div class="d1"><img src="../../../assets/seo/NO2.svg" />11-30位</div>
               <div class="d2">
-                <a @click="getTableInfoRank(7, 1)">{{ rankInfo.appointKeyword && rankInfo.appointKeyword.secondNum || 0 }}</a>个
+                <a @click="getTableInfoRank(7, 1)">{{ (rankInfo.appointKeyword && rankInfo.appointKeyword.secondNum) || 0 }}</a>个
               </div>
             </div>
             <div class="content">
               <div class="d1"><img src="../../../assets/seo/NO3.svg" />31-100位</div>
               <div class="d2">
-                <a @click="getTableInfoRank(8, 1)">{{ rankInfo.appointKeyword && rankInfo.appointKeyword.thirdType || 0 }}</a>个
+                <a @click="getTableInfoRank(8, 1)">{{ (rankInfo.appointKeyword && rankInfo.appointKeyword.thirdType) || 0 }}</a>个
               </div>
             </div>
           </template>
@@ -451,7 +454,14 @@ export default {
   },
   mounted() {
     this.siteCode = localStorage.getItem('siteCode');
-    this.getSiteInfo();
+    
+    // 确保先获取站点信息，再加载其他数据
+    if (this.siteCode) {
+      this.getSiteInfo().then(() => {
+        // 确保站点信息加载完成后再获取其他信息
+        this.getAllInfo();
+      });
+    }
   },
 
   methods: {
@@ -583,11 +593,17 @@ export default {
       let data = {
         siteCode: that.siteCode,
       };
-      getAction('/seo/seoKeywordsRank/getSubscriptionIdBySiteCode', data).then(function (res) {
-        if (res.code == 200) {
-          that.subscriptionId = res.result[0].id ?? '';
-          that.planId = res.result[0].planId ?? '';
-        }
+      
+      return new Promise((resolve) => {
+        getAction('/seo/seoKeywordsRank/getSubscriptionIdBySiteCode', data).then(function (res) {
+          if (res.code == 200) {
+            that.subscriptionId = res.result[0]?.id || '';
+            that.planId = res.result[0]?.planId || '';
+          }
+          resolve();
+        }).catch(() => {
+          resolve(); // 即使出错也继续流程
+        });
       });
     },
 
@@ -678,40 +694,41 @@ export default {
       return new Promise((resolve, reject) => {
         getAction('/seo/seoKeywordsRank/getRankInfo', d)
           .then((res) => {
-            if (res.code == 200) {
-              // 确保即使后端返回null或undefined也能初始化为空对象
-              const appointKeyword = res.result.appointKeyword || {};
-              const longTailKeyword = res.result.longTailKeyword || {};
-              const serverTime = res.result.serverTime || {};
+            if (res.code == 200 && res.result) {
+              console.log('RankInfo API response:', res.result);
               
-              // 使用Vue.set确保响应式更新
-              this.$set(this.rankInfo, 'appointKeyword', appointKeyword);
-              this.$set(this.rankInfo, 'longTailKeyword', longTailKeyword);
-              this.$set(this.rankInfo, 'serverTime', serverTime);
+              // 先创建一个完整的数据对象，确保所有属性都有初始值
+              const newRankInfo = {
+                appointKeyword: {
+                  firstNum: 0,
+                  secondNum: 0,
+                  thirdType: 0,
+                  ...res.result.appointKeyword
+                },
+                longTailKeyword: {
+                  firstNum: 0,
+                  secondNum: 0,
+                  thirdType: 0,
+                  ...res.result.longTailKeyword
+                },
+                serverTime: res.result.serverTime || {}
+              };
               
-              // 确保各个数字属性有默认值
-              if (!appointKeyword.firstNum) this.$set(this.rankInfo.appointKeyword, 'firstNum', 0);
-              if (!appointKeyword.secondNum) this.$set(this.rankInfo.appointKeyword, 'secondNum', 0);
-              if (!appointKeyword.thirdType) this.$set(this.rankInfo.appointKeyword, 'thirdType', 0);
+              // 完全替换整个对象，而不是单独设置属性
+              this.rankInfo = newRankInfo;
               
-              if (!longTailKeyword.firstNum) this.$set(this.rankInfo.longTailKeyword, 'firstNum', 0);
-              if (!longTailKeyword.secondNum) this.$set(this.rankInfo.longTailKeyword, 'secondNum', 0);
-              if (!longTailKeyword.thirdType) this.$set(this.rankInfo.longTailKeyword, 'thirdType', 0);
+              // 打印出处理后的数据，检查数据结构
+              console.log('Processed rankInfo:', this.rankInfo);
               
               resolve(res);
             } else {
-              // 初始化为空对象
-              this.$set(this.rankInfo, 'appointKeyword', {firstNum: 0, secondNum: 0, thirdType: 0});
-              this.$set(this.rankInfo, 'longTailKeyword', {firstNum: 0, secondNum: 0, thirdType: 0});
-              this.$set(this.rankInfo, 'serverTime', {});
+              console.error('RankInfo API error or empty result:', res);
+              // 保持默认值
               reject(res);
             }
           })
           .catch(err => {
-            // 初始化为空对象
-            this.$set(this.rankInfo, 'appointKeyword', {firstNum: 0, secondNum: 0, thirdType: 0});
-            this.$set(this.rankInfo, 'longTailKeyword', {firstNum: 0, secondNum: 0, thirdType: 0});
-            this.$set(this.rankInfo, 'serverTime', {});
+            console.error('RankInfo API exception:', err);
             reject(err);
           })
           .finally(() => {