temp

src/ui/CIDV044.vue

@@ -0,0 +1,87 @@
+<script setup>
+import LTitle from "@/components/LTitle.vue";
+
+const props = defineProps({
+    data: {
+        type: Object,
+        required: true,
+    },
+});
+const { data } = props;
+
+// 状态映射，包括显示的文字和样式
+const statusMap = {
+    0: {
+        text: "未婚或尚未登记结婚",
+        bgClass: "bg-yellow-100",
+        textClass: "text-yellow-700",
+        description: "未进行民政登记婚姻",
+    },
+    1: {
+        text: "已婚",
+        bgClass: "bg-green-100",
+        textClass: "text-green-700",
+        description: "已登记婚姻，家庭幸福美满",
+    },
+    2: {
+        text: "离异",
+        bgClass: "bg-red-100",
+        textClass: "text-red-700",
+        description: "离异状态，未来生活可期",
+    },
+    3: {
+        text: "离婚冷静期",
+        bgClass: "bg-blue-100",
+        textClass: "text-blue-700",
+        description: "目前处于离婚冷静期，请谨慎决策",
+    },
+};
+
+// 根据 `data.status` 确定当前状态，默认值为 “无相关记录”
+const currentStatus =
+    data.status !== undefined
+        ? statusMap[data.status] || statusMap["0"]
+        : {
+            text: "无相关记录",
+            bgClass: "bg-gray-200",
+            textClass: "text-gray-500",
+            description: "暂无婚姻相关记录",
+        };
+</script>
+
+<template>
+    <div class="card">
+        <div class="status-info flex flex-col items-center ">
+            <div
+                :class="`status-label rounded-full px-6 py-3 text-center font-bold shadow-md ${currentStatus.bgClass} ${currentStatus.textClass}`">
+                {{ currentStatus.text }}
+            </div>
+            <p class="status-description mt-3 text-sm text-gray-600">
+                {{ currentStatus.description }}
+            </p>
+        </div>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.status-info {
+    text-align: center;
+}
+
+.status-label {
+    font-size: 1.25rem;
+    padding: 0.75rem 1.5rem;
+    border-radius: 9999px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+.status-description {
+    color: #4a5568;
+    margin-top: 0.5rem;
+    font-weight: 500;
+}
+
+.additional-info p {
+    margin-top: 0.5rem;
+}
+</style>

src/ui/CLawsuitPP.vue

@@ -0,0 +1,377 @@
+<script setup>
+import LTitle from "@/components/LTitle.vue";
+import { defineProps, onMounted, ref, computed } from "vue";
+import * as echarts from "echarts";
+
+const props = defineProps({
+    data: {
+        type: Object,
+        required: true,
+    },
+});
+// 正确解构props.data中的字段并处理默认值
+const {
+    entout: PropEntout = [],
+    sxbzxr: PropSxbzxr = [],
+    xgbzxr: PropXgbzxr = []
+} = props.data || {}
+
+// 安全获取entout数据(带响应式)
+const entout = ref(PropEntout[0]?.entout || {
+    administrative: {},
+    bankrupt: {},
+    cases_tree: { criminal: [] },
+    civil: {},
+    count: {},
+    criminal: { cases: [], count: {} },
+    implement: {},
+    preservation: {}
+})
+
+// 获取其他字段(按需添加响应式)
+const sx = ref(PropSxbzxr[0]?.sxbzxr || [])
+const xg = ref(PropXgbzxr[0]?.xgbzxr || [])
+const fieldLabel = [
+    // ================= 案件基础信息 =================
+    { "field": "n_jbfy", "label": "经办法院" },
+
+    { "field": "n_jbfy_cj", "label": "法院所属层级" },
+    { "field": "c_ssdy", "label": "所属地域" },
+
+    // ================= 时间维度 =================
+    { "field": "d_larq", "label": "立案时间" },
+    { "field": "larq_stat", "label": "涉案时间分布" },
+    { "field": "d_jarq", "label": "结案时间" },
+
+    // ================= 案由与罪名 =================
+    { "field": "n_laay", "label": "立案案由" },
+    { "field": "n_laay_tag", "label": "立案案由标签" },
+    { "field": "n_laay_tree", "label": "立案案由详细" },
+    { "field": "n_jaay", "label": "结案案由" },
+
+    { "field": "n_jaay_tag", "label": "结案案由标签" },
+    { "field": "n_jaay_tree", "label": "结案案由详细" },
+    { "field": "n_dzzm", "label": "定罪罪名" },
+    { "field": "n_dzzm_tree", "label": "定罪罪名详细" },
+
+    // ================= 当事人与诉讼 =================
+    { "field": "c_gkws_dsr", "label": "当事人" },
+    { "field": "n_dsrlx", "label": "当事人类型" },
+    { "field": "n_ssdw", "label": "诉讼地位" },
+    { "field": "n_ssdw_ys", "label": "一审诉讼地位" },
+    { "field": "c_gkws_glah", "label": "相关案件号" },
+
+    // ================= 审理与判决 =================
+    { "field": "n_slcx", "label": "审理程序" },
+    { "field": "c_slfsxx", "label": "审理方式信息" },
+    { "field": "n_ajjzjd", "label": "案件进展阶段" },
+    { "field": "n_pcjg", "label": "判处结果" },
+    { "field": "c_gkws_pjjg", "label": "判决结果" },
+    { "field": "n_pj_victory", "label": "胜诉估计" },
+
+    // ================= 金额与执行 =================
+    // --- 起诉金额 ---
+    { "field": "n_qsbdje_level", "label": "起诉标的金额等级" },
+    { "field": "n_qsbdje", "label": "起诉标的金额" },
+    { "field": "n_qsbdje_gj_level", "label": "起诉标的金额估计等级" },
+    { "field": "n_qsbdje_gj", "label": "起诉标的金额估计" },
+
+    // --- 结案金额 ---
+    { "field": "n_jabdje_level", "label": "结案标的金额等级" },
+    { "field": "n_jabdje", "label": "结案标的金额" },
+    { "field": "n_jabdje_gj_level", "label": "结案标的金额估计等级" },
+    { "field": "n_jabdje_gj", "label": "结案标的金额估计" },
+
+    // --- 执行金额 ---
+    { "field": "n_sqzxbdje", "label": "申请执行标的金额" },
+    { "field": "n_sjdwje", "label": "实际到位金额" },
+    { "field": "n_wzxje", "label": "未执行金额" },
+
+    // --- 其他金额 ---
+    { "field": "n_fzje_level", "label": "犯罪金额等级" },
+    { "field": "n_fzje", "label": "犯罪金额" },
+    { "field": "n_bqqpcje_level", "label": "被请求赔偿金额等级" },
+    { "field": "n_bqqpcje", "label": "被请求赔偿金额" },
+    { "field": "n_pcpcje_level", "label": "判处赔偿金额等级" },
+    { "field": "n_pcpcje", "label": "判处赔偿金额" },
+    { "field": "n_pcpcje_gj_level", "label": "判处赔偿金额估计等级" },
+    { "field": "n_pcpcje_gj", "label": "判处赔偿金额估计" },
+    { "field": "n_ccxzxje_level", "label": "财产刑执行金额等级" },
+    { "field": "n_ccxzxje", "label": "财产刑执行金额" },
+    { "field": "n_ccxzxje_gj_level", "label": "财产刑执行金额估计等级" },
+    { "field": "n_ccxzxje_gj", "label": "财产刑执行金额估计" },
+
+    // ================= 其他辅助字段 =================
+    { "field": "n_sqbqse_level", "label": "申请保全数额等级" },
+    { "field": "n_sqbqse", "label": "申请保全数额" },
+    { "field": "c_sqbqbdw", "label": "申请保全标的物" },
+
+    // ================= 失信被执行人专项 、限制高消费专项 =================
+    { "field": "xb", "label": "性别" },
+    { "field": "zxfy", "label": "执行法院" },
+    { "field": "sf", "label": "省份" },
+    { "field": "ah", "label": "案号" },
+    { "field": "zxyjwh", "label": "执行依据文号" },
+    { "field": "zxyjdw", "label": "执行依据单位" },
+    { "field": "yw", "label": "生成法律文书确定的义务" },
+    { "field": "lxqk", "label": "履行情况" },
+    { "field": "xwqx", "label": "失信行为情形" },
+    { "field": "pjje_gj", "label": "失信金额估计" },
+    { "field": "larq", "label": "立案日期" },
+    { "field": "fbrq", "label": "发布日期" },
+];
+const collapse = ref([]);
+const chartOptions = ref({});
+const chartDom = ref(null); // 用于绑定 DOM 容器
+const totalCases = ref(0);
+
+onMounted(() => {
+    // 计算每种案件的数量
+    const caseCounts = {
+        criminal: entout.value.criminal?.cases?.length || 0,
+        civil: entout.value.civil?.cases?.length || 0,
+        administrative: entout.value.administrative?.cases?.length || 0,
+        preservation: entout.value.preservation?.cases?.length || 0,
+        implement: entout.value.implement?.cases?.length || 0,
+        bankrupt: entout.value.bankrupt?.cases?.length || 0,
+        sx: sx.value.length,
+        xg: xg.value.length
+    };
+
+    // 计算涉诉总案件数
+    totalCases.value = Object.values(caseCounts).reduce(
+        (sum, count) => sum + count,
+        0
+    );
+
+    chartOptions.value = {
+        title: {
+            // text: "涉诉案件数",
+            // subtext: totalCases.toString(),
+            // left: "35%", // 与 series.center 的第一个值保持一致
+            // top: "50%", // 与 series.center 的第二个值保持一致
+            // textAlign: "center", // 确保文本居中
+            // textStyle: {
+            //     fontSize: 16,
+            //     fontWeight: "bold",
+            //     color: "#333",
+            // },
+            // subtextStyle: {
+            //     fontSize: 24,
+            //     fontWeight: "bold",
+            //     color: "#EE6666",
+            // },
+        },
+        tooltip: {
+            trigger: "item",
+            formatter: "{b}: {c}件 ({d}%)",
+        },
+        legend: {
+            orient: "vertical",
+            right: "0", // 调整到右边
+            top: "middle", // 垂直居中
+            itemGap: 10, // 图例项间距
+            textStyle: {
+                fontSize: 12,
+                color: "#666",
+            },
+        },
+        series: [
+            {
+                name: "案件类型",
+                type: "pie",
+                radius: ["30%", "60%"], // 调整环形图半径
+                center: ["30%", "50%"], // 调整环形图的位置
+                avoidLabelOverlap: false,
+                itemStyle: {
+                    borderRadius: 8, // 添加圆角效果
+                    borderColor: "#fff",
+                    borderWidth: 2,
+                },
+                label: {
+                    show: false, // 隐藏标签
+                    position: "center",
+                },
+                emphasis: {
+                    label: {
+                        show: true,
+                        fontSize: "18",
+                        fontWeight: "bold",
+                        formatter: "{b}\n{c}件",
+                    },
+                },
+                labelLine: {
+                    show: false,
+                },
+                data: [
+                    {
+                        value: caseCounts.criminal,
+                        name: `刑事案件${caseCounts.criminal}件`,
+                    },
+                    {
+                        value: caseCounts.civil,
+                        name: `民事案件${caseCounts.civil}件`,
+                    },
+                    {
+                        value: caseCounts.administrative,
+                        name: `行政案件${caseCounts.administrative}件`,
+                    },
+                    {
+                        value: caseCounts.preservation,
+                        name: `非诉保全审查${caseCounts.preservation}件`,
+                    },
+                    {
+                        value: caseCounts.implement,
+                        name: `执行案件${caseCounts.implement}件`,
+                    },
+                    {
+                        value: caseCounts.bankrupt,
+                        name: `强制清算与破产${caseCounts.bankrupt}件`,
+                    },
+                    {
+                        value: caseCounts.bankrupt,
+                        name: `失信${caseCounts.sx}件`,
+                    }, {
+                        value: caseCounts.bankrupt,
+                        name: `限高${caseCounts.xg}件`,
+                    },
+                ],
+            },
+        ],
+    };
+
+    // 初始化 ECharts 实例
+    const chartInstance = echarts.init(chartDom.value);
+    chartInstance.setOption(chartOptions.value);
+
+    // 监听窗口大小变化，动态调整图表
+    window.addEventListener("resize", () => {
+        chartInstance.resize();
+    });
+});
+
+const caseTypes = computed(() => {
+    const data = entout.value;
+    return {
+        civil: data.civil?.cases || [],
+        criminal: data.criminal?.cases || [],
+        administrative: data.administrative?.cases || [],
+        preservation: data.preservation?.cases || [],
+        implement: data.implement?.cases || [],
+        bankrupt: data.bankrupt?.cases || [],
+        sx: sx.value,
+        xg: xg.value
+    };
+});
+
+function getCaseTypeName(caseType) {
+    const caseTypeNames = {
+        civil: "民事",
+        criminal: "刑事",
+        administrative: "行政",
+        preservation: "非诉保全审查",
+        implement: "执行",
+        bankrupt: "强制清算与破产",
+        sx: "失信",
+        xg: "限高"
+    };
+    return caseTypeNames[caseType] || caseType;
+}
+</script>
+
+<template>
+    <div class="card">
+        <div class="flex flex-col gap-y-4">
+            <!-- 涉诉案件统计 -->
+            <LTitle title="涉诉案件统计" type="blue-green" />
+            <div class="font-bold ml-4 text-lg">
+                涉诉案件数共
+                <span class="text-red-500 text-2xl font-bold">{{
+                    totalCases
+                }}</span>件
+            </div>
+            <div ref="chartDom" style="
+                    width: 100%;
+                    height: 300px;
+                    margin-top: -40px;
+                    margin-bottom: -40px;
+                "></div>
+            <template v-for="(caseType, typeName) in caseTypes" :key="typeName">
+                <LTitle :title="` ${getCaseTypeName(typeName)}案件`" type="blue-green" />
+                <div v-if="!caseType || caseType.length === 0">
+                    无记录，或数据未被公开
+                </div>
+                <template v-else>
+                    <van-collapse v-model="collapse">
+                        <van-collapse-item v-for="(caseData, index) in caseType" :key="index" custom-class="collapse"
+                            :name="index" :title="`案件: ${caseData.c_ah || caseData.ah}`">
+                            <div class="case-row">
+                                <div class="case-label">案号:</div>
+                                <div class="case-value">
+                                    {{ caseData.c_ah || "-" }}
+                                </div>
+                            </div>
+                            <div class="case-row">
+                                <div class="case-label">案件类型:</div>
+                                <div class="case-value">
+                                    {{ caseData.n_ajlx || "-" }}
+                                </div>
+                            </div>
+                            <div class="case-row">
+                                <div class="case-label">经办法院:</div>
+                                <div class="case-value">
+                                    {{ caseData.n_jbfy || "-" }}
+                                </div>
+                            </div>
+                            <div class="case-row">
+                                <div class="case-label">立案日期:</div>
+                                <div class="case-value">
+                                    {{ caseData.d_larq || "-" }}
+                                </div>
+                            </div>
+                            <div class="case-row">
+                                <div class="case-label">结案方式:</div>
+                                <div class="case-value">
+                                    {{ caseData.n_jafs || "-" }}
+                                </div>
+                            </div>
+                            <div class="case-row">
+                                <div class="case-label">当事人信息:</div>
+                                <div class="case-value">
+                                    <div v-for="dsr in caseData.c_dsrxx" :key="dsr.c_mc">
+                                        {{ dsr.c_mc }} -
+                                        {{
+                                            dsr.n_ssdw
+                                        }}
+                                    </div>
+                                </div>
+                            </div>
+                            <template v-for="(item, index) in fieldLabel" :key="index">
+                                <div class="case-row" v-if="caseData[item.field]">
+                                    <div class="case-label">{{ item.label }}:</div>
+                                    <div class="case-value">{{ caseData[item.field] || '无' }}</div>
+                                </div>
+                            </template>
+                        </van-collapse-item>
+                    </van-collapse>
+                </template>
+            </template>
+        </div>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.case-row {
+    @apply flex items-start justify-between my-2;
+}
+
+.case-label {
+    @apply flex-shrink-0 font-bold text-gray-700;
+}
+
+.case-value {
+    @apply text-left text-gray-500;
+}
+
+:deep(.van-cell) {}
+</style>

src/views/Example.vue

@@ -39,6 +39,10 @@ const featureMap = {
         name: '企业涉诉',
         component: defineAsyncComponent(() => import('@/ui/CLawsuit.vue')),
     },
+    G22SC01: {
+        name: '司法涉诉',
+        component: defineAsyncComponent(() => import('@/ui/CLawsuitPP.vue')),
+    },
     G15BJ02: {
         name: '手机三要素',
         component: defineAsyncComponent(() => import('@/ui/CPhoneThreeElements.vue')),
@@ -82,7 +86,12 @@ const featureMap = {
     CAR061: {
         name: '名下车辆',
         component: defineAsyncComponent(() => import('@/ui/CCAR061.vue')),
-    }
+    },
+    IDV044: {
+        name: '婚姻状态',
+        component: defineAsyncComponent(() => import('@/ui/CIDV044.vue')),
+        remark: '查询结果为"未婚或尚未登记结婚"时，表示婚姻登记处暂无相关的登记记录。婚姻状态信息由婚姻登记处逐级上报，可能存在数据遗漏或更新滞后。当前可查询的婚姻状态包括：未婚或尚未登记结婚、已婚、离异、离异冷静期。如您对查询结果有疑问，请联系客服反馈。'
+    },
 };
 
 
@@ -91,7 +100,7 @@ import LRemark from "@/components/LRemark.vue";
 
 
 const productId = ref(null);
-const isDone = ref(true);
+const isDone = ref(false);
 const active = ref(null)
 
 const reportData = ref([])
@@ -100,7 +109,7 @@ const reportName = ref("")
 const reportDateTime = ref(null)
 const feature = ref("")
 const isEmpty = ref(false)
-onMounted(() => {
+onBeforeMount(() => {
     const query = new URLSearchParams(window.location.search);
     feature.value = query.get("feature");
     console.log("feature", feature.value)
@@ -127,6 +136,7 @@ const getReport = async () => {
         } else if (data.value.code === 200003) {
             isEmpty.value = true
         }
+        isDone.value = true
     }
 }
 const maskValue = computed(() => {
@@ -308,13 +318,14 @@ const maskValue = computed(() => {
                         </div>
                         <LRemark content="如查询的姓名/身份证与运营商提供的不一致，可能会存在报告内容不匹配的情况" />
                     </van-tab>
-                    <van-tab v-for="(item, index) in reportData" :key="index" :title="featureMap[item.data.apiID].name">
+                    <van-tab v-for="(item, index) in reportData" :key="index"
-                        <div id="lawsuit" class="title mb-4">{{ featureMap[item.data.apiID].name }}</div>
+                        :title="featureMap[item.data.apiID]?.name">
-                        <component :is="featureMap[item.data.apiID].component" :data="item.data.data"
+                        <div id="lawsuit" class="title mb-4">{{ featureMap[item.data.apiID]?.name }}</div>
+                        <component :is="featureMap[item.data.apiID]?.component" :data="item.data.data"
                             :params="reportParams">
                         </component>
-                        <LRemark v-if="featureMap[item.data.apiID].remark"
+                        <LRemark v-if="featureMap[item.data.apiID]?.remark"
-                            :content="featureMap[item.data.apiID].remark" />
+                            :content="featureMap[item.data.apiID]?.remark" />
                     </van-tab>
                     <div class="card">
                         <div>

src/views/Report.vue

@@ -31,6 +31,10 @@ const featureMap = {
         name: '司法涉诉',
         component: defineAsyncComponent(() => import('@/ui/CLawsuit.vue')),
     },
+    G22SC01: {
+        name: '司法涉诉',
+        component: defineAsyncComponent(() => import('@/ui/CLawsuitPP.vue')),
+    },
     G05HZ01: {
         name: '股东人企关系',
         component: defineAsyncComponent(() => import('@/ui/CRelatedEnterprises.vue')),
@@ -82,7 +86,12 @@ const featureMap = {
     CAR061: {
         name: '名下车辆',
         component: defineAsyncComponent(() => import('@/ui/CCAR061.vue')),
-    }
+    },
+    IDV044: {
+        name: '婚姻状态',
+        component: defineAsyncComponent(() => import('@/ui/CIDV044.vue')),
+        remark: '查询结果为"未婚或尚未登记结婚"时，表示婚姻登记处暂无相关的登记记录。婚姻状态信息由婚姻登记处逐级上报，可能存在数据遗漏或更新滞后。当前可查询的婚姻状态包括：未婚或尚未登记结婚、已婚、离异、离异冷静期。如您对查询结果有疑问，请联系客服反馈。'
+    },
 };
 
 
@@ -92,7 +101,7 @@ import LTitle from "@/components/LTitle.vue";
 const route = useRoute();
 
 const productId = ref(null);
-const isDone = ref(true);
+const isDone = ref(false);
 const active = ref(null)
 const reportData = ref([])
 const reportParams = ref({})
@@ -102,7 +111,7 @@ const orderId = ref(null);
 const orderNo = ref("")
 const isEmpty = ref(false)
 const isPending = ref(false)
-onMounted(() => {
+onBeforeMount(() => {
     const query = new URLSearchParams(window.location.search);
     orderNo.value = query.get("out_trade_no");
     orderId.value = query.get("order_id");
@@ -142,6 +151,9 @@ const getReport = async () => {
         } else if (data.value.code === 200002) {
             isPending.value = true
         }
+        isDone.value = true
+        console.log(isDone.value)
+
     }
 }
 // 对请求参数进行脱敏处理
@@ -337,13 +349,14 @@ const maskValue = computed(() => {
                         </van-tab>
                     </template>
                     <LPendding v-if="isPending" />
-                    <van-tab v-for="(item, index) in reportData" :key="index" :title="featureMap[item.data.apiID].name">
+                    <van-tab v-for="(item, index) in reportData" :key="index"
-                        <div id="lawsuit" class="title mb-4">{{ featureMap[item.data.apiID].name }}</div>
+                        :title="featureMap[item.data.apiID]?.name">
-                        <component :is="featureMap[item.data.apiID].component" :data="item.data.data"
+                        <div id="lawsuit" class="title mb-4">{{ featureMap[item.data.apiID]?.name }}</div>
+                        <component :is="featureMap[item.data.apiID]?.component" :data="item.data.data"
                             :params="reportParams" :isMerriageProduct="item.data.apiID === 'G09SC02'">
                         </component>
-                        <LRemark v-if="featureMap[item.data.apiID].remark"
+                        <LRemark v-if="featureMap[item.data.apiID]?.remark"
-                            :content="featureMap[item.data.apiID].remark" />
+                            :content="featureMap[item.data.apiID]?.remark" />
                     </van-tab>
                     <div class="card">
                         <div>