style(admin): B-22 迁移 teacher/{HealthPlanReview,TeacherMessages,TeacherOrders,TeacherPackages,TeacherTeam}

- 页头统一 PageHeader：HealthPlanReview 健康方案审核（筛选入 extra slot）、TeacherOrders 订单与佣金（导出入 slot）、TeacherPackages 我的任务模板（搜索+创建入 slot）
- 分区头统一 SectionTitle：TeacherTeam 团队成员（搜索+计数入 extra slot）
- 状态标签统一 StatusTag：HealthPlanReview statusType、TeacherOrders getStatusType、TeacherPackages getLevelType（junior ''→primary）
- CSS 令牌化 + 删死 CSS：TeacherMessages member-name(#606266)/no-data+reply-time(#C0C4CC)、TeacherPackages 全套 slate 色(#1E293B/#64748B/#94A3B8/#3B82F6/#F59E0B→令牌)；删各页 page-header/page-title/card-header/card-title 及重复 sort-header scoped

cfc-web/src/views/teacher/HealthPlanReview.vue

@@ -1,19 +1,16 @@
 <template>
   <div class="health-plan-review">
-    <div class="page-header">
-      <h2>健康方案审核</h2>
-      <div class="filters">
-        <el-select v-model="familyFilter" placeholder="选择家庭" clearable @change="loadPlans" style="width:180px">
-          <el-option v-for="f in families" :key="f.id" :label="f.familyName || '家庭'+f.id" :value="f.id" />
-        </el-select>
-        <el-select v-model="statusFilter" placeholder="状态筛选" clearable @change="loadPlans" style="width:140px;margin-left:10px">
-          <el-option label="待审核" value="pending_review" />
-          <el-option label="草稿" value="draft" />
-          <el-option label="已驳回" value="rejected" />
-        </el-select>
-        <el-button type="primary" @click="loadPlans" style="margin-left:10px">查询</el-button>
-      </div>
-    </div>
+    <PageHeader title="健康方案审核">
+      <el-select v-model="familyFilter" placeholder="选择家庭" clearable @change="loadPlans" size="small" style="width:180px">
+        <el-option v-for="f in families" :key="f.id" :label="f.familyName || '家庭'+f.id" :value="f.id" />
+      </el-select>
+      <el-select v-model="statusFilter" placeholder="状态筛选" clearable @change="loadPlans" size="small" style="width:140px">
+        <el-option label="待审核" value="pending_review" />
+        <el-option label="草稿" value="draft" />
+        <el-option label="已驳回" value="rejected" />
+      </el-select>
+      <el-button type="primary" size="small" @click="loadPlans">查询</el-button>
+    </PageHeader>
 
         <div class="adm-table-wrap">
 <el-table :data="plans" border stripe style="width:100%" v-loading="loading" height="100%">
@@ -44,7 +41,7 @@
           <span class="sort-header" @click.stop="onSortClick('status', $event)">状态<span v-if="sortIndex('status') !== null" class="sort-index" :class="sortClass('status') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('status') }}</span>{{ sortIcon('status') }}</span>
         </template>
         <template slot-scope="{ row }">
-          <el-tag :type="statusType(row.status)">{{ statusLabel(row.status) }}</el-tag>
+          <StatusTag :type="statusType(row.status)" :text="statusLabel(row.status)" />
         </template>
       </el-table-column>
       <el-table-column prop="reviewComment" label="审核意见" width="150">
@@ -317,16 +314,4 @@ export default {
 
 <style scoped>
 .health-plan-review { padding: 20px; }
-.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
-.page-header h2 { margin: 0; font-size: 20px; }
-.filters { display: flex; align-items: center; }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
 </style>

cfc-web/src/views/teacher/TeacherMessages.vue

@@ -619,11 +619,11 @@ export default {
 
 .member-name {
   font-size: 13px;
-  color: #606266;
+  color: var(--adm-text-65);
 }
 
 .no-data {
-  color: #C0C4CC;
+  color: var(--adm-text-25);
   font-size: 13px;
   padding: 8px 0;
 }
@@ -656,7 +656,7 @@ export default {
 }
 
 .message-reply .reply-time {
-  color: #C0C4CC;
+  color: var(--adm-text-25);
   font-size: 11px;
   margin-left: 8px;
 }

cfc-web/src/views/teacher/TeacherOrders.vue

@@ -1,17 +1,11 @@
 <template>
   <div class="teacher-orders admin-page">
     <!-- 页面标题区 -->
-    <div class="page-header">
-      <div class="header-left">
-        <h2 class="page-title">订单与佣金</h2>
-        <span class="page-desc">管理您的订单和收入明细</span>
-      </div>
-      <div class="header-actions">
-        <el-button class="export-btn" @click="handleExport">
-          <i class="el-icon-download"></i> 导出
-        </el-button>
-      </div>
-    </div>
+    <PageHeader title="订单与佣金" subtitle="管理您的订单和收入明细">
+      <el-button class="export-btn" @click="handleExport">
+        <i class="el-icon-download"></i> 导出
+      </el-button>
+    </PageHeader>
 
     <!-- 佣金概览卡片 -->
     <el-row :gutter="24" class="stats-row">
@@ -127,9 +121,7 @@
             <span class="sort-header" @click.stop="onSortClick('status', $event)">状态<span v-if="sortIndex('status') !== null" class="sort-index" :class="sortClass('status') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('status') }}</span>{{ sortIcon('status') }}</span>
           </template>
           <template slot-scope="scope">
-            <el-tag :type="getStatusType(scope.row.status)" effect="dark" size="small">
-              {{ scope.row.status }}
-            </el-tag>
+            <StatusTag :type="getStatusType(scope.row.status)" :text="scope.row.status" effect="dark" size="small" />
           </template>
         </el-table-column>
         <el-table-column prop="createdAt" label="创建时间" width="160">
@@ -344,25 +336,6 @@ export default {
 }
 
 /* 页面标题 */
-.page-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-  margin-bottom: 24px;
-}
-
-.page-title {
-  font-size: 24px;
-  font-weight: 700;
-  color: var(--adm-text-88);
-  margin: 0 0 4px 0;
-}
-
-.page-desc {
-  font-size: 14px;
-  color: var(--adm-text-45);
-}
-
 .export-btn {
   border: 1px solid var(--adm-border-split);
   border-radius: 8px;
@@ -515,14 +488,4 @@ export default {
   color: var(--adm-success);
   font-weight: 700;
 }
-
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: var(--adm-primary);
-}
 </style>

cfc-web/src/views/teacher/TeacherPackages.vue

@@ -1,18 +1,12 @@
 <template>
   <div class="teacher-packages admin-page">
     <!-- 页面标题区 -->
-    <div class="page-header">
-      <div class="header-left">
-        <h2 class="page-title">我的任务模板</h2>
-        <span class="page-desc">管理您的服务任务模板</span>
-      </div>
-      <div class="header-actions">
-        <el-input v-model="keyword" placeholder="搜索任务模板..." prefix-icon="el-icon-search" style="width:200px; margin-right:12px" clearable @keyup.enter.native="handleSearch" @clear="handleSearch" />
-        <el-button type="primary" class="primary-btn" @click="handleCreate">
-          <i class="el-icon-plus"></i> 创建任务模板
-        </el-button>
-      </div>
-    </div>
+    <PageHeader title="我的任务模板" subtitle="管理您的服务任务模板">
+      <el-input v-model="keyword" placeholder="搜索任务模板..." prefix-icon="el-icon-search" size="small" style="width:200px" clearable @keyup.enter.native="handleSearch" @clear="handleSearch" />
+      <el-button type="primary" size="small" @click="handleCreate">
+        <i class="el-icon-plus"></i> 创建任务模板
+      </el-button>
+    </PageHeader>
 
     <!-- 统计卡片 -->
     <el-row :gutter="24" class="stats-row">
@@ -55,9 +49,7 @@
             <span class="sort-header" @click.stop="onSortClick('level', $event)">等级<span v-if="sortIndex('level') !== null" class="sort-index" :class="sortClass('level') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('level') }}</span>{{ sortIcon('level') }}</span>
           </template>
           <template slot-scope="scope">
-            <el-tag :type="getLevelType(scope.row.level)" effect="dark" size="small">
-              {{ scope.row.level || '初级' }}
-            </el-tag>
+            <StatusTag :type="getLevelType(scope.row.level)" :text="scope.row.level || '初级'" effect="dark" size="small" />
           </template>
         </el-table-column>
         <el-table-column prop="price" label="价格" width="120">
@@ -125,7 +117,7 @@
             <el-option v-for="t in templates" :key="t.id" :label="t.name" :value="t.id">
               <span style="display: flex; justify-content: space-between">
                 <span>{{ t.name }}</span>
-                <span style="color: #F59E0B">{{ formatPriceWithSymbol(t.referencePrice) }}</span>
+                <span style="color: var(--adm-warning-text)">{{ formatPriceWithSymbol(t.referencePrice) }}</span>
               </span>
             </el-option>
           </el-select>
@@ -349,11 +341,11 @@ export default {
     },
     getLevelType(level) {
       const map = {
-        'junior': '',
+        'junior': 'primary',
         'intermediate': 'success',
         'senior': 'warning'
       }
-      return map[level] || ''
+      return map[level] || 'primary'
     }
   }
 }
@@ -366,37 +358,6 @@ export default {
   min-height: calc(100vh - 120px);
 }
 
-/* 页面标题 */
-.page-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-  margin-bottom: 24px;
-}
-
-.page-title {
-  font-size: 24px;
-  font-weight: 700;
-  color: #1E293B;
-  margin: 0 0 4px 0;
-}
-
-.page-desc {
-  font-size: 14px;
-  color: #64748B;
-}
-
-.primary-btn {
-  background: #1677FF;
-  border: none;
-  padding: 12px 24px;
-  border-radius: 10px;
-}
-
-.primary-btn:hover {
-  background: #0958D9;
-}
-
 /* 统计卡片 */
 .stats-row {
   margin-bottom: 24px;
@@ -418,12 +379,12 @@ export default {
 .package-icon {
   width: 40px;
   height: 40px;
-  background: #1677FF;
+  background: var(--adm-primary);
   border-radius: 10px;
   display: flex;
   align-items: center;
   justify-content: center;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
   margin-right: 12px;
   font-size: 16px;
 }
@@ -431,28 +392,28 @@ export default {
 .package-name {
   font-weight: 600;
   font-size: 15px;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 
 .package-id {
   font-size: 12px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
   margin-top: 2px;
 }
 
 .price {
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-size: 15px;
 }
 
 .min-price {
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 
 .sales-count {
   font-weight: 600;
-  color: #3B82F6;
+  color: var(--adm-primary);
 }
 
 /* 弹窗 */
@@ -466,7 +427,7 @@ export default {
 
 .price-tip {
   font-size: 12px;
-  color: #64748B;
+  color: var(--adm-text-65);
   margin-top: 4px;
   display: flex;
   align-items: center;
@@ -475,7 +436,7 @@ export default {
 
 .form-tip {
   font-size: 12px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
   margin-left: 8px;
 }
 
@@ -484,14 +445,4 @@ export default {
   justify-content: flex-end;
   gap: 12px;
 }
-
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
 </style>

cfc-web/src/views/teacher/TeacherTeam.vue

@@ -40,10 +40,11 @@
 
     <!-- 团队成员列表 -->
     <el-card class="table-card">
-      <div slot="header" class="card-header">
-        <span class="card-title">团队成员</span>
-        <el-input v-model="keyword" placeholder="搜索成员..." prefix-icon="el-icon-search" style="width:200px" clearable @keyup.enter.native="handleSearch" @clear="handleSearch" />
-        <span class="card-count">共 {{ filteredMembers.length }} 人</span>
+      <div slot="header">
+        <SectionTitle title="团队成员">
+          <el-input v-model="keyword" placeholder="搜索成员..." prefix-icon="el-icon-search" size="small" style="width:200px" clearable @keyup.enter.native="handleSearch" @clear="handleSearch" />
+          <span class="card-count">共 {{ filteredMembers.length }} 人</span>
+        </SectionTitle>
       </div>
             <div class="adm-table-wrap">
 <el-table :data="filteredMembers" stripe style="width: 100%;" v-loading="loading" height="100%">
@@ -377,18 +378,6 @@ export default {
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
 }
 
-.card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.card-title {
-  font-size: 16px;
-  font-weight: 600;
-  color: var(--adm-text-88);
-}
-
 .card-count {
   font-size: 13px;
   color: var(--adm-text-45);
@@ -484,14 +473,4 @@ export default {
   color: var(--adm-text-45);
   margin-top: 4px;
 }
-
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: var(--adm-primary);
-}
 </style>