Przeglądaj źródła

style(admin): C-12 TeacherTeam/TaskTemplates/Rewards/RecommendationRules/PromotionManagement 内联 style 归零

zxyj-web 3 tygodni temu
rodzic
commit
f8f95c43ee

+ 20 - 8
cfc-web/src/views/Rewards.vue

@@ -9,7 +9,7 @@
         <!-- 奖励列表 -->
         <el-tab-pane label="奖励列表" name="list">
           <!-- 搜索筛选 -->
-          <el-form :inline="true" :model="searchForm" style="margin-bottom: 20px">
+          <el-form :inline="true" :model="searchForm" class="mb-20">
             <el-form-item label="家庭">
               <el-input
                 v-model="searchForm.familyName"
@@ -22,7 +22,7 @@
                   icon="el-icon-close"
                   v-if="searchForm.familyId"
                   @click.stop="clearFamily"
-                  style="padding: 8px"
+                  class="padding-8"
                 ></el-button>
                 <i slot="suffix" class="el-input__icon el-icon-arrow-down" @click.stop="showFamilySelector"></i>
               </el-input>
@@ -43,7 +43,7 @@
 
           <!-- 家庭选择对话框 -->
           <el-dialog title="选择家庭" :visible.sync="familyDialogVisible" width="600px">
-            <el-table :max-height="tableHeight" style="cursor: pointer" :data="familyList" border v-loading="familyLoading" @row-click="selectFamily">
+            <el-table :max-height="tableHeight" class="cursor-pointer" :data="familyList" border v-loading="familyLoading" @row-click="selectFamily">
               <el-table-column prop="id" label="ID" width="80"></el-table-column>
               <el-table-column prop="name" label="家庭名称" min-width="150"></el-table-column>
               <el-table-column prop="inviteCode" label="邀请码" width="120"></el-table-column>
@@ -53,7 +53,7 @@
                 </template>
               </el-table-column>
             <el-pagination
-              style="margin-top: 15px; text-align: right"
+              class="pagination-mt15"
               @current-change="loadFamilies"
               :current-page="familyPagination.current"
               :page-size="familyPagination.size"
@@ -63,7 +63,7 @@
           </el-dialog>
 
                     <div class="adm-table-wrap">
-<el-table :data="tableData" border v-loading="loading" style="width: 100%" height="100%">
+<el-table :data="tableData" border v-loading="loading" class="full-width" height="100%">
              <el-table-column prop="id" label="ID" width="80">
                <template slot="header">
                  <span class="sort-header" @click.stop="onSortClick('id', $event)">ID<span v-if="sortIndex('id') !== null" class="sort-index" :class="sortClass('id') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('id') }}</span>{{ sortIcon('id') }}</span>
@@ -132,7 +132,7 @@
           </div>
 
           <el-pagination
-            style="margin-top: 20px; text-align: right"
+            class="pagination-mt20"
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
             :current-page="pagination.current"
@@ -145,11 +145,11 @@
 
         <!-- 奖励模板 -->
         <el-tab-pane label="奖励模板" name="templates">
-          <el-button type="primary" size="small" style="margin-bottom: 15px" @click="showCreateTemplate">
+          <el-button type="primary" size="small" class="mb-15" @click="showCreateTemplate">
             新建模板
           </el-button>
                     <div class="adm-table-wrap">
-<el-table :data="templates" border v-loading="loadingTemplates" style="width: 100%" height="100%">
+<el-table :data="templates" border v-loading="loadingTemplates" class="full-width" height="100%">
             <el-table-column prop="id" label="ID" width="80"></el-table-column>
             <el-table-column prop="title" label="模板名称" min-width="200"></el-table-column>
             <el-table-column prop="pointsRequired" label="所需积分" width="120">
@@ -444,4 +444,16 @@ export default {
 }
 </script>
 
+<style scoped>
+.page-container { padding: 20px; }
+/* == C 批内联清理工具类 == */
+.mb-20 { margin-bottom: 20px; }
+.mb-15 { margin-bottom: 15px; }
+.padding-8 { padding: 8px; }
+.cursor-pointer { cursor: pointer; }
+.pagination-mt15 { margin-top: 15px; text-align: right; }
+.pagination-mt20 { margin-top: 20px; text-align: right; }
+.full-width { width: 100%; }
+</style>
+
 

+ 19 - 8
cfc-web/src/views/TaskTemplates.vue

@@ -7,7 +7,7 @@
       </PageHeader>
 
       <!-- 搜索和筛选 -->
-      <el-form :inline="true" :model="searchForm" style="margin-bottom: 20px">
+      <el-form :inline="true" :model="searchForm" class="mb-20">
         <el-form-item label="分类">
           <el-select v-model="searchForm.category" placeholder="全部分类" clearable @change="handleSearch">
             <el-option label="学习" value="学习"></el-option>
@@ -43,7 +43,7 @@
         :data="tableData"
         border
         v-loading="loading"
-        style="width: 100%"
+        class="full-width"
         height="100%"
       >
         <el-table-column prop="id" label="ID" width="80">
@@ -149,7 +149,7 @@
             <el-button
               type="text"
               size="small"
-              style="color: var(--adm-error)"
+              class="text-error"
               @click="handleDelete(scope.row)"
             >
               删除
@@ -161,7 +161,7 @@
 
       <!-- 分页 -->
       <el-pagination
-        style="margin-top: 20px; text-align: right"
+        class="pagination-right"
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
         :current-page="pagination.current"
@@ -213,11 +213,11 @@
         </el-form-item>
     <el-form-item label="推荐年龄" prop="recommendedAge">
       <el-input-number v-model="editForm.recommendedAge" :min="0" :max="18" placeholder="推荐年龄"></el-input-number>
-      <span style="margin-left: 10px; color: var(--adm-text-45)">岁及以上</span>
+      <span class="suffix-hint">岁及以上</span>
     </el-form-item>
     <el-form-item label="预计时长" prop="duration">
       <el-input-number v-model="editForm.duration" :min="1" :max="480" placeholder="预计时长"></el-input-number>
-      <span style="margin-left: 10px; color: var(--adm-text-45)">分钟</span>
+      <span class="suffix-hint">分钟</span>
     </el-form-item>
     <el-form-item label="完成方式" prop="completeTypes">
       <el-checkbox-group v-model="editForm.completeTypes">
@@ -243,7 +243,7 @@
     </el-form-item>
     <el-form-item label="周期次数" prop="maxFrequency" v-if="editForm.taskType === 'recurring'">
       <el-input-number v-model="editForm.maxFrequency" :min="1" :max="100" placeholder="周期内最多完成次数"></el-input-number>
-      <span style="margin-left: 10px; color: var(--adm-text-45); font-size: 12px">
+      <span class="suffix-hint-sm">
         超过此次数不计积分
       </span>
     </el-form-item>
@@ -260,7 +260,7 @@
     </el-form-item>
     <el-form-item label="按分类审核" prop="reviewByCategory" v-if="editForm.needReview === 1 && editForm.reviewType === 'parent'">
       <el-switch v-model="editForm.reviewByCategory" :active-value="1" :inactive-value="0"></el-switch>
-      <span style="margin-left: 10px; color: var(--adm-text-45); font-size: 12px">
+      <span class="suffix-hint-sm">
         开启后,将按照分类自动分配审核人
       </span>
     </el-form-item>
@@ -531,4 +531,15 @@ export default {
 }
 </script>
 
+<style scoped>
+.admin-page { padding: 20px; }
+/* == C 批内联清理工具类 == */
+.mb-20 { margin-bottom: 20px; }
+.full-width { width: 100%; }
+.text-error { color: var(--adm-error); }
+.pagination-right { margin-top: 20px; text-align: right; }
+.suffix-hint { margin-left: 10px; color: var(--adm-text-45); }
+.suffix-hint-sm { margin-left: 10px; color: var(--adm-text-45); font-size: 12px; }
+</style>
+
 

+ 14 - 8
cfc-web/src/views/admin/PromotionManagement.vue

@@ -4,8 +4,8 @@
     <el-card>
       <el-tabs v-model="activeTab" @tab-click="handleTabChange">
         <el-tab-pane label="邀请里程碑" name="milestone">
-          <div style="margin-bottom: 16px">
-            <el-input v-model="milestoneKeyword" placeholder="搜索里程碑..." prefix-icon="el-icon-search" style="width:200px" clearable @keyup.enter.native="handleMilestoneSearch" @clear="handleMilestoneSearch" />
+          <div class="mb-16">
+            <el-input v-model="milestoneKeyword" placeholder="搜索里程碑..." prefix-icon="el-icon-search" class="w-200" clearable @keyup.enter.native="handleMilestoneSearch" @clear="handleMilestoneSearch" />
     </div>
         <div class="adm-table-wrap">
 <el-table :data="filteredMilestones" v-loading="milestoneLoading" border stripe height="100%">
@@ -35,19 +35,19 @@
     </div>
     </el-tab-pane>
         <el-tab-pane label="排行榜" name="leaderboard">
-          <div style="margin-bottom: 16px; display: flex; gap: 16px; align-items: center; flex-wrap: wrap">
+          <div class="filter-row">
             <el-date-picker
               v-model="weekStart"
               type="date"
               placeholder="选择周起始日"
               value-format="yyyy-MM-dd"
               @change="handleWeekChange"
-              style="width: 180px"
+              class="w-180"
             />
             <el-input
               v-model="searchKeyword"
               placeholder="搜索用户昵称"
-              style="width: 200px"
+              class="w-200"
               clearable
               @keyup.enter.native="handleSearch"
             />
@@ -79,7 +79,7 @@
             :page-size="leaderboardSize"
             :total="leaderboardTotal"
             layout="total, prev, pager, next"
-            style="margin-top: 20px; text-align: right"
+            class="pagination-right"
           />
         </el-tab-pane>
       </el-tabs>
@@ -91,10 +91,10 @@
           <el-input v-model="milestoneForm.milestone" disabled />
         </el-form-item>
         <el-form-item label="奖励积分" required>
-          <el-input-number v-model="milestoneForm.rewardPoints" :min="0" style="width: 200px" />
+          <el-input-number v-model="milestoneForm.rewardPoints" :min="0" class="w-200" />
         </el-form-item>
         <el-form-item label="奖励能量" required>
-          <el-input-number v-model="milestoneForm.rewardEnergy" :min="0" style="width: 200px" />
+          <el-input-number v-model="milestoneForm.rewardEnergy" :min="0" class="w-200" />
         </el-form-item>
       </el-form>
       <div slot="footer">
@@ -277,4 +277,10 @@ export default {
 .promotion-management {
   padding: 20px;
 }
+/* == C 批内联清理工具类 == */
+.mb-16 { margin-bottom: 16px; }
+.w-200 { width: 200px; }
+.w-180 { width: 180px; }
+.filter-row { margin-bottom: 16px; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
+.pagination-right { margin-top: 20px; text-align: right; }
 </style>

+ 11 - 8
cfc-web/src/views/admin/RecommendationRules.vue

@@ -104,7 +104,7 @@
         </el-form-item>
 
         <el-form-item label="关联类型" required>
-          <el-select v-model="form.ruleType" placeholder="选择类型" style="width:100%">
+          <el-select v-model="form.ruleType" placeholder="选择类型" class="full-width">
             <el-option label="共购关联" value="co_purchase"></el-option>
             <el-option label="复购关联" value="repurchase"></el-option>
             <el-option label="画像缺口关联" value="profile_gap"></el-option>
@@ -113,7 +113,7 @@
         </el-form-item>
 
         <el-form-item label="关联维度" required>
-          <el-select v-model="form.dimensionCode" placeholder="选择维度" style="width:100%">
+          <el-select v-model="form.dimensionCode" placeholder="选择维度" class="full-width">
             <el-option label="身" value="body"></el-option>
             <el-option label="智" value="wisdom"></el-option>
             <el-option label="心" value="mind"></el-option>
@@ -131,11 +131,11 @@
         </el-form-item>
 
         <el-form-item label="优先级">
-          <el-input-number v-model="form.priority" :min="1" :max="100" style="width:120px" />
+          <el-input-number v-model="form.priority" :min="1" :max="100" class="w-120" />
         </el-form-item>
 
         <el-form-item label="生效场景(多选)">
-          <el-checkbox-group v-model="form.sceneCodes" style="width:100%">
+          <el-checkbox-group v-model="form.sceneCodes" class="full-width">
             <el-option label="dimension_page" value="dimension_page"></el-option>
             <el-option label="ai_chat" value="ai_chat"></el-option>
             <el-option label="report_upload" value="report_upload"></el-option>
@@ -149,22 +149,22 @@
 
         <el-form-item>
           <el-form-item label="复购周期天数">
-            <el-input-number v-model="form.repurchaseDays" :min="1" :max="365" style="width:120px" />
+            <el-input-number v-model="form.repurchaseDays" :min="1" :max="365" class="w-120" />
           </el-form-item>
           <el-form-item v-if="form.ruleType === 'co_purchase'">
             <el-form-item label="共购时间窗口(天)">
-              <el-input-number v-model="form.coPurchaseWindowDays" :min="1" :max="90" style="width:120px" />
+              <el-input-number v-model="form.coPurchaseWindowDays" :min="1" :max="90" class="w-120" />
             </el-form-item>
           </el-form-item>
           <el-form-item v-if="form.ruleType === 'co_purchase'">
             <el-form-item label="共购计数(起始)">
-              <el-input-number v-model="form.coPurchaseCount" :min="0" style="width:120px" />
+              <el-input-number v-model="form.coPurchaseCount" :min="0" class="w-120" />
             </el-form-item>
           </el-form-item>
         </el-form-item>
 
         <el-form-item label="手动覆盖(1=运营干预优先)">
-          <el-select v-model="form.manualOverride" style="width:100%">
+          <el-select v-model="form.manualOverride" class="full-width">
             <el-option label="否(0)" value="0"></el-option>
             <el-option label="是(1)" value="1"></el-option>
           </el-select>
@@ -299,4 +299,7 @@ export default {
     float: right;
   }
 }
+/* == C 批内联清理工具类 == */
+.full-width { width: 100%; }
+.w-120 { width: 120px; }
 </style>

+ 13 - 7
cfc-web/src/views/teacher/TeacherTeam.vue

@@ -42,12 +42,12 @@
     <el-card class="table-card">
       <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" />
+          <el-input v-model="keyword" placeholder="搜索成员..." prefix-icon="el-icon-search" size="small" class="w-200" 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%">
+<el-table :data="filteredMembers" stripe class="full-width" v-loading="loading" height="100%">
         <el-table-column label="成员信息" min-width="200">
           <template slot="header">
             <span class="sort-header" @click.stop="onSortClick('id', $event)">成员信息<span v-if="sortIndex('id') !== null" class="sort-index" :class="sortClass('id') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('id') }}</span>{{ sortIcon('id') }}</span>
@@ -155,13 +155,13 @@
         <el-row :gutter="12">
           <el-col :span="12">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: var(--adm-primary)">{{ formatPriceWithSymbol(currentMember.monthlySales || 0) }}</div>
+              <div class="mini-stat-value stat-primary">{{ formatPriceWithSymbol(currentMember.monthlySales || 0) }}</div>
               <div class="mini-stat-label">本月业绩</div>
             </div>
           </el-col>
           <el-col :span="12">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: var(--adm-success)">{{ formatPriceWithSymbol(currentMember.totalSales || 0) }}</div>
+              <div class="mini-stat-value stat-success">{{ formatPriceWithSymbol(currentMember.totalSales || 0) }}</div>
               <div class="mini-stat-label">累计业绩</div>
             </div>
           </el-col>
@@ -171,19 +171,19 @@
         <el-row :gutter="12">
           <el-col :span="8">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: var(--adm-warning)">{{ currentMember.familyCount || 0 }}</div>
+              <div class="mini-stat-value stat-warning">{{ currentMember.familyCount || 0 }}</div>
               <div class="mini-stat-label">服务家庭</div>
             </div>
           </el-col>
           <el-col :span="8">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: var(--adm-primary)">{{ currentMember.childrenCount || 0 }}</div>
+              <div class="mini-stat-value stat-primary">{{ currentMember.childrenCount || 0 }}</div>
               <div class="mini-stat-label">服务孩子</div>
             </div>
           </el-col>
           <el-col :span="8">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: var(--adm-success)">{{ currentMember.taskCount || 0 }}</div>
+              <div class="mini-stat-value stat-success">{{ currentMember.taskCount || 0 }}</div>
               <div class="mini-stat-label">完成任务</div>
             </div>
           </el-col>
@@ -473,4 +473,10 @@ export default {
   color: var(--adm-text-45);
   margin-top: 4px;
 }
+/* == C 批内联清理工具类 == */
+.w-200 { width: 200px; }
+.full-width { width: 100%; }
+.stat-primary { color: var(--adm-primary); }
+.stat-success { color: var(--adm-success); }
+.stat-warning { color: var(--adm-warning); }
 </style>