change

src/ui/JRZQ6F2A/components/InstitutionTotalSection.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="card institution-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 text-lg">申请机构总数 (银行+非银) {{ totalCount }}家</span>
+      </div>
+      
+      <!-- Tab切换 -->
+      <div class="px-4 mb-4">
+        <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">
+              <!-- 银行机构 -->
+              <BankOrgSection :data="data" :period="period.key" />
+              
+              <!-- 非银机构 -->
+              <NBankOrgSection :data="data" :period="period.key" />
+            </div>
+          </van-tab>
+        </van-tabs>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed, ref } from 'vue'
+import { getBankOrgDetails, getNBankOrgDetails } from '../utils/dataParser'
+import BankOrgSection from './BankOrgSection.vue'
+import NBankOrgSection from './NBankOrgSection.vue'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    required: true,
+    default: () => ({})
+  }
+})
+
+const activeTab = ref(5) // 默认显示12个月
+
+const periods = [
+  { key: 'd7', label: '7天' },
+  { key: 'd15', label: '15天' },
+  { key: 'm1', label: '1个月' },
+  { key: 'm3', label: '3个月' },
+  { 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 scoped>
+.card {
+  background: #ffffff;
+}
+</style>
+
+