feat: 亮灯表新增客户经理指标文字说明

每个客户经理折叠栏新增一行指标摘要:
「已拜访X · 临期X · 未拜访X · 完成率X%」
数字加粗,完成率按阈值着色(>=80%绿 >=50%金 <50%红)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2026-07-12 16:25:35 +08:00
parent efc200b6de
commit 750ce8d8eb
@@ -141,6 +141,12 @@ const statusLabel: Record<string, string> = { green: '近30天已拜访', yellow
<span class="manager-expand">{{ expandedManagers.has(m.manager_id) ? '▼' : '▶' }}</span>
<span class="manager-name" @click.stop="goManagerReport(m.manager_id)">{{ m.manager_name }}</span>
<span class="manager-count">{{ m.total_customers }} 个客户</span>
<span class="manager-metrics">
已拜访<strong>{{ m.visited_this_month }}</strong> ·
临期<strong>{{ m.visited_last_month_only }}</strong> ·
未拜访<strong>{{ m.not_visited_2months }}</strong> ·
完成率<strong :style="{ color: coverageColor(m.coverage_rate) }">{{ (m.coverage_rate * 100).toFixed(0) }}%</strong>
</span>
</div>
<div class="manager-lights">
<span class="light-dot light-dot--green">{{ m.visited_this_month }}</span>
@@ -304,6 +310,8 @@ const statusLabel: Record<string, string> = { green: '近30天已拜访', yellow
.manager-name { font-family: var(--font-heading); font-size: 15px; color: var(--ink); letter-spacing: 0.04em; cursor: pointer; }
.manager-name:hover { color: var(--gold); }
.manager-count { font-family: var(--font-body); font-size: 12px; color: var(--warm-gray); }
.manager-metrics { font-family: var(--font-body); font-size: 12px; color: var(--warm-gray); white-space: nowrap; }
.manager-metrics strong { font-weight: 600; color: var(--ink); margin: 0 1px; }
.manager-lights { display: flex; gap: 6px; }
.light-dot { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; border-radius: 4px; font-family: var(--font-mono); font-size: 12px; font-weight: 600; cursor: help; }
.light-dot--green { background: #EDF2EC; color: var(--sage); }