style(admin): B-25 文章/配置类页面美化

- ArticleCategory: 状态 el-tag→StatusTag、#999/#ddd/#67C23A/#303133→令牌、删 scoped sort CSS
- ArticleEdit: 删 /deep/ .admin-page-header/.admin-page-title/.admin-page-actions 死 CSS（PageHeader 接管）、#dcdfe6→--adm-border-base、#409eff(拖拽指示线)→--adm-primary、.form-hint #999→--adm-text-45
- ArticleManage: 状态列 withdrawn/兜底 el-tag→StatusTag、删 scoped sort CSS
- AssessmentPlanRules: 页头 h2 区→PageHeader、状态 el-tag→StatusTag
- BaziConfigs/BloodTypeConfigs: 类型/状态 el-tag→StatusTag、成功弹窗 #67C23A/#303133→令牌、删 scoped sort CSS
- CfValueManage: 页头 h2 区→PageHeader、流水类型 el-tag→StatusTag、删 scoped sort CSS

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

@@ -28,8 +28,8 @@
         </el-table-column>
         <el-table-column label="颜色" width="100">
           <template slot-scope="{ row }">
-            <span v-if="row.color" :style="{ display: 'inline-block', width: '20px', height: '20px', backgroundColor: row.color, borderRadius: '4px', verticalAlign: 'middle', border: '1px solid #ddd' }"></span>
-            <span style="margin-left: 6px; color: #999;">{{ row.color || '-' }}</span>
+            <span v-if="row.color" :style="{ display: 'inline-block', width: '20px', height: '20px', backgroundColor: row.color, borderRadius: '4px', verticalAlign: 'middle', border: '1px solid var(--adm-border-base)' }"></span>
+            <span style="margin-left: 6px; color: var(--adm-text-45);">{{ row.color || '-' }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="sortOrder" label="排序" width="70">
@@ -39,9 +39,7 @@
         </el-table-column>
         <el-table-column label="状态" width="80">
           <template slot-scope="{ row }">
-            <el-tag :type="row.status === 1 || row.status === 'ACTIVE' ? 'success' : 'danger'" size="small">
-              {{ row.status === 1 || row.status === 'ACTIVE' ? '启用' : '停用' }}
-            </el-tag>
+            <StatusTag :type="row.status === 1 || row.status === 'ACTIVE' ? 'success' : 'danger'" size="small" :text="row.status === 1 || row.status === 'ACTIVE' ? '启用' : '停用'" />
           </template>
         </el-table-column>
         <el-table-column label="操作" width="180" fixed="right">
@@ -85,8 +83,8 @@
 
     <el-dialog title="操作成功" :visible.sync="successDialogVisible" width="400px" :close-on-click-modal="false">
       <div style="text-align:center;padding:10px 0">
-        <i class="el-icon-success" style="color:#67C23A;font-size:32px"></i>
-        <p style="margin:12px 0 0;font-size:16px;color:#303133">保存成功</p>
+        <i class="el-icon-success" style="color:var(--adm-success);font-size:32px"></i>
+        <p style="margin:12px 0 0;font-size:16px;color:var(--adm-text-88)">保存成功</p>
       </div>
       <div slot="footer">
         <el-button type="primary" @click="handleContinue">继续添加</el-button>
@@ -249,13 +247,4 @@ export default {
 .article-category {
   padding: 20px;
 }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
 </style>

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

@@ -845,36 +845,16 @@ onError: (file, err, res) => {
 .article-edit /deep/ .el-form {
   width: 100%;
 }
-.article-edit /deep/ .admin-page-header {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 12px;
-  flex-wrap: wrap;
-}
-.article-edit /deep/ .admin-page-title {
-  font-size: 18px;
-  font-weight: 600;
-  line-height: 32px;
-}
-.article-edit /deep/ .admin-page-actions {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  gap: 8px;
-  flex-wrap: wrap;
-  margin-left: auto;
-}
 .cover-preview {
   width: 240px;
   max-height: 160px;
   object-fit: cover;
   border-radius: 6px;
-  border: 1px solid #dcdfe6;
+  border: 1px solid var(--adm-border-base);
   cursor: pointer;
 }
 .rich-editor {
-  border: 1px solid #dcdfe6;
+  border: 1px solid var(--adm-border-base);
   border-radius: 4px;
 }
 .rich-editor /deep/ .w-e-toolbar {
@@ -892,7 +872,7 @@ onError: (file, err, res) => {
   position: relative;
   background-image: none !important;
   background-color: #111;
-  border: 1px solid #dcdfe6;
+  border: 1px solid var(--adm-border-base);
   border-radius: 6px;
   margin: 10px 0;
   padding: 0;
@@ -926,7 +906,7 @@ onError: (file, err, res) => {
   left: 10px;
   right: 10px;
   height: 3px;
-  background: #409eff;
+  background: var(--adm-primary);
   border-radius: 2px;
   pointer-events: none;
   z-index: 60;
@@ -971,7 +951,7 @@ onError: (file, err, res) => {
 }
 
 .form-hint {
-  color: #999;
+  color: var(--adm-text-45);
   font-size: 12px;
   margin-left: 10px;
   white-space: nowrap;

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

@@ -126,8 +126,8 @@
             <StatusTag v-else-if="row.status === 'draft'" size="small" type="info" text="草稿箱" />
             <StatusTag v-else-if="row.status === 'rejected'" size="small" type="danger" text="已驳回" />
             <StatusTag v-else-if="row.status === 'published'" size="small" type="success" text="发布中" />
-            <el-tag v-else-if="row.status === 'withdrawn'" size="small">已撤回</el-tag>
-            <el-tag v-else size="small" type="info">{{ row.status }}</el-tag>
+            <StatusTag v-else-if="row.status === 'withdrawn'" size="small" type="warning" text="已撤回" />
+            <StatusTag v-else size="small" type="info" :text="row.status" />
           </template>
         </el-table-column>
         <el-table-column label="审核状态" width="120">
@@ -681,19 +681,4 @@ export default {
 .article-manage {
   padding: 0;
 }
-
-.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/AssessmentPlanRules.vue

@@ -1,9 +1,8 @@
 <template>
   <div class="assessment-plan-rules">
-    <div class="header">
-      <h2>方案生成规则</h2>
+    <PageHeader title="方案生成规则">
       <el-button type="primary" @click="showDialog(null)">新增规则</el-button>
-    </div>
+    </PageHeader>
 
         <div class="adm-table-wrap">
 <el-table :data="rules" border stripe style="width: 100%" height="100%">
@@ -15,7 +14,7 @@
       <el-table-column prop="priority" label="优先级" width="80" />
       <el-table-column label="状态" width="80">
         <template slot-scope="{ row }">
-          <el-tag :type="row.isActive ? 'success' : 'info'">{{ row.isActive ? '启用' : '禁用' }}</el-tag>
+          <StatusTag :type="row.isActive ? 'success' : 'info'" :text="row.isActive ? '启用' : '禁用'" />
         </template>
       </el-table-column>
       <el-table-column prop="createdAt" label="创建时间" />
@@ -114,7 +113,3 @@ export default {
   }
 }
 </script>
-
-<style scoped>
-.header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
-</style>

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

@@ -26,9 +26,7 @@
             <span class="sort-header" @click.stop="onSortClick('type', $event)">类型<span v-if="sortIndex('type') !== null" class="sort-index" :class="sortClass('type') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('type') }}</span>{{ sortIcon('type') }}</span>
           </template>
           <template slot-scope="scope">
-            <el-tag :type="scope.row.type === 'stem' ? 'primary' : 'success'" size="mini">
-              {{ scope.row.type === 'stem' ? '天干' : '地支' }}
-            </el-tag>
+            <StatusTag :type="scope.row.type === 'stem' ? 'primary' : 'success'" size="mini" :text="scope.row.type === 'stem' ? '天干' : '地支'" />
           </template>
         </el-table-column>
         <el-table-column prop="element" label="五行">
@@ -116,8 +114,8 @@
 
     <el-dialog title="操作成功" :visible.sync="successDialogVisible" width="400px" :close-on-click-modal="false">
       <div style="text-align:center;padding:10px 0">
-        <i class="el-icon-success" style="color:#67C23A;font-size:32px"></i>
-        <p style="margin:12px 0 0;font-size:16px;color:#303133">保存成功</p>
+        <i class="el-icon-success" style="color:var(--adm-success);font-size:32px"></i>
+        <p style="margin:12px 0 0;font-size:16px;color:var(--adm-text-88)">保存成功</p>
       </div>
       <div slot="footer">
         <el-button type="primary" @click="handleContinue">继续添加</el-button>
@@ -247,18 +245,4 @@ export default {
 </script>
 
 <style scoped>
-.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/BloodTypeConfigs.vue

@@ -87,8 +87,8 @@
 
     <el-dialog title="操作成功" :visible.sync="successDialogVisible" width="400px" :close-on-click-modal="false">
       <div style="text-align:center;padding:10px 0">
-        <i class="el-icon-success" style="color:#67C23A;font-size:32px"></i>
-        <p style="margin:12px 0 0;font-size:16px;color:#303133">保存成功</p>
+        <i class="el-icon-success" style="color:var(--adm-success);font-size:32px"></i>
+        <p style="margin:12px 0 0;font-size:16px;color:var(--adm-text-88)">保存成功</p>
       </div>
       <div slot="footer">
         <el-button type="primary" @click="handleContinue">继续添加</el-button>
@@ -217,18 +217,4 @@ export default {
 </script>
 
 <style scoped>
-.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/CfValueManage.vue

@@ -1,12 +1,11 @@
 <template>
   <div class="cf-value admin-page">
-    <div class="header">
-      <h2>CF值（平台积分）管理</h2>
+    <PageHeader title="CF值（平台积分）管理">
       <div class="filters">
         <el-input v-model="searchUserId" placeholder="用户ID/用户名搜索" style="width: 200px;" clearable @keyup.enter.native="searchBalance" />
         <el-button type="primary" @click="searchBalance">查询余额</el-button>
       </div>
-    </div>
+    </PageHeader>
 
     <el-tabs v-model="activeTab">
       <el-tab-pane label="余额列表" name="balances">
@@ -77,7 +76,7 @@
           </el-table-column>
           <el-table-column prop="type" label="类型" width="100">
             <template slot-scope="{ row }">
-              <el-tag :type="typeTag(row.type)" size="small">{{ row.type }}</el-tag>
+              <StatusTag :type="typeTag(row.type)" size="small" :text="row.type" />
             </template>
           </el-table-column>
           <el-table-column prop="amount" label="数量" width="80">
@@ -239,13 +238,4 @@ getCfValueBalance({ userId: this.searchUserId }).then(async res => {
 
 <style scoped>
 .cf-value { padding: 20px; }
-.sort-header {
-  cursor: pointer;
-  user-select: none;
-  font-weight: 500;
-  font-size: 12px;
-}
-.sort-header:hover {
-  color: #409eff;
-}
 </style>