统一结果总览详情弹窗主区视觉

ruoyi-ui/src/views/ccdiProject/components/detail/ProjectAnalysisAbnormalTab.vue

@@ -4,10 +4,11 @@
       <section
         v-for="(group, groupIndex) in detailGroups"
         :key="`${group.groupCode || group.groupType || groupIndex}-group`"
-        class="abnormal-card"
+        class="abnormal-card analysis-panel"
       >
         <div class="abnormal-card__header">
           <div class="abnormal-card__title">{{ group.groupName || "异常明细" }}</div>
+          <div class="abnormal-card__summary">{{ getGroupSummary(group) }}</div>
         </div>
 
         <el-table
@@ -151,6 +152,16 @@ export default {
     resolveGroupKey(group, index = 0) {
       return group.groupCode || group.groupName || `BANK_STATEMENT_${index}`;
     },
+    getGroupSummary(group) {
+      const recordTotal = Array.isArray(group && group.records) ? group.records.length : 0;
+      if (group && group.groupType === "BANK_STATEMENT") {
+        return `共 ${recordTotal} 条交易记录，按时间顺序查看重点流水。`;
+      }
+      if (group && group.groupType === "OBJECT") {
+        return `共 ${recordTotal} 个异常对象，结合快照与摘要连续阅读。`;
+      }
+      return "按统一工作台区块承载当前异常分组内容。";
+    },
     getStatementPage(group) {
       const groupKey = this.resolveGroupKey(group);
       return this.statementPageMap[groupKey] || 1;
@@ -179,10 +190,14 @@ export default {
   gap: 16px;
 }
 
+.analysis-panel {
+  border: 1px solid #e2e8f0;
+  border-radius: 20px;
+  background: #ffffff;
+}
+
 .abnormal-card {
   padding: 20px;
-  border: 1px solid #e2e8f0;
-  background: #fff;
 }
 
 .abnormal-card__header {
@@ -195,8 +210,10 @@ export default {
   color: #0f172a;
 }
 
-.abnormal-card__subtitle {
+.abnormal-card__summary {
-  font-size: 12px;
+  margin-top: 8px;
+  font-size: 13px;
+  line-height: 1.7;
   color: #64748b;
 }
 
@@ -242,7 +259,8 @@ export default {
 .object-card {
   padding: 16px;
   border: 1px solid #e2e8f0;
-  background: #f8fafc;
+  border-radius: 16px;
+  background: #ffffff;
 }
 
 .object-card__title {

ruoyi-ui/src/views/ccdiProject/components/detail/ProjectAnalysisDialog.vue

@@ -63,19 +63,19 @@
           </el-alert>
           <el-tabs v-model="activeTab" stretch>
             <el-tab-pane label="异常明细" name="abnormalDetail">
-              <project-analysis-abnormal-tab :detail-data="dialogData.abnormalDetail" />
+              <project-analysis-abnormal-tab class="analysis-panel" :detail-data="dialogData.abnormalDetail" />
             </el-tab-pane>
             <el-tab-pane label="资产分析" name="assetAnalysis">
-              <project-analysis-placeholder-tab :tab-data="getTabData('assetAnalysis')" />
+              <project-analysis-placeholder-tab class="analysis-panel" :tab-data="getTabData('assetAnalysis')" />
             </el-tab-pane>
             <el-tab-pane label="征信摘要" name="creditSummary">
-              <project-analysis-placeholder-tab :tab-data="getTabData('creditSummary')" />
+              <project-analysis-placeholder-tab class="analysis-panel" :tab-data="getTabData('creditSummary')" />
             </el-tab-pane>
             <el-tab-pane label="关系图谱" name="relationshipGraph">
-              <project-analysis-placeholder-tab :tab-data="getTabData('relationshipGraph')" />
+              <project-analysis-placeholder-tab class="analysis-panel" :tab-data="getTabData('relationshipGraph')" />
             </el-tab-pane>
             <el-tab-pane label="资金流向" name="fundFlow">
-              <project-analysis-placeholder-tab :tab-data="getTabData('fundFlow')" />
+              <project-analysis-placeholder-tab class="analysis-panel" :tab-data="getTabData('fundFlow')" />
             </el-tab-pane>
           </el-tabs>
         </div>

ruoyi-ui/src/views/ccdiProject/components/detail/ProjectAnalysisPlaceholderTab.vue

@@ -1,5 +1,5 @@
 <template>
-  <section class="project-analysis-placeholder-tab">
+  <section class="project-analysis-placeholder-tab analysis-panel analysis-panel--placeholder">
     <div class="placeholder-title">{{ tabData.label }}</div>
     <div class="placeholder-text">{{ tabData.description }}</div>
   </section>
@@ -21,11 +21,19 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.analysis-panel {
+  border: 1px solid #e2e8f0;
+  border-radius: 20px;
+  background: #ffffff;
+}
+
 .project-analysis-placeholder-tab {
   min-height: 560px;
   padding: 24px;
-  border: 1px solid #e2e8f0;
+}
-  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
+
+.analysis-panel--placeholder {
+  background: #ffffff;
 }
 
 .placeholder-title {

ruoyi-ui/tests/unit/project-analysis-dialog-abnormal-tab.test.js

@@ -16,18 +16,27 @@ const abnormalTab = fs.readFileSync(
   ),
   "utf8"
 );
+const placeholderTab = fs.readFileSync(
+  path.resolve(
+    __dirname,
+    "../../src/views/ccdiProject/components/detail/ProjectAnalysisPlaceholderTab.vue"
+  ),
+  "utf8"
+);
 
 [
   "<project-analysis-abnormal-tab",
   ':detail-data="dialogData.abnormalDetail"',
-  "source-summary",
+  "project-analysis-overview",
 ].forEach((token) => assert(dialog.includes(token), token));
 
 [
+  "analysis-panel",
   "detailData.groups",
   'group.groupType === "BANK_STATEMENT"',
   'group.groupType === "OBJECT"',
   "group.groupName",
+  "abnormal-card__summary",
   "statementPageSize: 5",
   "statementPageMap",
   "slice(startIndex, startIndex + this.statementPageSize)",
@@ -48,3 +57,13 @@ const abnormalTab = fs.readFileSync(
   "extraFields",
   "grid-template-columns: minmax(0, 1fr)",
 ].forEach((token) => assert(abnormalTab.includes(token), token));
+
+[
+  "analysis-panel",
+  "analysis-panel--placeholder",
+].forEach((token) => assert(placeholderTab.includes(token), token));
+
+assert(
+  !placeholderTab.includes("background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%)"),
+  "占位页签不应继续单独使用旧渐变底"
+);

ruoyi-ui/tests/unit/project-analysis-dialog-layout.test.js

@@ -16,6 +16,13 @@ const mockSource = fs.readFileSync(
   ),
   "utf8"
 );
+const placeholderTab = fs.readFileSync(
+  path.resolve(
+    __dirname,
+    "../../src/views/ccdiProject/components/detail/ProjectAnalysisPlaceholderTab.vue"
+  ),
+  "utf8"
+);
 
 [
   'title="项目分析"',
@@ -23,6 +30,7 @@ const mockSource = fs.readFileSync(
   'top="5vh"',
   "project-analysis-header",
   "project-analysis-overview",
+  "analysis-panel",
   "project-analysis-header__title",
   "project-analysis-header__risk",
   "project-analysis-header__meta",
@@ -48,6 +56,11 @@ const mockSource = fs.readFileSync(
 
 assert(!dialog.includes("project-analysis-shell"), "不应继续保留内部大白卡外壳");
 assert(!dialog.includes('class="source-summary"'), "当前命中模型不应停留在主区顶部");
+assert(placeholderTab.includes("analysis-panel--placeholder"), "占位页签应与主区面板统一样式基线");
+assert(
+  !placeholderTab.includes("background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%)"),
+  "占位页签不应继续保留旧渐变底"
+);
 
 [
   "projectAnalysisTabs",