# 司南报告组件 (DWBG6A2C) - 模块化架构

## 概述

司南报告组件采用模块化架构设计，将完整的司南报告拆分成13个独立的模块，每个模块都可以作为独立的tab显示，具有独立的大标题。

## 数据结构

司南报告的数据结构如下：

```javascript
{
  "apiID": "DWBG6A2C",
  "data": {
    "baseInfo": {},              // 基本信息
    "standLiveInfo": {},         // 身份信息核验
    "riskPoint": {},             // 命中风险标注
    "securityInfo": {},          // 公安重点人员核验
    "antiFraudInfo": {},         // 涉赌涉诈人员核验
    "riskList": {},              // 风险名单
    "applicationStatistics": {}, // 历史借贷行为
    "lendingStatistics": {},     // 近24个月放款情况
    "performanceStatistics": {}, // 履约情况
    "overdueRecord": {},         // 历史逾期记录
    "creditDetail": {},          // 授信详情
    "rentalBehavior": {},        // 租赁行为
    "riskSupervision": {},       // 关联风险监督
    "judiciaRiskInfos": []       // 法院风险信息
  },
  "success": true,
  "timestamp": "2025-01-20 21:19:58"
}
```

## 模块拆分

司南报告被拆分成以下14个独立模块：

| API ID | 模块名称 | 包含数据 | 组件文件 |
|--------|----------|----------|----------|
| `DWBG6A2C_BaseInfo` | 基本信息 | baseInfo | BaseInfoSection.vue |
| `DWBG6A2C_StandLiveInfo` | 身份信息核验 | standLiveInfo | StandLiveInfoSection.vue |
| `DWBG6A2C_RiskPoint` | 命中风险标注 | riskPoint | RiskPointSection.vue |
| `DWBG6A2C_SecurityInfo` | 公安重点人员核验 | securityInfo | SecurityInfoSection.vue |
| `DWBG6A2C_AntiFraudInfo` | 涉赌涉诈人员核验 | antiFraudInfo | AntiFraudInfoSection.vue |
| `DWBG6A2C_RiskList` | 风险名单 | riskList | RiskListSection.vue |
| `DWBG6A2C_ApplicationStatistics` | 历史借贷行为 | applicationStatistics | ApplicationStatisticsSection.vue |
| `DWBG6A2C_LendingStatistics` | 近24个月放款情况 | lendingStatistics | LendingStatisticsSection.vue |
| `DWBG6A2C_PerformanceStatistics` | 履约情况 | performanceStatistics | PerformanceStatisticsSection.vue |
| `DWBG6A2C_OverdueRecord` | 历史逾期记录 | overdueRecord | OverdueRecordSection.vue |
| `DWBG6A2C_CreditDetail` | 授信详情 | creditDetail | CreditDetailSection.vue |
| `DWBG6A2C_RentalBehavior` | 租赁行为 | rentalBehavior | RentalBehaviorSection.vue |
| `DWBG6A2C_RiskSupervision` | 关联风险监督 | riskSupervision | RiskSupervisionSection.vue |
| `DWBG6A2C_CourtRiskInfo` | 法院风险信息 | judiciaRiskInfos | CourtRiskInfoSection.vue |

## 使用方法

### 1. 前端自动拆分

BaseReport.vue 已自动配置支持司南报告的模块化显示：

```javascript
import { splitDWBG6A2CForTabs } from '@/ui/DWBG6A2C/utils/simpleSplitter.js';

// 处理数据拆分（支持DWBG8B4D和DWBG6A2C）
const processedReportData = computed(() => {
    let data = reportData.value;
    
    // 拆分DWBG8B4D数据
    data = splitDWBG8B4DForTabs(data);
    
    // 拆分DWBG6A2C数据
    data = splitDWBG6A2CForTabs(data);
    
    return data;
});
```

### 2. 组件配置

BaseReport.vue 中已配置所有司南报告模块：

```javascript
// 司南报告
DWBG6A2C: {
    name: "司南报告",
    component: defineAsyncComponent(() => import("@/ui/DWBG6A2C/index.vue")),
    remark: '司南报告提供全面的个人信用风险评估，包括身份核验、风险名单、借贷行为、履约情况等多维度分析。'
},
// ... 其他模块配置
```

## 组件结构

```
src/ui/DWBG6A2C/
├── index.vue                              # 原始完整组件（保留）
├── README.md                              # 文档说明
├── components/                            # 子组件目录
│   ├── BaseInfoSection.vue               # 基本信息
│   ├── StandLiveInfoSection.vue          # 身份信息核验
│   ├── RiskPointSection.vue              # 命中风险标注
│   ├── SecurityInfoSection.vue           # 公安重点人员核验
│   ├── AntiFraudInfoSection.vue          # 涉赌涉诈人员核验
│   ├── RiskListSection.vue               # 风险名单
│   ├── ApplicationStatisticsSection.vue  # 历史借贷行为
│   ├── LendingStatisticsSection.vue      # 近24个月放款情况
│   ├── PerformanceStatisticsSection.vue  # 履约情况
│   ├── OverdueRecordSection.vue          # 历史逾期记录
│   ├── CreditDetailSection.vue           # 授信详情
│   ├── RentalBehaviorSection.vue         # 租赁行为
│   ├── RiskSupervisionSection.vue        # 关联风险监督
│   └── CourtRiskInfoSection.vue          # 法院风险信息
└── utils/
    └── simpleSplitter.js                 # 数据拆分工具
```

## 特色功能

### 1. 智能风险评估
- 多维度风险标注
- 智能颜色编码
- 风险等级自动判断

### 2. 数据可视化
- 渐变色彩设计
- 图标化展示
- 响应式布局

### 3. 用户友好
- 清晰的层次结构
- 详细的说明文档
- 直观的风险提示

### 4. 模块化设计
- 独立的模块组件
- 可复用的工具函数
- 灵活的数据拆分

## 工具函数

`utils/simpleSplitter.js` 提供了以下工具函数：

- `splitDWBG6A2CForTabs()` - 数据拆分
- `formatRiskLevel()` - 格式化风险等级
- `formatPhoneStatus()` - 格式化手机号状态
- `formatVerificationResult()` - 格式化身份核验结果
- `formatInTime()` - 格式化在网时长
- `hasRiskData()` - 检查是否有风险数据

## 使用示例

```javascript
// 在页面中使用
<BaseReport 
  :reportData="reportData"
  :reportParams="reportParams"
  reportName="司南报告"
  feature="DWBG6A2C"
  :isEmpty="false"
  :isDone="true"
/>
```

## 注意事项

1. 确保数据格式符合司南报告的标准结构
2. 所有模块都支持数据为空的情况
3. 风险评估基于实际数据动态计算
4. 组件采用 Tailwind CSS 进行样式设计
5. 支持移动端响应式布局

## 更新日志

- v1.0.0: 初始版本，支持完整的司南报告模块化显示
- 包含13个独立模块
- 支持自动数据拆分
- 提供完整的风险评估功能
