fix(dashboard): MyDashboard 显示实际值期间+空值区分暂无数据 (period-label)
This commit is contained in:
@@ -70,7 +70,9 @@
|
||||
<span class="kpi-tag" :class="'tag-' + k.level">{{ k.level === 'green' ? '达标' : k.level === 'yellow' ? '预警' : k.level === 'red' ? '危险' : '未评' }}</span>
|
||||
</div>
|
||||
<div class="kpi-value-row">
|
||||
<div class="kpi-actual">{{ fmtValue(k.actual_value, k.kpi_code) }}</div>
|
||||
<div class="kpi-actual" :class="{ 'kpi-actual-empty': k.actual_value == null }">
|
||||
{{ k.actual_value == null ? '暂无数据' : periodActual(k) }}
|
||||
</div>
|
||||
<div class="kpi-target">{{ targetLabel(k) }} {{ k.target_value ?? '-' }}</div>
|
||||
</div>
|
||||
<el-progress
|
||||
@@ -149,6 +151,22 @@ function fmtValue(val: any, code: string) {
|
||||
return val
|
||||
}
|
||||
|
||||
// 实际值期间格式化: KPIValue.period 为 'YYYY-MM',本年显示 '8月',跨年显示 '2025年12月'
|
||||
function fmtPeriod(p: string | null | undefined): string {
|
||||
if (!p) return '最近'
|
||||
const m = /^(\d{4})-(\d{1,2})/.exec(String(p))
|
||||
if (!m) return String(p)
|
||||
const now = new Date()
|
||||
const y = Number(m[1])
|
||||
const mo = Number(m[2])
|
||||
return (y === now.getFullYear() ? '' : y + '年') + mo + '月'
|
||||
}
|
||||
|
||||
// 实际值带期间口径展示,如 "8月: 12,345",员工能分辨该值属于哪个采集期间
|
||||
function periodActual(k: any): string {
|
||||
return fmtPeriod(k.period) + ': ' + fmtValue(k.actual_value, k.kpi_code)
|
||||
}
|
||||
|
||||
function targetLabel(k: any) {
|
||||
const freq = k.frequency || 'monthly'
|
||||
if (freq === 'quarterly' || freq === 'half_year') return '目标(季)'
|
||||
@@ -291,6 +309,7 @@ onMounted(async () => {
|
||||
.tag-gray { background: #eee; color: #999; }
|
||||
.kpi-value-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
|
||||
.kpi-actual { font-size: 24px; font-weight: 700; }
|
||||
.kpi-actual-empty { font-size: 15px; font-weight: 500; color: #999; }
|
||||
.kpi-target { font-size: 12px; color: #999; }
|
||||
|
||||
/* ── 改善行动 ── */
|
||||
|
||||
Reference in New Issue
Block a user