From d1dd8b572d56f97d4a38f4f69428d61217544c6a Mon Sep 17 00:00:00 2001
From: let5sne <let5sne@gmail.com>
Date: Tue, 14 Jul 2026 03:07:42 +0800
Subject: [PATCH] fix(mobile): align supervisor dashboard with figma

---
 .../src/pages/supervisor/index/index.vue      | 173 +++++++++++++++++-
 1 file changed, 165 insertions(+), 8 deletions(-)

diff --git a/mobile-uni/src/pages/supervisor/index/index.vue b/mobile-uni/src/pages/supervisor/index/index.vue
index 2cee5a17..d6acb256 100644
--- a/mobile-uni/src/pages/supervisor/index/index.vue
+++ b/mobile-uni/src/pages/supervisor/index/index.vue
@@ -2,8 +2,8 @@
   <view class="page supervisor-page">
     <view class="page-head">
       <view>
-        <text class="page-title">主管</text>
-        <text class="page-subtitle">团队训练工作台</text>
+        <text class="page-title">主管工作台</text>
+        <text class="page-subtitle">住宅项目 · 今日训练与带教</text>
       </view>
       <button v-if="loggedIn && !accessDenied" class="ghost-button refresh-button" :disabled="loading" @click="loadPage">
         {{ loading ? '刷新中' : '刷新' }}
@@ -32,7 +32,7 @@
     <template v-else>
       <view class="panel overview-panel">
         <view class="section-head">
-          <text class="panel-title">团队概览</text>
+          <text class="panel-title">今日概览</text>
           <text class="muted">实时数据</text>
         </view>
         <view class="metric-grid">
@@ -40,7 +40,7 @@
             v-for="item in supervisorMetrics"
             :key="item.key"
             class="metric-item"
-            :class="{ primary: item.primary }"
+            :class="{ primary: item.primary, danger: item.key === 'lowScores' || item.key === 'alerts' }"
           >
             <text class="metric-value">{{ item.value }}</text>
             <text class="metric-label">{{ item.title }}</text>
@@ -51,7 +51,7 @@
 
       <view class="panel task-panel">
         <view class="section-head">
-          <text class="panel-title">任务入口</text>
+          <text class="panel-title">快捷入口</text>
           <text class="muted">{{ teamCount }} 人</text>
         </view>
         <view class="task-list">
@@ -81,7 +81,7 @@
 
       <view class="panel alert-panel">
         <view class="section-head">
-          <text class="panel-title">团队预警</text>
+          <text class="panel-title">连续低分预警</text>
           <text class="muted">{{ actionableAlerts.length }} 条</text>
         </view>
         <view v-if="alerts.length" class="alert-list">
@@ -104,8 +104,8 @@
 
       <view v-if="pendingPreview.length" class="panel preview-panel">
         <view class="section-head">
-          <text class="panel-title">待复盘预览</text>
-          <button class="text-button" @click="openPage('/pages/supervisor/reviews/index')">查看全部</button>
+          <text class="panel-title">待复盘对练</text>
+          <button class="text-button" @click="openPage('/pages/supervisor/reviews/index')">全部 {{ pendingReviewCount }} 条 →</button>
         </view>
         <view class="preview-list">
           <button
@@ -444,4 +444,161 @@ onShow(() => {
 .compact-empty {
   padding: 16px 8px 4px;
 }
+
+.supervisor-page {
+  padding: 22px 20px 112px;
+  background: #f7f7f7;
+}
+
+.page-head {
+  align-items: flex-start;
+  margin-bottom: 18px;
+}
+
+.page-head .page-title {
+  color: #17181c;
+  font-size: 30px;
+  letter-spacing: 0.4px;
+}
+
+.page-head .page-subtitle {
+  color: #8a8d93;
+}
+
+.refresh-button {
+  min-height: 42px;
+  border-radius: 12px;
+  background: #ffffff;
+  color: #666a72;
+  box-shadow: none;
+}
+
+.supervisor-page .panel {
+  border: 0;
+  border-radius: 20px;
+  background: #ffffff;
+  box-shadow: none;
+}
+
+.overview-panel {
+  padding: 0;
+  background: transparent !important;
+}
+
+.overview-panel .section-head {
+  padding: 0 2px;
+}
+
+.metric-grid {
+  gap: 8px;
+  overflow: visible;
+  border: 0;
+  background: transparent;
+}
+
+.metric-item {
+  min-height: 86px;
+  padding: 16px;
+  border-radius: 16px;
+  background: #ffffff;
+  box-shadow: 0 4px 14px rgba(24, 28, 36, 0.03);
+}
+
+.metric-item.primary,
+.metric-item.danger {
+  background: #ffffff;
+}
+
+.metric-item.primary .metric-value,
+.metric-item.primary .metric-label,
+.metric-item.danger .metric-value,
+.metric-item.danger .metric-label {
+  color: #e60012;
+}
+
+.metric-value {
+  font-size: 27px;
+}
+
+.metric-label {
+  margin-top: 8px;
+  color: #25282d;
+  font-size: 13px;
+}
+
+.metric-desc {
+  color: #8a8d93;
+}
+
+.task-panel,
+.alert-panel,
+.preview-panel {
+  padding: 18px;
+}
+
+.task-row,
+.alert-row,
+.preview-row {
+  border-color: #f0f1f3;
+  background: #ffffff;
+}
+
+.task-row {
+  min-height: 58px;
+  padding: 10px 0;
+  border-width: 0 0 1px;
+  border-radius: 0;
+}
+
+.task-row:last-child {
+  border-bottom: 0;
+}
+
+.task-title,
+.alert-title,
+.preview-title {
+  color: #25282d;
+}
+
+.task-meta,
+.alert-desc,
+.preview-desc {
+  color: #8a8d93;
+}
+
+.alert-row {
+  padding: 14px 12px;
+  border: 0;
+  border-radius: 14px;
+  background: #fff1f2;
+}
+
+.alert-row + .alert-row {
+  margin-top: 8px;
+}
+
+.alert-row.high .alert-title,
+.alert-row.medium .alert-title,
+.alert-arrow {
+  color: #e60012;
+}
+
+.preview-row {
+  padding: 14px 0;
+  border-width: 0 0 1px;
+  border-radius: 0;
+}
+
+.preview-row:last-child {
+  border-bottom: 0;
+}
+
+.preview-score {
+  color: #e60012;
+  font-size: 20px;
+}
+
+.text-button {
+  color: #e60012;
+}
 </style>