feat: KPI详情历史数据对齐元数据 — 目标值/偏差%/红黄绿判定/单位/数据批次

- 后端: get_kpi的values附带target_value/deviation_pct/level/score/unit
  判定对齐工作台语义: 正向≥0.9绿/≥0.7黄/否则红; 反向≤目标绿/≤1.1倍黄/否则红
- 前端: 历史数据表格新增目标值/偏差/判定列, 实际值带单位+红黄着色, 新增数据批次列
- 验证: 渠补率2月84%=黄(超5%), 5月88.3%=红(超10.4%), 收入全部red(远低于1200万目标)
This commit is contained in:
Hermes CI Fix
2026-08-26 09:27:12 +08:00
parent 9d712046f3
commit a253eadeb0
2 changed files with 69 additions and 9 deletions
+33 -4
View File
@@ -147,12 +147,33 @@
<el-tab-pane label="历史数据" name="history">
<v-chart :option="chartOption" autoresize class="full-width-chart" />
<el-table :data="values" size="small" class="data-table">
<el-table-column prop="period" label="期间" width="120" />
<el-table-column prop="actual_value" label="实际值" width="120" />
<el-table-column prop="source_type" label="来源" width="80" />
<el-table-column prop="data_status" label="状态" width="80">
<el-table-column prop="period" label="期间" width="100" />
<el-table-column label="实际值" width="130">
<template #default="{ row }">
<span :style="row.level === 'red' ? 'color:#f56c6c;font-weight:600' : (row.level === 'yellow' ? 'color:#e6a23c;font-weight:600' : '')">
{{ row.actual_value != null ? formatValue(row.actual_value) : '--' }}{{ row.unit || '' }}
</span>
</template>
</el-table-column>
<el-table-column label="目标值" width="120">
<template #default="{ row }">{{ row.target_value != null ? formatValue(row.target_value) + (row.unit || '') : '--' }}</template>
</el-table-column>
<el-table-column label="偏差" width="90">
<template #default="{ row }"><span v-if="row.deviation_pct != null" :style="row.level === 'red' ? 'color:#f56c6c' : (row.level === 'yellow' ? 'color:#e6a23c' : 'color:#67c23a')">{{ row.deviation_pct > 0 ? '+' : '' }}{{ row.deviation_pct }}%</span><span v-else>--</span></template>
</el-table-column>
<el-table-column label="判定" width="80">
<template #default="{ row }">
<el-tag v-if="row.level === 'green'" type="success" size="small">绿</el-tag>
<el-tag v-else-if="row.level === 'yellow'" type="warning" size="small"></el-tag>
<el-tag v-else-if="row.level === 'red'" type="danger" size="small"></el-tag>
<el-tag v-else type="info" size="small"></el-tag>
</template>
</el-table-column>
<el-table-column prop="source_type" label="来源" width="90" />
<el-table-column prop="data_status" label="状态" width="90">
<template #default="{ row }"><el-tag :type="row.data_status==='verified'?'success':'warning'" size="small">{{ row.data_status }}</el-tag></template>
</el-table-column>
<el-table-column prop="source_batch" label="数据批次" min-width="160" show-overflow-tooltip />
</el-table>
</el-tab-pane>
@@ -304,6 +325,14 @@ import { useFormGuard } from '../composables/useFormGuard'
const route = useRoute()
const kpi = ref<any>(null)
const values = ref<any[]>([])
// 数值格式化(历史数据对齐显示用)
function formatValue(v: any) {
if (v === null || v === undefined || isNaN(Number(v))) return '--'
const n = Number(v)
// 整数不带小数,非整数保留2位
return n.toLocaleString('zh-CN', { minimumFractionDigits: 0, maximumFractionDigits: 2 })
}
const mapOptions = ref<any[]>([])
const activeTab = ref('basic')