style(admin): B-28 MembershipCenter/LangGraphAdmin/indicators 等 6 页令牌化

- 状态/开关标签迁移 StatusTag（等级、AI审核、优先客服、老师咨询、升级路径、升级方式、当前等级）
- 裸 hex 换 --adm-* 令牌（#909399/#999→text-45、#606266→text-65、#c0c4cc→text-25、#1e1e1e/#d4d4d4 终端色保留）
- 删 scoped .sort-header 死代码（走全局 sort.css）
- features/levelCode 非状态 chip 保留 el-tag

cfc-web/src/views/admin/FamilyEarningsWithdraw.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="family-earnings-withdraw admin-page">
-    <div class="header admin-page-header">
-      <h2 class="admin-page-title">家庭收益提现审核</h2>
+    <PageHeader title="家庭收益提现审核">
       <div class="flex items-center gap-sm">
         <el-select v-model="typeFilter" placeholder="类型" @change="loadList" style="width:120px">
           <el-option label="全部" value="" />
@@ -12,7 +11,7 @@
         </el-select>
         <el-button type="primary" @click="loadList">刷新</el-button>
       </div>
-    </div>
+    </PageHeader>
 
     <div class="adm-table-wrap">
       <el-table :data="list" v-loading="loading" border stripe height="100%">
@@ -20,12 +19,12 @@
         <el-table-column prop="familyId" label="家庭ID" width="90" />
         <el-table-column label="类型" width="100">
           <template slot-scope="{ row }">
-            <el-tag :type="typeTag(row.type)" size="mini">{{ typeLabel(row.type) }}</el-tag>
+            <StatusTag size="mini" :type="typeTag(row.type)" :text="typeLabel(row.type)" />
           </template>
         </el-table-column>
         <el-table-column label="金额" width="120">
           <template slot-scope="{ row }">
-            <span :class="row.amount > 0 ? 'amount-out' : 'amount-in'">{{ row.amount > 0 ? '-' : '+' }}{{ fenToYuan(row.amount) }}</span>
+            <span class="adm-num" :class="row.amount > 0 ? 'amount-out' : 'amount-in'">{{ row.amount > 0 ? '-' : '+' }}{{ fenToYuan(row.amount) }}</span>
           </template>
         </el-table-column>
         <el-table-column label="操作人" width="120">
@@ -128,24 +127,10 @@ export default {
 }
 .amount-out {
   font-weight: bold;
-  color: #f56c6c;
+  color: var(--adm-error-text);
 }
 .amount-in {
   font-weight: bold;
-  color: #67c23a;
-}
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
-.sort-tag {
-  margin-left: 8px;
-  cursor: pointer;
-  white-space: nowrap;
+  color: var(--adm-success);
 }
 </style>

cfc-web/src/views/admin/HealthCheckinManage.vue

@@ -37,7 +37,7 @@
         </el-table-column>
         <el-table-column label="心情" width="80">
           <template slot-scope="{ row }">
-            <el-tag :type="moodTagType(row.mood)" size="mini">{{ moodLabel(row.mood) }}</el-tag>
+            <StatusTag size="mini" :type="moodTagType(row.mood)" :text="moodLabel(row.mood)" />
           </template>
         </el-table-column>
         <el-table-column label="行为" min-width="200" show-overflow-tooltip>
@@ -124,18 +124,4 @@ export default {
   display: flex;
   align-items: center;
 }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
-.sort-tag {
-  margin-left: 8px;
-  cursor: pointer;
-  white-space: nowrap;
-}
 </style>

cfc-web/src/views/admin/InventoryManage.vue

@@ -31,14 +31,12 @@
             </el-table-column>
             <el-table-column label="类型" width="80">
               <template slot-scope="{ row }">
-                <el-tag :type="row.type === 'inbound' || row.type === 'refund' ? 'success' : row.type === 'outbound' ? 'danger' : 'warning'" size="mini">
-                  {{ {'inbound':'入库','outbound':'出库','adjustment':'调账','counting':'盘点','refund':'退款入库'}[row.type] || row.type }}
-                </el-tag>
+                <StatusTag size="mini" :type="row.type === 'inbound' || row.type === 'refund' ? 'success' : row.type === 'outbound' ? 'danger' : 'warning'" :text="{'inbound':'入库','outbound':'出库','adjustment':'调账','counting':'盘点','refund':'退款入库'}[row.type] || row.type" />
               </template>
             </el-table-column>
             <el-table-column label="数量" width="80">
               <template slot-scope="{ row }">
-                <span :style="{ color: row.direction === 1 ? '#67c23a' : '#f56c6c' }">{{ row.direction === 1 ? '+' : '-' }}{{ row.quantity }}</span>
+                <span :style="{ color: row.direction === 1 ? 'var(--adm-success)' : 'var(--adm-error-text)' }">{{ row.direction === 1 ? '+' : '-' }}{{ row.quantity }}</span>
               </template>
             </el-table-column>
             <el-table-column prop="beforeStock" label="变动前" width="70">
@@ -92,9 +90,7 @@
             </el-table-column>
             <el-table-column label="状态" width="90">
               <template slot-scope="{ row }">
-                <el-tag :type="row.status === 'completed' ? 'success' : row.status === 'cancelled' ? 'info' : 'warning'" size="mini">
-                  {{ {'pending':'待确认','completed':'已完成','cancelled':'已取消'}[row.status] || row.status }}
-                </el-tag>
+                <StatusTag size="mini" :type="row.status === 'completed' ? 'success' : row.status === 'cancelled' ? 'info' : 'warning'" :text="{'pending':'待确认','completed':'已完成','cancelled':'已取消'}[row.status] || row.status" />
               </template>
             </el-table-column>
             <el-table-column prop="createdAt" label="创建时间" width="160">
@@ -127,7 +123,7 @@
               <template slot-scope="{ row }">{{ row.specs || '-' }}</template>
             </el-table-column>
             <el-table-column prop="currentStock" label="当前库存" width="80">
-              <template slot-scope="{ row }"><span style="color:#f56c6c;font-weight:bold;">{{ row.currentStock }}</span></template>
+              <template slot-scope="{ row }"><span style="color:var(--adm-error-text);font-weight:bold;">{{ row.currentStock }}</span></template>
             </el-table-column>
             <el-table-column prop="minStockAlert" label="预警下限" width="80" />
           
@@ -150,7 +146,7 @@
               <template slot-scope="{ row }">{{ row.productName || 'ID:' + row.productId }}</template>
             </el-table-column>
             <el-table-column label="数量" width="70">
-              <template slot-scope="{ row }"><span style="color:#f56c6c;">-{{ row.quantity }}</span></template>
+              <template slot-scope="{ row }"><span style="color:var(--adm-error-text);">-{{ row.quantity }}</span></template>
             </el-table-column>
             <el-table-column prop="remark" label="出库原因" min-width="200" show-overflow-tooltip>
               <template slot="header">
@@ -187,12 +183,12 @@
             </el-table-column>
             <el-table-column label="差异" width="80">
               <template slot-scope="{ row }">
-                <span :style="{ color: row.difference > 0 ? '#67c23a' : row.difference < 0 ? '#f56c6c' : '#999' }">{{ row.difference > 0 ? '+' : '' }}{{ row.difference }}</span>
+                <span :style="{ color: row.difference > 0 ? 'var(--adm-success)' : row.difference < 0 ? 'var(--adm-error-text)' : 'var(--adm-text-45)' }">{{ row.difference > 0 ? '+' : '' }}{{ row.difference }}</span>
               </template>
             </el-table-column>
             <el-table-column label="状态" width="80">
               <template slot-scope="{ row }">
-                <el-tag :type="row.status === 'confirmed' ? 'success' : 'warning'" size="mini">{{ row.status === 'confirmed' ? '已确认' : '待确认' }}</el-tag>
+                <StatusTag size="mini" :type="row.status === 'confirmed' ? 'success' : 'warning'" :text="row.status === 'confirmed' ? '已确认' : '待确认'" />
               </template>
             </el-table-column>
             <el-table-column prop="remark" label="备注" min-width="150" show-overflow-tooltip>
@@ -459,18 +455,4 @@ export default {
 .inventory-manage { padding: 20px; }
 .filter-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
 .pagination-wrap { margin-top: 12px; text-align: right; }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
-.sort-tag {
-  margin-left: 8px;
-  cursor: pointer;
-  white-space: nowrap;
-}
 </style>

cfc-web/src/views/admin/LangGraphAdmin.vue

@@ -49,9 +49,7 @@
             <el-table-column prop="name" label="组件" width="140" />
             <el-table-column prop="status" label="状态" width="100">
               <template slot-scope="{ row }">
-                <el-tag :type="row.status === 'ok' ? 'success' : row.status === 'error' ? 'danger' : 'info'" size="small">
-                  {{ row.status === 'ok' ? '正常' : row.status === 'error' ? '异常' : '未知' }}
-                </el-tag>
+                <StatusTag size="small" :type="row.status === 'ok' ? 'success' : row.status === 'error' ? 'danger' : 'info'" :text="row.status === 'ok' ? '正常' : row.status === 'error' ? '异常' : '未知'" />
               </template>
             </el-table-column>
             <el-table-column prop="detail" label="详情" show-overflow-tooltip />
@@ -68,9 +66,7 @@
             <el-descriptions-item label="Java 后端">{{ config.JAVA_BASE_URL || '-' }}</el-descriptions-item>
             <el-descriptions-item label="Chroma DB">{{ config.CHROMA_DB_PATH || '-' }}</el-descriptions-item>
             <el-descriptions-item label="LangSmith 追踪">
-              <el-tag :type="config.LANGCHAIN_TRACING_V2 === 'true' ? 'success' : 'info'" size="mini">
-                {{ config.LANGCHAIN_TRACING_V2 === 'true' ? '已启用' : '未启用' }}
-              </el-tag>
+              <StatusTag size="mini" :type="config.LANGCHAIN_TRACING_V2 === 'true' ? 'success' : 'info'" :text="config.LANGCHAIN_TRACING_V2 === 'true' ? '已启用' : '未启用'" />
             </el-descriptions-item>
             <el-descriptions-item label="日志级别">{{ config.LOG_LEVEL || 'info' }}</el-descriptions-item>
           </el-descriptions>
@@ -121,12 +117,12 @@
           <el-table-column prop="path" label="路径" min-width="200" show-overflow-tooltip />
           <el-table-column prop="status" label="状态" width="60">
             <template slot-scope="{ row }">
-              <el-tag :type="row.status < 400 ? 'success' : 'danger'" size="mini">{{ row.status }}</el-tag>
+              <StatusTag size="mini" :type="row.status < 400 ? 'success' : 'danger'" :text="String(row.status)" />
             </template>
           </el-table-column>
           <el-table-column prop="duration_ms" label="耗时" width="70">
             <template slot-scope="{ row }">
-              <span :style="{ color: row.duration_ms > 5000 ? '#f56c6c' : '' }">{{ row.duration_ms }}ms</span>
+              <span :style="{ color: row.duration_ms > 5000 ? 'var(--adm-error-text)' : '' }">{{ row.duration_ms }}ms</span>
             </template>
           </el-table-column>
           <el-table-column prop="client_ip" label="IP" width="90" show-overflow-tooltip />
@@ -142,7 +138,7 @@
           <el-table-column label="时间" width="90"><template slot-scope="{ row }">{{ row.ts }}</template></el-table-column>
           <el-table-column label="方法" width="60"><template slot-scope="{ row }">{{ row.method }}</template></el-table-column>
           <el-table-column label="路径"><template slot-scope="{ row }">{{ row.path }}</template></el-table-column>
-          <el-table-column label="状态" width="70"><template slot-scope="{ row }"><el-tag :type="row.status < 400 ? 'success' : 'danger'" size="mini">{{ row.status }}</el-tag></template></el-table-column>
+          <el-table-column label="状态" width="70"><template slot-scope="{ row }"><StatusTag size="mini" :type="row.status < 400 ? 'success' : 'danger'" :text="String(row.status)" /></template></el-table-column>
           <el-table-column label="耗时" width="80"><template slot-scope="{ row }">{{ row.duration_ms }}ms</template></el-table-column>
           <el-table-column label="IP" width="90"><template slot-scope="{ row }">{{ row.client_ip }}</template></el-table-column>
           <el-table-column label="请求体" min-width="200"><template slot-scope="{ row }"><pre class="detail-pre">{{ row.body || '(空)' }}</pre></template></el-table-column>
@@ -394,24 +390,24 @@ export default {
   align-items: center;
   gap: 10px;
   padding: 10px 16px;
-  background: #fff;
+  background: var(--adm-bg-container);
   border-radius: 8px;
   box-shadow: 0 1px 4px rgba(0,0,0,0.08);
   border-left: 3px solid transparent;
   flex: 1;
   min-width: 0;
 }
-.lg-stat.status-healthy  { border-left-color: #67c23a; }
-.lg-stat.status-unhealthy { border-left-color: #f56c6c; }
-.lg-stat.status-degraded  { border-left-color: #e6a23c; }
+.lg-stat.status-healthy  { border-left-color: var(--adm-success); }
+.lg-stat.status-unhealthy { border-left-color: var(--adm-error); }
+.lg-stat.status-degraded  { border-left-color: var(--adm-warning); }
 .lg-stat-icon { font-size: 22px; flex-shrink: 0; }
-.lg-stat.status-checking .lg-stat-icon { color: #409EFF; }
-.lg-stat.status-healthy .lg-stat-icon { color: #67c23a; }
-.lg-stat.status-unhealthy .lg-stat-icon { color: #f56c6c; }
-.lg-stat.status-degraded .lg-stat-icon { color: #e6a23c; }
-.lg-stat-label { font-size: 11px; color: #909399; }
-.lg-stat-value { font-size: 16px; font-weight: bold; color: #303133; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.lg-stat-sub { font-size: 11px; color: #bbb; }
+.lg-stat.status-checking .lg-stat-icon { color: var(--adm-primary); }
+.lg-stat.status-healthy .lg-stat-icon { color: var(--adm-success); }
+.lg-stat.status-unhealthy .lg-stat-icon { color: var(--adm-error); }
+.lg-stat.status-degraded .lg-stat-icon { color: var(--adm-warning); }
+.lg-stat-label { font-size: 11px; color: var(--adm-text-45); }
+.lg-stat-value { font-size: 16px; font-weight: bold; color: var(--adm-text-88); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.lg-stat-sub { font-size: 11px; color: var(--adm-text-25); }
 .lg-actions { display: flex; gap: 8px; flex-shrink: 0; }
 
 .lg-tabs {
@@ -433,7 +429,7 @@ export default {
 }
 
 .lg-panel {
-  background: #fff;
+  background: var(--adm-bg-container);
   border-radius: 8px;
   box-shadow: 0 1px 4px rgba(0,0,0,0.06);
   margin-bottom: 12px;
@@ -444,9 +440,9 @@ export default {
 .lg-panel-title {
   font-size: 14px;
   font-weight: 600;
-  color: #303133;
+  color: var(--adm-text-88);
   padding: 10px 16px;
-  border-bottom: 1px solid #ebeef5;
+  border-bottom: 1px solid var(--adm-border-split);
   flex-shrink: 0;
 }
 .lg-desc {
@@ -493,7 +489,7 @@ export default {
   margin: 0;
 }
 .response-pre {
-  background: #f5f7fa;
+  background: var(--adm-bg-header);
   padding: 12px;
   border-radius: 4px;
   font-size: 12px;

cfc-web/src/views/admin/MembershipCenter.vue

@@ -23,7 +23,7 @@
             <el-table :data="safeLevels" v-loading="levelsLoading" border stripe size="small" empty-text="暂无等级配置" height="100%">
               <el-table-column prop="levelCode" label="等级编码" width="110">
                 <template slot-scope="{ row }">
-                  <el-tag :type="levelTagType(row.levelCode)" size="small">{{ row.levelCode }}</el-tag>
+                  <StatusTag size="small" :type="levelTagType(row.levelCode)" :text="row.levelCode" />
                 </template>
               </el-table-column>
               <el-table-column prop="levelName" label="等级名称" width="130" />
@@ -54,12 +54,12 @@
               </el-table-column>
               <el-table-column label="AI审核" width="80" align="center">
                 <template slot-scope="{ row }">
-                  <el-tag :type="row.aiReviewEnabled ? 'success' : 'info'" size="small">{{ row.aiReviewEnabled ? '是' : '否' }}</el-tag>
+                  <StatusTag size="small" :type="row.aiReviewEnabled ? 'success' : 'info'" :text="row.aiReviewEnabled ? '是' : '否'" />
                 </template>
               </el-table-column>
               <el-table-column label="优先客服" width="80" align="center">
                 <template slot-scope="{ row }">
-                  <el-tag :type="row.prioritySupport ? 'success' : 'info'" size="small">{{ row.prioritySupport ? '是' : '否' }}</el-tag>
+                  <StatusTag size="small" :type="row.prioritySupport ? 'success' : 'info'" :text="row.prioritySupport ? '是' : '否'" />
                 </template>
               </el-table-column>
               <el-table-column label="操作" width="140" fixed="right">
@@ -87,15 +87,15 @@
               <el-table-column label="升级路径" width="140">
                 <template slot-scope="{ row }">
                   <span class="level-path">
-                    <el-tag size="mini" type="info">{{ row.fromLevel || 'FREE' }}</el-tag>
+                    <StatusTag size="mini" :type="levelTagType(row.fromLevel || 'FREE')" :text="row.fromLevel || 'FREE'" />
                     <i class="el-icon-right"></i>
-                    <el-tag size="mini" type="success">{{ row.toLevel || '—' }}</el-tag>
+                    <StatusTag size="mini" :type="levelTagType(row.toLevel || 'FREE')" :text="row.toLevel || '—'" />
                   </span>
                 </template>
               </el-table-column>
               <el-table-column label="升级方式" width="110">
                 <template slot-scope="{ row }">
-                  <el-tag :type="upgradeTypeTag(row.upgradeType)" size="mini">{{ upgradeTypeLabel(row.upgradeType) }}</el-tag>
+                  <StatusTag size="mini" :type="upgradeTypeTag(row.upgradeType) || 'primary'" :text="upgradeTypeLabel(row.upgradeType)" />
                 </template>
               </el-table-column>
               <el-table-column prop="orderId" label="订单号" width="120" show-overflow-tooltip>
@@ -150,7 +150,7 @@
               <el-table-column prop="phone" label="手机号" width="130" />
               <el-table-column label="当前等级" width="110">
                 <template slot-scope="{ row }">
-                  <el-tag :type="levelTagType(row.memberLevel)" size="mini">{{ row.memberLevel || 'FREE' }}</el-tag>
+                  <StatusTag size="mini" :type="levelTagType(row.memberLevel)" :text="row.memberLevel || 'FREE'" />
                 </template>
               </el-table-column>
               <el-table-column label="推荐人ID" width="100">
@@ -177,7 +177,7 @@
     <el-dialog title="功能权限详情" :visible.sync="featuresVisible" width="520px" @close="featuresVisible = false">
       <div v-if="currentLevel">
         <div style="display:flex;align-items:center;gap:12px;margin-bottom:16px;">
-          <el-tag :type="levelTagType(currentLevel.levelCode)" size="medium">{{ currentLevel.levelCode }}</el-tag>
+          <StatusTag :type="levelTagType(currentLevel.levelCode)" size="medium" :text="currentLevel.levelCode" />
           <span style="font-size:16px;font-weight:600;">{{ currentLevel.levelName }}</span>
         </div>
         <p class="text-muted" style="margin:0 0 16px;">{{ currentLevel.levelDesc || '暂无描述' }}</p>
@@ -187,17 +187,17 @@
            <el-descriptions-item label="家庭成员上限">{{ currentLevel.maxChildren || '—' }}</el-descriptions-item>
           <el-descriptions-item label="每日任务上限">{{ currentLevel.maxTasksPerDay || '—' }}</el-descriptions-item>
           <el-descriptions-item label="AI审核">
-            <el-tag :type="currentLevel.aiReviewEnabled ? 'success' : 'info'" size="mini">{{ currentLevel.aiReviewEnabled ? '启用' : '未启用' }}</el-tag>
+            <StatusTag :type="currentLevel.aiReviewEnabled ? 'success' : 'info'" size="mini" :text="currentLevel.aiReviewEnabled ? '启用' : '未启用'" />
           </el-descriptions-item>
           <el-descriptions-item label="优先客服">
-            <el-tag :type="currentLevel.prioritySupport ? 'success' : 'info'" size="mini">{{ currentLevel.prioritySupport ? '支持' : '不支持' }}</el-tag>
+            <StatusTag :type="currentLevel.prioritySupport ? 'success' : 'info'" size="mini" :text="currentLevel.prioritySupport ? '支持' : '不支持'" />
           </el-descriptions-item>
           <el-descriptions-item label="老师咨询" :span="2">
-            <el-tag :type="currentLevel.teacherConsultation ? 'success' : 'info'" size="mini">{{ currentLevel.teacherConsultation ? '支持' : '不支持' }}</el-tag>
+            <StatusTag :type="currentLevel.teacherConsultation ? 'success' : 'info'" size="mini" :text="currentLevel.teacherConsultation ? '支持' : '不支持'" />
           </el-descriptions-item>
         </el-descriptions>
         <div v-if="parseFeatures(currentLevel.features).length" style="margin-top:16px;">
-          <div style="font-weight:600;margin-bottom:8px;color:#606266;">功能权限列表</div>
+          <div style="font-weight:600;margin-bottom:8px;color:var(--adm-text-65);">功能权限列表</div>
           <div style="display:flex;flex-wrap:wrap;gap:6px;">
             <el-tag v-for="(f, i) in parseFeatures(currentLevel.features)" :key="i" size="small">{{ f }}</el-tag>
           </div>
@@ -237,7 +237,7 @@
       <el-form :model="editForm" label-width="100px" size="small">
         <el-form-item label="等级编码">
           <el-tag>{{ editForm.levelCode }}</el-tag>
-          <span style="color:#999;margin-left:8px;font-size:12px;">编码不可修改</span>
+          <span style="color:var(--adm-text-45);margin-left:8px;font-size:12px;">编码不可修改</span>
         </el-form-item>
         <el-form-item label="等级名称" required>
           <el-input v-model="editForm.levelName" placeholder="如：家庭会员" maxlength="32" show-word-limit style="width:320px;" />
@@ -247,7 +247,7 @@
         </el-form-item>
         <el-form-item label="级别排序">
           <el-input-number v-model="editForm.levelOrder" :min="1" :max="999" :step="1" style="width:160px;" />
-          <span style="color:#999;margin-left:8px;font-size:12px;">数字越小级别越低，低级别可见则更高级别也可见</span>
+          <span style="color:var(--adm-text-45);margin-left:8px;font-size:12px;">数字越小级别越低，低级别可见则更高级别也可见</span>
         </el-form-item>
         <el-form-item label="月费(元)">
           <el-input-number v-model="editForm.priceMonthly" :min="0" :step="100" :precision="0" style="width:160px;" />
@@ -260,7 +260,7 @@
         </el-form-item>
         <el-form-item label="月原价(元)">
           <el-input-number v-model="editForm.originalPriceMonthly" :min="0" :step="100" :precision="0" style="width:160px;" />
-          <span style="color:#999;margin-left:8px;font-size:12px;">留空/0 表示无折扣</span>
+          <span style="color:var(--adm-text-45);margin-left:8px;font-size:12px;">留空/0 表示无折扣</span>
         </el-form-item>
         <el-form-item label="季原价(元)">
           <el-input-number v-model="editForm.originalPriceQuarterly" :min="0" :step="100" :precision="0" style="width:160px;" />
@@ -603,7 +603,7 @@ export default {
   gap: 4px;
 }
 .level-path .el-icon-right {
-  color: #909399;
+  color: var(--adm-text-45);
   font-size: 12px;
 }
 
@@ -614,19 +614,10 @@ export default {
   align-items: center;
   justify-content: center;
   padding: 32px 0;
-  color: #c0c4cc;
+  color: var(--adm-text-25);
 }
 .empty-state i {
   font-size: 40px;
   margin-bottom: 8px;
 }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
 </style>

cfc-web/src/views/admin/indicators/index.vue

@@ -1,9 +1,8 @@
 <template>
   <div class="indicators-page admin-page">
-    <div class="page-header">
-      <h2>指标管理</h2>
+    <PageHeader title="指标管理">
       <el-button type="primary" @click="showDialog(null)">新增指标</el-button>
-    </div>
+    </PageHeader>
 
     <!-- 筛选栏 -->
     <div class="filter-bar">
@@ -63,9 +62,7 @@
       </el-table-column>
       <el-table-column prop="status" label="状态" width="80">
         <template slot-scope="{ row }">
-          <el-tag :type="row.status === 1 ? 'success' : 'info'">
-            {{ row.status === 1 ? '启用' : '禁用' }}
-          </el-tag>
+          <StatusTag :type="row.status === 1 ? 'success' : 'info'" :text="row.status === 1 ? '启用' : '禁用'" />
         </template>
         <template slot="header">
           <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>
@@ -241,21 +238,5 @@ export default {
 
 <style scoped>
 .indicators-page { padding: 20px; }
-.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
-.page-header h2 { margin: 0; font-size: 20px; color: #1a1a2e; }
 .filter-bar { margin-bottom: 16px; display: flex; align-items: center; }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
-.sort-tag {
-  margin-left: 8px;
-  cursor: pointer;
-  white-space: nowrap;
-}
 </style>