feat(ui): CMA前端UI优化P0 - BSC变量+公共类+统一标题+色值替换+内联style替换

frontend/src/views/BIReportCenter.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
-    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;">
-      <h2 style="margin:0;">BI报表中心</h2>
+    <div class="flex-between section-gap">
+      <h3 class="page-title">BI报表中心</h3>
       <div>
         <el-button type="primary" @click="showTemplateDialog = true">从模板创建</el-button>
         <el-button @click="showNewReport = true">新建分析报表</el-button>
@@ -9,7 +9,7 @@
     </div>
 
     <!-- 预置模板 -->
-    <el-card shadow="never" style="margin-bottom:16px;">
+    <el-card shadow="never" class="section-gap">
       <template #header>预置报表模板</template>
       <el-row :gutter="16">
         <el-col v-for="tpl in templates" :key="tpl.id" :span="24 / templates.length || 1">
@@ -31,7 +31,7 @@
     </el-card>
 
     <!-- 分析引擎 -->
-    <el-card v-if="analysisResult" shadow="never" style="margin-bottom:16px;">
+    <el-card v-if="analysisResult" shadow="never" class="section-gap">
       <template #header>
         <div style="display:flex;justify-content:space-between;align-items:center;">
           <span>{{ currentReportName }}</span>
@@ -61,7 +61,7 @@
     </el-card>
 
     <!-- 已保存报表 -->
-    <el-card shadow="never">
+    <el-card shadow="never" class="section-gap">
       <template #header>已保存报表</template>
       <el-table :data="reports" size="small" v-loading="loading">
         <el-table-column prop="name" label="报表名称" min-width="200" />