更新：更改组件字体大小

src/components/BaseReport.vue

@@ -515,7 +515,7 @@ const featureMap = {
     JRZQ6F2A: {
         name: "借贷申请",
         component: defineAsyncComponent(() => import("@/ui/JRZQ6F2A/index.vue")),
-        remark: '借贷申请提供全面的借贷申请行为分析，包括申请次数、申请总次数（银行+非银）和申请机构总数（银行+非银）等多维度数据。通过不同时间段的统计分析，全面展示申请人的借贷申请行为。'
+        remark: '【非银行类贷款】：主要有持牌网络小贷、持牌小贷、持牌消费金融、持牌融资租赁、持牌汽车金融、其他。\n【持牌网络小贷】：小额贷款公司拥有相关牌照和许可证，可以通过互联网为用户提供贷款服务。贷款服务包括抵押贷款、消费贷款等。\n【持牌小贷机构】：是指经国家金融管理部门批准设立并颁发许可证，具备合法资质，可依法在注册地所在省市开展小额贷款业务的非银行类金融机构。\n【持牌消费金融】：是指经银监会批准，在中华人民共和国境内设立的，不吸收公众存款，以小额、分散为原则，为中国境内居民个人提供以消费为目的的贷款的非银行金融机构。\n【持牌融资租赁】：是指持有金融牌照和许可证进行的融资租赁业务的融资租赁机构。\n【持牌汽车金融机构】：是经过国家金融监督管理总局批准设立的、专门提供汽车金融服务的非银行金融机构。主要职责是为中国境内的汽车购买者及销售者提供金融服务，包括但不限于购车贷款、经销商贷款、汽车融资租赁等。\n【其他】：指除以上分类的其他非银行类贷款机构。'
     },
     FLXGDEA9: {
         name: "本人不良",
@@ -565,6 +565,14 @@ const featureMap = {
         component: defineAsyncComponent(() => import("@/ui/YYSY8B1C/index.vue")),
         remark: '手机在网时长查询用于检测用户手机号码的在网使用时长。在网时长越长，通常表示用户身份越稳定，信用风险越低。需要注意的是，如果手机号码存在携号转网的情况，那么在网时长会从转网的时候重新计算，转网前的在网时长不计入当前在网时长。建议结合手机携号转网查询结果进行综合评估。'
     },
+
+    // 支付表现
+    JRZQ3C9R: {
+        name: "支付表现",
+        component: defineAsyncComponent(() => import("@/ui/JRZQ3C9R/index.vue")),
+        remark: '支付表现是指数基于近两年的查验记录、还款成功与失败表现以及余额不足情况，对用户支付与还款习惯进行量化评分，用于评估其支付稳定性与违约风险。'
+    },
+
 };
 
 const maskValue = computed(() => {
@@ -664,7 +672,7 @@ const featureRiskLevels = {
     'QYGL3F8E': 5,         // 人企关系加强版
     'QCXG7A2B': 5,         // 名下车辆
     'JRZQ09J8': 5,         // 收入评估
-
+    'JRZQ3C9R': 5,         // 支付行为指数
     // 🔵 低风险类 - 权重 3
     'IVYZ5733': 3,         // 婚姻状态
     'IVYZ9A2B': 3,         // 学历信息

src/components/Remark.vue

@@ -1,11 +1,15 @@
 <template>
     <div class=" m-4">
         <div class="flex items-center">
-            <img src="@/assets/images/report/wxts_icon.png" alt="温馨提示" class="tips-icon" />
+            <img src="@/assets/images/report/wxts_icon.png" :alt="title" class="tips-icon" />
-            <span class="tips-title">温馨提示!</span>
+            <span class="tips-title">{{ title }}</span>
         </div>
         <div class="mt-1 ml-4">
-            <van-text-ellipsis rows="2" :content="content" expand-text="展开" collapse-text="收起" />
+            <van-text-ellipsis v-if="!defaultExpanded" :rows="2" :content="content" expand-text="展开"
+                collapse-text="收起" />
+            <div v-else class="tips-content">
+                {{ content }}
+            </div>
         </div>
     </div>
 </template>
@@ -17,6 +21,14 @@ const props = defineProps({
     content: {
         type: String,
         required: true
+    },
+    title: {
+        type: String,
+        default: '温馨提示!'
+    },
+    defaultExpanded: {
+        type: Boolean,
+        default: false
     }
 });
 
@@ -43,7 +55,7 @@ const isExpanded = ref(false);
 }
 
 .tips-content {
-    font-size: 14px;
+    font-size: 16px;
     color: #333;
 }
 
@@ -77,8 +89,7 @@ const isExpanded = ref(false);
 }
 
 :deep(.van-text-ellipsis) {
-    font-size: 12px;
+    font-size: 14px;
     color: #999999;
 }
 </style>
-

src/ui/JRZQ3C9R/components/BasicInfoSection.vue

@@ -0,0 +1,211 @@
+<template>
+    <div class="card rounded-lg border border-gray-200 mb-2">
+        <div class="mt-4">
+            <LTitle title="基础信息与近期行为比例" />
+
+            <!-- 查贷比柱状图 -->
+            <div class="h-64 px-2 mb-4">
+                <v-chart class="chart-container" :option="ratioChartOption" autoresize />
+            </div>
+
+            <div class="px-4 pb-4 space-y-4">
+                <!-- 基础信息 -->
+                <div>
+                    <LTitle title="基础信息" />
+                    <div class="mt-4 border border-gray-200 rounded-lg overflow-hidden">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-2 text-base">
+                                <div class="py-3 px-4 text-left font-semibold border-r border-white whitespace-nowrap">
+                                    指标</div>
+                                <div class="py-3 px-4 text-center font-semibold whitespace-nowrap">数值</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in basicInfoRows" :key="row.label"
+                                :class="['grid grid-cols-2 text-base', idx < basicInfoRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 px-4 font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 px-4 text-center text-[#333333] font-semibold whitespace-nowrap">
+                                    {{ row.value }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 近期查贷比（查验次数 / 借款次数） -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-2 text-base">
+                                <div class="py-3 px-4 text-left font-semibold border-r border-white whitespace-nowrap">
+                                    指标</div>
+                                <div class="py-3 px-4 text-center font-semibold whitespace-nowrap">数值</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in ratioRows" :key="row.label"
+                                :class="['grid grid-cols-2 text-base', idx < ratioRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 px-4 font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 px-4 text-center text-[#333333] font-semibold whitespace-nowrap">
+                                    {{ formatRatio(row.value) }}
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- 基础信息与查贷比解读 -->
+            <Remark :content="basicInfoRemark" title="报告解读" :default-expanded="true" />
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, TooltipComponent } from 'echarts/components'
+import { normalizeValue, getBasicInfoRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, TooltipComponent])
+
+const props = defineProps({
+    data: {
+        type: Object,
+        required: true,
+        default: () => ({})
+    }
+})
+
+const data = computed(() => props.data || {})
+
+const flagText = computed(() => {
+    const v = data.value.flag
+    if (v === 1 || v === '1') return '查得'
+    if (v === 0 || v === '0') return '查无'
+    return '-'
+})
+
+const flagDbText = computed(() => {
+    const v = data.value.flagdb
+    if (v === 1 || v === '1') return '库有'
+    if (v === 0 || v === '0') return '库无'
+    return '-'
+})
+
+// 基础信息数据行
+const basicInfoRows = computed(() => {
+    const v = data.value
+    return [
+        { label: '查得标识', value: flagText.value },
+        { label: '库有标识', value: flagDbText.value },
+        { label: '历史银行卡数', value: normalizeValue(v.ppcm_history_cardnum) },
+        { label: '当前活跃银行卡数', value: normalizeValue(v.ppcm_recent_cardnum) },
+        { label: '历史手机号数', value: normalizeValue(v.ppcm_history_cellnum) },
+        { label: '当前活跃手机号数', value: normalizeValue(v.ppcm_recent_cellnum) }
+    ]
+})
+
+const ratioRows = computed(() => {
+    const v = data.value
+    return [
+        { label: '近1个月查贷比', value: normalizeValue(v.ppcm_m1_qy_rep_ratio) },
+        { label: '近3个月查贷比', value: normalizeValue(v.ppcm_m3_qy_rep_ratio) },
+        { label: '近6个月查贷比', value: normalizeValue(v.ppcm_m6_qy_rep_ratio) },
+        { label: '近1年查贷比', value: normalizeValue(v.ppcm_m12_qy_rep_ratio) }
+    ]
+})
+
+const formatRatio = (v) => {
+    if (!v) return '-'
+    return v.toFixed ? v.toFixed(2) : v
+}
+// 查贷比柱状图配置
+const ratioChartOption = computed(() => {
+    const labels = ratioRows.value.map(r => r.label)
+    const values = ratioRows.value.map(r => r.value || 0)
+
+    return {
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: { type: 'shadow' },
+            formatter(params) {
+                const p = params[0]
+                if (!p) return ''
+                return `${p.name}<br/>查贷比：${formatRatio(p.value)}`
+            }
+        },
+        grid: {
+            left: '6%',
+            right: '6%',
+            top: 20,
+            bottom: 0,
+            containLabel: true
+        },
+        xAxis: {
+            type: 'category',
+            data: labels,
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280'
+            },
+            axisLine: {
+                lineStyle: {
+                    color: '#e5e7eb'
+                }
+            }
+        },
+        yAxis: {
+            type: 'value',
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280'
+            },
+            splitLine: {
+                lineStyle: {
+                    color: '#f3f4f6'
+                }
+            }
+        },
+        series: [
+            {
+                name: '查贷比',
+                type: 'bar',
+                data: values,
+                barWidth: '35%',
+                barMinHeight: 3,
+                itemStyle: {
+                    color: '#2B79EE',
+                    borderRadius: [4, 4, 0, 0]
+                }
+            }
+        ]
+    }
+})
+
+// 基础信息与查贷比解读
+const basicInfoRemark = computed(() => getBasicInfoRemark(data.value))
+</script>
+
+<style scoped>
+.card {
+    background: #ffffff;
+}
+
+.chart-container {
+    width: 100%;
+    height: 100%;
+}
+</style>

src/ui/JRZQ3C9R/components/InsufficientRatioSection.vue

@@ -0,0 +1,114 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="mt-4">
+      <LTitle title="余额不足导致还款失败占比" />
+      <div class="h-64 px-2">
+        <v-chart class="chart-container" :option="chartOption" autoresize />
+      </div>
+    </div>
+    
+    <!-- 余额不足占比解读 -->
+    <Remark :content="insufficientRatioRemark" title="报告解读" :default-expanded="true" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, TooltipComponent } from 'echarts/components'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import { PERIODS, getInsufficientRatioByPeriod, getInsufficientRatioRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, TooltipComponent])
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+const chartOption = computed(() => {
+  const ratio = getInsufficientRatioByPeriod(props.data || {})
+  const labels = PERIODS.map(p => p.label)
+  const values = PERIODS.map(p => (ratio[p.key] || 0) * 100)
+
+  return {
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: { type: 'shadow' },
+      formatter(params) {
+        const p = params[0]
+        return `${p.name}<br/>余额不足失败占比：${p.value.toFixed(2)}%`
+      }
+    },
+    grid: {
+      left: '6%',
+      right: '6%',
+      top: 20,
+      bottom: 0,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#e5e7eb'
+        }
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280',
+        formatter: '{value}%'
+      },
+      splitLine: {
+        lineStyle: {
+          color: '#f3f4f6'
+        }
+      }
+    },
+    series: [
+      {
+        name: '余额不足失败占比',
+        type: 'bar',
+        data: values,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#F97316',
+          borderRadius: [4, 4, 0, 0]
+        }
+      }
+    ]
+  }
+})
+
+// 余额不足占比解读
+const insufficientRatioRemark = computed(() => getInsufficientRatioRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+
+.chart-container {
+  width: 100%;
+  height: 100%;
+}
+</style>
+
+

src/ui/JRZQ3C9R/components/LoanAndOverdueSection.vue

@@ -0,0 +1,329 @@
+<template>
+    <div class="card rounded-lg border border-gray-200 mb-2">
+        <div class="mt-4">
+            <LTitle title="借款与逾期概览" />
+
+            <!-- 借款次数汇总图 -->
+            <div class="h-64 px-2 mb-4">
+                <v-chart class="chart-container" :option="loanChartOption" autoresize />
+            </div>
+
+            <!-- 逾期次数汇总图 -->
+            <div class="h-64 px-2 mb-4">
+                <v-chart class="chart-container" :option="overdueChartOption" autoresize />
+            </div>
+
+            <div class="mb-4 mt-4 space-y-4">
+                <!-- 借款次数 / 机构数 -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-6 text-sm">
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">周期
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">银行
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">消费金融
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">其他机构
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">总次数
+                                </div>
+                                <div class="py-3 text-center font-semibold whitespace-nowrap">机构数</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in loanRows" :key="row.key"
+                                :class="['grid grid-cols-6 text-base', idx < loanRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 text-center font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.bank }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.fin }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.other }}</div>
+                                <div
+                                    class="py-3 text-center text-[#333333] font-semibold border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.total }}</div>
+                                <div class="py-3 text-center text-[#333333] whitespace-nowrap">{{ row.orgTotal }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 借款等级 -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-2 text-base">
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">周期
+                                </div>
+                                <div class="py-3 text-center font-semibold whitespace-nowrap">综合借款等级</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in loanAmtRows" :key="row.key"
+                                :class="['grid grid-cols-2 text-base', idx < loanAmtRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 text-center font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 text-center text-[#333333] font-semibold whitespace-nowrap">{{ row.amt
+                                }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 逾期次数与等级 -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-4 text-base">
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">周期
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">逾期次数
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">
+                                    逾期机构数</div>
+                                <div class="py-3 text-center font-semibold whitespace-nowrap">逾期等级</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in overdueRows" :key="row.key"
+                                :class="['grid grid-cols-4 text-base', idx < overdueRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 text-center font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.num }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.org }}</div>
+                                <div class="py-3 text-center text-[#333333] font-semibold whitespace-nowrap">{{
+                                    row.level }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- 借款与逾期概览解读 -->
+        <Remark :content="loanAndOverdueRemark" title="报告解读" :default-expanded="true" />
+    </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import { PERIODS, normalizeValue, getLoanAndOverdueRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, LegendComponent, TooltipComponent])
+
+const props = defineProps({
+    data: {
+        type: Object,
+        required: true,
+        default: () => ({})
+    }
+})
+
+// 借款次数与机构数
+const loanRows = computed(() => {
+    const v = props.data || {}
+    return PERIODS.map(p => {
+        const prefix = `ppcm_${p.key}`
+        return {
+            key: p.key,
+            label: p.label,
+            bank: normalizeValue(v[`${prefix}_bank_loannum`]),
+            fin: normalizeValue(v[`${prefix}_nbank_fin_loannum`]),
+            other: normalizeValue(v[`${prefix}_nbank_other_loannum`]),
+            total: normalizeValue(v[`${prefix}_loannum`]),
+            orgTotal: normalizeValue(v[`${prefix}_loanorg`])
+        }
+    })
+})
+
+// 借款等级 ppcm_{period}_loanamt
+const loanAmtRows = computed(() => {
+    const v = props.data || {}
+    return PERIODS.map(p => {
+        const prefix = `ppcm_${p.key}`
+        return {
+            key: p.key,
+            label: p.label,
+            amt: normalizeValue(v[`${prefix}_loanamt`])
+        }
+    })
+})
+
+// 逾期次数 / 机构数 / 等级
+const overdueRows = computed(() => {
+    const v = props.data || {}
+    const periodKeys = ['d7', 'm1', 'm3', 'm6', 'm12', 'm24']
+    const labelMap = {
+        d7: '近7天',
+        m1: '近1个月',
+        m3: '近3个月',
+        m6: '近6个月',
+        m12: '近1年',
+        m24: '近2年'
+    }
+    return periodKeys.map(key => {
+        const prefix = `ppcm_${key}`
+        return {
+            key,
+            label: labelMap[key],
+            num: normalizeValue(v[`${prefix}_overnum`]),
+            org: normalizeValue(v[`${prefix}_overorg`]),
+            level: normalizeValue(v[`${prefix}_overamt`])
+        }
+    })
+})
+
+// 借款次数汇总柱状图（总借款次数）
+const loanChartOption = computed(() => {
+    const labels = PERIODS.map(p => p.label)
+    const totals = loanRows.value.map(r => r.total)
+
+    return {
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: { type: 'shadow' }
+        },
+        grid: {
+            left: '3%',
+            right: '4%',
+            top: 20,
+            bottom: 0,
+            containLabel: true
+        },
+        xAxis: {
+            type: 'category',
+            data: labels,
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280'
+            },
+            axisLine: {
+                lineStyle: {
+                    color: '#e5e7eb'
+                }
+            }
+        },
+        yAxis: {
+            type: 'value',
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280',
+                formatter: '{value} 次'
+            },
+            splitLine: {
+                lineStyle: {
+                    color: '#f3f4f6'
+                }
+            }
+        },
+        series: [
+            {
+                name: '总借款次数',
+                type: 'bar',
+                data: totals,
+                barWidth: '35%',
+                barMinHeight: 3,
+                itemStyle: {
+                    color: '#60A5FA',
+                    borderRadius: [4, 4, 0, 0]
+                }
+            }
+        ]
+    }
+})
+
+// 逾期次数汇总柱状图
+const overdueChartOption = computed(() => {
+    const labels = overdueRows.value.map(r => r.label)
+    const nums = overdueRows.value.map(r => r.num)
+
+    return {
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: { type: 'shadow' }
+        },
+        grid: {
+            left: '3%',
+            right: '4%',
+            top: 20,
+            bottom: 0,
+            containLabel: true
+        },
+        xAxis: {
+            type: 'category',
+            data: labels,
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280'
+            },
+            axisLine: {
+                lineStyle: {
+                    color: '#e5e7eb'
+                }
+            }
+        },
+        yAxis: {
+            type: 'value',
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280',
+                formatter: '{value} 次'
+            },
+            splitLine: {
+                lineStyle: {
+                    color: '#f3f4f6'
+                }
+            }
+        },
+        series: [
+            {
+                name: '逾期次数',
+                type: 'bar',
+                data: nums,
+                barWidth: '35%',
+                barMinHeight: 3,
+                itemStyle: {
+                    color: '#F97316',
+                    borderRadius: [4, 4, 0, 0]
+                }
+            }
+        ]
+    }
+})
+
+// 借款与逾期概览解读
+const loanAndOverdueRemark = computed(() => getLoanAndOverdueRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+    background: #ffffff;
+}
+
+.chart-container {
+    width: 100%;
+    height: 100%;
+}
+</style>

src/ui/JRZQ3C9R/components/QueryOverviewSection.vue

@@ -0,0 +1,259 @@
+<template>
+    <div class="card rounded-lg border border-gray-200 mb-2">
+        <div class="mt-4">
+            <LTitle title="查验行为概览（次数 / 机构数 / 天数）" />
+
+            <!-- 查验次数图表 -->
+            <div class="h-64 px-2 mb-4">
+                <v-chart class="chart-container" :option="countChartOption" autoresize />
+            </div>
+
+            <div class="mb-4 mt-4 space-y-4">
+                <!-- 查验次数 -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-5 text-base">
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">周期
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">银行
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">消费金融
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">其他机构
+                                </div>
+                                <div class="py-3 text-center font-semibold whitespace-nowrap">总次数</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in queryCountRows" :key="row.key"
+                                :class="['grid grid-cols-5 text-base', idx < queryCountRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 text-center font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.bank }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.fin }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.other }}</div>
+                                <div class="py-3 text-center text-[#333333] font-semibold whitespace-nowrap">{{
+                                    row.total }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 查验机构数 -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-5 text-base">
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">周期
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">银行
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">消费金融
+                                </div>
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">其他机构
+                                </div>
+                                <div class="py-3 text-center font-semibold whitespace-nowrap">总机构数</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in queryOrgRows" :key="row.key"
+                                :class="['grid grid-cols-5 text-base', idx < queryOrgRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 text-center font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.bank }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.fin }}</div>
+                                <div class="py-3 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.other }}</div>
+                                <div class="py-3 text-center text-[#333333] font-semibold whitespace-nowrap">{{
+                                    row.total }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 查验天数 -->
+                <div>
+                    <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+                        <!-- 表头 -->
+                        <div class="bg-[#5d7eeb] text-white">
+                            <div class="grid grid-cols-2 text-base">
+                                <div class="py-3 text-center font-semibold border-r border-white whitespace-nowrap">周期
+                                </div>
+                                <div class="py-3 text-center font-semibold whitespace-nowrap">查验天数</div>
+                            </div>
+                        </div>
+                        <!-- 数据行 -->
+                        <div class="bg-white">
+                            <div v-for="(row, idx) in queryDayRows" :key="row.key"
+                                :class="['grid grid-cols-2 text-base', idx < queryDayRows.length - 1 ? 'border-b border-gray-200' : '']">
+                                <div
+                                    class="py-3 text-center font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">
+                                    {{ row.label }}</div>
+                                <div class="py-3 text-center text-[#333333] font-semibold whitespace-nowrap">{{ row.days
+                                    }}</div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        
+        <!-- 查验行为概览解读 -->
+        <Remark :content="queryOverviewRemark" title="报告解读" :default-expanded="true" />
+    </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import { PERIODS, normalizeValue, getQueryOverviewRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, LegendComponent, TooltipComponent])
+
+const props = defineProps({
+    data: {
+        type: Object,
+        required: true,
+        default: () => ({})
+    }
+})
+
+// 查验次数
+const queryCountRows = computed(() => {
+    const v = props.data || {}
+    return PERIODS.map(p => {
+        const prefix = `ppcm_${p.key}`
+        return {
+            key: p.key,
+            label: p.label,
+            bank: normalizeValue(v[`${prefix}_bank_qynum`]),
+            fin: normalizeValue(v[`${prefix}_nbank_fin_qynum`]),
+            other: normalizeValue(v[`${prefix}_nbank_other_qynum`]),
+            total: normalizeValue(v[`${prefix}_qynum`])
+        }
+    })
+})
+
+// 查验次数汇总柱状图（总次数）
+const countChartOption = computed(() => {
+    const labels = PERIODS.map(p => p.label)
+    const totals = queryCountRows.value.map(r => r.total)
+
+    return {
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: { type: 'shadow' }
+        },
+        grid: {
+            left: '3%',
+            right: '4%',
+            top: 20,
+            bottom: 0,
+            containLabel: true
+        },
+        xAxis: {
+            type: 'category',
+            data: labels,
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280'
+            },
+            axisLine: {
+                lineStyle: {
+                    color: '#e5e7eb'
+                }
+            }
+        },
+        yAxis: {
+            type: 'value',
+            axisLabel: {
+                fontSize: 16,
+                color: '#6b7280',
+                formatter: '{value} 次'
+            },
+            splitLine: {
+                lineStyle: {
+                    color: '#f3f4f6'
+                }
+            }
+        },
+        series: [
+            {
+                name: '总查验次数',
+                type: 'bar',
+                data: totals,
+                barWidth: '35%',
+                barMinHeight: 3,
+                itemStyle: {
+                    color: '#2B79EE',
+                    borderRadius: [4, 4, 0, 0]
+                }
+            }
+        ]
+    }
+})
+
+// 查验机构数
+const queryOrgRows = computed(() => {
+    const v = props.data || {}
+    return PERIODS.map(p => {
+        const prefix = `ppcm_${p.key}`
+        return {
+            key: p.key,
+            label: p.label,
+            bank: normalizeValue(v[`${prefix}_bank_qyorg`]),
+            fin: normalizeValue(v[`${prefix}_nbank_fin_qyorg`]),
+            other: normalizeValue(v[`${prefix}_nbank_other_qyorg`]),
+            total: normalizeValue(v[`${prefix}_qyorg`])
+        }
+    })
+})
+
+// 查验天数
+const queryDayRows = computed(() => {
+    const v = props.data || {}
+    const dayKeys = ['m1', 'm3', 'm6', 'm12', 'm24']
+    const labelMap = {
+        m1: '近1个月',
+        m3: '近3个月',
+        m6: '近6个月',
+        m12: '近1年',
+        m24: '近2年'
+    }
+    return dayKeys.map(key => {
+        const prefix = `ppcm_${key}`
+        return {
+            key,
+            label: labelMap[key],
+            days: normalizeValue(v[`${prefix}_qyday`])
+        }
+    })
+})
+
+// 查验行为概览解读
+const queryOverviewRemark = computed(() => getQueryOverviewRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+    background: #ffffff;
+}
+</style>

src/ui/JRZQ3C9R/components/QueryTrendSection.vue

@@ -0,0 +1,141 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="mt-4">
+      <LTitle title="查验次数时间分布" />
+      <div class="h-64 px-2">
+        <v-chart class="chart-container" :option="chartOption" autoresize />
+      </div>
+    </div>
+    
+    <!-- 查验次数解读 -->
+    <Remark :content="queryTrendRemark" title="报告解读" :default-expanded="true" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import { PERIODS, getQueryCountsByPeriod, getQueryTrendRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, LegendComponent, TooltipComponent])
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+const chartOption = computed(() => {
+  const counts = getQueryCountsByPeriod(props.data || {})
+  const labels = PERIODS.map(p => p.label)
+
+  const bankData = PERIODS.map(p => counts[p.key]?.bank || 0)
+  const finData = PERIODS.map(p => counts[p.key]?.nbankFin || 0)
+  const otherData = PERIODS.map(p => counts[p.key]?.nbankOther || 0)
+
+  return {
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: { type: 'shadow' }
+    },
+    legend: {
+      top: 0,
+      icon: 'circle',
+      textStyle: {
+        fontSize: 16,
+        color: '#4b5563'
+      }
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      top: '30%',
+      bottom: 0,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#e5e7eb'
+        }
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280',
+        formatter: '{value} 次'
+      },
+      splitLine: {
+        lineStyle: {
+          color: '#f3f4f6'
+        }
+      }
+    },
+    series: [
+      {
+        name: '银行查验次数',
+        type: 'bar',
+        data: bankData,
+        barWidth: '25%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#2B79EE',
+          borderRadius: [4, 4, 0, 0]
+        }
+      },
+      {
+        name: '消费金融查验次数',
+        type: 'bar',
+        data: finData,
+        barWidth: '25%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#60A5FA',
+          borderRadius: [4, 4, 0, 0]
+        }
+      },
+      {
+        name: '其他机构查验次数',
+        type: 'bar',
+        data: otherData,
+        barWidth: '25%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#A855F7',
+          borderRadius: [4, 4, 0, 0]
+        }
+      }
+    ]
+  }
+})
+
+// 查验次数解读
+const queryTrendRemark = computed(() => getQueryTrendRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+
+.chart-container {
+  width: 100%;
+  height: 100%;
+}
+</style>

src/ui/JRZQ3C9R/components/RepayFailTrendSection.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="mt-4">
+      <LTitle title="还款失败次数趋势" />
+      <div class="h-64 px-2">
+        <v-chart class="chart-container" :option="chartOption" autoresize />
+      </div>
+    </div>
+    
+    <!-- 还款失败次数解读 -->
+    <Remark :content="repayFailRemark" title="报告解读" :default-expanded="true" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, TooltipComponent } from 'echarts/components'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import { PERIODS, getRepayCountsByPeriod, getRepayFailRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, TooltipComponent])
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+const chartOption = computed(() => {
+  const counts = getRepayCountsByPeriod(props.data || {})
+  const labels = PERIODS.map(p => p.label)
+
+  const failData = PERIODS.map(p => counts[p.key]?.fail || 0)
+
+  return {
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: { type: 'shadow' }
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      top: 24,
+      bottom: 0,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#e5e7eb'
+        }
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280',
+        formatter: '{value} 次'
+      },
+      splitLine: {
+        lineStyle: {
+          color: '#f3f4f6'
+        }
+      }
+    },
+    series: [
+      {
+        name: '还款失败次数',
+        type: 'bar',
+        data: failData,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#F97316',
+          borderRadius: [4, 4, 0, 0]
+        }
+      }
+    ]
+  }
+})
+
+// 还款失败次数解读
+const repayFailRemark = computed(() => getRepayFailRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+
+.chart-container {
+  width: 100%;
+  height: 100%;
+}
+</style>
+
+

src/ui/JRZQ3C9R/components/RepayOrgAndLevelSection.vue

@@ -0,0 +1,241 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="mt-4">
+      <LTitle title="还款机构数与等级概览" />
+
+      <!-- 还款成功 / 失败机构数对比图 -->
+      <div class="h-64 px-2 mb-4">
+        <v-chart class="chart-container" :option="orgChartOption" autoresize />
+      </div>
+
+      <div class="mb-4 mt-4 space-y-4">
+        <!-- 还款成功机构数 -->
+        <div>
+          <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+            <!-- 表头 -->
+            <div class="bg-[#5d7eeb] text-white">
+              <div class="grid grid-cols-2 text-base">
+                <div class="py-3 px-4 text-left font-semibold border-r border-white whitespace-nowrap">周期</div>
+                <div class="py-3 px-4 text-center font-semibold whitespace-nowrap">机构数</div>
+              </div>
+            </div>
+            <!-- 数据行 -->
+            <div class="bg-white">
+              <div v-for="(row, idx) in successOrgRows" :key="row.key"
+                :class="['grid grid-cols-2 text-base', idx < successOrgRows.length - 1 ? 'border-b border-gray-200' : '']">
+                <div class="py-3 px-4 font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">{{ row.label
+                }}</div>
+                <div class="py-3 px-4 text-center text-[#333333] font-semibold whitespace-nowrap">{{ row.value }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 还款失败机构数 -->
+        <div>
+          <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+            <!-- 表头 -->
+            <div class="bg-[#5d7eeb] text-white">
+              <div class="grid grid-cols-2 text-base">
+                <div class="py-3 px-4 text-left font-semibold border-r border-white whitespace-nowrap">周期</div>
+                <div class="py-3 px-4 text-center font-semibold whitespace-nowrap">机构数</div>
+              </div>
+            </div>
+            <!-- 数据行 -->
+            <div class="bg-white">
+              <div v-for="(row, idx) in failOrgRows" :key="row.key"
+                :class="['grid grid-cols-2 text-base', idx < failOrgRows.length - 1 ? 'border-b border-gray-200' : '']">
+                <div class="py-3 px-4 font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">{{ row.label
+                }}</div>
+                <div class="py-3 px-4 text-center text-[#333333] font-semibold whitespace-nowrap">{{ row.value }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 还款成功 / 失败等级（综合） -->
+        <div>
+          <div class="mb-4 border border-gray-200 rounded-lg overflow-hidden mx-4">
+            <!-- 表头 -->
+            <div class="bg-[#5d7eeb] text-white">
+              <div class="grid grid-cols-3 text-base">
+                <div class="py-3 px-4 text-left font-semibold border-r border-white whitespace-nowrap">周期</div>
+                <div class="py-3 px-4 text-center font-semibold border-r border-white whitespace-nowrap">成功等级</div>
+                <div class="py-3 px-4 text-center font-semibold whitespace-nowrap">失败等级</div>
+              </div>
+            </div>
+            <!-- 数据行 -->
+            <div class="bg-white">
+              <div v-for="(row, idx) in levelRows" :key="row.key"
+                :class="['grid grid-cols-3 text-base', idx < levelRows.length - 1 ? 'border-b border-gray-200' : '']">
+                <div class="py-3 px-4 font-medium text-gray-800 border-r border-gray-200 whitespace-nowrap">{{ row.label
+                }}</div>
+                <div class="py-3 px-4 text-center text-[#333333] border-r border-gray-200 whitespace-nowrap">{{ row.succ
+                }}</div>
+                <div class="py-3 px-4 text-center text-[#333333] font-semibold whitespace-nowrap">{{ row.fail }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      
+      <!-- 还款机构数与等级解读 -->
+      <Remark :content="repayOrgAndLevelRemark" title="报告解读" :default-expanded="true" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import { PERIODS, normalizeValue, getRepayOrgAndLevelRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, LegendComponent, TooltipComponent])
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+// 还款成功机构数 ppcm_{period}_succ_reporg
+const successOrgRows = computed(() => {
+  const v = props.data || {}
+  return PERIODS.map(p => {
+    const prefix = `ppcm_${p.key}`
+    return {
+      key: p.key,
+      label: p.label,
+      value: normalizeValue(v[`${prefix}_succ_reporg`])
+    }
+  })
+})
+
+// 还款失败机构数 ppcm_{period}_fail_reporg
+const failOrgRows = computed(() => {
+  const v = props.data || {}
+  return PERIODS.map(p => {
+    const prefix = `ppcm_${p.key}`
+    return {
+      key: p.key,
+      label: p.label,
+      value: normalizeValue(v[`${prefix}_fail_reporg`])
+    }
+  })
+})
+
+// 还款成功 / 失败等级 ppcm_{period}_succ_repamt / fail_repamt
+const levelRows = computed(() => {
+  const v = props.data || {}
+  return PERIODS.map(p => {
+    const prefix = `ppcm_${p.key}`
+    return {
+      key: p.key,
+      label: p.label,
+      succ: normalizeValue(v[`${prefix}_succ_repamt`]),
+      fail: normalizeValue(v[`${prefix}_fail_repamt`])
+    }
+  })
+})
+
+// 成功 / 失败机构数对比图
+const orgChartOption = computed(() => {
+  const labels = PERIODS.map(p => p.label)
+  const succ = successOrgRows.value.map(r => r.value)
+  const fail = failOrgRows.value.map(r => r.value)
+
+  return {
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: { type: 'shadow' }
+    },
+    legend: {
+      top: 0,
+      icon: 'circle',
+      textStyle: {
+        fontSize: 16,
+        color: '#4b5563'
+      }
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      top: '15%',
+      bottom: 0,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#e5e7eb'
+        }
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280',
+        formatter: '{value} 家'
+      },
+      splitLine: {
+        lineStyle: {
+          color: '#f3f4f6'
+        }
+      }
+    },
+    series: [
+      {
+        name: '还款成功机构数',
+        type: 'bar',
+        data: succ,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#34D399',
+          borderRadius: [4, 4, 0, 0]
+        }
+      },
+      {
+        name: '还款失败机构数',
+        type: 'bar',
+        data: fail,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#F97316',
+          borderRadius: [4, 4, 0, 0]
+        }
+      }
+    ]
+  }
+})
+
+// 还款机构数与等级解读
+const repayOrgAndLevelRemark = computed(() => getRepayOrgAndLevelRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+
+.chart-container {
+  width: 100%;
+  height: 100%;
+}
+</style>

src/ui/JRZQ3C9R/components/RepaySuccessTrendSection.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="mt-4">
+      <LTitle title="还款成功次数趋势" />
+      <div class="h-64 px-2">
+        <v-chart class="chart-container" :option="chartOption" autoresize />
+      </div>
+    </div>
+    
+    <!-- 还款成功次数解读 -->
+    <Remark :content="repaySuccessRemark" title="报告解读" :default-expanded="true" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, TooltipComponent } from 'echarts/components'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import { PERIODS, getRepayCountsByPeriod, getRepaySuccessRemark } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, TooltipComponent])
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+const chartOption = computed(() => {
+  const counts = getRepayCountsByPeriod(props.data || {})
+  const labels = PERIODS.map(p => p.label)
+
+  const successData = PERIODS.map(p => counts[p.key]?.success || 0)
+
+  return {
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: { type: 'shadow' }
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      top: 24,
+      bottom: 0,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#e5e7eb'
+        }
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280',
+        formatter: '{value} 次'
+      },
+      splitLine: {
+        lineStyle: {
+          color: '#f3f4f6'
+        }
+      }
+    },
+    series: [
+      {
+        name: '还款成功次数',
+        type: 'bar',
+        data: successData,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#34D399',
+          borderRadius: [4, 4, 0, 0]
+        }
+      }
+    ]
+  }
+})
+
+// 还款成功次数解读
+const repaySuccessRemark = computed(() => getRepaySuccessRemark(props.data || {}))
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+
+.chart-container {
+  width: 100%;
+  height: 100%;
+}
+</style>
+
+

src/ui/JRZQ3C9R/components/RepayTrendSection.vue

@@ -0,0 +1,124 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="mt-4">
+      <LTitle title="还款成功 / 失败次数趋势" />
+      <div class="h-64 px-2">
+        <v-chart class="chart-container" :option="chartOption" autoresize />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import VChart from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { BarChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import LTitle from '@/components/LTitle.vue'
+import { PERIODS, getRepayCountsByPeriod } from '../utils/dataParser'
+
+use([CanvasRenderer, BarChart, GridComponent, LegendComponent, TooltipComponent])
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+const chartOption = computed(() => {
+  const counts = getRepayCountsByPeriod(props.data || {})
+  const labels = PERIODS.map(p => p.label)
+
+  const successData = PERIODS.map(p => counts[p.key]?.success || 0)
+  const failData = PERIODS.map(p => counts[p.key]?.fail || 0)
+
+  return {
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: { type: 'shadow' }
+    },
+    legend: {
+      top: 0,
+      icon: 'circle',
+      textStyle: {
+        fontSize: 16,
+        color: '#4b5563'
+      }
+    },
+    grid: {
+      left: '3%',
+      right: '4%',
+      top: 24,
+      bottom: 0,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      data: labels,
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280'
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#e5e7eb'
+        }
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        fontSize: 16,
+        color: '#6b7280',
+        formatter: '{value} 次'
+      },
+      splitLine: {
+        lineStyle: {
+          color: '#f3f4f6'
+        }
+      }
+    },
+    series: [
+      {
+        name: '还款成功次数',
+        type: 'bar',
+        data: successData,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#34D399',
+          borderRadius: [4, 4, 0, 0]
+        }
+      },
+      {
+        name: '还款失败次数',
+        type: 'bar',
+        data: failData,
+        barWidth: '30%',
+        barMinHeight: 3,
+        itemStyle: {
+          color: '#F97316',
+          borderRadius: [4, 4, 0, 0]
+        }
+      }
+    ]
+  }
+})
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+
+.chart-container {
+  width: 100%;
+  height: 100%;
+}
+</style>
+
+

src/ui/JRZQ3C9R/components/ScoreSection.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 mb-2">
+    <div class="flex items-center justify-between px-4 pt-4 pb-2">
+      <div>
+        <div class="text-base text-gray-500">支付行为评分</div>
+        <div class="flex items-baseline gap-2 mt-1">
+          <span class="text-3xl font-bold text-[#111827]">
+            {{ scoreDisplay }}
+          </span>
+          <span class="text-base text-gray-400">分</span>
+          <span
+            class="inline-flex items-center px-2 py-0.5 rounded-full text-base"
+            :class="levelClass"
+          >
+            {{ level }}
+          </span>
+        </div>
+      </div>
+      <div class="text-right text-base text-gray-500 max-w-[11rem] leading-relaxed">
+        分数基于近两年查验及还款行为综合评估，分数越高代表支付行为越稳定、违约风险越低。
+      </div>
+    </div>
+    <div class="px-4 pb-4 text-base text-gray-500">
+      最近一次查验距今天数：
+      <span class="font-medium text-[#111827]">{{ latestQueryText }}</span>
+    </div>
+    
+    <!-- 评分解读 -->
+    <Remark :content="scoreRemark" title="评分解读" :default-expanded="true" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import Remark from '@/components/Remark.vue'
+import { getBehavLevel, mapScoreTo100, getScoreRemark } from '../utils/dataParser'
+
+const props = defineProps({
+  score: {
+    type: Number,
+    default: 0
+  },
+  latestQueryText: {
+    type: String,
+    default: '暂无查验记录'
+  }
+})
+
+const scoreDisplay = computed(() => (props.score > 0 ? props.score : '--'))
+
+const level = computed(() => getBehavLevel(props.score))
+
+// 评分解读
+const scoreRemark = computed(() => getScoreRemark(props.score, level.value))
+
+// 按等级给不同颜色
+const levelClass = computed(() => {
+  const mapped = mapScoreTo100(props.score)
+  if (mapped >= 85) {
+    return 'bg-emerald-50 text-emerald-600'
+  }
+  if (mapped >= 70) {
+    return 'bg-blue-50 text-blue-600'
+  }
+  if (mapped >= 55) {
+    return 'bg-amber-50 text-amber-600'
+  }
+  return 'bg-red-50 text-red-600'
+})
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+</style>
+
+

src/ui/JRZQ3C9R/index.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="flex flex-col gap-4">
+    <!-- 评分卡片 -->
+    <ScoreSection
+      :score="behavScore"
+      :latest-query-text="latestQueryText"
+    />
+
+    <!-- 查验次数时间分布 -->
+    <QueryTrendSection :data="ppcmData" />
+
+    <!-- 查验次数 / 机构数 / 天数表格概览 -->
+    <QueryOverviewSection :data="ppcmData" />
+
+    <!-- 还款成功次数趋势 -->
+    <RepaySuccessTrendSection :data="ppcmData" />
+
+    <!-- 还款失败次数趋势 -->
+    <RepayFailTrendSection :data="ppcmData" />
+
+    <!-- 余额不足导致还款失败占比 -->
+    <InsufficientRatioSection :data="ppcmData" />
+
+    <!-- 还款机构数与等级 -->
+    <RepayOrgAndLevelSection :data="ppcmData" />
+
+    <!-- 借款与逾期概览 -->
+    <LoanAndOverdueSection :data="ppcmData" />
+
+    <!-- 基础信息与查贷比 -->
+    <BasicInfoSection :data="ppcmData" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { useRiskNotifier } from '@/composables/useRiskNotifier'
+import {
+  extractPpcmData,
+  getBehavScore,
+  getLatestQueryBucket,
+  mapScoreTo100
+} from './utils/dataParser'
+import ScoreSection from './components/ScoreSection.vue'
+import QueryTrendSection from './components/QueryTrendSection.vue'
+import QueryOverviewSection from './components/QueryOverviewSection.vue'
+import RepaySuccessTrendSection from './components/RepaySuccessTrendSection.vue'
+import RepayFailTrendSection from './components/RepayFailTrendSection.vue'
+import InsufficientRatioSection from './components/InsufficientRatioSection.vue'
+import RepayOrgAndLevelSection from './components/RepayOrgAndLevelSection.vue'
+import LoanAndOverdueSection from './components/LoanAndOverdueSection.vue'
+import BasicInfoSection from './components/BasicInfoSection.vue'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  },
+  apiId: {
+    type: String,
+    default: ''
+  },
+  index: {
+    type: Number,
+    default: 0
+  },
+  notifyRiskStatus: {
+    type: Function,
+    default: () => {}
+  }
+})
+
+// 原始数据：可能是 { code,data } 或 { data:{code,data} }
+const rawData = computed(() => props.data?.data || props.data || {})
+
+// 提取 ppcm 指标对象
+const ppcmData = computed(() => extractPpcmData(rawData.value))
+
+// 原始行为评分（300-900）
+const behavScore = computed(() => getBehavScore(ppcmData.value))
+
+// 最近一次查验距今天数说明
+const latestQueryText = computed(() => getLatestQueryBucket(ppcmData.value))
+
+// 将评分映射到 0-100 分，用于统一风险分
+const riskScore = computed(() => {
+  return mapScoreTo100(behavScore.value)
+})
+
+// 通知父组件风险评分
+useRiskNotifier(props, riskScore)
+
+defineExpose({
+  riskScore
+})
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+</style>
+
+

src/ui/JRZQ3C9R/utils/dataParser.js

@@ -0,0 +1,430 @@
+/**
+ * 支付行为指数（JRZQ3C9R）数据解析工具
+ */
+
+/**
+ * 将 -1 / 空 / null 统一视为 0，其他数值转为 Number
+ */
+export function normalizeValue(value) {
+    if (value === undefined || value === null || value === "" || value === -1) {
+        return 0;
+    }
+    const num = Number(value);
+    return Number.isNaN(num) ? 0 : num;
+}
+
+/**
+ * 从原始 data 中提取真正的指标对象
+ * 兼容多种包裹结构：
+ * - { code, data: {...} }
+ * - { data: { code, data: {...} } }
+ */
+export function extractPpcmData(raw) {
+    if (!raw) return {};
+
+    // example.json 结构：data.data.data
+    if (raw.data && raw.data.data) {
+        return raw.data.data || {};
+    }
+
+    // 已经是 { code, data } 这一层
+    if (raw.data && !raw.code) {
+        return raw.data || {};
+    }
+
+    return raw || {};
+}
+
+/**
+ * 获取支付行为评分（原始 300-900 分）
+ */
+export function getBehavScore(ppcm) {
+    const score = normalizeValue(ppcm.ppcm_behav_score);
+    return score;
+}
+
+/**
+ * 将 300-900 分映射到 0-100 分（用于统一风险评分体系）
+ */
+export function mapScoreTo100(score) {
+    if (!score || score <= 0) {
+        return 100;
+    }
+    // 限制在 [300,900]
+    const clamped = Math.min(900, Math.max(300, score));
+    // 300 -> 0, 900 -> 100
+    const mapped = ((clamped - 300) / 600) * 100;
+    return Math.round(mapped);
+}
+
+/**
+ * 支付行为评分等级标签
+ */
+export function getBehavLevel(score) {
+    if (!score || score <= 0) return "暂无评分";
+    if (score >= 800) return "优秀";
+    if (score >= 750) return "良好";
+    if (score >= 700) return "中等";
+    if (score >= 650) return "一般";
+    return "偏低";
+}
+
+/**
+ * 通用时间段
+ */
+export const PERIODS = [
+    { key: "d7", label: "近7天" },
+    { key: "m1", label: "近1个月" },
+    { key: "m3", label: "近3个月" },
+    { key: "m6", label: "近6个月" },
+    { key: "m12", label: "近1年" },
+    { key: "m24", label: "近2年" },
+];
+
+/**
+ * 获取查验次数统计（按时间段）
+ * ppcm_{period}_bank_qynum / _nbank_fin_qynum / _nbank_other_qynum / _qynum
+ */
+export function getQueryCountsByPeriod(ppcm) {
+    const result = {};
+
+    PERIODS.forEach((p) => {
+        const prefix = `ppcm_${p.key}`;
+        result[p.key] = {
+            bank: normalizeValue(ppcm[`${prefix}_bank_qynum`]),
+            nbankFin: normalizeValue(ppcm[`${prefix}_nbank_fin_qynum`]),
+            nbankOther: normalizeValue(ppcm[`${prefix}_nbank_other_qynum`]),
+            total: normalizeValue(ppcm[`${prefix}_qynum`]),
+        };
+    });
+
+    return result;
+}
+
+/**
+ * 获取还款成功 / 失败次数统计（按时间段）
+ * success：ppcm_{period}_succ_repnum
+ * fail：ppcm_{period}_fail_repnum
+ */
+export function getRepayCountsByPeriod(ppcm) {
+    const result = {};
+
+    PERIODS.forEach((p) => {
+        const prefix = `ppcm_${p.key}`;
+        result[p.key] = {
+            success: normalizeValue(ppcm[`${prefix}_succ_repnum`]),
+            fail: normalizeValue(ppcm[`${prefix}_fail_repnum`]),
+        };
+    });
+
+    return result;
+}
+
+/**
+ * 获取余额不足失败占比（按时间段）
+ * ppcm_{period}_fail_neh_repnum_ratio
+ */
+export function getInsufficientRatioByPeriod(ppcm) {
+    const result = {};
+
+    PERIODS.forEach((p) => {
+        const prefix = `ppcm_${p.key}`;
+        result[p.key] = normalizeValue(ppcm[`${prefix}_fail_neh_repnum_ratio`]);
+    });
+
+    return result;
+}
+
+/**
+ * 解析最近一次查验距今天数区间编码
+ * ppcm_latest_qytoday: 1-10 档位
+ */
+export function getLatestQueryBucket(ppcm) {
+    const code = normalizeValue(ppcm.ppcm_latest_qytoday);
+    if (!code) return "暂无查验记录";
+
+    const mapping = {
+        1: "0-7天",
+        2: "7-15天",
+        3: "15-30天",
+        4: "30-60天",
+        5: "60-90天",
+        6: "90-120天",
+        7: "120-150天",
+        8: "150-180天",
+        9: "180-360天",
+        10: "360天以上",
+    };
+
+    return mapping[code] || "未知区间";
+}
+
+/**
+ * 生成各 card 的解读文本
+ */
+
+/**
+ * 支付行为评分解读（数据解读 + 意思解读）
+ */
+export function getScoreRemark(score, level) {
+    if (!score || score <= 0) {
+        return "暂无支付行为评分数据。\n\n【数据解读】评分基于近两年查验及还款行为综合评估，分数越高代表支付行为越稳定、违约风险越低。\n\n【意思解读】支付行为评分是机构评估您还款能力和信用状况的重要指标。评分越高，说明您的还款履约记录越好，机构对您的信任度越高，未来申请贷款或信用卡时更容易获得批准和更优惠的利率。";
+    }
+    
+    let dataRemark = `【数据解读】您的支付行为评分为 ${score} 分，等级为"${level}"。`;
+    let meaningRemark = "";
+    
+    if (score >= 800) {
+        dataRemark += "您的支付行为表现优秀，还款履约能力强，违约风险极低。";
+        meaningRemark = "【意思解读】优秀评分表明您有非常稳定的还款记录和良好的资金管理能力。这意味着机构认为您是低风险客户，在申请贷款、信用卡等金融产品时更容易获得批准，且可能享受更优惠的利率和更高的额度。继续保持这种良好的支付习惯，有助于维护和提升您的信用价值。";
+    } else if (score >= 750) {
+        dataRemark += "您的支付行为表现良好，还款履约能力较强，违约风险较低。";
+        meaningRemark = "【意思解读】良好评分说明您的还款记录稳定，机构对您的信任度较高。这有助于您在申请金融产品时获得较好的审批结果。建议继续保持良好的支付习惯，避免逾期，可以进一步提升评分等级。";
+    } else if (score >= 700) {
+        dataRemark += "您的支付行为表现中等，还款履约能力一般，违约风险适中。";
+        meaningRemark = "【意思解读】中等评分表示您的还款记录存在一定波动，机构可能会对您的申请进行更严格的审核。建议注意按时还款，减少还款失败的情况，提高支付稳定性，这将有助于提升您的评分和信用价值。";
+    } else if (score >= 650) {
+        dataRemark += "您的支付行为表现一般，还款履约能力有待提升，违约风险偏高。";
+        meaningRemark = "【意思解读】一般评分表明您的还款记录不够稳定，可能存在逾期或还款失败的情况。这会导致机构对您的信任度降低，在申请金融产品时可能面临更严格的审核或被拒绝。建议加强还款管理，提前准备还款资金，避免逾期，逐步改善支付行为。";
+    } else {
+        dataRemark += "您的支付行为表现偏低，还款履约能力较弱，违约风险较高。";
+        meaningRemark = "【意思解读】偏低评分表明您的还款记录存在较多问题，如频繁逾期、还款失败等。这会导致机构认为您的违约风险较高，在申请贷款、信用卡等金融产品时很可能被拒绝，即使获批也可能面临更高的利率和更低的额度。建议重点关注还款情况，及时处理逾期问题，制定还款计划，逐步改善支付行为，提升信用评分。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 查验次数时间分布解读（数据解读 + 意思解读）
+ */
+export function getQueryTrendRemark(ppcm) {
+    const counts = getQueryCountsByPeriod(ppcm);
+    const m12Total = counts.m12?.total || 0;
+    const m3Total = counts.m3?.total || 0;
+    const bankTotal = counts.m12?.bank || 0;
+    const finTotal = counts.m12?.nbankFin || 0;
+    const otherTotal = counts.m12?.nbankOther || 0;
+    
+    let dataRemark = `【数据解读】近一年查验总次数：${m12Total}次，其中银行查验${bankTotal}次，消费金融查验${finTotal}次，其他机构查验${otherTotal}次。近3个月查验次数：${m3Total}次。`;
+    let meaningRemark = "";
+    
+    if (m12Total === 0) {
+        dataRemark += "暂无查验记录。";
+        meaningRemark = "【意思解读】无查验记录可能表示近期无相关机构查询您的支付行为数据，或者您近期没有申请相关金融产品。这通常意味着您的信用活动较少，但也可能表示您的信用记录不够活跃。";
+    } else if (m12Total <= 5) {
+        dataRemark += "查验次数较少。";
+        meaningRemark = "【意思解读】查验次数较少说明机构对您的支付行为关注度较低，整体风险可控。这可能是因为您的还款记录良好，机构认为风险较低，或者您的信用活动较少。较低的查验频率通常对信用评分影响较小。";
+    } else if (m12Total <= 15) {
+        dataRemark += "查验次数适中。";
+        meaningRemark = "【意思解读】查验次数适中说明机构对您的支付行为保持正常关注。这通常发生在您有正常的金融活动时，如申请贷款、信用卡等。适度的查验是正常的信用评估过程，不会对您的信用产生负面影响。";
+    } else {
+        dataRemark += "查验次数较多。";
+        meaningRemark = "【意思解读】查验次数较多可能表示机构对您的支付行为关注度较高，这可能是因为您近期有较多的金融申请活动，或者机构需要更频繁地评估您的信用状况。频繁的查验虽然不会直接降低您的信用评分，但可能反映出机构对您的风险关注。建议关注自身还款情况，保持良好的支付记录，减少不必要的金融申请。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 查验行为概览解读（数据解读 + 意思解读）
+ */
+export function getQueryOverviewRemark(ppcm) {
+    const m12Count = normalizeValue(ppcm.ppcm_m12_qynum);
+    const m12Org = normalizeValue(ppcm.ppcm_m12_qyorg);
+    const m12Day = normalizeValue(ppcm.ppcm_m12_qyday);
+    
+    let dataRemark = `【数据解读】近一年查验行为概览：查验次数${m12Count}次，涉及机构${m12Org}家，查验天数${m12Day}天。`;
+    let meaningRemark = "";
+    
+    if (m12Count === 0) {
+        dataRemark += "暂无查验记录。";
+        meaningRemark = "【意思解读】无查验记录表示近期没有机构查询您的支付行为数据。这可能意味着您的信用活动较少，或者没有申请相关金融产品。虽然不会对信用产生负面影响，但信用记录的活跃度也是评估因素之一。";
+    } else {
+        const avgPerDay = m12Day > 0 ? (m12Count / m12Day).toFixed(2) : 0;
+        dataRemark += `平均每天查验${avgPerDay}次。`;
+        
+        if (m12Org > 0 && m12Count / m12Org > 3) {
+            dataRemark += "单机构查验频率较高。";
+            meaningRemark = "【意思解读】单机构查验频率较高可能表示该机构对您的信用状况需要更频繁的评估，这可能是因为您与该机构有业务往来，或者该机构在评估您的申请。较高的查验频率通常不会直接影响信用评分，但可能反映出机构对您的关注度。建议关注相关机构的关注原因，保持良好的还款记录。";
+        } else {
+            meaningRemark = "【意思解读】查验次数、机构数和天数的组合反映了机构对您信用状况的关注程度。适度的查验是正常的信用评估过程，说明您有正常的金融活动。保持稳定的还款记录，有助于维持良好的信用形象。";
+        }
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 还款成功次数趋势解读（数据解读 + 意思解读）
+ */
+export function getRepaySuccessRemark(ppcm) {
+    const counts = getRepayCountsByPeriod(ppcm);
+    const m12Success = counts.m12?.success || 0;
+    const m3Success = counts.m3?.success || 0;
+    
+    let dataRemark = `【数据解读】近一年还款成功次数：${m12Success}次，近3个月还款成功次数：${m3Success}次。`;
+    let meaningRemark = "";
+    
+    if (m12Success === 0) {
+        dataRemark += "暂无还款成功记录。";
+        meaningRemark = "【意思解读】无还款成功记录可能表示您近期没有需要还款的金融产品，或者还款数据尚未更新。如果确实有还款义务，建议确认还款是否成功，避免因还款失败影响信用记录。";
+    } else if (m12Success >= 20) {
+        dataRemark += "还款成功次数较多。";
+        meaningRemark = "【意思解读】还款成功次数较多说明您的还款履约能力较强，支付行为稳定。这表明您有良好的资金管理能力和还款习惯，机构会认为您是可靠的客户。这种稳定的还款记录有助于提升您的信用评分，在申请新的金融产品时更容易获得批准和更优惠的条件。";
+    } else if (m12Success >= 10) {
+        dataRemark += "还款成功次数适中。";
+        meaningRemark = "【意思解读】还款成功次数适中说明您的还款履约能力良好。这表明您能够按时完成还款义务，机构对您的信任度较高。继续保持这种良好的还款习惯，有助于维持和提升您的信用价值。";
+    } else {
+        dataRemark += "还款成功次数较少。";
+        meaningRemark = "【意思解读】还款成功次数较少可能表示您的还款活动不够频繁，或者存在还款失败的情况。如果确实有还款义务，建议关注还款情况，确保按时还款。稳定的还款记录是建立良好信用的基础，频繁的还款成功有助于提升您的信用评分。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 还款失败次数趋势解读（数据解读 + 意思解读）
+ */
+export function getRepayFailRemark(ppcm) {
+    const counts = getRepayCountsByPeriod(ppcm);
+    const m12Fail = counts.m12?.fail || 0;
+    const m3Fail = counts.m3?.fail || 0;
+    
+    let dataRemark = `【数据解读】近一年还款失败次数：${m12Fail}次，近3个月还款失败次数：${m3Fail}次。`;
+    let meaningRemark = "";
+    
+    if (m12Fail === 0) {
+        dataRemark += "无还款失败记录。";
+        meaningRemark = "【意思解读】无还款失败记录说明您的还款履约能力优秀，支付行为稳定。这表明您有良好的资金管理能力和还款习惯，所有还款都能按时成功完成。这种完美的还款记录会显著提升您的信用评分，机构会认为您是低风险客户，在申请金融产品时更容易获得批准和更优惠的条件。";
+    } else if (m12Fail <= 2) {
+        dataRemark += "还款失败次数较少。";
+        meaningRemark = "【意思解读】还款失败次数较少说明整体还款履约能力良好。偶尔的还款失败可能是由于临时资金紧张或技术原因，但如果频繁发生，可能会影响机构对您的信任度。建议继续保持良好的还款习惯，提前准备还款资金，避免因余额不足等原因导致还款失败。";
+    } else if (m12Fail <= 5) {
+        dataRemark += "还款失败次数适中。";
+        meaningRemark = "【意思解读】还款失败次数适中可能表示您的资金管理存在一定问题，或者还款计划不够合理。频繁的还款失败会导致机构对您的还款能力产生怀疑，可能影响您的信用评分和未来申请金融产品的审批结果。建议关注还款情况，制定合理的还款计划，确保账户有足够资金，避免频繁失败。";
+    } else {
+        dataRemark += "还款失败次数较多。";
+        meaningRemark = "【意思解读】还款失败次数较多表明您的还款履约能力存在问题，可能是资金管理不当、还款计划不合理或账户余额不足等原因。这会导致机构认为您的违约风险较高，严重影响您的信用评分。在申请新的金融产品时很可能被拒绝，即使获批也可能面临更高的利率和更严格的限制。建议重点关注还款管理，及时处理还款问题，制定还款计划，确保账户有足够资金，逐步改善还款行为，避免影响信用记录。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 余额不足导致还款失败占比解读（数据解读 + 意思解读）
+ */
+export function getInsufficientRatioRemark(ppcm) {
+    const ratios = getInsufficientRatioByPeriod(ppcm);
+    const m12Ratio = ratios.m12 || 0;
+    const m3Ratio = ratios.m3 || 0;
+    
+    const m12Percent = (m12Ratio * 100).toFixed(2);
+    const m3Percent = (m3Ratio * 100).toFixed(2);
+    
+    let dataRemark = `【数据解读】近一年余额不足导致还款失败占比：${m12Percent}%，近3个月占比：${m3Percent}%。`;
+    let meaningRemark = "";
+    
+    if (m12Ratio === 0) {
+        dataRemark += "无余额不足导致的还款失败。";
+        meaningRemark = "【意思解读】无余额不足导致的还款失败说明您的账户资金管理良好，能够确保还款时有足够的资金。这表明您有良好的资金规划能力，能够提前准备还款资金。这种良好的资金管理习惯有助于维持稳定的还款记录，提升机构对您的信任度。";
+    } else if (m12Ratio <= 0.1) {
+        dataRemark += "余额不足占比很低。";
+        meaningRemark = "【意思解读】余额不足占比很低说明整体资金管理良好，偶尔的余额不足可能是由于临时资金周转问题。虽然占比很低，但仍需注意，因为即使是偶尔的余额不足也可能导致还款失败，影响信用记录。建议继续保持良好的资金管理习惯，提前准备还款资金。";
+    } else if (m12Ratio <= 0.3) {
+        dataRemark += "余额不足占比适中。";
+        meaningRemark = "【意思解读】余额不足占比适中表明您的资金管理存在一定问题，可能没有提前准备足够的还款资金。这会导致部分还款因余额不足而失败，影响您的还款履约记录。机构可能会认为您的资金管理能力不足，影响信用评分。建议关注账户余额，制定资金规划，确保还款时有足够资金，避免因余额不足导致还款失败。";
+    } else {
+        dataRemark += "余额不足占比较高。";
+        meaningRemark = "【意思解读】余额不足占比较高表明您的资金管理存在严重问题，经常没有足够的资金用于还款。这会导致频繁的还款失败，严重影响您的还款履约记录和信用评分。机构会认为您的资金管理能力不足，违约风险较高，在申请新的金融产品时很可能被拒绝。建议加强资金管理，制定详细的资金规划，提前准备还款资金，建立还款提醒机制，避免因余额不足导致还款失败，逐步改善资金管理习惯。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 还款机构数与等级解读（数据解读 + 意思解读）
+ */
+export function getRepayOrgAndLevelRemark(ppcm) {
+    const m12SuccOrg = normalizeValue(ppcm.ppcm_m12_succ_reporg);
+    const m12FailOrg = normalizeValue(ppcm.ppcm_m12_fail_reporg);
+    const m12SuccLevel = normalizeValue(ppcm.ppcm_m12_succ_repamt);
+    const m12FailLevel = normalizeValue(ppcm.ppcm_m12_fail_repamt);
+    
+    let dataRemark = `【数据解读】近一年还款成功机构数：${m12SuccOrg}家，还款失败机构数：${m12FailOrg}家。还款成功等级：${m12SuccLevel}，还款失败等级：${m12FailLevel}。`;
+    let meaningRemark = "";
+    
+    if (m12SuccOrg > 0 && m12FailOrg === 0) {
+        dataRemark += "所有机构还款均成功。";
+        meaningRemark = "【意思解读】所有机构还款均成功说明您的还款履约能力优秀，能够与多家机构保持良好的还款关系。这表明您有稳定的资金流和良好的还款习惯，机构对您的信任度很高。这种完美的还款记录会显著提升您的信用评分，在申请新的金融产品时更容易获得批准和更优惠的条件。";
+    } else if (m12SuccOrg > m12FailOrg) {
+        dataRemark += "还款成功机构数多于失败机构数。";
+        meaningRemark = "【意思解读】还款成功机构数多于失败机构数说明整体还款履约能力良好，虽然存在部分机构的还款失败，但大部分机构都能成功还款。这表明您有基本的还款能力，但资金管理可能存在一定问题。建议关注失败原因，及时处理还款问题，确保所有机构都能成功还款，进一步提升信用价值。";
+    } else if (m12FailOrg > 0) {
+        dataRemark += "存在还款失败机构。";
+        meaningRemark = "【意思解读】存在还款失败机构表明您的还款履约能力存在问题，可能无法与所有机构保持良好的还款关系。这会导致相关机构对您的信任度降低，可能影响您与该机构的业务往来，甚至影响您的整体信用评分。建议关注失败原因，及时处理还款问题，制定还款计划，确保所有机构都能成功还款，维护良好的信用关系。";
+    } else {
+        meaningRemark = "【意思解读】还款机构数和等级反映了您与不同机构的还款关系。成功机构数越多、失败机构数越少，说明您的还款履约能力越强，机构对您的信任度越高。保持良好的还款记录有助于维护和提升您的信用价值。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 借款与逾期概览解读（数据解读 + 意思解读）
+ */
+export function getLoanAndOverdueRemark(ppcm) {
+    const m12Loan = normalizeValue(ppcm.ppcm_m12_loannum);
+    const m12LoanOrg = normalizeValue(ppcm.ppcm_m12_loanorg);
+    const m12LoanAmt = normalizeValue(ppcm.ppcm_m12_loanamt);
+    const m12OverNum = normalizeValue(ppcm.ppcm_m12_overnum);
+    const m12OverOrg = normalizeValue(ppcm.ppcm_m12_overorg);
+    const m12OverAmt = normalizeValue(ppcm.ppcm_m12_overamt);
+    
+    let dataRemark = `【数据解读】近一年借款情况：借款次数${m12Loan}次，涉及机构${m12LoanOrg}家，借款等级${m12LoanAmt}。逾期情况：逾期次数${m12OverNum}次，逾期机构数${m12OverOrg}家，逾期等级${m12OverAmt}。`;
+    let meaningRemark = "";
+    
+    if (m12OverNum === 0) {
+        dataRemark += "无逾期记录。";
+        meaningRemark = "【意思解读】无逾期记录说明您的还款履约能力优秀，能够按时完成所有还款义务。这表明您有良好的资金管理能力和还款习惯，机构会认为您是低风险客户。这种完美的还款记录会显著提升您的信用评分，在申请新的金融产品时更容易获得批准和更优惠的条件。借款等级反映了您的借款规模，适度的借款有助于建立信用记录，但过度借款可能增加还款压力。";
+    } else if (m12OverNum <= 2) {
+        dataRemark += "逾期次数较少。";
+        meaningRemark = "【意思解读】逾期次数较少说明整体还款履约能力良好，虽然存在偶尔的逾期，但大部分还款都能按时完成。偶尔的逾期可能是由于临时资金紧张或忘记还款，但如果频繁发生，可能会影响机构对您的信任度。建议继续保持良好的还款习惯，建立还款提醒机制，避免逾期，进一步提升信用价值。";
+    } else {
+        dataRemark += "逾期次数较多。";
+        meaningRemark = "【意思解读】逾期次数较多表明您的还款履约能力存在问题，可能无法按时完成还款义务。这会导致机构认为您的违约风险较高，严重影响您的信用评分。在申请新的金融产品时很可能被拒绝，即使获批也可能面临更高的利率和更严格的限制。逾期记录会在信用报告中保留较长时间，影响您的长期信用价值。建议重点关注还款管理，制定还款计划，提前准备还款资金，及时处理逾期问题，避免影响信用记录。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}
+
+/**
+ * 基础信息与查贷比解读（数据解读 + 意思解读）
+ */
+export function getBasicInfoRemark(ppcm) {
+    const flag = normalizeValue(ppcm.flag);
+    const flagDb = normalizeValue(ppcm.flagdb);
+    const m12Ratio = normalizeValue(ppcm.ppcm_m12_qy_rep_ratio);
+    
+    const flagText = flag === 1 ? "查得" : "查无";
+    const flagDbText = flagDb === 1 ? "库有" : "库无";
+    const ratioText = m12Ratio > 0 ? m12Ratio.toFixed(2) : "0";
+    
+    let dataRemark = `【数据解读】基础信息：查得标识为"${flagText}"，库有标识为"${flagDbText}"。近一年查贷比（查验次数/借款次数）：${ratioText}。`;
+    let meaningRemark = "";
+    
+    if (m12Ratio === 0) {
+        dataRemark += "查贷比为0。";
+        meaningRemark = "【意思解读】查贷比为0表示无查验或借款记录，可能表示您近期没有相关的金融活动。查得标识和库有标识反映了您的信用记录在系统中的存在情况。如果标识为\"查无\"或\"库无\"，可能表示您的信用记录不够完整或活跃，建议适当使用金融产品以建立信用记录。";
+    } else if (m12Ratio <= 1) {
+        dataRemark += "查贷比较低。";
+        meaningRemark = "【意思解读】查贷比较低说明查验次数少于或等于借款次数，这表明机构对您的关注度相对较低，整体风险可控。较低的查贷比通常意味着您的借款活动正常，机构不需要频繁查验就能评估您的信用状况。这通常是一个积极的信号，表明您的信用记录稳定，机构对您的信任度较高。";
+    } else if (m12Ratio <= 3) {
+        dataRemark += "查贷比适中。";
+        meaningRemark = "【意思解读】查贷比适中说明查验与借款比例正常，这是正常的信用评估过程。适度的查验是机构评估您信用状况的正常手段，通常发生在您申请金融产品时。这种比例表明您的信用活动正常，机构对您的关注度在合理范围内。";
+    } else {
+        dataRemark += "查贷比较高。";
+        meaningRemark = "【意思解读】查贷比较高说明查验次数明显多于借款次数，可能表示机构对您的关注度较高。这可能是因为您近期有较多的金融申请活动，或者机构需要更频繁地评估您的信用状况。虽然频繁的查验不会直接降低您的信用评分，但可能反映出机构对您的风险关注。建议关注自身信用状况，保持良好的还款记录，减少不必要的金融申请，避免过度查询影响信用形象。";
+    }
+    
+    return `${dataRemark}\n\n${meaningRemark}`;
+}

src/ui/JRZQ6F2A/components/ApplicationCountSection.vue

@@ -52,6 +52,11 @@ const props = defineProps({
     type: Object,
     required: true,
     default: () => ({})
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -61,7 +66,7 @@ const labels = periodKeys.map(key => PERIOD_MAP[key].label)
 // 总申请次数图表配置
 const chartOption = computed(() => {
   const data = periodKeys.map(key => {
-    const counts = getApplicationCounts(props.data, key)
+    const counts = getApplicationCounts(props.data, key, props.dimension)
     return counts.total
   })
 
@@ -90,7 +95,7 @@ const chartOption = computed(() => {
       type: 'category',
       data: labels,
       axisLabel: {
-        fontSize: 10,
+        fontSize: 16,
         color: '#6b7280',
         rotate: 45
       },
@@ -103,7 +108,7 @@ const chartOption = computed(() => {
     yAxis: {
       type: 'value',
       axisLabel: {
-        fontSize: 11,
+        fontSize: 16,
         color: '#6b7280',
         formatter: '{value} 次'
       },
@@ -137,11 +142,11 @@ const chartOption = computed(() => {
 // 特殊时段（周末 / 夜间）图表配置
 const specialChartOption = computed(() => {
   const weekendData = periodKeys.map(key => {
-    const s = getSpecialPeriodCounts(props.data, key)
+    const s = getSpecialPeriodCounts(props.data, key, props.dimension)
     return s.weekend || 0
   })
   const nightData = periodKeys.map(key => {
-    const s = getSpecialPeriodCounts(props.data, key)
+    const s = getSpecialPeriodCounts(props.data, key, props.dimension)
     return s.night || 0
   })
 
@@ -163,7 +168,7 @@ const specialChartOption = computed(() => {
       data: ['周末申请次数', '夜间申请次数'],
       top: '5%',
       textStyle: {
-        fontSize: 12
+        fontSize: 14
       }
     },
     grid: {
@@ -177,7 +182,7 @@ const specialChartOption = computed(() => {
       type: 'category',
       data: labels,
       axisLabel: {
-        fontSize: 10,
+        fontSize: 16,
         color: '#6b7280',
         rotate: 45
       },
@@ -190,7 +195,7 @@ const specialChartOption = computed(() => {
     yAxis: {
       type: 'value',
       axisLabel: {
-        fontSize: 11,
+        fontSize: 16,
         color: '#6b7280',
         formatter: '{value} 次'
       },

src/ui/JRZQ6F2A/components/ApplicationTotalSection.vue

@@ -1,22 +1,18 @@
 <template>
   <div class="card application-total-section">
     <div class="rounded-lg border border-gray-200 pb-2 mb-4">
-      <div class="flex items-center mb-4 p-4">
-        <span class="font-bold text-gray-800">申请总次数 (银行+非银) {{ totalCount }}次</span>
-      </div>
       <div class="mt-4">
         <!-- Tab切换 -->
-        <div class="mb-6">
+        <div class="">
           <LTitle title="申请总次数详情" />
           <div class="bg-white px-4 py-2">
             <van-tabs v-model:active="activeTab" color="var(--color-primary)">
               <van-tab v-for="(period, index) in periods" :key="period.key" :title="period.label">
-                <div class="p-4">
+                <div class="p-4 pb-0">
                   <!-- 银行机构 -->
-                  <BankInstitutionSection :data="data" :period="period.key" />
+                  <BankInstitutionSection :data="data" :period="period.key" :dimension="dimension" />
-
                   <!-- 非银机构 -->
-                  <NBankInstitutionSection :data="data" :period="period.key" />
+                  <NBankInstitutionSection :data="data" :period="period.key" :dimension="dimension" />
                 </div>
               </van-tab>
             </van-tabs>
@@ -28,9 +24,8 @@
 </template>
 
 <script setup>
-import { computed, ref } from 'vue'
+import { ref } from 'vue'
 import LTitle from '@/components/LTitle.vue'
-import { getApplicationCounts, PERIOD_MAP } from '../utils/dataParser'
 import BankInstitutionSection from './BankInstitutionSection.vue'
 import NBankInstitutionSection from './NBankInstitutionSection.vue'
 
@@ -39,6 +34,11 @@ const props = defineProps({
     type: Object,
     required: true,
     default: () => ({})
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -52,12 +52,6 @@ const periods = [
   { key: 'm6', label: '6个月' },
   { key: 'm12', label: '12个月' }
 ]
-
-// 计算总申请次数（12个月）
-const totalCount = computed(() => {
-  const counts = getApplicationCounts(props.data, 'm12')
-  return counts.total
-})
 </script>
 
 <style lang="scss" scoped>
@@ -89,7 +83,7 @@ const totalCount = computed(() => {
 
 .application-total-section :deep(.van-tab) {
   color: #999999 !important;
-  font-size: 14px !important;
+  font-size: 16px !important;
   font-weight: 400 !important;
   border-right: unset !important;
   background-color: transparent !important;

src/ui/JRZQ6F2A/components/ApplyRemarkSection.vue

@@ -0,0 +1,71 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 pb-2 mb-2">
+    <div class="px-4 pt-4">
+      <LTitle title="借贷意向申请情况与建议" />
+    </div>
+
+    <div class="px-2 pb-4">
+      <!-- 银行类机构申请情况 -->
+      <Remark
+        v-if="remarks.bankSituation"
+        :title="'银行类机构申请情况'"
+        :content="remarks.bankSituation"
+        :default-expanded="true"
+      />
+
+      <!-- 银行类机构申请建议 -->
+      <Remark
+        :title="'银行类机构申请建议'"
+        :content="remarks.bankAdvice"
+        :default-expanded="false"
+      />
+
+      <!-- 非银行类机构申请情况 -->
+      <Remark
+        v-if="remarks.nbankSituation"
+        :title="'非银行类机构申请情况'"
+        :content="remarks.nbankSituation"
+        :default-expanded="true"
+      />
+
+      <!-- 非银行类机构申请建议 -->
+      <Remark
+        :title="'非银行类机构申请建议'"
+        :content="remarks.nbankAdvice"
+        :default-expanded="false"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import { getApplyRemarks } from '../utils/dataParser'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({}),
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id',
+  },
+})
+
+const remarks = computed(() => {
+  return getApplyRemarks(props.data || {}, props.dimension)
+})
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+</style>
+
+

src/ui/JRZQ6F2A/components/BankInstitutionSection.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="mb-6">
+  <div class="">
     <LTitle title="银行机构申请分布" />
     <div class="mt-4">
       <!-- 饼图：宽度占满 -->
@@ -8,8 +8,9 @@
       </div>
 
       <!-- 详细列表：在图表下方，展示所有项并带颜色标识 -->
-      <div class="space-y-2">
+      <div class="space-y-0 mb-2 rounded-lg overflow-hidden">
-        <div v-for="(item, index) in detailList" :key="index" class="flex justify-between items-center text-sm">
+        <div v-for="(item, index) in detailList" :key="index"
+          :class="['flex justify-between items-center text-lg py-3 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
           <div class="flex items-center">
             <span class="w-2 h-2 rounded-full mr-2" :style="{ backgroundColor: item.color }" />
             <span class="text-gray-600">{{ item.label }}</span>
@@ -17,8 +18,13 @@
           <span class="text-[#333333] font-bold">{{ item.value }}次</span>
         </div>
       </div>
+
     </div>
   </div>
+
+  <!-- 银行类机构申请情况（近1年 / 近3个月，仅在12个月tab下展示） -->
+  <Remark class="mt-8 mb-8" v-if="period === 'm12' && applyRemarks.bankSituation" :title="'银行类机构申请情况'"
+    :content="applyRemarks.bankSituation" :default-expanded="true" />
 </template>
 
 <script setup>
@@ -33,7 +39,8 @@ import {
   LegendComponent
 } from 'echarts/components'
 import LTitle from '@/components/LTitle.vue'
-import { getBankApplicationDetails, FIELD_LABELS } from '../utils/dataParser'
+import Remark from '@/components/Remark.vue'
+import { getBankApplicationDetails, FIELD_LABELS, getApplyRemarks } from '../utils/dataParser'
 
 // 注册ECharts组件
 use([
@@ -53,6 +60,11 @@ const props = defineProps({
   period: {
     type: String,
     required: true
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -69,7 +81,14 @@ const COLORS = [
 ]
 
 // 获取银行机构申请详情
-const bankDetails = computed(() => getBankApplicationDetails(props.data, props.period))
+const bankDetails = computed(() =>
+  getBankApplicationDetails(props.data, props.period, props.dimension)
+)
+
+// 申请情况与建议（使用整体数据 + 当前维度）
+const applyRemarks = computed(() => {
+  return getApplyRemarks(props.data || {}, props.dimension)
+})
 
 // 计算银行机构总次数
 const bankTotal = computed(() => {
@@ -103,7 +122,7 @@ const pieChartOption = computed(() => {
         top: 'center',
         textStyle: {
           color: '#999',
-          fontSize: 14
+          fontSize: 16
         }
       }
     }
@@ -121,7 +140,7 @@ const pieChartOption = computed(() => {
       style: {
         text: '银行机构',
         fill: '#111827',
-        fontSize: 14,
+        fontSize: 16,
         fontWeight: 'bold',
       },
     },
@@ -148,7 +167,7 @@ const pieChartOption = computed(() => {
           },
           label: {
             show: true,
-            fontSize: 14,
+            fontSize: 16,
             fontWeight: 'bold',
             color: '#333'
           }

src/ui/JRZQ6F2A/components/BankOrgSection.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="mb-6">
+  <div class="">
     <LTitle title="银行机构申请机构数分布" />
     <div class="mt-4">
       <!-- 饼图：宽度占满 -->
@@ -8,8 +8,9 @@
       </div>
 
       <!-- 详细列表：在图表下方，展示所有项并带颜色标识 -->
-      <div class="space-y-2">
+      <div class="space-y-0 mb-2 rounded-lg overflow-hidden">
-        <div v-for="(item, index) in detailList" :key="index" class="flex justify-between items-center text-sm">
+        <div v-for="(item, index) in detailList" :key="index"
+          :class="['flex justify-between items-center text-lg py-3 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
           <div class="flex items-center">
             <span class="w-2 h-2 rounded-full mr-2" :style="{ backgroundColor: item.color }" />
             <span class="text-gray-600">{{ item.label }}</span>
@@ -17,8 +18,13 @@
           <span class="text-[#333333] font-bold">{{ item.value }}家</span>
         </div>
       </div>
+
     </div>
   </div>
+
+  <!-- 银行类机构申请建议（仅在12个月tab下展示） -->
+  <Remark class="mt-8 mb-8" v-if="period === 'm12' && applyRemarks.bankAdvice" :title="'银行类机构申请建议'"
+    :content="applyRemarks.bankAdvice" :default-expanded="true" />
 </template>
 
 <script setup>
@@ -33,7 +39,8 @@ import {
   LegendComponent
 } from 'echarts/components'
 import LTitle from '@/components/LTitle.vue'
-import { getBankOrgDetails, FIELD_LABELS } from '../utils/dataParser'
+import Remark from '@/components/Remark.vue'
+import { getBankOrgDetails, FIELD_LABELS, getApplyRemarks } from '../utils/dataParser'
 
 // 注册ECharts组件
 use([
@@ -53,6 +60,11 @@ const props = defineProps({
   period: {
     type: String,
     required: true
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -69,7 +81,14 @@ const COLORS = [
 ]
 
 // 获取银行机构数详情
-const bankOrgs = computed(() => getBankOrgDetails(props.data, props.period))
+const bankOrgs = computed(() =>
+  getBankOrgDetails(props.data, props.period, props.dimension)
+)
+
+// 申请情况与建议（使用整体数据 + 当前维度）
+const applyRemarks = computed(() => {
+  return getApplyRemarks(props.data || {}, props.dimension)
+})
 
 // 计算银行机构总数
 const bankTotal = computed(() => {
@@ -103,7 +122,7 @@ const pieChartOption = computed(() => {
         top: 'center',
         textStyle: {
           color: '#999',
-          fontSize: 14
+          fontSize: 16
         }
       }
     }
@@ -121,7 +140,7 @@ const pieChartOption = computed(() => {
       style: {
         text: '银行机构',
         fill: '#111827',
-        fontSize: 14,
+        fontSize: 16,
         fontWeight: 'bold',
       },
     },
@@ -148,7 +167,7 @@ const pieChartOption = computed(() => {
           },
           label: {
             show: true,
-            fontSize: 14,
+            fontSize: 16,
             fontWeight: 'bold',
             color: '#333'
           }

src/ui/JRZQ6F2A/components/InstitutionTotalSection.vue

@@ -3,17 +3,17 @@
     <div class="rounded-lg border border-gray-200 pb-2 mb-4">
       <div class="mt-4">
         <!-- Tab切换 -->
-        <div class="mb-6">
+        <div class="">
           <LTitle title="申请机构总数详情" />
           <div class="bg-white px-4 py-2">
             <van-tabs v-model:active="activeTab" color="var(--color-primary)">
               <van-tab v-for="(period, index) in periods" :key="period.key" :title="period.label">
-                <div class="p-4">
+                <div class="p-4 pb-0">
                   <!-- 银行机构 -->
-                  <BankOrgSection :data="data" :period="period.key" />
+                  <BankOrgSection :data="data" :period="period.key" :dimension="dimension" />
 
                   <!-- 非银机构 -->
-                  <NBankOrgSection :data="data" :period="period.key" />
+                  <NBankOrgSection :data="data" :period="period.key" :dimension="dimension" />
                 </div>
               </van-tab>
             </van-tabs>
@@ -25,9 +25,8 @@
 </template>
 
 <script setup>
-import { computed, ref } from 'vue'
+import { ref } from 'vue'
 import LTitle from '@/components/LTitle.vue'
-import { getBankOrgDetails, getNBankOrgDetails } from '../utils/dataParser'
 import BankOrgSection from './BankOrgSection.vue'
 import NBankOrgSection from './NBankOrgSection.vue'
 
@@ -36,6 +35,11 @@ const props = defineProps({
     type: Object,
     required: true,
     default: () => ({})
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -49,15 +53,6 @@ const periods = [
   { key: 'm6', label: '6个月' },
   { key: 'm12', label: '12个月' }
 ]
-
-// 计算总机构数（12个月）
-const totalCount = computed(() => {
-  const bankOrgs = getBankOrgDetails(props.data, 'm12')
-  const nbankOrgs = getNBankOrgDetails(props.data, 'm12')
-  const bankTotal = Object.values(bankOrgs).reduce((sum, val) => sum + (val || 0), 0)
-  const nbankTotal = Object.values(nbankOrgs).reduce((sum, val) => sum + (val || 0), 0)
-  return bankTotal + nbankTotal
-})
 </script>
 
 <style lang="scss" scoped>
@@ -89,7 +84,7 @@ const totalCount = computed(() => {
 
 .institution-total-section :deep(.van-tab) {
   color: #999999 !important;
-  font-size: 14px !important;
+  font-size: 16px !important;
   font-weight: 400 !important;
   border-right: unset !important;
   background-color: transparent !important;

src/ui/JRZQ6F2A/components/NBankInstitutionSection.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="mb-6">
+  <div class="">
     <LTitle title="非银机构申请分布" />
     <div class="mt-4">
       <!-- 饼图：宽度占满 -->
@@ -8,8 +8,9 @@
       </div>
 
       <!-- 详细列表：在图表下方，展示所有项并带颜色标识 -->
-      <div class="space-y-2">
+      <div class="space-y-0 mb-2 rounded-lg overflow-hidden">
-        <div v-for="(item, index) in detailList" :key="index" class="flex justify-between items-center text-sm">
+        <div v-for="(item, index) in detailList" :key="index"
+          :class="['flex justify-between items-center text-lg py-3 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
           <div class="flex items-center">
             <span class="w-2 h-2 rounded-full mr-2" :style="{ backgroundColor: item.color }" />
             <span class="text-gray-600">{{ item.label }}</span>
@@ -17,8 +18,13 @@
           <span class="text-[#333333] font-bold">{{ item.value }}次</span>
         </div>
       </div>
+
     </div>
   </div>
+
+  <!-- 非银行类机构申请情况（近1年 / 近3个月，仅在12个月tab下展示） -->
+  <Remark class="mt-8 mb-0" v-if="period === 'm12' && applyRemarks.nbankSituation" :title="'非银行类机构申请情况'"
+    :content="applyRemarks.nbankSituation" :default-expanded="true" />
 </template>
 
 <script setup>
@@ -33,7 +39,8 @@ import {
   LegendComponent
 } from 'echarts/components'
 import LTitle from '@/components/LTitle.vue'
-import { getNBankApplicationDetails, FIELD_LABELS } from '../utils/dataParser'
+import Remark from '@/components/Remark.vue'
+import { getNBankApplicationDetails, FIELD_LABELS, getApplyRemarks } from '../utils/dataParser'
 
 // 注册ECharts组件
 use([
@@ -53,6 +60,11 @@ const props = defineProps({
   period: {
     type: String,
     required: true
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -69,7 +81,14 @@ const COLORS = [
 ]
 
 // 获取非银机构申请详情
-const nbankDetails = computed(() => getNBankApplicationDetails(props.data, props.period))
+const nbankDetails = computed(() =>
+  getNBankApplicationDetails(props.data, props.period, props.dimension)
+)
+
+// 申请情况与建议（使用整体数据 + 当前维度）
+const applyRemarks = computed(() => {
+  return getApplyRemarks(props.data || {}, props.dimension)
+})
 
 // 计算非银机构总次数
 const nbankTotal = computed(() => {
@@ -103,7 +122,7 @@ const pieChartOption = computed(() => {
         top: 'center',
         textStyle: {
           color: '#999',
-          fontSize: 14
+          fontSize: 16
         }
       }
     }
@@ -121,7 +140,7 @@ const pieChartOption = computed(() => {
       style: {
         text: '非银机构',
         fill: '#111827',
-        fontSize: 14,
+        fontSize: 16,
         fontWeight: 'bold',
       },
     },
@@ -148,7 +167,7 @@ const pieChartOption = computed(() => {
           },
           label: {
             show: true,
-            fontSize: 14,
+            fontSize: 16,
             fontWeight: 'bold',
             color: '#333'
           }

src/ui/JRZQ6F2A/components/NBankOrgSection.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="mb-6">
+  <div class="">
     <LTitle title="非银机构申请机构数分布" />
     <div class="mt-4">
       <!-- 饼图：宽度占满 -->
@@ -8,8 +8,9 @@
       </div>
 
       <!-- 详细列表：在图表下方，展示所有项并带颜色标识 -->
-      <div class="space-y-2">
+      <div class="space-y-0 mb-2 rounded-lg overflow-hidden">
-        <div v-for="(item, index) in detailList" :key="index" class="flex justify-between items-center text-sm">
+        <div v-for="(item, index) in detailList" :key="index"
+          :class="['flex justify-between items-center text-lg py-3 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
           <div class="flex items-center">
             <span class="w-2 h-2 rounded-full mr-2" :style="{ backgroundColor: item.color }" />
             <span class="text-gray-600">{{ item.label }}</span>
@@ -17,8 +18,14 @@
           <span class="text-[#333333] font-bold">{{ item.value }}家</span>
         </div>
       </div>
+
     </div>
+
   </div>
+
+  <!-- 非银行类机构申请建议（仅在12个月tab下展示） -->
+  <Remark class="mt-8 mb-0" v-if="period === 'm12' && applyRemarks.nbankAdvice" :title="'非银行类机构申请建议'"
+    :content="applyRemarks.nbankAdvice" :default-expanded="true" />
 </template>
 
 <script setup>
@@ -33,7 +40,8 @@ import {
   LegendComponent
 } from 'echarts/components'
 import LTitle from '@/components/LTitle.vue'
-import { getNBankOrgDetails, FIELD_LABELS } from '../utils/dataParser'
+import Remark from '@/components/Remark.vue'
+import { getNBankOrgDetails, FIELD_LABELS, getApplyRemarks } from '../utils/dataParser'
 
 // 注册ECharts组件
 use([
@@ -53,6 +61,11 @@ const props = defineProps({
   period: {
     type: String,
     required: true
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -69,7 +82,14 @@ const COLORS = [
 ]
 
 // 获取非银机构数详情
-const nbankOrgs = computed(() => getNBankOrgDetails(props.data, props.period))
+const nbankOrgs = computed(() =>
+  getNBankOrgDetails(props.data, props.period, props.dimension)
+)
+
+// 申请情况与建议（使用整体数据 + 当前维度）
+const applyRemarks = computed(() => {
+  return getApplyRemarks(props.data || {}, props.dimension)
+})
 
 // 计算非银机构总数
 const nbankTotal = computed(() => {
@@ -103,7 +123,7 @@ const pieChartOption = computed(() => {
         top: 'center',
         textStyle: {
           color: '#999',
-          fontSize: 14
+          fontSize: 16
         }
       }
     }
@@ -121,7 +141,7 @@ const pieChartOption = computed(() => {
       style: {
         text: '非银机构',
         fill: '#111827',
-        fontSize: 14,
+        fontSize: 16,
         fontWeight: 'bold',
       },
     },
@@ -148,7 +168,7 @@ const pieChartOption = computed(() => {
           },
           label: {
             show: true,
-            fontSize: 14,
+            fontSize: 16,
             fontWeight: 'bold',
             color: '#333'
           }

src/ui/JRZQ6F2A/components/ProductTypeDistributionSection.vue

@@ -8,8 +8,9 @@
         </div>
 
         <!-- 详细列表：与图表颜色一致，包含 0 次的类型 -->
-        <div class="space-y-2 px-4 pb-4">
+        <div class="space-y-0 px-4 pb-4 rounded-lg overflow-hidden">
-          <div v-for="item in detailList" :key="item.key" class="flex items-center justify-between text-sm">
+          <div v-for="(item, index) in detailList" :key="item.key" 
+            :class="['flex items-center justify-between text-lg py-3 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
             <div class="flex items-center">
               <span class="w-2 h-2 rounded-full mr-2" :style="{ backgroundColor: item.color }" />
               <span class="text-gray-600">{{ item.label }}</span>
@@ -52,6 +53,11 @@ const props = defineProps({
     type: Object,
     required: true,
     default: () => ({})
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id'
   }
 })
 
@@ -79,7 +85,8 @@ const detailList = computed(() => {
   const labels = FIELD_LABELS.bank || {}
 
   return TYPE_KEYS.map((key, index) => {
-    const field = `${PREFIX}_id_${key}_allnum`
+    const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
+    const field = `${PREFIX}_${dimKey}_${key}_allnum`
     const value = getValue(v[field]) || 0
 
     return {
@@ -121,7 +128,7 @@ const chartOption = computed(() => {
       type: 'category',
       data: categories,
       axisLabel: {
-        fontSize: 10,
+        fontSize: 13,
         color: '#6b7280',
         rotate: 30
       },
@@ -134,7 +141,7 @@ const chartOption = computed(() => {
     yAxis: {
       type: 'value',
       axisLabel: {
-        fontSize: 11,
+        fontSize: 16,
         color: '#6b7280',
         formatter: '{value} 次'
       },
@@ -170,15 +177,4 @@ const chartOption = computed(() => {
   width: 100%;
   height: 100%;
 }
-</style>
+</style>
-
-{
-"cells": [],
-"metadata": {
-"language_info": {
-"name": "python"
-}
-},
-"nbformat": 4,
-"nbformat_minor": 2
-}

src/ui/JRZQ6F2A/components/RecentIntensiveApplicationSection.vue

@@ -3,34 +3,15 @@
     <div class="rounded-lg border border-gray-200 p-4 space-y-3">
       <LTitle title="近期集中申请提示" />
 
-      <div v-if="hasAnyData" class="space-y-2 text-sm text-gray-700">
+      <div v-if="hasAnyData" class="space-y-0 text-lg text-gray-700 rounded-lg overflow-hidden">
-        <div class="flex justify-between">
+        <div v-for="(item, index) in dataItems" :key="item.label"
-          <span>最近在银行连续申请次数</span>
+          :class="['flex justify-between py-3 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
-          <span class="font-bold text-[#111827]">{{ bankCons }} 次</span>
+          <span>{{ item.label }}</span>
-        </div>
+          <span class="font-bold text-[#111827]">{{ item.value }}</span>
-        <div class="flex justify-between">
-          <span>最近在银行连续申请天数</span>
-          <span class="font-bold text-[#111827]">{{ bankDays }} 天</span>
-        </div>
-        <div class="flex justify-between">
-          <span>最近在非银连续申请次数</span>
-          <span class="font-bold text-[#111827]">{{ nbankCons }} 次</span>
-        </div>
-        <div class="flex justify-between">
-          <span>最近在非银连续申请天数</span>
-          <span class="font-bold text-[#111827]">{{ nbankDays }} 天</span>
-        </div>
-        <div class="flex justify-between">
-          <span>距最近一次在银行机构申请</span>
-          <span class="font-bold text-[#111827]">{{ bankGap }} 天</span>
-        </div>
-        <div class="flex justify-between">
-          <span>距最近一次在非银机构申请</span>
-          <span class="font-bold text-[#111827]">{{ nbankGap }} 天</span>
         </div>
       </div>
 
-      <div v-else class="text-sm text-gray-400">
+      <div v-else class="text-base text-gray-400">
         暂未查询到明显的近期集中申请行为。
       </div>
     </div>
@@ -48,15 +29,38 @@ const props = defineProps({
     required: true,
     default: () => ({}),
   },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id',
+  },
 })
 
-const bankCons = computed(() => getValue(props.data?.als_lst_id_bank_consnum))
+const bankCons = computed(() => {
-const bankDays = computed(() => getValue(props.data?.als_lst_id_bank_csinteday))
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
-const nbankCons = computed(() => getValue(props.data?.als_lst_id_nbank_consnum))
+  return getValue(props.data?.[`als_lst_${dimKey}_bank_consnum`])
-const nbankDays = computed(() => getValue(props.data?.als_lst_id_nbank_csinteday))
+})
+const bankDays = computed(() => {
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
+  return getValue(props.data?.[`als_lst_${dimKey}_bank_csinteday`])
+})
+const nbankCons = computed(() => {
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
+  return getValue(props.data?.[`als_lst_${dimKey}_nbank_consnum`])
+})
+const nbankDays = computed(() => {
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
+  return getValue(props.data?.[`als_lst_${dimKey}_nbank_csinteday`])
+})
 
-const bankGap = computed(() => getValue(props.data?.als_lst_id_bank_inteday))
+const bankGap = computed(() => {
-const nbankGap = computed(() => getValue(props.data?.als_lst_id_nbank_inteday))
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
+  return getValue(props.data?.[`als_lst_${dimKey}_bank_inteday`])
+})
+const nbankGap = computed(() => {
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
+  return getValue(props.data?.[`als_lst_${dimKey}_nbank_inteday`])
+})
 
 const hasAnyData = computed(() => {
   return (
@@ -68,6 +72,18 @@ const hasAnyData = computed(() => {
     (nbankGap.value || 0) > 0
   )
 })
+
+// 数据项列表
+const dataItems = computed(() => {
+  return [
+    { label: '最近在银行连续申请次数', value: `${bankCons.value} 次` },
+    { label: '最近在银行连续申请天数', value: `${bankDays.value} 天` },
+    { label: '最近在非银连续申请次数', value: `${nbankCons.value} 次` },
+    { label: '最近在非银连续申请天数', value: `${nbankDays.value} 天` },
+    { label: '距最近一次在银行机构申请', value: `${bankGap.value} 天` },
+    { label: '距最近一次在非银机构申请', value: `${nbankGap.value} 天` }
+  ]
+})
 </script>
 
 <style scoped>
@@ -75,5 +91,3 @@ const hasAnyData = computed(() => {
   background: #ffffff;
 }
 </style>
-
-

src/ui/JRZQ6F2A/components/RiskSummarySection.vue

@@ -0,0 +1,69 @@
+<template>
+  <div class="card rounded-lg border border-gray-200 pb-2 mb-2">
+    <div class="px-4 pt-4 pb-4">
+      <LTitle title="风险汇总" />
+      <div class="space-y-0 mt-3 rounded-lg overflow-hidden">
+        <div v-for="(risk, index) in riskSummary" :key="risk.label"
+          :class="['flex justify-between items-center text-lg py-4 px-4', index % 2 === 0 ? 'bg-primary-50' : 'bg-white']">
+          <span class="text-gray-600">{{ risk.label }}</span>
+          <span class="font-semibold text-xl" :class="getRiskClass(risk.value)">{{ risk.value }}</span>
+        </div>
+      </div>
+    </div>
+
+    <!-- 风险汇总解读 -->
+    <Remark :content="riskRemark" title="风险解读" :default-expanded="true" />
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import LTitle from '@/components/LTitle.vue'
+import Remark from '@/components/Remark.vue'
+import { getRiskSummary, generateRiskRemark } from '../utils/dataParser'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({}),
+  },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id',
+  },
+})
+
+// 风险汇总
+const riskSummary = computed(() => {
+  return getRiskSummary(props.data || {}, props.dimension)
+})
+
+// 风险汇总解读文本
+const riskRemark = computed(() => {
+  return generateRiskRemark(riskSummary.value)
+})
+
+// 根据风险等级返回对应的样式类
+const getRiskClass = (level) => {
+  switch (level) {
+    case '无风险':
+      return 'text-green-600'
+    case '低风险':
+      return 'text-blue-600'
+    case '中风险':
+      return 'text-amber-600'
+    case '高风险':
+      return 'text-red-600'
+    default:
+      return 'text-gray-600'
+  }
+}
+</script>
+
+<style scoped>
+.card {
+  background: #ffffff;
+}
+</style>

src/ui/JRZQ6F2A/components/SummaryApplyStats.vue

@@ -1,21 +1,35 @@
 <template>
   <div class="card rounded-lg border border-gray-200 pb-2 mb-2">
-    <div class="flex items-center mb-4 p-4">
+    <div class="flex items-center justify-between mb-4 px-4 pt-4">
-      <span class="font-bold text-gray-800">借贷申请统计概览</span>
+      <LTitle title="统计概览" />
+      <!-- 维度切换按钮组 -->
+      <div class="inline-flex rounded-full overflow-hidden text-base">
+        <button class="px-4 py-1 border border-[#2B79EE] rounded-l-full"
+          :class="dimension === 'id' ? 'bg-[#2B79EE] text-white' : 'bg-white text-[#2B79EE]'"
+          @click="$emit('update:dimension', 'id')">
+          身份证匹配
+        </button>
+        <button class="px-4 py-1 border border-[#2B79EE] border-l-0 rounded-r-full"
+          :class="dimension === 'cell' ? 'bg-[#2B79EE] text-white' : 'bg-white text-[#2B79EE]'"
+          @click="$emit('update:dimension', 'cell')">
+          手机号匹配
+        </button>
+      </div>
     </div>
     <div class="grid grid-cols-2 gap-4 px-4 pb-4">
       <div v-for="item in items" :key="item.label"
         class="bg-blue-50 rounded-lg p-3 text-center border border-[#2B79EE1A]">
-        <div class="text-xl font-bold text-[#111827]">
+        <div class="text-2xl font-bold text-[#111827]">
           {{ item.value }}
-          <span class="text-xs text-gray-500 ml-1">{{ item.unit }}</span>
+          <span class="text-base text-gray-500 ml-1">{{ item.unit }}</span>
         </div>
-        <div class="text-xs text-gray-600 mt-1">
+        <div class="text-base text-gray-600 mt-1">
           {{ item.label }}
         </div>
       </div>
     </div>
   </div>
+
 </template>
 
 <script setup>
@@ -28,26 +42,34 @@ const props = defineProps({
     required: true,
     default: () => ({}),
   },
+  // 维度：id（身份证） / cell（手机号）
+  dimension: {
+    type: String,
+    default: 'id',
+  },
 })
 
 const items = computed(() => {
   const v = props.data || {}
 
   // 近12个月申请次数（总/银行/非银）
-  const m12 = getApplicationCounts(v, 'm12')
+  const m12 = getApplicationCounts(v, 'm12', props.dimension)
 
   // 近12个月申请机构总数（银行+非银）
-  const bankOrgs = getBankOrgDetails(v, 'm12')
+  const bankOrgs = getBankOrgDetails(v, 'm12', props.dimension)
-  const nbankOrgs = getNBankOrgDetails(v, 'm12')
+  const nbankOrgs = getNBankOrgDetails(v, 'm12', props.dimension)
   const bankOrgTotal = Object.values(bankOrgs || {}).reduce((sum, val) => sum + (val || 0), 0)
   const nbankOrgTotal = Object.values(nbankOrgs || {}).reduce((sum, val) => sum + (val || 0), 0)
   const orgTotal = bankOrgTotal + nbankOrgTotal
 
   // 近12个月周末 / 夜间申请次数（银行+非银）
+  const dimKey = props.dimension === 'cell' ? 'cell' : 'id'
   const weekendTotal =
-    Number(v.als_m12_id_bank_week_allnum || 0) + Number(v.als_m12_id_nbank_week_allnum || 0)
+    Number(v[`als_m12_${dimKey}_bank_week_allnum`] || 0) +
+    Number(v[`als_m12_${dimKey}_nbank_week_allnum`] || 0)
   const nightTotal =
-    Number(v.als_m12_id_bank_night_allnum || 0) + Number(v.als_m12_id_nbank_night_allnum || 0)
+    Number(v[`als_m12_${dimKey}_bank_night_allnum`] || 0) +
+    Number(v[`als_m12_${dimKey}_nbank_night_allnum`] || 0)
 
   return [
     { label: '总申请次数', value: m12.total || 0, unit: '次' },

src/ui/JRZQ6F2A/index.vue

@@ -1,27 +1,30 @@
 <template>
   <div class="flex flex-col gap-4">
-    <!-- 统计概览小模块 -->
+    <!-- 统计概览小模块（内部自带维度切换按钮） -->
-    <SummaryApplyStats :data="variableValue" />
+    <SummaryApplyStats v-model:dimension="activeDimension" :data="variableValue" />
 
     <!-- 申请次数 -->
-    <ApplicationCountSection :data="variableValue" />
+    <ApplicationCountSection :data="variableValue" :dimension="activeDimension" />
 
     <!-- 产品类型申请分布 -->
-    <ProductTypeDistributionSection :data="variableValue" />
+    <ProductTypeDistributionSection :data="variableValue" :dimension="activeDimension" />
 
     <!-- 近期集中申请提示 -->
-    <RecentIntensiveApplicationSection :data="variableValue" />
+    <RecentIntensiveApplicationSection :data="variableValue" :dimension="activeDimension" />
 
     <!-- 申请总次数 (银行+非银) -->
-    <ApplicationTotalSection :data="variableValue" />
+    <ApplicationTotalSection :data="variableValue" :dimension="activeDimension" />
 
     <!-- 申请机构总数 (银行+非银) -->
-    <InstitutionTotalSection :data="variableValue" />
+    <InstitutionTotalSection :data="variableValue" :dimension="activeDimension" />
+
+    <!-- 风险汇总 -->
+    <RiskSummarySection :data="variableValue" :dimension="activeDimension" />
   </div>
 </template>
 
 <script setup>
-import { computed } from 'vue'
+import { computed, ref } from 'vue'
 import { useRiskNotifier } from '@/composables/useRiskNotifier'
 import { extractVariableValue } from './utils/dataParser'
 import ApplicationCountSection from './components/ApplicationCountSection.vue'
@@ -30,6 +33,7 @@ import InstitutionTotalSection from './components/InstitutionTotalSection.vue'
 import SummaryApplyStats from './components/SummaryApplyStats.vue'
 import ProductTypeDistributionSection from './components/ProductTypeDistributionSection.vue'
 import RecentIntensiveApplicationSection from './components/RecentIntensiveApplicationSection.vue'
+import RiskSummarySection from './components/RiskSummarySection.vue'
 
 const props = defineProps({
   data: {
@@ -51,6 +55,9 @@ const props = defineProps({
   },
 })
 
+// 当前维度：id（身份证） / cell（手机号）
+const activeDimension = ref('id')
+
 // 获取数据
 const rawData = computed(() => props.data?.data || props.data || {})
 
@@ -60,6 +67,7 @@ const variableValue = computed(() => extractVariableValue(rawData.value))
 // 计算风险评分（0-100分，分数越高越安全）
 const riskScore = computed(() => {
   const data = variableValue.value
+  const dimKey = activeDimension.value === 'cell' ? 'cell' : 'id'
 
   if (!data || Object.keys(data).length === 0) {
     return 100 // 无数据视为最安全
@@ -68,7 +76,9 @@ const riskScore = computed(() => {
   let score = 100 // 初始满分
 
   // 近7天申请次数评估
-  const d7Total = parseInt(data.als_d7_id_bank_allnum || 0) + parseInt(data.als_d7_id_nbank_allnum || 0)
+  const d7Total =
+    parseInt(data[`als_d7_${dimKey}_bank_allnum`] || 0) +
+    parseInt(data[`als_d7_${dimKey}_nbank_allnum`] || 0)
   if (d7Total > 5) {
     score -= 20 // 近7天申请过多
   } else if (d7Total > 3) {
@@ -76,7 +86,9 @@ const riskScore = computed(() => {
   }
 
   // 近15天申请次数评估
-  const d15Total = parseInt(data.als_d15_id_bank_allnum || 0) + parseInt(data.als_d15_id_nbank_allnum || 0)
+  const d15Total =
+    parseInt(data[`als_d15_${dimKey}_bank_allnum`] || 0) +
+    parseInt(data[`als_d15_${dimKey}_nbank_allnum`] || 0)
   if (d15Total > 10) {
     score -= 15
   } else if (d15Total > 5) {
@@ -84,7 +96,9 @@ const riskScore = computed(() => {
   }
 
   // 近1个月申请次数评估
-  const m1Total = parseInt(data.als_m1_id_bank_allnum || 0) + parseInt(data.als_m1_id_nbank_allnum || 0)
+  const m1Total =
+    parseInt(data[`als_m1_${dimKey}_bank_allnum`] || 0) +
+    parseInt(data[`als_m1_${dimKey}_nbank_allnum`] || 0)
   if (m1Total > 15) {
     score -= 20
   } else if (m1Total > 8) {
@@ -92,7 +106,9 @@ const riskScore = computed(() => {
   }
 
   // 近3个月申请次数评估
-  const m3Total = parseInt(data.als_m3_id_bank_allnum || 0) + parseInt(data.als_m3_id_nbank_allnum || 0)
+  const m3Total =
+    parseInt(data[`als_m3_${dimKey}_bank_allnum`] || 0) +
+    parseInt(data[`als_m3_${dimKey}_nbank_allnum`] || 0)
   if (m3Total > 20) {
     score -= 15
   } else if (m3Total > 10) {
@@ -100,7 +116,9 @@ const riskScore = computed(() => {
   }
 
   // 近6个月申请次数评估
-  const m6Total = parseInt(data.als_m6_id_bank_allnum || 0) + parseInt(data.als_m6_id_nbank_allnum || 0)
+  const m6Total =
+    parseInt(data[`als_m6_${dimKey}_bank_allnum`] || 0) +
+    parseInt(data[`als_m6_${dimKey}_nbank_allnum`] || 0)
   if (m6Total > 30) {
     score -= 10
   } else if (m6Total > 15) {

src/ui/JRZQ6F2A/utils/dataParser.js

@@ -1,6 +1,6 @@
 /**
  * 数据解析工具函数
- * 用于解析借贷申请验证A的返回数据
+ * 用于解析借贷意向验证A的返回数据
  */
 
 /**
@@ -53,19 +53,20 @@ export const PERIOD_MAP = {
 /**
  * 获取申请次数（按时间段）
  */
-export function getApplicationCounts(variableValue, period) {
+export function getApplicationCounts(variableValue, period, dimension = "id") {
     const { prefix } = PERIOD_MAP[period];
+    const dimKey = dimension === "cell" ? "cell" : "id";
 
     // 计算总申请次数（所有类型的申请次数之和）
     const types = [
-        "id_pdl_allnum", // 线上小额现金贷
+        `${dimKey}_pdl_allnum`, // 线上小额现金贷
-        "id_caon_allnum", // 线上现金分期
+        `${dimKey}_caon_allnum`, // 线上现金分期
-        "id_rel_allnum", // 信用卡（类信用卡）
+        `${dimKey}_rel_allnum`, // 信用卡（类信用卡）
-        "id_caoff_allnum", // 线下现金分期
+        `${dimKey}_caoff_allnum`, // 线下现金分期
-        "id_cooff_allnum", // 线下消费分期
+        `${dimKey}_cooff_allnum`, // 线下消费分期
-        "id_af_allnum", // 汽车金融
+        `${dimKey}_af_allnum`, // 汽车金融
-        "id_coon_allnum", // 线上消费分期
+        `${dimKey}_coon_allnum`, // 线上消费分期
-        "id_oth_allnum", // 其他
+        `${dimKey}_oth_allnum`, // 其他
     ];
 
     let total = 0;
@@ -75,11 +76,12 @@ export function getApplicationCounts(variableValue, period) {
     });
 
     // 银行机构申请次数
-    const bankTotal = getValue(variableValue[`${prefix}_id_bank_allnum`]) || 0;
+    const bankTotal =
+        getValue(variableValue[`${prefix}_${dimKey}_bank_allnum`]) || 0;
 
     // 非银机构申请次数
     const nbankTotal =
-        getValue(variableValue[`${prefix}_id_nbank_allnum`]) || 0;
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_allnum`]) || 0;
 
     // 如果计算出的total为0，则使用银行+非银的总和
     const finalTotal = total > 0 ? total : bankTotal + nbankTotal;
@@ -94,17 +96,22 @@ export function getApplicationCounts(variableValue, period) {
 /**
  * 获取特殊时段（周末/夜间）申请次数（按时间段，银行+非银）
  */
-export function getSpecialPeriodCounts(variableValue, period) {
+export function getSpecialPeriodCounts(
+    variableValue,
+    period,
+    dimension = "id"
+) {
     const { prefix } = PERIOD_MAP[period];
+    const dimKey = dimension === "cell" ? "cell" : "id";
 
     const weekendBank =
-        getValue(variableValue[`${prefix}_id_bank_week_allnum`]) || 0;
+        getValue(variableValue[`${prefix}_${dimKey}_bank_week_allnum`]) || 0;
     const weekendNbank =
-        getValue(variableValue[`${prefix}_id_nbank_week_allnum`]) || 0;
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_week_allnum`]) || 0;
     const nightBank =
-        getValue(variableValue[`${prefix}_id_bank_night_allnum`]) || 0;
+        getValue(variableValue[`${prefix}_${dimKey}_bank_night_allnum`]) || 0;
     const nightNbank =
-        getValue(variableValue[`${prefix}_id_nbank_night_allnum`]) || 0;
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_night_allnum`]) || 0;
 
     return {
         weekend: weekendBank + weekendNbank,
@@ -115,88 +122,116 @@ export function getSpecialPeriodCounts(variableValue, period) {
 /**
  * 获取银行机构申请次数详情
  */
-export function getBankApplicationDetails(variableValue, period) {
+export function getBankApplicationDetails(
+    variableValue,
+    period,
+    dimension = "id"
+) {
     const { prefix } = PERIOD_MAP[period];
+    const dimKey = dimension === "cell" ? "cell" : "id";
 
     return {
-        pdl: getValue(variableValue[`${prefix}_id_pdl_allnum`]), // 线上小额现金贷
+        pdl: getValue(variableValue[`${prefix}_${dimKey}_pdl_allnum`]), // 线上小额现金贷
-        caon: getValue(variableValue[`${prefix}_id_caon_allnum`]), // 线上现金分期
+        caon: getValue(variableValue[`${prefix}_${dimKey}_caon_allnum`]), // 线上现金分期
-        rel: getValue(variableValue[`${prefix}_id_rel_allnum`]), // 信用卡（类信用卡）
+        rel: getValue(variableValue[`${prefix}_${dimKey}_rel_allnum`]), // 信用卡（类信用卡）
-        caoff: getValue(variableValue[`${prefix}_id_caoff_allnum`]), // 线下现金分期
+        caoff: getValue(variableValue[`${prefix}_${dimKey}_caoff_allnum`]), // 线下现金分期
-        cooff: getValue(variableValue[`${prefix}_id_cooff_allnum`]), // 线下消费分期
+        cooff: getValue(variableValue[`${prefix}_${dimKey}_cooff_allnum`]), // 线下消费分期
-        af: getValue(variableValue[`${prefix}_id_af_allnum`]), // 汽车金融
+        af: getValue(variableValue[`${prefix}_${dimKey}_af_allnum`]), // 汽车金融
-        coon: getValue(variableValue[`${prefix}_id_coon_allnum`]), // 线上消费分期
+        coon: getValue(variableValue[`${prefix}_${dimKey}_coon_allnum`]), // 线上消费分期
-        oth: getValue(variableValue[`${prefix}_id_oth_allnum`]), // 其他
+        oth: getValue(variableValue[`${prefix}_${dimKey}_oth_allnum`]), // 其他
-        bank: getValue(variableValue[`${prefix}_id_bank_allnum`]), // 银行机构申请
+        bank: getValue(variableValue[`${prefix}_${dimKey}_bank_allnum`]), // 银行机构申请
-        tra: getValue(variableValue[`${prefix}_id_bank_tra_allnum`]), // 传统银行申请
+        tra: getValue(variableValue[`${prefix}_${dimKey}_bank_tra_allnum`]), // 传统银行申请
-        ret: getValue(variableValue[`${prefix}_id_bank_ret_allnum`]), // 网络零售银行申请
+        ret: getValue(variableValue[`${prefix}_${dimKey}_bank_ret_allnum`]), // 网络零售银行申请
     };
 }
 
 /**
  * 获取非银机构申请次数详情
  */
-export function getNBankApplicationDetails(variableValue, period) {
+export function getNBankApplicationDetails(
+    variableValue,
+    period,
+    dimension = "id"
+) {
     const { prefix } = PERIOD_MAP[period];
+    const dimKey = dimension === "cell" ? "cell" : "id";
 
     return {
-        nbank: getValue(variableValue[`${prefix}_id_nbank_allnum`]), // 非银机构
+        nbank: getValue(variableValue[`${prefix}_${dimKey}_nbank_allnum`]), // 非银机构
-        p2p: getValue(variableValue[`${prefix}_id_nbank_p2p_allnum`]), // 改制机构
+        p2p: getValue(variableValue[`${prefix}_${dimKey}_nbank_p2p_allnum`]), // 改制机构
-        mc: getValue(variableValue[`${prefix}_id_nbank_mc_allnum`]), // 小贷机构
+        mc: getValue(variableValue[`${prefix}_${dimKey}_nbank_mc_allnum`]), // 小贷机构
-        ca: getValue(variableValue[`${prefix}_id_nbank_ca_allnum`]), // 现金类分期机构
+        ca: getValue(variableValue[`${prefix}_${dimKey}_nbank_ca_allnum`]), // 现金类分期机构
-        cf: getValue(variableValue[`${prefix}_id_nbank_cf_allnum`]), // 消费类分期机构
+        cf: getValue(variableValue[`${prefix}_${dimKey}_nbank_cf_allnum`]), // 消费类分期机构
-        com: getValue(variableValue[`${prefix}_id_nbank_com_allnum`]), // 代偿类分期机构
+        com: getValue(variableValue[`${prefix}_${dimKey}_nbank_com_allnum`]), // 代偿类分期机构
-        oth: getValue(variableValue[`${prefix}_id_nbank_oth_allnum`]), // 其他申请
+        oth: getValue(variableValue[`${prefix}_${dimKey}_nbank_oth_allnum`]), // 其他申请
-        nsloan: getValue(variableValue[`${prefix}_id_nbank_nsloan_allnum`]), // 持牌网络小贷机构
+        nsloan: getValue(
-        autofin: getValue(variableValue[`${prefix}_id_nbank_autofin_allnum`]), // 持牌汽车金融机构
+            variableValue[`${prefix}_${dimKey}_nbank_nsloan_allnum`]
-        sloan: getValue(variableValue[`${prefix}_id_nbank_sloan_allnum`]), // 持牌小贷机构
+        ), // 持牌网络小贷机构
-        cons: getValue(variableValue[`${prefix}_id_nbank_cons_allnum`]), // 持牌消费金融机构
+        autofin: getValue(
-        finlea: getValue(variableValue[`${prefix}_id_nbank_finlea_allnum`]), // 持牌融资租赁机构
+            variableValue[`${prefix}_${dimKey}_nbank_autofin_allnum`]
-        else: getValue(variableValue[`${prefix}_id_nbank_else_allnum`]), // 其他申请
+        ), // 持牌汽车金融机构
+        sloan: getValue(
+            variableValue[`${prefix}_${dimKey}_nbank_sloan_allnum`]
+        ), // 持牌小贷机构
+        cons: getValue(variableValue[`${prefix}_${dimKey}_nbank_cons_allnum`]), // 持牌消费金融机构
+        finlea: getValue(
+            variableValue[`${prefix}_${dimKey}_nbank_finlea_allnum`]
+        ), // 持牌融资租赁机构
+        else: getValue(variableValue[`${prefix}_${dimKey}_nbank_else_allnum`]), // 其他申请
     };
 }
 
 /**
  * 获取银行机构申请机构数详情
  */
-export function getBankOrgDetails(variableValue, period) {
+export function getBankOrgDetails(variableValue, period, dimension = "id") {
     const { prefix } = PERIOD_MAP[period];
+    const dimKey = dimension === "cell" ? "cell" : "id";
 
     return {
-        pdl: getValue(variableValue[`${prefix}_id_pdl_orgnum`]),
+        pdl: getValue(variableValue[`${prefix}_${dimKey}_pdl_orgnum`]),
-        caon: getValue(variableValue[`${prefix}_id_caon_orgnum`]),
+        caon: getValue(variableValue[`${prefix}_${dimKey}_caon_orgnum`]),
-        rel: getValue(variableValue[`${prefix}_id_rel_orgnum`]),
+        rel: getValue(variableValue[`${prefix}_${dimKey}_rel_orgnum`]),
-        caoff: getValue(variableValue[`${prefix}_id_caoff_orgnum`]),
+        caoff: getValue(variableValue[`${prefix}_${dimKey}_caoff_orgnum`]),
-        cooff: getValue(variableValue[`${prefix}_id_cooff_orgnum`]),
+        cooff: getValue(variableValue[`${prefix}_${dimKey}_cooff_orgnum`]),
-        af: getValue(variableValue[`${prefix}_id_af_orgnum`]),
+        af: getValue(variableValue[`${prefix}_${dimKey}_af_orgnum`]),
-        coon: getValue(variableValue[`${prefix}_id_coon_orgnum`]),
+        coon: getValue(variableValue[`${prefix}_${dimKey}_coon_orgnum`]),
-        oth: getValue(variableValue[`${prefix}_id_oth_orgnum`]),
+        oth: getValue(variableValue[`${prefix}_${dimKey}_oth_orgnum`]),
-        bank: getValue(variableValue[`${prefix}_id_bank_orgnum`]),
+        bank: getValue(variableValue[`${prefix}_${dimKey}_bank_orgnum`]),
-        tra: getValue(variableValue[`${prefix}_id_bank_tra_orgnum`]),
+        tra: getValue(variableValue[`${prefix}_${dimKey}_bank_tra_orgnum`]),
-        ret: getValue(variableValue[`${prefix}_id_bank_ret_orgnum`]),
+        ret: getValue(variableValue[`${prefix}_${dimKey}_bank_ret_orgnum`]),
     };
 }
 
 /**
  * 获取非银机构申请机构数详情
  */
-export function getNBankOrgDetails(variableValue, period) {
+export function getNBankOrgDetails(variableValue, period, dimension = "id") {
     const { prefix } = PERIOD_MAP[period];
+    const dimKey = dimension === "cell" ? "cell" : "id";
 
     return {
-        nbank: getValue(variableValue[`${prefix}_id_nbank_orgnum`]),
+        nbank: getValue(variableValue[`${prefix}_${dimKey}_nbank_orgnum`]),
-        p2p: getValue(variableValue[`${prefix}_id_nbank_p2p_orgnum`]),
+        p2p: getValue(variableValue[`${prefix}_${dimKey}_nbank_p2p_orgnum`]),
-        mc: getValue(variableValue[`${prefix}_id_nbank_mc_orgnum`]),
+        mc: getValue(variableValue[`${prefix}_${dimKey}_nbank_mc_orgnum`]),
-        ca: getValue(variableValue[`${prefix}_id_nbank_ca_orgnum`]),
+        ca: getValue(variableValue[`${prefix}_${dimKey}_nbank_ca_orgnum`]),
-        cf: getValue(variableValue[`${prefix}_id_nbank_cf_orgnum`]),
+        cf: getValue(variableValue[`${prefix}_${dimKey}_nbank_cf_orgnum`]),
-        com: getValue(variableValue[`${prefix}_id_nbank_com_orgnum`]),
+        com: getValue(variableValue[`${prefix}_${dimKey}_nbank_com_orgnum`]),
-        oth: getValue(variableValue[`${prefix}_id_nbank_oth_orgnum`]),
+        oth: getValue(variableValue[`${prefix}_${dimKey}_nbank_oth_orgnum`]),
-        nsloan: getValue(variableValue[`${prefix}_id_nbank_nsloan_orgnum`]),
+        nsloan: getValue(
-        autofin: getValue(variableValue[`${prefix}_id_nbank_autofin_orgnum`]),
+            variableValue[`${prefix}_${dimKey}_nbank_nsloan_orgnum`]
-        sloan: getValue(variableValue[`${prefix}_id_nbank_sloan_orgnum`]),
+        ),
-        cons: getValue(variableValue[`${prefix}_id_nbank_cons_orgnum`]),
+        autofin: getValue(
-        finlea: getValue(variableValue[`${prefix}_id_nbank_finlea_orgnum`]),
+            variableValue[`${prefix}_${dimKey}_nbank_autofin_orgnum`]
-        else: getValue(variableValue[`${prefix}_id_nbank_else_orgnum`]),
+        ),
+        sloan: getValue(
+            variableValue[`${prefix}_${dimKey}_nbank_sloan_orgnum`]
+        ),
+        cons: getValue(variableValue[`${prefix}_${dimKey}_nbank_cons_orgnum`]),
+        finlea: getValue(
+            variableValue[`${prefix}_${dimKey}_nbank_finlea_orgnum`]
+        ),
+        else: getValue(variableValue[`${prefix}_${dimKey}_nbank_else_orgnum`]),
     };
 }
 
@@ -235,3 +270,249 @@ export const FIELD_LABELS = {
         else: "其他申请",
     },
 };
+
+/**
+ * 根据申请次数计算风险等级
+ * @param {number} count 申请次数
+ * @returns {string} 风险等级：无风险、低风险、中风险、高风险
+ */
+export function calculateRiskLevel(count) {
+    const num = Number(count) || 0;
+    if (num === 0) {
+        return "无风险";
+    } else if (num >= 1 && num <= 3) {
+        return "低风险";
+    } else if (num >= 4 && num <= 8) {
+        return "中风险";
+    } else {
+        return "高风险";
+    }
+}
+
+/**
+ * 获取各机构类型的风险汇总（近12个月）
+ * @param {Object} variableValue 数据对象
+ * @param {string} dimension 维度：id（身份证） / cell（手机号）
+ * @returns {Array} 风险汇总列表，格式：[{label: '机构类型风险等级', value: '风险等级'}]
+ */
+export function getRiskSummary(variableValue, dimension = "id") {
+    const dimKey = dimension === "cell" ? "cell" : "id";
+    const prefix = "als_m12"; // 近12个月
+
+    // 银行类机构申请次数
+    const bankCount =
+        getValue(variableValue[`${prefix}_${dimKey}_bank_allnum`]) || 0;
+
+    // 非银行类机构申请次数
+    const nbankCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_allnum`]) || 0;
+
+    // 持牌网络小贷机构申请次数
+    const nsloanCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_nsloan_allnum`]) || 0;
+
+    // 持牌小贷机构申请次数
+    const sloanCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_sloan_allnum`]) || 0;
+
+    // 持牌消费金融机构申请次数
+    const consCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_cons_allnum`]) || 0;
+
+    // 持牌融资租赁机构申请次数
+    const finleaCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_finlea_allnum`]) || 0;
+
+    // 持牌汽车金融机构申请次数
+    const autofinCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_autofin_allnum`]) ||
+        0;
+
+    // 其他非银机构申请次数（包括 p2p, mc, ca, cf, com, oth, else）
+    const p2pCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_p2p_allnum`]) || 0;
+    const mcCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_mc_allnum`]) || 0;
+    const caCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_ca_allnum`]) || 0;
+    const cfCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_cf_allnum`]) || 0;
+    const comCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_com_allnum`]) || 0;
+    const othCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_oth_allnum`]) || 0;
+    const elseCount =
+        getValue(variableValue[`${prefix}_${dimKey}_nbank_else_allnum`]) || 0;
+    const otherNbankCount =
+        p2pCount +
+        mcCount +
+        caCount +
+        cfCount +
+        comCount +
+        othCount +
+        elseCount;
+
+    return [
+        {
+            label: "银行类机构风险等级",
+            value: calculateRiskLevel(bankCount),
+            count: bankCount,
+        },
+        {
+            label: "非银行类机构风险等级",
+            value: calculateRiskLevel(nbankCount),
+            count: nbankCount,
+        },
+        {
+            label: "持牌网络小贷机构风险等级",
+            value: calculateRiskLevel(nsloanCount),
+            count: nsloanCount,
+        },
+        {
+            label: "持牌小贷机构风险等级",
+            value: calculateRiskLevel(sloanCount),
+            count: sloanCount,
+        },
+        {
+            label: "持牌消费金融机构风险等级",
+            value: calculateRiskLevel(consCount),
+            count: consCount,
+        },
+        {
+            label: "持牌融资租赁机构风险等级",
+            value: calculateRiskLevel(finleaCount),
+            count: finleaCount,
+        },
+        {
+            label: "持牌汽车金融机构风险等级",
+            value: calculateRiskLevel(autofinCount),
+            count: autofinCount,
+        },
+        {
+            label: "其他非银机构风险等级",
+            value: calculateRiskLevel(otherNbankCount),
+            count: otherNbankCount,
+        },
+    ];
+}
+
+/**
+ * 生成风险汇总解读文本
+ * @param {Array} riskSummary 风险汇总列表
+ * @returns {string} 解读文本
+ */
+export function generateRiskRemark(riskSummary) {
+    if (!riskSummary || riskSummary.length === 0) {
+        return "暂无风险数据。";
+    }
+
+    // 按风险等级优先级排序：高风险 > 中风险 > 低风险 > 无风险
+    const riskPriority = { 高风险: 4, 中风险: 3, 低风险: 2, 无风险: 1 };
+    const sortedRisks = riskSummary
+        .filter((r) => r.value !== "无风险")
+        .sort(
+            (a, b) =>
+                (riskPriority[b.value] || 0) - (riskPriority[a.value] || 0)
+        );
+
+    if (sortedRisks.length === 0) {
+        return "经大数据分析，您在各机构类型的风险等级均为无风险，信用状况良好。请您继续保持良好的借还款履约行为，维护个人信用。";
+    }
+
+    // 取最高风险的机构类型
+    const highestRisk = sortedRisks[0];
+    const orgType = highestRisk.label.replace("风险等级", ""); // 去掉"风险等级"后缀
+    const riskLevel = highestRisk.value;
+    const count = highestRisk.count || 0;
+
+    // 生成解读文本
+    let remark = `经大数据分析，您命中${orgType}风险等级的${riskLevel}名单`;
+
+    if (count > 0) {
+        remark += `，历史命中 ${count} 次`;
+    }
+
+    remark += `，最近一次进入${orgType}风险等级的${riskLevel}名单在近 1 年内。请您注意对应机构的正常借还款履约行为，提高信用评价。`;
+
+    return remark;
+}
+
+/**
+ * 将风险等级映射为“贷款申请需求”文本
+ */
+function mapRiskToDemandText(level) {
+    switch (level) {
+        case "高风险":
+            return "贷款申请需求较高";
+        case "中风险":
+            return "贷款申请需求适中";
+        case "低风险":
+        case "无风险":
+        default:
+            return "贷款申请需求较低";
+    }
+}
+
+/**
+ * 将风险等级映射为“贷款申请频率”文本
+ */
+function mapRiskToFrequencyText(level) {
+    switch (level) {
+        case "高风险":
+            return "贷款申请频率较高";
+        case "中风险":
+            return "贷款申请频率适中";
+        case "低风险":
+        case "无风险":
+        default:
+            return "贷款申请频率较低";
+    }
+}
+
+/**
+ * 生成银行 / 非银申请情况解读（近1年 / 近3个月）
+ * @param {Object} variableValue
+ * @param {string} dimension
+ * @returns {{ bankSituation: string, bankAdvice: string, nbankSituation: string, nbankAdvice: string }}
+ */
+export function getApplyRemarks(variableValue, dimension = "id") {
+    const v = variableValue || {};
+
+    // 近12个月 & 近3个月 申请次数
+    const m12 = getApplicationCounts(v, "m12", dimension);
+    const m3 = getApplicationCounts(v, "m3", dimension);
+
+    const bankYearCount = m12.bank || 0;
+    const bank3mCount = m3.bank || 0;
+    const nbankYearCount = m12.nbank || 0;
+    const nbank3mCount = m3.nbank || 0;
+
+    // 使用风险等级来映射需求 / 频率文本
+    const bankYearRisk = calculateRiskLevel(bankYearCount);
+    const bank3mRisk = calculateRiskLevel(bank3mCount);
+    const nbankYearRisk = calculateRiskLevel(nbankYearCount);
+    const nbank3mRisk = calculateRiskLevel(nbank3mCount);
+
+    const bankDemandText = mapRiskToDemandText(bankYearRisk);
+    const bankFreqText = mapRiskToFrequencyText(bank3mRisk);
+    const nbankDemandText = mapRiskToDemandText(nbankYearRisk);
+    const nbankFreqText = mapRiskToFrequencyText(nbank3mRisk);
+
+    const advice =
+        "报告检测的是近12个月内的申请数据，含同一机构。如果申请过于频繁会对评审有影响，请保持良好的借贷习惯，切勿频繁申请，拒绝不明平台的审核邀请。";
+
+    const bankSituation =
+        `近一年申请次数：${bankYearCount}次，${bankDemandText}\n` +
+        `近3个月申请次数：${bank3mCount}次，${bankFreqText}`;
+
+    const nbankSituation =
+        `近一年申请次数：${nbankYearCount}次，${nbankDemandText}\n` +
+        `近3个月申请次数：${nbank3mCount}次，${nbankFreqText}`;
+
+    return {
+        bankSituation,
+        bankAdvice: advice,
+        nbankSituation,
+        nbankAdvice: advice,
+    };
+}

src/views/Example.vue

@@ -1,6 +1,9 @@
 <template>
     <BaseReport :feature="feature" :reportData="reportData" :reportParams="reportParams" :reportName="reportName"
         :reportDateTime="reportDateTime" :isEmpty="isEmpty" :isDone="isDone" isExample />
+    <div class="w-20 h-20 z-[1000] fixed right-0 top-1/2 -translate-y-1/2">
+        <img src="@/assets/images/example_sy.png" alt="example" class="w-full h-full object-contain" />
+    </div>
 </template>
 
 <script setup>