[Dashboard] 逻辑问题 - 数据加载失败无提示 & 静态数据 #6

New Issue

tangweijie · 2026-01-18T17:07:59+08:00

tangweijie commented

2026-01-18 17:07:59 +08:00

问题描述

Dashboard 前端页面 Index.vue 存在以下逻辑问题：

1. 数据加载失败无用户提示

位置: frontend/src/views/Dashboard/Index.vue:307-309

} catch (error) {
  console.error('加载Dashboard数据失败:', error)
}

数据加载失败时只打印 console，无用户提示，用户体验差。

2. prisonerId 为空时无提示

位置: frontend/src/views/Dashboard/Index.vue:324-327

const prisonerId = route.query.prisonerId as string
if (prisonerId) {
  loadData(Number(prisonerId))
}

当 URL 无 prisonerId 参数时，页面空白且无任何提示。

3. 底部统计卡片使用静态值

位置: frontend/src/views/Dashboard/Index.vue:53-68

<div class="list-card-item-value">108</div>
<!-- 四个卡片都是硬编码 108 -->

底部四个统计卡片（位置、人员、警力、车辆）使用静态硬编码值"108"，应从接口获取真实数据。

4. res 为空时无处理

位置: frontend/src/views/Dashboard/Index.vue:217

const res = await DashboardApi.getPrisonerStats(prisonerId)
if (!res) return

返回空数据时应清空页面数据或显示占位，而非静默返回。

修复建议

// 1. 添加用户提示
} catch (error) {
  console.error('加载Dashboard数据失败:', error)
  ElMessage.error('加载数据失败，请刷新页面重试')
}

// 2. 添加 prisonerId 空值提示
if (!prisonerId) {
  ElMessage.warning('请选择要查看的罪犯')
  return
}

// 3. 处理空数据
if (!res) {
  resetData()
  ElMessage.warning('未找到该罪犯的信息')
  return
}

// 4. 添加 resetData 函数
const resetData = () => {
  gaugeValue.value = 0
  basicInfo.value = { ...initialBasicInfo }
  centerLeftData.value = initialCenterLeftData
  // ...清空其他数据
}

影响范围

安全性：无
用户体验：高
数据正确性：中

修复优先级

P0 - 立即修复

相关信息

文件: frontend/src/views/Dashboard/Index.vue
审查时间: 2026-01-18
代码行数: 562 行

## 问题描述 Dashboard 前端页面 `Index.vue` 存在以下逻辑问题： ### 1. 数据加载失败无用户提示 **位置**: `frontend/src/views/Dashboard/Index.vue:307-309` ```javascript } catch (error) { console.error('加载Dashboard数据失败:', error) } ``` 数据加载失败时只打印 console，无用户提示，用户体验差。 ### 2. prisonerId 为空时无提示 **位置**: `frontend/src/views/Dashboard/Index.vue:324-327` ```javascript const prisonerId = route.query.prisonerId as string if (prisonerId) { loadData(Number(prisonerId)) } ``` 当 URL 无 prisonerId 参数时，页面空白且无任何提示。 ### 3. 底部统计卡片使用静态值 **位置**: `frontend/src/views/Dashboard/Index.vue:53-68` ```html <div class="list-card-item-value">108</div>  ``` 底部四个统计卡片（位置、人员、警力、车辆）使用静态硬编码值"108"，应从接口获取真实数据。 ### 4. res 为空时无处理 **位置**: `frontend/src/views/Dashboard/Index.vue:217` ```javascript const res = await DashboardApi.getPrisonerStats(prisonerId) if (!res) return ``` 返回空数据时应清空页面数据或显示占位，而非静默返回。 --- ## 修复建议 ```javascript // 1. 添加用户提示 } catch (error) { console.error('加载Dashboard数据失败:', error) ElMessage.error('加载数据失败，请刷新页面重试') } // 2. 添加 prisonerId 空值提示 if (!prisonerId) { ElMessage.warning('请选择要查看的罪犯') return } // 3. 处理空数据 if (!res) { resetData() ElMessage.warning('未找到该罪犯的信息') return } // 4. 添加 resetData 函数 const resetData = () => { gaugeValue.value = 0 basicInfo.value = { ...initialBasicInfo } centerLeftData.value = initialCenterLeftData // ...清空其他数据 } ``` --- ## 影响范围 - 安全性：无 - 用户体验：高 - 数据正确性：中 --- ## 修复优先级 **P0 - 立即修复** --- ## 相关信息 - 文件: `frontend/src/views/Dashboard/Index.vue` - 审查时间: 2026-01-18 - 代码行数: 562 行

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: tangweijie/xlcp-frontend#6