ccdi/docs/reports/implementation/2026-03-25-special-check-family-asset-liability-detail-redesign-frontend-record.md

2026-03-25 专项核查员工家庭资产负债展开区改版前端实施记录

本次修改文件

生产代码

• ruoyi-ui/src/views/ccdiProject/components/detail/FamilyAssetLiabilityDetail.vue

测试

• ruoyi-ui/tests/unit/special-check-detail-layout.test.js
• ruoyi-ui/tests/unit/special-check-detail-summary-groups.test.js
• ruoyi-ui/tests/unit/special-check-visual-alignment.test.js
• ruoyi-ui/tests/unit/special-check-detail-date-display.test.js

实施范围

• 本次只改专项核查“员工家庭资产负债专项核查”的展开详情组件
• 列表层 FamilyAssetLiabilitySection.vue、展开入口、详情缓存、按需请求与接口路径均未改动
• 未新增后端字段、未新增路由、未新增弹窗或抽屉容器

实现内容

1. 展开区结构改为 5 段纵向汇总卡片

• 将旧的“三列卡片 + 资产/负债表格”改为单列纵向结构
• 固定展示顺序为：
  • 总收入
  • 总负债
  • 总资产
  • 关键指标
  • 详查结果
• 每张卡片标题右侧直接展示汇总值或结果名称

2. 资产与负债明细改为来源项聚合

• 资产来源项基于 assetDetail.items 按现有类型字段聚合展示
• 负债来源项基于 debtDetail.items 按现有类型字段聚合展示
• 每条来源项统一展示：
  • 类型名
  • 聚合金额
  • 占总额比例
• 彻底移除 el-table 明细表结构，避免继续展示逐条流水式详情

2.1 细项名称展示口径调整

• 根据补充要求，总资产卡片内的细项名称优先展示 assetName
• 总负债卡片内的细项名称优先展示 debtName
• 仅当名称为空时，才回退使用现有类型字段作为兜底文案

3. 关键指标与风险结论改为前端就地计算

• 继续复用现有 incomeDetail / assetDetail / debtDetail / summary 数据
• 前端新增以下计算能力：
  • 净资产 = 总资产 - 总负债
  • 资产负债率 = 总负债 / 总资产
  • 资产/收入比 = 总资产 / 总收入
  • 负债/收入比 = 总负债 / 总收入
• 分母为 0 时统一展示 -
• 详查结果按 summary.riskLevelCode 映射文案与样式：
  • NORMAL -> 结构基本合理
  • RISK -> 负债与收入压力偏高
  • HIGH -> 资产负债结构明显异常
  • MISSING_INFO -> 当前信息不完整

边界说明

• 本次未改列表列顺序、风险标签、查看详情入口与项目切换逻辑
• 本次未改接口契约，汇总值优先复用 summary，不足时回退详情明细中的现有总额字段
• 日期格式化工具函数仍保留，延续既有金额/日期工具风格