style(admin): C-7 ZodiacConfigs/WuxingConfig/ProblemDomain/Families/Wishes 内联 style 归零

cfc-web/src/views/Families.vue

@@ -6,7 +6,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-input
             v-model="searchForm.name"
@@ -27,7 +27,7 @@
           :data="tableData"
           border
           v-loading="loading"
-          style="width: 100%"
+          class="full-width"
           height="100%"
         >
         <el-table-column prop="id" label="ID" width="80">
@@ -77,7 +77,7 @@
 
         <!-- 分页 -->
       <el-pagination
-        style="margin-top: 20px; text-align: right"
+        class="pagination-right"
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
         :current-page="pagination.current"
@@ -112,7 +112,7 @@
       width="900px"
     >
       <div v-if="membersData.family">
-        <el-descriptions :column="2" border style="margin-bottom: 20px">
+        <el-descriptions :column="2" border class="mb-20">
           <el-descriptions-item label="家庭名称">{{ membersData.family.name }}</el-descriptions-item>
           <el-descriptions-item label="邀请码">{{ membersData.family.inviteCode }}</el-descriptions-item>
         </el-descriptions>
@@ -121,7 +121,7 @@
         <el-table
           :data="membersData.members"
           border
-          style="width: 100%"
+          class="full-width"
           :max-height="350"
           v-if="membersData.members && membersData.members.length > 0"
         >
@@ -179,7 +179,7 @@
           <el-input :value="couponForm.familyName" disabled></el-input>
         </el-form-item>
         <el-form-item label="优惠券" required>
-          <el-select v-model="couponForm.couponId" placeholder="请选择优惠券" style="width: 100%">
+          <el-select v-model="couponForm.couponId" placeholder="请选择优惠券" class="full-width">
             <el-option
               v-for="c in couponOptions"
               :key="c.id"
@@ -204,9 +204,9 @@
       :visible.sync="couponDialogVisible"
       width="900px"
     >
-      <el-form :inline="true" style="margin-bottom: 12px">
+      <el-form :inline="true" class="mb-12">
         <el-form-item label="状态">
-          <el-select v-model="couponStatusFilter" placeholder="全部" clearable size="small" style="width:120px">
+          <el-select v-model="couponStatusFilter" placeholder="全部" clearable size="small" class="w-120">
             <el-option label="可用" value="AVAILABLE"></el-option>
             <el-option label="已使用" value="USED"></el-option>
           </el-select>
@@ -215,7 +215,7 @@
           <el-button size="small" @click="loadCoupons(currentRow.id)">刷新</el-button>
         </el-form-item>
       </el-form>
-      <el-table :data="couponListData" border v-loading="couponLoading" style="width:100%" max-height="400">
+      <el-table :data="couponListData" border v-loading="couponLoading" class="full-width" max-height="400">
         <el-table-column prop="name" label="券名称" min-width="140"></el-table-column>
         <el-table-column prop="type" label="类型" width="80">
           <template slot-scope="scope">
@@ -241,7 +241,7 @@
           <template slot-scope="scope">{{ formatTime(scope.row.usedAt) }}</template>
         </el-table-column>
       <el-pagination
-        style="margin-top: 12px; text-align: right"
+        class="pagination-right-mt12"
         @size-change="onCouponSizeChange"
         @current-change="onCouponPageChange"
         :current-page="couponPagination.current"
@@ -258,7 +258,7 @@
       :visible.sync="usageDialogVisible"
       width="800px"
     >
-      <el-table :data="usageListData" border v-loading="usageLoading" style="width:100%" max-height="400">
+      <el-table :data="usageListData" border v-loading="usageLoading" class="full-width" max-height="400">
         <el-table-column prop="name" label="券名称" min-width="140"></el-table-column>
         <el-table-column prop="type" label="类型" width="80">
           <template slot-scope="scope">
@@ -279,7 +279,7 @@
           <template slot-scope="scope">{{ formatTime(scope.row.usedAt) }}</template>
         </el-table-column>
       <el-pagination
-        style="margin-top: 12px; text-align: right"
+        class="pagination-right-mt12"
         @size-change="onUsageSizeChange"
         @current-change="onUsagePageChange"
         :current-page="usagePagination.current"
@@ -604,4 +604,14 @@ export default {
 }
 </script>
 
+<style scoped>
+.page-container { padding: 20px; }
+.mb-20 { margin-bottom: 20px; }
+.mb-12 { margin-bottom: 12px; }
+.full-width { width: 100%; }
+.w-120 { width: 120px; }
+.pagination-right { margin-top: 20px; text-align: right; }
+.pagination-right-mt12 { margin-top: 12px; text-align: right; }
+</style>
+
 

cfc-web/src/views/Wishes.vue

@@ -9,7 +9,7 @@
         <!-- 待处理列表 -->
         <el-tab-pane label="待处理" name="pending">
           <!-- 统计卡片 -->
-          <el-row :gutter="20" style="margin-bottom: 20px">
+          <el-row :gutter="20" class="mb-20">
             <el-col :span="6">
               <StatCard label="待定价" :value="draftCount" color="info" icon="el-icon-price-tag" />
             </el-col>
@@ -28,7 +28,7 @@
           <div v-if="draftWishes.length > 0" class="wish-section">
             <SectionTitle title="待定价" />
 <div class="adm-table-wrap">
-<el-table style="width: 100%" height="100%" :data="draftWishes" border v-loading="loading">
+<el-table class="full-width" height="100%" :data="draftWishes" border v-loading="loading">
               <el-table-column prop="id" label="ID" width="80"></el-table-column>
               <el-table-column prop="childName" label="孩子" width="100"></el-table-column>
               <el-table-column prop="title" label="心愿名称" min-width="200"></el-table-column>
@@ -59,7 +59,7 @@
           <div v-if="pendingExchangeWishes.length > 0" class="wish-section">
             <SectionTitle title="⏳ 待审批兑换" />
                         <div class="adm-table-wrap">
-<el-table :data="pendingExchangeWishes" border v-loading="loading" style="width: 100%" height="100%">
+<el-table :data="pendingExchangeWishes" border v-loading="loading" class="full-width" height="100%">
               <el-table-column prop="id" label="ID" width="80"></el-table-column>
               <el-table-column prop="childName" label="孩子" width="100"></el-table-column>
               <el-table-column prop="title" label="心愿名称" min-width="200"></el-table-column>
@@ -94,7 +94,7 @@
           <div v-if="approvedWishes.length > 0" class="wish-section">
             <SectionTitle title="待兑现" />
                         <div class="adm-table-wrap">
-<el-table :data="approvedWishes" border v-loading="loading" style="width: 100%" height="100%">
+<el-table :data="approvedWishes" border v-loading="loading" class="full-width" height="100%">
               <el-table-column prop="id" label="ID" width="80"></el-table-column>
               <el-table-column prop="childName" label="孩子" width="100"></el-table-column>
               <el-table-column prop="title" label="心愿名称" min-width="200"></el-table-column>
@@ -121,7 +121,7 @@
           <div v-if="exchangingWishes.length > 0" class="wish-section">
             <SectionTitle title="待收货确认" />
                         <div class="adm-table-wrap">
-<el-table :data="exchangingWishes" border v-loading="loading" style="width: 100%" height="100%">
+<el-table :data="exchangingWishes" border v-loading="loading" class="full-width" height="100%">
               <el-table-column prop="id" label="ID" width="80"></el-table-column>
               <el-table-column prop="childName" label="孩子" width="100"></el-table-column>
               <el-table-column prop="title" label="心愿名称" min-width="200"></el-table-column>
@@ -146,7 +146,7 @@
         <!-- 全部心愿 -->
         <el-tab-pane label="全部心愿" name="all">
           <!-- 搜索筛选 -->
-          <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"
@@ -159,7 +159,7 @@
                   icon="el-icon-close"
                   v-if="searchForm.familyId"
                   @click.stop="clearFamily"
-                  style="padding: 8px"
+                  class="pt-8"
                 ></el-button>
                 <i slot="suffix" class="el-input__icon el-icon-arrow-down" @click.stop="showFamilySelector"></i>
               </el-input>
@@ -184,12 +184,12 @@
 
           <!-- 家庭选择对话框 -->
           <el-dialog title="选择家庭" :visible.sync="familyDialogVisible" width="600px">
-            <el-table :data="familyList" border v-loading="familyLoading" @row-click="selectFamily" style="cursor: pointer" :max-height="300">
+            <el-table :data="familyList" border v-loading="familyLoading" @row-click="selectFamily" class="cursor-pointer" :max-height="300">
               <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>
             <el-pagination
-              style="margin-top: 15px; text-align: right"
+              class="mb-15-rows"
               @current-change="loadFamilies"
               :current-page="familyPagination.current"
               :page-size="familyPagination.size"
@@ -199,7 +199,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>
@@ -262,7 +262,7 @@
           <
 
           <el-pagination
-            style="margin-top: 20px; text-align: right"
+            class="mb-20-rows"
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
             :current-page="pagination.current"
@@ -567,4 +567,11 @@ export default {
   color: var(--adm-text-45);
   font-size: 12px;
 }
+/* == C 批内联清理工具类 == */
+.mb-20 { margin-bottom: 20px; }
+.mb-20-rows { margin-top: 20px; text-align: right; }
+.mb-15-rows { margin-top: 15px; text-align: right; }
+.pt-8 { padding: 8px; }
+.full-width { width: 100%; }
+.cursor-pointer { cursor: pointer; }
 </style>

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

@@ -29,7 +29,7 @@
             <span class="sort-header" @click.stop="onSortClick('icon', $event)">图标<span v-if="sortIndex('icon') !== null" class="sort-index" :class="sortClass('icon') === 'sort-asc' ? 'sort-asc-badge' : 'sort-desc-badge'">{{ sortIndex('icon') }}</span>{{ sortIcon('icon') }}</span>
           </template>
           <template slot-scope="scope">
-            <span style="font-size:20px">{{ scope.row.icon || '🧭' }}</span>
+            <span class="font-20">{{ scope.row.icon || '🧭' }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="description" label="描述" min-width="160" show-overflow-tooltip>
@@ -58,7 +58,7 @@
         <el-table-column label="操作" width="150" align="center">
           <template slot-scope="scope">
             <el-button type="text" size="mini" @click="openEdit(scope.row)">编辑</el-button>
-            <el-button type="text" size="mini" style="color:var(--adm-error)" @click="handleDelete(scope.row)">删除</el-button>
+            <el-button type="text" size="mini" class="text-error" @click="handleDelete(scope.row)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -74,15 +74,15 @@
           <el-input v-model="form.name" placeholder="如：减肥 / 睡眠 / 便秘" />
         </el-form-item>
         <el-form-item label="图标">
-          <el-input v-model="form.icon" placeholder="emoji，如 🌙" style="width:120px" />
+          <el-input v-model="form.icon" placeholder="emoji，如 🌙" class="w-120" />
         </el-form-item>
         <el-form-item label="描述">
           <el-input v-model="form.description" type="textarea" :rows="2" placeholder="一句话描述" />
         </el-form-item>
         <el-form-item label="调研模板ID">
-          <el-input v-model.number="form.surveyTemplateId" placeholder="SurveyTemplate.id" style="width:200px" />
-          <el-button size="mini" style="margin-left:8px" @click="loadSurveys">从调研模板列表选择</el-button>
-          <el-select v-if="surveyOptions.length" v-model="form.surveyTemplateId" placeholder="选择模板" style="width:200px;margin-left:8px" clearable>
+          <el-input v-model.number="form.surveyTemplateId" placeholder="SurveyTemplate.id" class="w-200" />
+          <el-button size="mini" class="ml-8" @click="loadSurveys">从调研模板列表选择</el-button>
+          <el-select v-if="surveyOptions.length" v-model="form.surveyTemplateId" placeholder="选择模板" class="w-200 ml-8" clearable>
             <el-option
               v-for="s in surveyOptions"
               :key="s.id"
@@ -120,18 +120,18 @@
           />
         </el-form-item>
         <el-form-item label="可视化编辑">
-          <div style="width:100%">
+          <div class="flow-container">
             <div
               v-for="(step, idx) in flowSteps"
               :key="idx"
-              style="margin-bottom:8px;padding:8px;border:1px solid var(--adm-border-split);border-radius:4px;"
+              class="flow-step-card"
             >
-              <el-input v-model="step.title" placeholder="步骤标题" style="width:40%;margin-right:8px" size="small" />
-              <el-input v-model="step.desc" placeholder="步骤描述" style="width:40%;margin-right:8px" size="small" />
-              <el-button type="text" size="small" style="color:var(--adm-error)" @click="removeStep(idx)">删除</el-button>
+              <el-input v-model="step.title" placeholder="步骤标题" class="step-input" size="small" />
+              <el-input v-model="step.desc" placeholder="步骤描述" class="step-input" size="small" />
+              <el-button type="text" size="small" class="text-error" @click="removeStep(idx)">删除</el-button>
             </div>
             <el-button type="primary" size="mini" plain @click="addStep">+ 添加步骤</el-button>
-            <el-button type="success" size="mini" plain @click="syncFlowJson" style="margin-left:8px">同步到JSON</el-button>
+            <el-button type="success" size="mini" plain class="ml-8" @click="syncFlowJson">同步到JSON</el-button>
           </div>
         </el-form-item>
       </el-form>
@@ -274,3 +274,17 @@ export default {
     }
   }
 }
+</script>
+
+<style scoped>
+.admin-page { padding: 20px; }
+/* == C 批内联清理工具类 == */
+.font-20 { font-size: 20px; }
+.text-error { color: var(--adm-error); }
+.w-120 { width: 120px; }
+.w-200 { width: 200px; }
+.ml-8 { margin-left: 8px; }
+.flow-container { width: 100%; }
+.flow-step-card { margin-bottom: 8px; padding: 8px; border: 1px solid var(--adm-border-split); border-radius: 4px; }
+.step-input { width: 40%; margin-right: 8px; }
+</style>

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

@@ -79,27 +79,27 @@
           </el-select>
         </el-form-item>
         <el-form-item label="起始日期">
-          <el-input-number v-model="form.startMonth" :min="1" :max="12" style="width:100px"></el-input-number> 月
-          <el-input-number v-model="form.startDay" :min="1" :max="31" style="width:100px"></el-input-number> 日
+          <el-input-number v-model="form.startMonth" :min="1" :max="12" class="w-100"></el-input-number> 月
+          <el-input-number v-model="form.startDay" :min="1" :max="31" class="w-100"></el-input-number> 日
         </el-form-item>
         <el-form-item label="结束日期">
-          <el-input-number v-model="form.endMonth" :min="1" :max="12" style="width:100px"></el-input-number> 月
-          <el-input-number v-model="form.endDay" :min="1" :max="31" style="width:100px"></el-input-number> 日
+          <el-input-number v-model="form.endMonth" :min="1" :max="12" class="w-100"></el-input-number> 月
+          <el-input-number v-model="form.endDay" :min="1" :max="31" class="w-100"></el-input-number> 日
         </el-form-item>
         <el-form-item label="心基础分">
-          <el-input-number v-model="form.mindBase" :min="0" :max="100" :precision="2" style="width:150px"></el-input-number>
+          <el-input-number v-model="form.mindBase" :min="0" :max="100" :precision="2" class="w-150"></el-input-number>
         </el-form-item>
         <el-form-item label="智基础分">
-          <el-input-number v-model="form.wisdomBase" :min="0" :max="100" :precision="2" style="width:150px"></el-input-number>
+          <el-input-number v-model="form.wisdomBase" :min="0" :max="100" :precision="2" class="w-150"></el-input-number>
         </el-form-item>
         <el-form-item label="身修正系数">
-          <el-input-number v-model="form.bodyModifier" :min="0" :max="2" :precision="2" :step="0.05" style="width:150px"></el-input-number>
+          <el-input-number v-model="form.bodyModifier" :min="0" :max="2" :precision="2" :step="0.05" class="w-150"></el-input-number>
         </el-form-item>
         <el-form-item label="行修正系数">
-          <el-input-number v-model="form.actionModifier" :min="0" :max="2" :precision="2" :step="0.05" style="width:150px"></el-input-number>
+          <el-input-number v-model="form.actionModifier" :min="0" :max="2" :precision="2" :step="0.05" class="w-150"></el-input-number>
         </el-form-item>
         <el-form-item label="富修正系数">
-          <el-input-number v-model="form.wealthModifier" :min="0" :max="2" :precision="2" :step="0.05" style="width:150px"></el-input-number>
+          <el-input-number v-model="form.wealthModifier" :min="0" :max="2" :precision="2" :step="0.05" class="w-150"></el-input-number>
         </el-form-item>
       </el-form>
       <div slot="footer">
@@ -109,9 +109,9 @@
     </el-dialog>
 
     <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:var(--adm-success);font-size:32px"></i>
-        <p style="margin:12px 0 0;font-size:16px;color:var(--adm-text-88)">保存成功</p>
+      <div class="success-body">
+        <i class="el-icon-success success-icon"></i>
+        <p class="success-text">保存成功</p>
       </div>
       <div slot="footer">
         <el-button type="primary" @click="handleContinue">继续添加</el-button>
@@ -243,4 +243,13 @@ export default {
 }
 </script>
 
+<style scoped>
+/* == C 批内联清理工具类 == */
+.w-100 { width: 100px; }
+.w-150 { width: 150px; }
+.success-body { text-align: center; padding: 10px 0; }
+.success-icon { color: var(--adm-success); font-size: 32px; }
+.success-text { margin: 12px 0 0; font-size: 16px; color: var(--adm-text-88); }
+</style>
+
 

cfc-web/src/views/admin/energy-config/WuxingConfig.vue

@@ -4,18 +4,18 @@
       <PageHeader slot="header" title="五行能量配置" />
 
       <!-- Section 1: Energy Source Config -->
-      <div style="margin-bottom: 30px;">
+      <div class="section-mb">
         <SectionTitle title="能量来源配置" />
-        <el-input v-model="sourceKeyword" placeholder="搜索来源类型/名称..." prefix-icon="el-icon-search" style="width: 250px; float: right; margin-bottom: 15px;" clearable @keyup.enter.native="loadSourceConfigs" @clear="loadSourceConfigs" />
-        <div style="clear: both;"></div>
+        <el-input v-model="sourceKeyword" placeholder="搜索来源类型/名称..." prefix-icon="el-icon-search" class="source-search" clearable @keyup.enter.native="loadSourceConfigs" @clear="loadSourceConfigs" />
+        <div class="clearfix"></div>
 
                 <div class="adm-table-wrap">
-<el-table :data="filteredSourceConfigs" stripe v-loading="sourceLoading" style="margin-top: 10px;" height="100%">
+<el-table :data="filteredSourceConfigs" stripe v-loading="sourceLoading" class="table-mt" height="100%">
           <el-table-column prop="sourceType" label="来源类型" width="120" show-overflow-tooltip></el-table-column>
           <el-table-column prop="sourceName" label="来源名称" width="150" show-overflow-tooltip></el-table-column>
           <el-table-column label="维度比例" min-width="300">
             <template slot-scope="scope">
-              <div v-for="ratio in getDimensionRatios(scope.row)" :key="ratio.dimensionId" style="display: inline-block; margin-right: 10px; margin-bottom: 5px;">
+              <div v-for="ratio in getDimensionRatios(scope.row)" :key="ratio.dimensionId" class="ratio-chip">
                 <StatusTag size="mini" effect="plain" :text="getDimensionLabel(ratio.dimensionId) + ': ' + (ratio.ratio / 10000) + '%'" />
               </div>
             </template>
@@ -29,7 +29,7 @@
         </el-table>
         </div>
 
-        <div style="margin-top: 15px;">
+        <div class="action-mt">
           <el-button type="primary" @click="handleCreateSource">+ 新增来源配置</el-button>
         </div>
       </div>
@@ -63,7 +63,7 @@
     <el-dialog :visible.sync="sourceDialogVisible" :title="sourceIsEdit ? '编辑来源配置' : '新增来源配置'" width="700px">
       <el-form :model="sourceForm" label-width="120px">
         <el-form-item label="来源类型" required>
-          <el-select v-model="sourceForm.sourceType" placeholder="选择来源类型" style="width: 100%">
+          <el-select v-model="sourceForm.sourceType" placeholder="选择来源类型" class="full-width">
             <el-option label="任务 (task)" value="task"></el-option>
             <el-option label="活动 (activity)" value="activity"></el-option>
             <el-option label="打卡 (streak)" value="streak"></el-option>
@@ -81,13 +81,13 @@
           </el-select>
         </el-form-item>
         <el-form-item label="来源名称" required>
-          <el-input v-model="sourceForm.sourceName" placeholder="如：任务通用、周末活动" style="width: 100%"></el-input>
+          <el-input v-model="sourceForm.sourceName" placeholder="如：任务通用、周末活动" class="full-width"></el-input>
         </el-form-item>
         <el-form-item label="维度比例">
-          <div v-for="(ratio, index) in sourceForm.ratios" :key="index" style="margin-bottom: 10px;">
+          <div v-for="(ratio, index) in sourceForm.ratios" :key="index" class="ratio-row">
             <el-row :gutter="10">
               <el-col :span="10">
-                <el-select v-model="ratio.dimensionId" placeholder="选择维度" style="width: 100%">
+                <el-select v-model="ratio.dimensionId" placeholder="选择维度" class="full-width">
                   <el-option label="身 (body)" :value="1"></el-option>
                   <el-option label="心 (mind)" :value="2"></el-option>
                   <el-option label="智 (wisdom)" :value="3"></el-option>
@@ -96,8 +96,8 @@
                 </el-select>
               </el-col>
               <el-col :span="10">
-                <el-input-number v-model="ratio.ratio" :min="0" :max="10000" :step="100" style="width: 100%" />
-                <span style="margin-left: 10px;">{{ ratio.ratio / 100 }}%</span>
+                <el-input-number v-model="ratio.ratio" :min="0" :max="10000" :step="100" class="full-width" />
+                <span class="pct-label">{{ ratio.ratio / 100 }}%</span>
               </el-col>
               <el-col :span="4">
                 <el-button size="mini" type="danger" @click="removeRatio(index)" v-if="sourceForm.ratios.length > 1">删除</el-button>
@@ -290,4 +290,14 @@ export default {
 .admin-page {
   padding: 20px;
 }
+/* == C 批内联清理工具类 == */
+.section-mb { margin-bottom: 30px; }
+.source-search { width: 250px; float: right; margin-bottom: 15px; }
+.clearfix { clear: both; }
+.table-mt { margin-top: 10px; }
+.action-mt { margin-top: 15px; }
+.ratio-chip { display: inline-block; margin-right: 10px; margin-bottom: 5px; }
+.full-width { width: 100%; }
+.ratio-row { margin-bottom: 10px; }
+.pct-label { margin-left: 10px; }
 </style>