首页问候

web/src/views/DashboardView.vue

@@ -57,9 +57,23 @@ interface DashboardData {
     classroomReservations: number
     generalApprovals: number
   }
+  greeting: DashboardGreeting
   generatedAt: string
 }
 
+interface DashboardGreeting {
+  role: string
+  title: string
+  subtitle: string
+  label: string
+  insights: Array<{
+    label: string
+    value: string
+    hint: string
+    tone: 'calm' | 'positive' | 'attention'
+  }>
+}
+
 interface DashboardLink {
   key: string
   label: string
@@ -390,8 +404,8 @@ onMounted(async () => {
             <i>数据范围</i>
           </div>
           <p class="overview-eyebrow">ACADEMIC OPERATIONS</p>
-          <h1>{{ data.audience.title }}</h1>
-          <p class="overview-description">{{ data.audience.description }}</p>
+          <h1>{{ data.greeting.title }}</h1>
+          <p class="overview-description">{{ data.greeting.subtitle }}</p>
         </div>
 
         <button class="pending-brief" type="button" @click="router.push(primaryActionRoute)">
@@ -436,6 +450,21 @@ onMounted(async () => {
         </div>
       </section>
 
+      <section class="greeting-insights" :aria-label="data.greeting.label">
+        <span class="greeting-insights-label">{{ data.greeting.label }}</span>
+        <div>
+          <article
+            v-for="insight in data.greeting.insights"
+            :key="insight.label"
+            :class="`greeting-insight ${insight.tone}`"
+          >
+            <span>{{ insight.label }}</span>
+            <strong>{{ insight.value }}</strong>
+            <small>{{ insight.hint }}</small>
+          </article>
+        </div>
+      </section>
+
       <section class="overview-metrics" aria-label="关键教学数据">
         <button
           v-for="metric in adminMetrics"
@@ -586,6 +615,43 @@ onMounted(async () => {
   background-size: 32px 32px, 32px 32px, auto;
 }
 
+.greeting-insights {
+  display: grid;
+  grid-template-columns: 120px minmax(0, 1fr);
+  gap: 18px;
+  align-items: stretch;
+  padding: 17px 21px;
+  border: 1px solid #dce6eb;
+  background: #f7faf9;
+}
+
+.greeting-insights-label {
+  align-self: center;
+  color: var(--dashboard-teal);
+  font: 700 10px/1.5 Consolas, monospace;
+  letter-spacing: .12em;
+}
+
+.greeting-insights > div {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 10px;
+}
+
+.greeting-insight {
+  min-width: 0;
+  padding-left: 13px;
+  display: grid;
+  gap: 3px;
+  border-left: 2px solid #a9bcc6;
+}
+
+.greeting-insight.positive { border-color: var(--dashboard-teal); }
+.greeting-insight.attention { border-color: var(--dashboard-amber); }
+.greeting-insight span { color: #687788; font-size: 11px; }
+.greeting-insight strong { color: var(--dashboard-navy); font-size: 20px; }
+.greeting-insight small { overflow: hidden; color: #84909d; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
+
 .overview-hero::after {
   content: "";
   position: absolute;
@@ -1155,6 +1221,7 @@ button:focus-visible {
 }
 
 @media (max-width: 1100px) {
+  .greeting-insights { grid-template-columns: 1fr; gap: 12px; }
   .dashboard-work-grid {
     grid-template-columns: 1fr;
   }
@@ -1170,6 +1237,8 @@ button:focus-visible {
 }
 
 @media (max-width: 760px) {
+  .greeting-insights { padding: 15px; }
+  .greeting-insights > div { grid-template-columns: 1fr; }
   .admin-dashboard { gap: 10px; }
 
   .overview-hero {