From c8224bf5986ae4b34fa6d720a5bb4833ecf02ff4 Mon Sep 17 00:00:00 2001
From: XuqmGroup <noreply@xuqm.com>
Date: Wed, 17 Jun 2026 10:07:32 +0800
Subject: [PATCH] =?UTF-8?q?fix(bugcollect):=20=E4=BF=AE=E5=A4=8D=20undefin?=
 =?UTF-8?q?ed.length=20=E5=B4=A9=E6=BA=83=20=E2=80=94=20=E6=89=80=E6=9C=89?=
 =?UTF-8?q?=E8=A7=86=E5=9B=BE=E5=8A=A0=20gateStatus=20=E5=AE=88=E5=8D=AB?=
 =?UTF-8?q?=E5=92=8C=20null=20safety?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 所有视图 loadData/loadWebhooks：首行加 gateStatus !== 'enabled' 守卫，避免 appKey 为空或服务未开通时发请求
- 所有视图加 watch(gateStatus) 监听，服务开通后自动刷新数据
- 所有响应体数组赋值改为 ?? []，防止后端返回 null/undefined 时 el-table 访问 .length 崩溃
- BugCollectOverview：maxRate computed 改用 crashRateTrend ?? [] 防止 undefined.map 崩溃

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../views/bug-collect/BugCollectEvents.vue    |  8 +++--
 .../views/bug-collect/BugCollectFunnels.vue   |  5 +--
 .../views/bug-collect/BugCollectIssues.vue    |  8 +++--
 .../views/bug-collect/BugCollectOverview.vue  | 33 ++++++++++++++-----
 .../views/bug-collect/BugCollectRankFreq.vue  | 12 ++++---
 .../views/bug-collect/BugCollectRankRisk.vue  | 12 ++++---
 .../views/bug-collect/BugCollectWebhooks.vue  |  6 ++--
 7 files changed, 58 insertions(+), 26 deletions(-)

diff --git a/tenant-platform/src/views/bug-collect/BugCollectEvents.vue b/tenant-platform/src/views/bug-collect/BugCollectEvents.vue
index 2faf909..670a1d9 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectEvents.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectEvents.vue
@@ -101,7 +101,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { bugCollectApi, type BugCollectEventItem } from '@/api/bugcollect'
 import { useBugCollectApp } from '@/composables/useBugCollectApp'
 
@@ -125,6 +125,7 @@ function formatTime(ts: string) {
 }
 
 async function loadData() {
+  if (!appKey.value || gateStatus.value !== 'enabled') return
   loading.value = true
   try {
     const res = await bugCollectApi.events(appKey.value, {
@@ -136,8 +137,8 @@ async function loadData() {
       size: pageSize.value,
     })
     const data = res.data.data
-    events.value = data.content
-    total.value = data.totalElements
+    events.value = data.content ?? []
+    total.value = data.totalElements ?? 0
   } catch {
   } finally {
     loading.value = false
@@ -155,6 +156,7 @@ function handleSizeChange(size: number) {
   loadData()
 }
 
+watch(gateStatus, (s) => { if (s === 'enabled') loadData() })
 onMounted(loadData)
 </script>
 
diff --git a/tenant-platform/src/views/bug-collect/BugCollectFunnels.vue b/tenant-platform/src/views/bug-collect/BugCollectFunnels.vue
index 381045d..7522f0c 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectFunnels.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectFunnels.vue
@@ -96,12 +96,13 @@ function funnelColor(idx: number) {
 
 async function analyze() {
   const validSteps = steps.value.filter((s) => s.trim())
-  if (validSteps.length < 2) return
+  if (validSteps.length < 2 || !appKey.value) return
   loading.value = true
   try {
     const res = await bugCollectApi.funnel(appKey.value, validSteps)
-    funnelData.value = res.data.data
+    funnelData.value = res.data.data ?? []
   } catch {
+    funnelData.value = []
   } finally {
     loading.value = false
   }
diff --git a/tenant-platform/src/views/bug-collect/BugCollectIssues.vue b/tenant-platform/src/views/bug-collect/BugCollectIssues.vue
index 01f6c6c..b580d25 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectIssues.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectIssues.vue
@@ -100,7 +100,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { bugCollectApi, type BugCollectIssue } from '@/api/bugcollect'
 import { useBugCollectApp } from '@/composables/useBugCollectApp'
 
@@ -134,6 +134,7 @@ function formatTime(ts: string) {
 }
 
 async function loadData() {
+  if (!appKey.value || gateStatus.value !== 'enabled') return
   loading.value = true
   try {
     const res = await bugCollectApi.issues(appKey.value, {
@@ -145,8 +146,8 @@ async function loadData() {
       size: pageSize.value,
     })
     const data = res.data.data
-    issues.value = data.content
-    total.value = data.totalElements
+    issues.value = data.content ?? []
+    total.value = data.totalElements ?? 0
   } catch {
   } finally {
     loading.value = false
@@ -164,6 +165,7 @@ function handleSizeChange(size: number) {
   loadData()
 }
 
+watch(gateStatus, (s) => { if (s === 'enabled') loadData() })
 onMounted(loadData)
 </script>
 
diff --git a/tenant-platform/src/views/bug-collect/BugCollectOverview.vue b/tenant-platform/src/views/bug-collect/BugCollectOverview.vue
index ef300db..3e8a89f 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectOverview.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectOverview.vue
@@ -111,24 +111,27 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, computed } from 'vue'
+import { ref, onMounted, computed, watch } from 'vue'
 import { bugCollectApi, type BugCollectOverview } from '@/api/bugcollect'
 import { Warning, Plus, User } from '@element-plus/icons-vue'
 import { useBugCollectApp } from '@/composables/useBugCollectApp'
 
 const { apps, loadingApps, appKey, setApp, gateStatus, applyDialogVisible, applyReason, applyLoading, submitActivation } = useBugCollectApp()
 
-const overview = ref<BugCollectOverview>({
+const EMPTY: BugCollectOverview = {
   totalIssues: 0,
   todayNewIssues: 0,
   affectedUsers: 0,
   crashRate: 0,
   crashRateTrend: [],
   topIssues: [],
-})
+}
+
+const overview = ref<BugCollectOverview>({ ...EMPTY })
 
 const maxRate = computed(() => {
-  const rates = overview.value.crashRateTrend.map((i) => i.rate)
+  const trend = overview.value.crashRateTrend ?? []
+  const rates = trend.map((i) => i.rate)
   return Math.max(...rates, 1)
 })
 
@@ -146,12 +149,26 @@ function issueTypeTag(type: string) {
   return (map[type] ?? '') as '' | 'success' | 'warning' | 'info' | 'danger'
 }
 
-onMounted(async () => {
+async function loadData() {
+  if (!appKey.value || gateStatus.value !== 'enabled') return
   try {
     const res = await bugCollectApi.overview(appKey.value)
-    overview.value = res.data.data
-  } catch {}
-})
+    const d = res.data.data ?? {}
+    overview.value = {
+      totalIssues: d.totalIssues ?? 0,
+      todayNewIssues: d.todayNewIssues ?? 0,
+      affectedUsers: d.affectedUsers ?? 0,
+      crashRate: d.crashRate ?? 0,
+      crashRateTrend: d.crashRateTrend ?? [],
+      topIssues: d.topIssues ?? [],
+    }
+  } catch {
+    overview.value = { ...EMPTY }
+  }
+}
+
+watch(gateStatus, (s) => { if (s === 'enabled') loadData() })
+onMounted(loadData)
 </script>
 
 <style scoped>
diff --git a/tenant-platform/src/views/bug-collect/BugCollectRankFreq.vue b/tenant-platform/src/views/bug-collect/BugCollectRankFreq.vue
index 0eb13fc..7d13b1c 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectRankFreq.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectRankFreq.vue
@@ -61,7 +61,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { bugCollectApi, type BugCollectIssueRanking } from '@/api/bugcollect'
 import { useBugCollectApp } from '@/composables/useBugCollectApp'
 
@@ -85,16 +85,20 @@ function formatTime(ts: string) {
   return new Date(ts).toLocaleString('zh-CN')
 }
 
-onMounted(async () => {
+async function loadData() {
+  if (!appKey.value || gateStatus.value !== 'enabled') return
   loading.value = true
   try {
     const res = await bugCollectApi.frequencyRanking(appKey.value)
-    rankings.value = res.data.data
+    rankings.value = res.data.data ?? []
   } catch {
+    rankings.value = []
   } finally {
     loading.value = false
   }
-})
+}
+watch(gateStatus, (s) => { if (s === 'enabled') loadData() })
+onMounted(loadData)
 </script>
 
 <style scoped>
diff --git a/tenant-platform/src/views/bug-collect/BugCollectRankRisk.vue b/tenant-platform/src/views/bug-collect/BugCollectRankRisk.vue
index 45665e4..3679cc3 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectRankRisk.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectRankRisk.vue
@@ -66,7 +66,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { bugCollectApi, type BugCollectIssueRanking } from '@/api/bugcollect'
 import { useBugCollectApp } from '@/composables/useBugCollectApp'
 
@@ -97,16 +97,20 @@ function formatTime(ts: string) {
   return new Date(ts).toLocaleString('zh-CN')
 }
 
-onMounted(async () => {
+async function loadData() {
+  if (!appKey.value || gateStatus.value !== 'enabled') return
   loading.value = true
   try {
     const res = await bugCollectApi.riskRanking(appKey.value)
-    rankings.value = res.data.data
+    rankings.value = res.data.data ?? []
   } catch {
+    rankings.value = []
   } finally {
     loading.value = false
   }
-})
+}
+watch(gateStatus, (s) => { if (s === 'enabled') loadData() })
+onMounted(loadData)
 </script>
 
 <style scoped>
diff --git a/tenant-platform/src/views/bug-collect/BugCollectWebhooks.vue b/tenant-platform/src/views/bug-collect/BugCollectWebhooks.vue
index af41496..cecbbb9 100644
--- a/tenant-platform/src/views/bug-collect/BugCollectWebhooks.vue
+++ b/tenant-platform/src/views/bug-collect/BugCollectWebhooks.vue
@@ -100,7 +100,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { ElMessage } from 'element-plus'
 import { bugCollectApi, type BugCollectWebhook } from '@/api/bugcollect'
 import { useBugCollectApp } from '@/composables/useBugCollectApp'
@@ -121,10 +121,11 @@ const form = ref({
 })
 
 async function loadWebhooks() {
+  if (!appKey.value || gateStatus.value !== 'enabled') return
   loading.value = true
   try {
     const res = await bugCollectApi.webhooks.list(appKey.value)
-    webhooks.value = res.data.data
+    webhooks.value = res.data.data ?? []
   } catch {
   } finally {
     loading.value = false
@@ -174,6 +175,7 @@ async function handleDelete(id: string) {
   } catch {}
 }
 
+watch(gateStatus, (s) => { if (s === 'enabled') loadWebhooks() })
 onMounted(loadWebhooks)
 </script>