report_viewer/src/ui/CDWBG8B4D/index.vue

<template>
  <div class="card shadow-sm rounded-xl overflow-hidden">
    <!-- 报告概览 -->
    <ReportOverview :base-info="data.baseInfo" :check-suggest="data.checkSuggest" :fraud-score="data.fraudScore"
      :credit-score="data.creditScore" :verify-rule="data.verifyRule" :fraud-rule="data.fraudRule" />

    <!-- 要素核查详情 -->
    <ElementVerificationSection :element-verification-detail="data.elementVerificationDetail" />

    <!-- 风险预警 -->
    <RiskWarningSection :risk-warning="data.riskWarning" />

    <!-- 逾期风险综述 -->
    <OverdueRiskSection :overdue-risk-product="data.overdueRiskProduct" />

    <!-- 法院曝光台信息 - 暂时隐藏 -->
    <MultCourtInfoSection 
      :mult-court-info="data.multCourtInfo"
    />

    <!-- 借贷评估 -->
    <LoanEvaluationSection :loan-evaluation-verification-detail="data.loanEvaluationVerificationDetail" />

    <!-- 租赁风险评估 -->
    <LeasingRiskSection :leasing-risk-assessment="data.leasingRiskAssessment" />

    <!-- 关联风险监督 -->
    <RiskSupervisionSection :risk-supervision="data.riskSupervision" />

  </div>
</template>

<script setup>
import { ref, computed, watch } from 'vue'
import { useRiskNotifier } from '@/composables/useRiskNotifier'
import ReportOverview from './components/ReportOverview.vue'
import ElementVerificationSection from './components/ElementVerification.vue'
import RiskWarningSection from './components/RiskWarningSection.vue'
import OverdueRiskSection from './components/OverdueRiskSection.vue'
import MultCourtInfoSection from './components/MultCourtInfoSection.vue'
import LoanEvaluationSection from './components/LoanEvaluationSection.vue'
import LeasingRiskSection from './components/LeasingRiskSection.vue'
import RiskSupervisionSection from './components/RiskSupervisionSection.vue'

const props = defineProps({
  data: {
    type: Object,
    required: true,
  },
  apiId: {
    type: String,
    default: '',
  },
  index: {
    type: Number,
    default: 0,
  },
  notifyRiskStatus: {
    type: Function,
    default: () => { },
  },
})

// 数据验证和默认值处理
const data = computed(() => {
  const defaultData = {
    baseInfo: {},
    checkSuggest: '',
    fraudScore: -1,
    creditScore: -1,
    verifyRule: '',
    fraudRule: '',
    riskWarning: {},
    elementVerificationDetail: {},
    riskSupervision: {},
    overdueRiskProduct: {},
    multCourtInfo: {},
    loanEvaluationVerificationDetail: {},
    leasingRiskAssessment: {},
    reportUrl: '',
    standLiveInfo: {},
    ...props.data
  }
  return defaultData
})

// 计算风险评分（0-100分，分数越高越安全）
// 谛听多维报告是复合报告，需要汇总所有子模块的评分
const riskScore = computed(() => {
  // 谛听多维报告由多个子模块组成，需要汇总所有子模块的评分
  // 由于子模块是动态渲染的，我们通过子模块的 ref 来获取评分

  // 这里返回一个默认值，实际的评分计算由子组件完成
  // 子组件会通过 notifyRiskStatus 通知父组件（BaseReport.vue）
  // BaseReport.vue 会根据子组件的评分和权重计算最终得分
  return 80;
});

// 使用 composable 通知父组件风险评分
useRiskNotifier(props, riskScore);

// 暴露给父组件
defineExpose({
  riskScore
});
</script>

<style lang="scss" scoped>
.card {
  @apply bg-white rounded-lg shadow-sm border border-gray-200 p-4;
}
</style>