<template>
    <!-- 关联企业涉诉风险 -->
    <div class="card shadow-sm rounded-xl overflow-hidden">
        <LTitle title="关联企业涉诉风险" type="blue-green" class="mb-4" />

        <!-- 全局风险概览面板 -->
        <div v-if="lawsuitCompanies.length > 0 && allLawsuitStats" class="mb-6">
            <div class="">
                <!-- 概览标题 -->
                <div class="mb-6">
                    <div class="flex items-center">
                        <div
                            class="h-8 w-1 bg-gradient-to-b from-blue-500 to-blue-700 rounded-full mr-3"
                        ></div>
                        <span class="text-lg font-medium text-gray-800"
                            >涉诉风险整体概览</span
                        >
                    </div>
                    <div
                        class="mt-1 h-px bg-gradient-to-r from-blue-200 via-gray-200 to-transparent"
                    ></div>

                    <!-- 添加风险概览总结 -->
                    <div
                        class="mt-4 p-3 bg-gradient-to-r from-blue-50 to-white rounded-lg border border-blue-100 shadow-sm"
                    >
                        <div class="flex">
                            <div
                                class="flex-shrink-0 w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center mr-3"
                            >
                                <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    class="h-6 w-6 text-blue-600"
                                    fill="none"
                                    viewBox="0 0 24 24"
                                    stroke="currentColor"
                                >
                                    <path
                                        stroke-linecap="round"
                                        stroke-linejoin="round"
                                        stroke-width="2"
                                        d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
                                    />
                                </svg>
                            </div>
                            <div>
                                <div class="text-sm text-gray-600">
                                    <span class="font-medium">{{
                                        totalCompanies
                                    }}</span>
                                    家关联企业中，
                                    <span
                                        v-if="
                                            allLawsuitStats?.totalCompanies > 0
                                        "
                                        class="text-red-600 font-medium"
                                        >{{
                                            allLawsuitStats?.totalCompanies || 0
                                        }}</span
                                    >
                                    <span
                                        v-else
                                        class="text-green-600 font-medium"
                                        >0</span
                                    >
                                    家存在涉诉风险
                                    <span
                                        v-if="
                                            allLawsuitStats?.highRiskCompanies >
                                            0
                                        "
                                        class="text-red-600"
                                    >
                                        (高风险:
                                        {{ allLawsuitStats?.highRiskCompanies }}
                                        家)
                                    </span>
                                    <span
                                        v-if="
                                            allLawsuitStats?.totalRiskItems > 0
                                        "
                                        class="ml-1"
                                    >
                                        ，共
                                        {{ allLawsuitStats?.totalRiskItems }}
                                        个风险事项
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 主要风险指标 -->
                <div class="grid grid-cols-2 md:grid-cols-4 gap-5 mb-6">
                    <!-- 风险事项卡片 -->
                    <div
                        class="bg-gradient-to-br from-red-50 to-red-100 p-5 rounded-xl shadow-sm border-0 flex flex-col items-center justify-center hover:shadow-md transition-all duration-300 relative overflow-hidden group"
                    >
                        <div
                            class="absolute -right-8 -top-8 w-20 h-20 bg-red-200 rounded-full opacity-30 group-hover:scale-110 transition-transform duration-300"
                        ></div>
                        <div class="text-center z-10">
                            <div class="text-4xl font-bold text-red-500 mb-1">
                                {{ allLawsuitStats.totalRiskItems }}
                            </div>
                            <div class="text-sm font-medium text-gray-700 mb-1">
                                风险事项
                            </div>
                            <div class="text-xs text-gray-500">
                                平均{{
                                    (
                                        allLawsuitStats.totalRiskItems /
                                        allLawsuitStats.totalCompanies
                                    ).toFixed(1)
                                }}项/企业
                            </div>
                        </div>
                        <div
                            class="absolute top-3 left-3 w-6 h-6 rounded-full bg-red-200 flex items-center justify-center text-red-500"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-4 w-4"
                                viewBox="0 0 20 20"
                                fill="currentColor"
                            >
                                <path
                                    fill-rule="evenodd"
                                    d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z"
                                    clip-rule="evenodd"
                                />
                            </svg>
                        </div>
                    </div>

                    <!-- 风险企业卡片 -->
                    <div
                        class="bg-gradient-to-br from-yellow-50 to-yellow-100 p-5 rounded-xl shadow-sm border-0 flex flex-col items-center justify-center hover:shadow-md transition-all duration-300 relative overflow-hidden group"
                    >
                        <div
                            class="absolute -right-8 -top-8 w-20 h-20 bg-yellow-200 rounded-full opacity-30 group-hover:scale-110 transition-transform duration-300"
                        ></div>
                        <div class="text-center z-10">
                            <div
                                class="text-4xl font-bold text-yellow-600 mb-1"
                            >
                                {{ allLawsuitStats.totalCompanies }}
                            </div>
                            <div class="text-sm font-medium text-gray-700 mb-1">
                                风险企业
                            </div>
                            <div class="text-xs text-gray-500">
                                占比关联企业{{
                                    (allLawsuitStats.totalCompanies /
                                        totalCompanies) *
                                    100
                                }}%
                            </div>
                            <div
                                class="flex items-center justify-center gap-3 mt-1"
                            >
                                <span class="text-xs text-red-600"
                                    >高风险
                                    {{
                                        allLawsuitStats.highRiskCompanies
                                    }}</span
                                >
                                <span class="text-xs text-amber-600"
                                    >中风险
                                    {{
                                        allLawsuitStats.mediumRiskCompanies
                                    }}</span
                                >
                            </div>
                        </div>
                        <div
                            class="absolute top-3 left-3 w-6 h-6 rounded-full bg-yellow-200 flex items-center justify-center text-yellow-600"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-4 w-4"
                                viewBox="0 0 20 20"
                                fill="currentColor"
                            >
                                <path
                                    fill-rule="evenodd"
                                    d="M4 4a2 2 0 012-2h8a2 2 0 012 2v12a1 1 0 01-1 1H5a1 1 0 01-1-1V4zm3 1h6v4H7V5zm8 8v2h1v1H4v-1h1v-2a1 1 0 011-1h8a1 1 0 011 1z"
                                    clip-rule="evenodd"
                                />
                            </svg>
                        </div>
                    </div>

                    <!-- 正常经营企业卡片 -->
                    <div
                        class="bg-gradient-to-br from-blue-50 to-blue-100 p-5 rounded-xl shadow-sm border-0 flex flex-col items-center justify-center hover:shadow-md transition-all duration-300 relative overflow-hidden group"
                    >
                        <div
                            class="absolute -right-8 -top-8 w-20 h-20 bg-blue-200 rounded-full opacity-30 group-hover:scale-110 transition-transform duration-300"
                        ></div>
                        <div class="text-center z-10">
                            <div class="text-4xl font-bold text-blue-500 mb-1">
                                {{ allLawsuitStats.normalOperatingCompanies }}
                            </div>
                            <div class="text-sm font-medium text-gray-700 mb-1">
                                正常经营企业
                            </div>
                            <div class="text-xs text-gray-500">
                                占比{{
                                    Math.round(
                                        (allLawsuitStats.normalOperatingCompanies /
                                            totalCompanies) *
                                            100
                                    )
                                }}%
                            </div>
                        </div>
                        <div
                            class="absolute top-3 left-3 w-6 h-6 rounded-full bg-blue-200 flex items-center justify-center text-blue-500"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-4 w-4"
                                viewBox="0 0 20 20"
                                fill="currentColor"
                            >
                                <path
                                    fill-rule="evenodd"
                                    d="M6.267 3.455a3.066 3.066 0 001.745-.723 3.066 3.066 0 013.976 0 3.066 3.066 0 001.745.723 3.066 3.066 0 012.812 2.812c.051.643.304 1.254.723 1.745a3.066 3.066 0 010 3.976 3.066 3.066 0 00-.723 1.745 3.066 3.066 0 01-2.812 2.812 3.066 3.066 0 00-1.745.723 3.066 3.066 0 01-3.976 0 3.066 3.066 0 00-1.745-.723 3.066 3.066 0 01-2.812-2.812 3.066 3.066 0 00-.723-1.745 3.066 3.066 0 010-3.976 3.066 3.066 0 00.723-1.745 3.066 3.066 0 012.812-2.812zm7.44 5.252a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                                    clip-rule="evenodd"
                                />
                            </svg>
                        </div>
                    </div>

                    <!-- 吊销注销企业卡片 -->
                    <div
                        class="bg-gradient-to-br from-gray-50 to-gray-100 p-5 rounded-xl shadow-sm border-0 flex flex-col items-center justify-center hover:shadow-md transition-all duration-300 relative overflow-hidden group"
                    >
                        <div
                            class="absolute -right-8 -top-8 w-20 h-20 bg-gray-200 rounded-full opacity-30 group-hover:scale-110 transition-transform duration-300"
                        ></div>
                        <div class="text-center z-10">
                            <div class="text-4xl font-bold text-gray-500 mb-1">
                                {{ allLawsuitStats.canceledCompanies }}
                            </div>
                            <div class="text-sm font-medium text-gray-700 mb-1">
                                吊销注销企业
                            </div>
                            <div class="text-xs text-gray-500">
                                占比{{
                                    Math.round(
                                        (allLawsuitStats.canceledCompanies /
                                            totalCompanies) *
                                            100
                                    )
                                }}%
                            </div>
                        </div>
                        <div
                            class="absolute top-3 left-3 w-6 h-6 rounded-full bg-gray-200 flex items-center justify-center text-gray-500"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-4 w-4"
                                viewBox="0 0 20 20"
                                fill="currentColor"
                            >
                                <path
                                    fill-rule="evenodd"
                                    d="M13.477 14.89A6 6 0 015.11 6.524l8.367 8.368zm1.414-1.414L6.524 5.11a6 6 0 018.367 8.367zM18 10a8 8 0 11-16 0 8 8 0 0116 0z"
                                    clip-rule="evenodd"
                                />
                            </svg>
                        </div>
                    </div>
                </div>

                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
                    <!-- 企业风险分布 -->
                    <div
                        class="bg-white rounded-xl p-4 border border-gray-100 shadow-sm hover:shadow-md transition-all duration-300"
                    >
                        <div
                            class="text-sm font-medium text-gray-700 mb-3 flex items-center"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-4 w-4 mr-1 text-gray-500"
                                viewBox="0 0 20 20"
                                fill="currentColor"
                            >
                                <path
                                    d="M2 10a8 8 0 018-8v8h8a8 8 0 11-16 0z"
                                />
                                <path
                                    d="M12 2.252A8.014 8.014 0 0117.748 8H12V2.252z"
                                />
                            </svg>
                            企业风险分布
                        </div>
                        <div class="flex items-center justify-between mb-1">
                            <div class="text-xs text-gray-500">高风险企业</div>
                            <div class="text-xs font-medium text-red-600">
                                {{ allLawsuitStats.highRiskCompanies }} 家
                            </div>
                        </div>
                        <div
                            class="w-full h-2 bg-gray-100 rounded-full mb-3 overflow-hidden"
                        >
                            <div
                                class="h-full bg-gradient-to-r from-red-400 to-red-600 rounded-full"
                                :style="{
                                    width: `${(
                                        (allLawsuitStats.highRiskCompanies /
                                            totalCompanies) *
                                        100
                                    ).toFixed(0)}%`,
                                }"
                            ></div>
                        </div>

                        <div class="flex items-center justify-between mb-1">
                            <div class="text-xs text-gray-500">中风险企业</div>
                            <div class="text-xs font-medium text-amber-600">
                                {{ allLawsuitStats.mediumRiskCompanies }} 家
                            </div>
                        </div>
                        <div
                            class="w-full h-2 bg-gray-100 rounded-full mb-3 overflow-hidden"
                        >
                            <div
                                class="h-full bg-gradient-to-r from-amber-400 to-amber-600 rounded-full"
                                :style="{
                                    width: `${(
                                        (allLawsuitStats.mediumRiskCompanies /
                                            totalCompanies) *
                                        100
                                    ).toFixed(0)}%`,
                                }"
                            ></div>
                        </div>

                        <div class="flex items-center justify-between mb-1">
                            <div class="text-xs text-gray-500">低风险企业</div>
                            <div class="text-xs font-medium text-green-600">
                                {{ allLawsuitStats.lowRiskCompanies }} 家
                            </div>
                        </div>
                        <div
                            class="w-full h-2 bg-gray-100 rounded-full overflow-hidden"
                        >
                            <div
                                class="h-full bg-gradient-to-r from-green-400 to-green-600 rounded-full"
                                :style="{
                                    width: `${(
                                        (allLawsuitStats.lowRiskCompanies /
                                            totalCompanies) *
                                        100
                                    ).toFixed(0)}%`,
                                }"
                            ></div>
                        </div>
                    </div>

                    <!-- 案件类型统计 - 柱状图 -->
                    <div
                        class="bg-white rounded-xl p-4 border border-gray-100 shadow-sm hover:shadow-md transition-all duration-300"
                    >
                        <div
                            class="text-sm font-medium text-gray-700 mb-3 flex items-center"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-4 w-4 mr-1 text-gray-500"
                                viewBox="0 0 20 20"
                                fill="currentColor"
                            >
                                <path
                                    d="M2 11a1 1 0 011-1h2a1 1 0 011 1v5a1 1 0 01-1 1H3a1 1 0 01-1-1v-5zM8 7a1 1 0 011-1h2a1 1 0 011 1v9a1 1 0 01-1 1H9a1 1 0 01-1-1V7zM14 4a1 1 0 011-1h2a1 1 0 011 1v12a1 1 0 01-1 1h-2a1 1 0 01-1-1V4z"
                                />
                            </svg>
                            案件类型分布
                        </div>
                        <div class="h-[200px]">
                            <v-chart :option="caseTypeChartOption" autoresize />
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 风险企业一览 -->
        <div
            class="mb-6"
            v-if="
                lawsuitCompanies.length > 0 ||
                filteredLawsuitCompanies.length > 0
            "
        >
            <div class="flex items-center">
                <div
                    class="h-8 w-1 bg-gradient-to-b from-blue-500 to-blue-700 rounded-full mr-3"
                ></div>
                <span class="text-lg font-medium text-gray-800"
                    >风险企业一览</span
                >
            </div>
            <div
                class="mt-1 h-px bg-gradient-to-r from-blue-200 via-gray-200 to-transparent"
            ></div>
        </div>

        <!-- 案件类型筛选tab -->
        <div v-if="lawsuitCompanies.length > 0" class="mb-4">
            <van-tabs
                v-model:active="activeCaseTypeFilter"
                line-width="30px"
                swipeable
            >
                <!-- 全部风险 -->
                <van-tab name="all">
                    <template #title>
                        <div class="flex items-center gap-1">
                            <span>全部风险</span>
                            <span
                                class="bg-red-50 text-red-600 text-xs min-w-5 h-5 rounded-full flex items-center justify-center ml-1 px-1"
                            >
                                {{ caseTypeCompanyCounts.all }}
                            </span>
                        </div>
                    </template>
                </van-tab>

                <!-- 各类型案件 - 使用v-for渲染 -->
                <van-tab
                    v-for="(typeInfo, type) in lawsuitTypeMap"
                    :key="type"
                    :name="type"
                >
                    <template #title>
                        <div class="flex items-center gap-1">
                            <span>{{ typeInfo.text }}</span>
                            <span
                                :class="
                                    'bg-' +
                                    typeInfo.color.split('-')[1] +
                                    '-50 ' +
                                    typeInfo.color.split(' ')[0] +
                                    ' text-xs min-w-5 h-5 rounded-full flex items-center justify-center ml-1 px-1'
                                "
                            >
                                {{ caseTypeCompanyCounts[type] || 0 }}
                            </span>
                        </div>
                    </template>
                    <div
                        v-if="filteredLawsuitCompanies.length === 0"
                        class="p-8 text-center text-gray-500"
                    >
                        <div class="flex flex-col items-center justify-center">
                            <van-empty
                                :description="`暂无${typeInfo.text}记录`"
                            />
                        </div>
                    </div>
                </van-tab>
            </van-tabs>
        </div>

        <div v-if="filteredLawsuitCompanies.length > 0" class="space-y-3">
            <div
                v-for="(company, index) in filteredLawsuitCompanies"
                :key="index"
                class="company-wrapper"
            >
                <!-- 企业卡片 - 可点击展开 -->
                <div
                    class="bg-white rounded-lg shadow-sm border overflow-hidden border-gray-200 hover:border-red-300 hover:shadow-md transition-all duration-300 cursor-pointer relative"
                    :class="{
                        'border-red-400 shadow-md': isCompanyExpanded(
                            company.orgName,
                            'lawsuit',
                            index
                        ),
                    }"
                    @click="
                        toggleCompanyExpand(company.orgName, 'lawsuit', index)
                    "
                >
                    <!-- 企业名称 - 红色渐变背景 -->
                    <div
                        class="bg-gradient-to-r from-red-50 to-red-100 px-4 py-2 flex items-center"
                    >
                        <div class="font-medium text-gray-800 truncate">
                            {{ company.orgName }}
                        </div>
                    </div>

                    <!-- 风险标签区域 -->
                    <div
                        class="px-4 py-2 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2"
                    >
                        <div class="flex flex-wrap gap-1">
                            <!-- 风险等级标签 -->
                            <!-- <span class="px-2 py-0.5 text-xs rounded-full" :class="getRiskLevel(company).color">
                {{ getRiskLevel(company).text }}
              </span> -->

                            <!-- 风险类型标签 -->
                            <template
                                v-if="getCompanyCaseTypes(company).length > 0"
                            >
                                <span
                                    v-for="(
                                        caseType, index
                                    ) in getCompanyCaseTypes(company).slice(
                                        0,
                                        3
                                    )"
                                    :key="index"
                                    class="inline-flex items-center px-1.5 py-0.5 rounded-full text-xs"
                                    :class="caseType.color"
                                >
                                    {{ caseType.text }}
                                </span>
                                <span
                                    v-if="
                                        getCompanyCaseTypes(company).length > 3
                                    "
                                    class="inline-flex items-center px-1.5 py-0.5 rounded-full bg-gray-50 text-gray-600 text-xs"
                                >
                                    +{{
                                        getCompanyCaseTypes(company).length - 3
                                    }}
                                </span>
                            </template>
                            <span
                                v-else
                                class="inline-flex items-center px-1.5 py-0.5 rounded-full bg-gray-50 text-gray-600 text-xs"
                            >
                                无涉诉信息
                            </span>
                        </div>

                        <!-- 案件数量指示器和企业状态 -->
                        <div class="flex items-center gap-2">
                            <div
                                v-if="getLawsuitStats(company)"
                                class="flex items-center bg-red-50 px-2 py-1 rounded-full"
                            >
                                <span class="text-xs text-red-600 font-medium"
                                    >案件:</span
                                >
                                <span
                                    class="text-sm font-bold text-red-600 ml-1"
                                    >{{
                                        getLawsuitStats(company).total || 0
                                    }}</span
                                >
                            </div>

                            <!-- 企业状态 -->
                            <span
                                v-if="
                                    company.basicInfo &&
                                    company.basicInfo.regStatus
                                "
                                class="px-1.5 py-0.5 rounded-full inline-block text-xs"
                                :class="
                                    getStatusClass(company.basicInfo.regStatus)
                                "
                            >
                                {{ company.basicInfo.regStatus }}
                            </span>
                        </div>
                    </div>

                    <!-- 展开指示器 -->
                    <div
                        class="absolute right-4 bottom-2 flex items-center text-xs text-gray-500 hover:text-red-600 transition-colors duration-300"
                        :class="{
                            'text-red-600': isCompanyExpanded(
                                company.orgName,
                                'lawsuit',
                                index
                            ),
                        }"
                    >
                        <span class="mr-1">{{
                            isCompanyExpanded(company.orgName, "lawsuit", index)
                                ? "收起详情"
                                : "查看详情"
                        }}</span>
                        <div
                            class="w-5 h-5 rounded-full bg-gray-100 flex items-center justify-center transition-transform duration-300"
                            :class="{
                                'bg-red-100 text-red-600 rotate-180':
                                    isCompanyExpanded(
                                        company.orgName,
                                        'lawsuit',
                                        index
                                    ),
                            }"
                        >
                            <svg
                                xmlns="http://www.w3.org/2000/svg"
                                class="h-3 w-3"
                                fill="none"
                                viewBox="0 0 24 24"
                                stroke="currentColor"
                            >
                                <path
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    stroke-width="2"
                                    d="M19 9l-7 7-7-7"
                                />
                            </svg>
                        </div>
                    </div>
                </div>

                <!-- 企业详情抽屉 - 关联企业涉诉风险 -->
                <div
                    class="overflow-hidden transition-all duration-500 ease-in-out"
                    :class="{
                        'max-h-0 opacity-0': !isCompanyExpanded(
                            company.orgName,
                            'lawsuit',
                            index
                        ),
                        'max-h-[2000px] opacity-100': isCompanyExpanded(
                            company.orgName,
                            'lawsuit',
                            index
                        ),
                    }"
                >
                    <div
                        class="mt-2 bg-white rounded-xl overflow-hidden p-3 border border-gray-200 shadow-sm transform transition-all duration-300 max-h-[800px] overflow-y-auto hover:shadow-md"
                    >
                        <div class="relative">
                            <!-- 企业基本信息 -->
                            <div
                                class="bg-gradient-to-r from-gray-50 to-gray-100 rounded-lg p-3 mb-3"
                            >
                                <div
                                    class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-2 mb-3"
                                >
                                    <div class="flex items-center">
                                        <div
                                            class="font-medium text-gray-800 mr-2"
                                        >
                                            {{ company.orgName }}
                                        </div>
                                        <span
                                            v-if="
                                                company.basicInfo &&
                                                company.basicInfo.regStatus
                                            "
                                            class="px-2 py-0.5 text-xs rounded-full font-medium flex-shrink-0"
                                            :class="
                                                getStatusClass(
                                                    company.basicInfo.regStatus
                                                )
                                            "
                                        >
                                            {{ company.basicInfo.regStatus }}
                                        </span>
                                    </div>
                                    <div class="text-xs text-gray-500">
                                        统一社会信用代码:
                                        <span class="text-gray-700">{{
                                            company.basicInfo?.creditCode ||
                                            "暂无"
                                        }}</span>
                                    </div>
                                </div>
                                <div
                                    class="grid grid-cols-1 sm:grid-cols-3 gap-3"
                                >
                                    <div
                                        class="bg-white rounded-lg shadow-sm p-2 flex items-center"
                                    >
                                        <div
                                            class="w-8 h-8 rounded-full bg-blue-50 text-blue-500 flex items-center justify-center mr-2"
                                        >
                                            <svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                class="h-4 w-4"
                                                viewBox="0 0 20 20"
                                                fill="currentColor"
                                            >
                                                <path
                                                    d="M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"
                                                />
                                                <path
                                                    fill-rule="evenodd"
                                                    d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z"
                                                    clip-rule="evenodd"
                                                />
                                            </svg>
                                        </div>
                                        <div class="flex flex-col">
                                            <div class="text-xs text-gray-500">
                                                注册资本
                                            </div>
                                            <div class="text-sm font-medium">
                                                {{
                                                    formatCapital(
                                                        company.basicInfo
                                                            ?.regCapital,
                                                        company.basicInfo
                                                            ?.regCapitalCurrency
                                                    ) || "暂无"
                                                }}
                                            </div>
                                        </div>
                                    </div>
                                    <div
                                        class="bg-white rounded-lg shadow-sm p-2 flex items-center"
                                    >
                                        <div
                                            class="w-8 h-8 rounded-full bg-amber-50 text-amber-500 flex items-center justify-center mr-2"
                                        >
                                            <svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                class="h-4 w-4"
                                                viewBox="0 0 20 20"
                                                fill="currentColor"
                                            >
                                                <path
                                                    fill-rule="evenodd"
                                                    d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
                                                    clip-rule="evenodd"
                                                />
                                            </svg>
                                        </div>
                                        <div class="flex flex-col">
                                            <div class="text-xs text-gray-500">
                                                成立日期
                                            </div>
                                            <div class="text-sm font-medium">
                                                {{
                                                    company.basicInfo
                                                        ?.estiblishTime ||
                                                    "暂无"
                                                }}
                                            </div>
                                        </div>
                                    </div>
                                    <div
                                        class="bg-white rounded-lg shadow-sm p-2 flex items-center"
                                    >
                                        <div
                                            class="w-8 h-8 rounded-full bg-green-50 text-green-500 flex items-center justify-center mr-2"
                                        >
                                            <svg
                                                xmlns="http://www.w3.org/2000/svg"
                                                class="h-4 w-4"
                                                viewBox="0 0 20 20"
                                                fill="currentColor"
                                            >
                                                <path
                                                    fill-rule="evenodd"
                                                    d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z"
                                                    clip-rule="evenodd"
                                                />
                                            </svg>
                                        </div>
                                        <div class="flex flex-col">
                                            <div class="text-xs text-gray-500">
                                                法定代表人
                                            </div>
                                            <div class="text-sm font-medium">
                                                {{
                                                    company.basicInfo
                                                        ?.legalPersonName ||
                                                    "暂无"
                                                }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- 筛选标签 -->
                            <div
                                v-if="
                                    getLawsuitStats(company) &&
                                    getLawsuitStats(company).types.length > 0
                                "
                                class="flex items-center mb-3 border-b border-gray-100 pb-3 flex-wrap"
                            >
                                <div class="text-xs text-gray-500 mr-2 mb-2">
                                    案件筛选:
                                </div>
                                <div class="flex flex-wrap gap-2">
                                    <span
                                        class="text-xs px-3 py-1 rounded-full flex items-center cursor-pointer transition-all duration-200"
                                        :class="[
                                            getCompanyActiveTab(
                                                company.orgName
                                            ) === null
                                                ? 'bg-blue-100 text-blue-600 font-medium shadow-sm'
                                                : 'bg-gray-100 text-gray-600 hover:bg-gray-200',
                                        ]"
                                        @click="
                                            setCompanyActiveTab(
                                                company.orgName,
                                                null
                                            )
                                        "
                                    >
                                        <svg
                                            xmlns="http://www.w3.org/2000/svg"
                                            class="h-3 w-3 mr-1"
                                            viewBox="0 0 20 20"
                                            fill="currentColor"
                                        >
                                            <path
                                                d="M2 10.5a1.5 1.5 0 113 0v6a1.5 1.5 0 01-3 0v-6zM6 10.333v5.43a2 2 0 001.106 1.79l.05.025A4 4 0 008.943 18h5.416a2 2 0 001.962-1.608l1.2-6A2 2 0 0015.56 8H12V4a2 2 0 00-2-2 1 1 0 00-1 1v.667a4 4 0 01-.8 2.4L6.8 7.933a4 4 0 00-.8 2.4z"
                                            />
                                        </svg>
                                        全部
                                        <span
                                            class="ml-1 bg-blue-50 text-blue-600 rounded-full h-4 px-1 min-w-[16px] inline-flex items-center justify-center text-[10px]"
                                        >
                                            {{ getLawsuitStats(company).total }}
                                        </span>
                                    </span>

                                    <template
                                        v-for="(
                                            type, typeIndex
                                        ) in getLawsuitStats(company).types"
                                        :key="typeIndex"
                                    >
                                        <span
                                            class="text-xs px-3 py-1 rounded-full flex items-center cursor-pointer transition-all duration-200"
                                            :class="[
                                                getCompanyActiveTab(
                                                    company.orgName
                                                ) === type.type
                                                    ? type.color +
                                                      ' font-medium shadow-sm'
                                                    : 'bg-gray-100 text-gray-600 hover:bg-gray-200',
                                            ]"
                                            @click="
                                                setCompanyActiveTab(
                                                    company.orgName,
                                                    type.type
                                                )
                                            "
                                        >
                                            {{ type.name }}
                                            <span
                                                class="ml-1 rounded-full h-4 px-1 min-w-[16px] inline-flex items-center justify-center text-[10px]"
                                                :class="
                                                    getCompanyActiveTab(
                                                        company.orgName
                                                    ) === type.type
                                                        ? 'bg-white bg-opacity-25 text-white'
                                                        : 'bg-gray-50 text-gray-600'
                                                "
                                            >
                                                {{ type.count }}
                                            </span>
                                        </span>
                                    </template>
                                </div>
                            </div>

                            <!-- 涉诉案件详情 -->
                            <template
                                v-if="
                                    getLawsuitStats(company) &&
                                    getLawsuitStats(company).types.length > 0
                                "
                            >
                                <div
                                    v-for="(type, typeIndex) in getLawsuitStats(
                                        company
                                    ).types"
                                    :key="typeIndex"
                                >
                                    <div
                                        v-if="
                                            getCompanyActiveTab(
                                                company.orgName
                                            ) === null ||
                                            getCompanyActiveTab(
                                                company.orgName
                                            ) === type.type
                                        "
                                        class="mb-5 rounded-xl overflow-hidden relative"
                                    >
                                        <!-- 案件类型标题条 -->
                                        <div
                                            class="flex items-center mb-3 relative"
                                        >
                                            <div
                                                class="text-base font-medium px-2 py-1.5 rounded-lg flex items-center gap-2 w-auto"
                                                :class="
                                                    type.color
                                                        .replace('bg-', 'bg-')
                                                        .replace(
                                                            'text-',
                                                            'text-'
                                                        )
                                                "
                                            >
                                                <div
                                                    class="w-6 h-6 rounded-full flex items-center justify-center"
                                                    :class="type.color"
                                                >
                                                    <svg
                                                        xmlns="http://www.w3.org/2000/svg"
                                                        class="h-4 w-4"
                                                        viewBox="0 0 20 20"
                                                        fill="currentColor"
                                                    >
                                                        <path
                                                            fill-rule="evenodd"
                                                            d="M10 1.944A11.954 11.954 0 012.166 5C2.056 5.649 2 6.319 2 7c0 5.225 3.34 9.67 8 11.317C14.66 16.67 18 12.225 18 7c0-.682-.057-1.35-.166-2.001A11.954 11.954 0 0110 1.944zM11 14a1 1 0 11-2 0 1 1 0 012 0zm0-7a1 1 0 10-2 0v3a1 1 0 102 0V7z"
                                                            clip-rule="evenodd"
                                                        />
                                                    </svg>
                                                </div>
                                                {{ type.name }}
                                            </div>
                                            <div
                                                class="ml-3 text-sm text-gray-500"
                                            >
                                                共
                                                <span class="font-medium">
                                                    {{
                                                        type.type ===
                                                            "sxbzxr" ||
                                                        type.type === "xgbzxr"
                                                            ? company
                                                                  .lawsuitInfo[
                                                                  type.type
                                                              ].length
                                                            : company
                                                                  .lawsuitInfo
                                                                  .data[
                                                                  type.type
                                                              ].cases.length
                                                    }}
                                                </span>
                                                起案件
                                            </div>
                                            <div
                                                class="absolute bottom-0 left-0 right-0 h-px bg-gradient-to-r from-transparent via-gray-200 to-transparent"
                                            ></div>
                                        </div>

                                        <!-- 案件列表 -->
                                        <div class="space-y-4">
                                            <!-- 普通案件 -->
                                            <div
                                                v-if="
                                                    type.type !== 'sxbzxr' &&
                                                    type.type !== 'xgbzxr'
                                                "
                                                v-for="(
                                                    caseItem, caseIndex
                                                ) in company.lawsuitInfo.data[
                                                    type.type
                                                ].cases"
                                                :key="caseIndex"
                                                class="bg-gray-50 rounded-xl p-3 border border-gray-100 hover:border-gray-300 transition-all duration-300 relative overflow-hidden group"
                                            >
                                                <!-- 装饰元素 -->
                                                <div
                                                    class="absolute top-0 right-0 w-24 h-24 opacity-5 transform rotate-45 translate-x-10 -translate-y-10 group-hover:opacity-10 transition-opacity duration-300"
                                                    :class="
                                                        type.color
                                                            .replace(
                                                                'text-',
                                                                'bg-'
                                                            )
                                                            .replace(
                                                                '-50',
                                                                '-600'
                                                            )
                                                    "
                                                ></div>

                                                <!-- 案件头部信息 -->
                                                <div
                                                    class="flex flex-wrap justify-between items-center mb-3 pb-2 border-b border-dashed border-gray-200"
                                                >
                                                    <div
                                                        class="font-medium flex items-center gap-2 mr-2 truncate"
                                                    >
                                                        <span
                                                            class="text-gray-800 truncate"
                                                            >{{
                                                                caseItem.c_ah ||
                                                                "暂无案号"
                                                            }}</span
                                                        >
                                                        <span
                                                            class="ml-2 text-xs px-2 py-0.5 rounded-full font-medium flex-shrink-0"
                                                            :class="
                                                                getCaseStatusClass(
                                                                    caseItem.n_ajjzjd
                                                                )
                                                            "
                                                        >
                                                            {{
                                                                caseItem.n_ajjzjd ||
                                                                "状态未知"
                                                            }}
                                                        </span>
                                                    </div>
                                                    <div
                                                        class="flex items-center gap-3 flex-shrink-0"
                                                    >
                                                        <div
                                                            v-if="
                                                                caseItem.d_larq
                                                            "
                                                            class="flex items-center text-xs text-gray-500 whitespace-nowrap"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            立案:
                                                            {{
                                                                formatDate(
                                                                    caseItem.d_larq
                                                                )
                                                            }}
                                                        </div>
                                                        <div
                                                            v-if="
                                                                caseItem.d_jarq
                                                            "
                                                            class="flex items-center text-xs text-gray-500 whitespace-nowrap"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            结案:
                                                            {{
                                                                formatDate(
                                                                    caseItem.d_jarq
                                                                )
                                                            }}
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- 案件信息卡片 -->
                                                <div
                                                    class="rounded-lg space-y-3"
                                                >
                                                    <!-- 法院和地区信息 -->
                                                    <div
                                                        class="grid grid-cols-1 sm:grid-cols-2 gap-3"
                                                    >
                                                        <div
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M10.496 2.132a1 1 0 00-.992 0l-7 4A1 1 0 003 8v7a1 1 0 100 2h14a1 1 0 100-2V8a1 1 0 00.496-1.868l-7-4zM6 9a1 1 0 00-1 1v3a1 1 0 102 0v-3a1 1 0 00-1-1zm3 1a1 1 0 012 0v3a1 1 0 11-2 0v-3zm5-1a1 1 0 00-1 1v3a1 1 0 102 0v-3a1 1 0 00-1-1z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                经办法院
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.n_jbfy ||
                                                                    "—"
                                                                }}
                                                            </div>
                                                        </div>
                                                        <div
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                所属地域
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.c_ssdy ||
                                                                    "—"
                                                                }}
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <!-- 案件类型 -->
                                                    <div
                                                        v-if="caseItem.n_ajlx"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    d="M9 2a1 1 0 000 2h2a1 1 0 100-2H9z"
                                                                />
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 5a2 2 0 012-2 3 3 0 003 3h2a3 3 0 003-3 2 2 0 012 2v11a2 2 0 01-2 2H6a2 2 0 01-2-2V5zm3 4a1 1 0 000 2h.01a1 1 0 100-2H7zm3 0a1 1 0 000 2h3a1 1 0 100-2h-3zm-3 4a1 1 0 100 2h.01a1 1 0 100-2H7zm3 0a1 1 0 100 2h3a1 1 0 100-2h-3z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            案件类型
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                caseItem.n_ajlx ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 立案时间 -->
                                                    <div
                                                        v-if="caseItem.d_larq"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            立案时间
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                formatDate(
                                                                    caseItem.d_larq
                                                                )
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 案由信息 -->
                                                    <div
                                                        v-if="
                                                            caseItem.n_laay_tree
                                                        "
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            立案案由
                                                        </div>
                                                        <div
                                                            class="text-sm bg-gray-50 p-1.5 rounded border border-gray-100"
                                                        >
                                                            {{
                                                                caseItem.n_laay_tree ||
                                                                caseItem.n_laay ||
                                                                "暂无"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 当事人信息 -->
                                                    <div
                                                        v-if="
                                                            caseItem.c_dsrxx &&
                                                            caseItem.c_dsrxx
                                                                .length > 0
                                                        "
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-1 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"
                                                                />
                                                            </svg>
                                                            当事人信息
                                                        </div>
                                                        <div
                                                            class="flex flex-wrap gap-1.5"
                                                        >
                                                            <div
                                                                v-for="(
                                                                    party,
                                                                    partyIndex
                                                                ) in caseItem.c_dsrxx"
                                                                :key="
                                                                    partyIndex
                                                                "
                                                                class="text-xs px-2 py-1 bg-gray-50 rounded-lg flex items-center border border-gray-100 hover:border-gray-300 transition-colors duration-200"
                                                            >
                                                                <span
                                                                    class="text-gray-600 mr-1"
                                                                    >{{
                                                                        party.n_ssdw ||
                                                                        "其他"
                                                                    }}:</span
                                                                >
                                                                <span
                                                                    class="font-medium text-gray-800"
                                                                    >{{
                                                                        party.c_mc
                                                                    }}</span
                                                                >
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <!-- 已结案信息 -->
                                                    <div
                                                        v-if="
                                                            caseItem.n_ajjzjd &&
                                                            caseItem.n_ajjzjd.includes(
                                                                '已结'
                                                            )
                                                        "
                                                        class="space-y-3"
                                                    >
                                                        <!-- 结案分割线 -->
                                                        <div
                                                            class="flex items-center pt-1"
                                                        >
                                                            <div
                                                                class="flex-grow h-px bg-gradient-to-r from-transparent via-green-200 to-transparent"
                                                            ></div>
                                                            <div
                                                                class="mx-2 px-3 py-1 text-xs font-medium text-green-600 bg-green-50 rounded-full flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                案件已结
                                                            </div>
                                                            <div
                                                                class="flex-grow h-px bg-gradient-to-r from-green-200 via-transparent to-transparent"
                                                            ></div>
                                                        </div>

                                                        <!-- 结案方式 -->
                                                        <div
                                                            v-if="
                                                                caseItem.n_jafs
                                                            "
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                结案方式
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.n_jafs ||
                                                                    "暂无"
                                                                }}
                                                            </div>
                                                        </div>

                                                        <!-- 结案时间 -->
                                                        <div
                                                            v-if="
                                                                caseItem.d_jarq
                                                            "
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                结案时间
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    formatDate(
                                                                        caseItem.d_jarq
                                                                    )
                                                                }}
                                                            </div>
                                                        </div>

                                                        <!-- 结案案由 -->
                                                        <div
                                                            v-if="
                                                                caseItem.n_jaay_tree
                                                            "
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                结案案由
                                                            </div>
                                                            <div
                                                                class="text-sm bg-gray-50 p-1.5 rounded border border-gray-100"
                                                            >
                                                                {{
                                                                    caseItem.n_jaay_tree ||
                                                                    "与立案案由相同"
                                                                }}
                                                            </div>
                                                        </div>

                                                        <!-- 相关当事人 -->
                                                        <div
                                                            v-if="
                                                                caseItem.c_gkws_dsr
                                                            "
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        d="M9 6a3 3 0 11-6 0 3 3 0 016 0zM17 6a3 3 0 11-6 0 3 3 0 016 0zM12.93 17c.046-.327.07-.66.07-1a6.97 6.97 0 00-1.5-4.33A5 5 0 0119 16v1h-6.07zM6 11a5 5 0 015 5v1H1v-1a5 5 0 015-5z"
                                                                    />
                                                                </svg>
                                                                相关当事人
                                                            </div>
                                                            <div
                                                                class="text-sm bg-gray-50 p-1.5 rounded border border-gray-100"
                                                            >
                                                                {{
                                                                    caseItem.c_gkws_dsr ||
                                                                    "暂无"
                                                                }}
                                                            </div>
                                                        </div>

                                                        <!-- 判决结果 -->
                                                        <div
                                                            v-if="
                                                                caseItem.c_gkws_pjjg
                                                            "
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M10 1.944A11.954 11.954 0 012.166 5C2.056 5.649 2 6.319 2 7c0 5.225 3.34 9.67 8 11.317C14.66 16.67 18 12.225 18 7c0-.682-.057-1.35-.166-2.001A11.954 11.954 0 0110 1.944zm-4.707 3.05a1 1 0 00.707.293h2a1 1 0 00.707-.293l.708-.707a1 1 0 000-1.414l-.708-.707a1 1 0 00-.707-.293h-2a1 1 0 00-.707.293l-.708.707a1 1 0 000 1.414l.708.707z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                判决结果
                                                            </div>
                                                            <div
                                                                class="text-sm bg-gray-50 p-1.5 rounded border border-gray-100 whitespace-pre-line"
                                                            >
                                                                {{
                                                                    caseItem.c_gkws_pjjg ||
                                                                    "暂无"
                                                                }}
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <!-- 后续案件信息 -->
                                                    <div
                                                        v-if="caseItem.next"
                                                        class="mt-3 pl-3 border-l-2 border-dashed"
                                                        :class="
                                                            type.color
                                                                .replace(
                                                                    'bg-',
                                                                    'border-'
                                                                )
                                                                .replace(
                                                                    '-50',
                                                                    '-300'
                                                                )
                                                        "
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            后续案件
                                                        </div>
                                                        <div
                                                            class="text-sm bg-white p-2 rounded shadow-sm border border-gray-100 flex items-center justify-between"
                                                        >
                                                            <div
                                                                class="truncate mr-2"
                                                            >
                                                                {{
                                                                    caseItem
                                                                        .next
                                                                        .c_ah
                                                                }}
                                                            </div>
                                                            <span
                                                                v-if="
                                                                    caseItem
                                                                        .next
                                                                        .stage_type
                                                                "
                                                                class="text-xs px-2 py-0.5 rounded-full bg-blue-50 text-blue-600 font-medium flex-shrink-0"
                                                            >
                                                                {{
                                                                    caseItem
                                                                        .next
                                                                        .stage_type ===
                                                                    2
                                                                        ? "二审"
                                                                        : caseItem
                                                                              .next
                                                                              .stage_type ===
                                                                          3
                                                                        ? "再审"
                                                                        : caseItem
                                                                              .next
                                                                              .stage_type ===
                                                                          4
                                                                        ? "申请再审"
                                                                        : caseItem
                                                                              .next
                                                                              .stage_type ===
                                                                          5
                                                                        ? "执行"
                                                                        : "其他"
                                                                }}
                                                            </span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- 失信被执行人案件 -->
                                            <div
                                                v-if="type.type === 'sxbzxr'"
                                                v-for="(
                                                    caseItem, caseIndex
                                                ) in company.lawsuitInfo.sxbzxr"
                                                :key="caseIndex"
                                                class="bg-gray-50 rounded-xl p-3 border border-gray-100 hover:border-gray-300 transition-all duration-300 relative overflow-hidden group"
                                            >
                                                <!-- 装饰元素 -->
                                                <div
                                                    class="absolute top-0 right-0 w-24 h-24 opacity-5 transform rotate-45 translate-x-10 -translate-y-10 group-hover:opacity-10 transition-opacity duration-300"
                                                    :class="
                                                        type.color
                                                            .replace(
                                                                'text-',
                                                                'bg-'
                                                            )
                                                            .replace(
                                                                '-50',
                                                                '-600'
                                                            )
                                                    "
                                                ></div>

                                                <!-- 案件头部信息 -->
                                                <div
                                                    class="flex flex-wrap justify-between items-center mb-3 pb-2 border-b border-dashed border-gray-200"
                                                >
                                                    <div
                                                        class="font-medium flex items-center gap-2 mr-2 truncate"
                                                    >
                                                        <span
                                                            class="text-gray-800 truncate"
                                                            >{{
                                                                caseItem.ah ||
                                                                "暂无案号"
                                                            }}</span
                                                        >
                                                        <span
                                                            class="ml-2 text-xs px-2 py-0.5 rounded-full font-medium flex-shrink-0 bg-red-50 text-red-600"
                                                        >
                                                            失信被执行人
                                                        </span>
                                                    </div>
                                                    <div
                                                        class="flex items-center gap-3 flex-shrink-0"
                                                    >
                                                        <div
                                                            v-if="caseItem.larq"
                                                            class="flex items-center text-xs text-gray-500 whitespace-nowrap"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            立案:
                                                            {{
                                                                formatDate(
                                                                    caseItem.larq
                                                                )
                                                            }}
                                                        </div>
                                                        <div
                                                            v-if="caseItem.fbrq"
                                                            class="flex items-center text-xs text-gray-500 whitespace-nowrap"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            发布:
                                                            {{
                                                                formatDate(
                                                                    caseItem.fbrq
                                                                )
                                                            }}
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- 案件信息卡片 -->
                                                <div
                                                    class="rounded-lg space-y-3"
                                                >
                                                    <!-- 法院和地区信息 -->
                                                    <div
                                                        class="grid grid-cols-1 sm:grid-cols-2 gap-3"
                                                    >
                                                        <div
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M10.496 2.132a1 1 0 00-.992 0l-7 4A1 1 0 003 8v7a1 1 0 100 2h14a1 1 0 100-2V8a1 1 0 00.496-1.868l-7-4zM6 9a1 1 0 00-1 1v3a1 1 0 102 0v-3a1 1 0 00-1-1zm3 1a1 1 0 012 0v3a1 1 0 11-2 0v-3zm5-1a1 1 0 00-1 1v3a1 1 0 102 0v-3a1 1 0 00-1-1z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                执行法院
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.zxfy ||
                                                                    "—"
                                                                }}
                                                            </div>
                                                        </div>
                                                        <div
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                所属地域
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.sf ||
                                                                    "—"
                                                                }}
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <!-- 企业法人 -->
                                                    <div
                                                        v-if="caseItem.qyfr"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            企业法人
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                caseItem.qyfr ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 组织机构代码 -->
                                                    <div
                                                        v-if="caseItem.zzjgdm"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 4a2 2 0 012-2h8a2 2 0 012 2v12a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm3 1h2v2H7V5zm2 4H7v2h2V9zm2-4h2v2h-2V5zm2 4h-2v2h2V9z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            组织机构代码
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                caseItem.zzjgdm ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 执行依据文号 -->
                                                    <div
                                                        v-if="caseItem.zxyjwh"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            执行依据文号
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                caseItem.zxyjwh ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 执行依据单位 -->
                                                    <div
                                                        v-if="caseItem.zxyjdw"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 4a2 2 0 012-2h8a2 2 0 012 2v12a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm3 1h2v2H7V5zm2 4H7v2h2V9zm2-4h2v2h-2V5zm2 4h-2v2h2V9z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            执行依据单位
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                caseItem.zxyjdw ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 义务内容 -->
                                                    <div
                                                        v-if="caseItem.yw"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            生成法律文书确定的义务
                                                        </div>
                                                        <div
                                                            class="text-sm bg-gray-50 p-1.5 rounded border border-gray-100"
                                                        >
                                                            {{
                                                                caseItem.yw ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 履行情况 -->
                                                    <div
                                                        v-if="caseItem.lxqk"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M6.267 3.455a3.066 3.066 0 001.745-.723 3.066 3.066 0 013.976 0 3.066 3.066 0 001.745.723 3.066 3.066 0 012.812 2.812c.051.643.304 1.254.723 1.745a3.066 3.066 0 010 3.976 3.066 3.066 0 00-.723 1.745 3.066 3.066 0 01-2.812 2.812 3.066 3.066 0 00-1.745.723 3.066 3.066 0 01-3.976 0 3.066 3.066 0 00-1.745-.723 3.066 3.066 0 01-2.812-2.812 3.066 3.066 0 00-.723-1.745 3.066 3.066 0 010-3.976 3.066 3.066 0 00.723-1.745 3.066 3.066 0 012.812-2.812zm7.44 5.252a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            履行情况
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                caseItem.lxqk ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 行为情形 -->
                                                    <div
                                                        v-if="caseItem.xwqx"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            行为情形
                                                        </div>
                                                        <div
                                                            class="text-sm bg-gray-50 p-1.5 rounded border border-gray-100"
                                                        >
                                                            {{
                                                                caseItem.xwqx ||
                                                                "—"
                                                            }}
                                                        </div>
                                                    </div>

                                                    <!-- 金额估计 -->
                                                    <div
                                                        v-if="caseItem.pjje_gj"
                                                        class="bg-white rounded-lg p-2 shadow-sm"
                                                    >
                                                        <div
                                                            class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    d="M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"
                                                                />
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            金额估计
                                                        </div>
                                                        <div
                                                            class="text-sm font-medium"
                                                        >
                                                            {{
                                                                formatLawsuitMoney(
                                                                    caseItem.pjje_gj
                                                                ) || "—"
                                                            }}
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <!-- 限高被执行人案件 -->
                                            <div
                                                v-if="type.type === 'xgbzxr'"
                                                v-for="(
                                                    caseItem, caseIndex
                                                ) in company.lawsuitInfo.xgbzxr"
                                                :key="caseIndex"
                                                class="bg-gray-50 rounded-xl p-3 border border-gray-100 hover:border-gray-300 transition-all duration-300 relative overflow-hidden group"
                                            >
                                                <!-- 装饰元素 -->
                                                <div
                                                    class="absolute top-0 right-0 w-24 h-24 opacity-5 transform rotate-45 translate-x-10 -translate-y-10 group-hover:opacity-10 transition-opacity duration-300"
                                                    :class="
                                                        type.color
                                                            .replace(
                                                                'text-',
                                                                'bg-'
                                                            )
                                                            .replace(
                                                                '-50',
                                                                '-600'
                                                            )
                                                    "
                                                ></div>

                                                <!-- 案件头部信息 -->
                                                <div
                                                    class="flex flex-wrap justify-between items-center mb-3 pb-2 border-b border-dashed border-gray-200"
                                                >
                                                    <div
                                                        class="font-medium flex items-center gap-2 mr-2 truncate"
                                                    >
                                                        <span
                                                            class="text-gray-800 truncate"
                                                            >{{
                                                                caseItem.ah ||
                                                                "暂无案号"
                                                            }}</span
                                                        >
                                                        <span
                                                            class="ml-2 text-xs px-2 py-0.5 rounded-full font-medium flex-shrink-0 bg-orange-50 text-orange-600"
                                                        >
                                                            限高被执行人
                                                        </span>
                                                    </div>
                                                    <div
                                                        class="flex items-center gap-3 flex-shrink-0"
                                                    >
                                                        <div
                                                            v-if="caseItem.fbrq"
                                                            class="flex items-center text-xs text-gray-500 whitespace-nowrap"
                                                        >
                                                            <svg
                                                                xmlns="http://www.w3.org/2000/svg"
                                                                class="h-3 w-3 mr-1"
                                                                viewBox="0 0 20 20"
                                                                fill="currentColor"
                                                            >
                                                                <path
                                                                    fill-rule="evenodd"
                                                                    d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
                                                                    clip-rule="evenodd"
                                                                />
                                                            </svg>
                                                            发布:
                                                            {{
                                                                formatDate(
                                                                    caseItem.fbrq
                                                                )
                                                            }}
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- 案件信息卡片 -->
                                                <div
                                                    class="rounded-lg space-y-3"
                                                >
                                                    <!-- 法院和ID信息 -->
                                                    <div
                                                        class="grid grid-cols-1 sm:grid-cols-2 gap-3"
                                                    >
                                                        <div
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M10.496 2.132a1 1 0 00-.992 0l-7 4A1 1 0 003 8v7a1 1 0 100 2h14a1 1 0 100-2V8a1 1 0 00.496-1.868l-7-4zM6 9a1 1 0 00-1 1v3a1 1 0 102 0v-3a1 1 0 00-1-1zm3 1a1 1 0 012 0v3a1 1 0 11-2 0v-3zm5-1a1 1 0 00-1 1v3a1 1 0 102 0v-3a1 1 0 00-1-1z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                执行法院
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.zxfy ||
                                                                    "—"
                                                                }}
                                                            </div>
                                                        </div>
                                                        <div
                                                            class="bg-white rounded-lg p-2 shadow-sm"
                                                        >
                                                            <div
                                                                class="text-xs text-gray-500 mb-0.5 flex items-center"
                                                            >
                                                                <svg
                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                    class="h-3 w-3 mr-1"
                                                                    viewBox="0 0 20 20"
                                                                    fill="currentColor"
                                                                >
                                                                    <path
                                                                        fill-rule="evenodd"
                                                                        d="M4 4a2 2 0 012-2h8a2 2 0 012 2v12a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm3 1h2v2H7V5zm2 4H7v2h2V9zm2-4h2v2h-2V5zm2 4h-2v2h2V9z"
                                                                        clip-rule="evenodd"
                                                                    />
                                                                </svg>
                                                                标识ID
                                                            </div>
                                                            <div
                                                                class="text-sm font-medium"
                                                            >
                                                                {{
                                                                    caseItem.id ||
                                                                    "—"
                                                                }}
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </template>

                            <!-- 无案件信息时显示 -->
                            <template v-else>
                                <div class="py-8 text-center">
                                    <div
                                        class="w-16 h-16 mx-auto mb-4 text-gray-300"
                                    >
                                        <svg
                                            xmlns="http://www.w3.org/2000/svg"
                                            viewBox="0 0 24 24"
                                            fill="currentColor"
                                        >
                                            <path
                                                d="M6.94 14.036c-.233.624-.43 1.2-.606 1.783.96-.697 2.101-1.139 3.418-1.304 2.513-.314 4.746-1.973 5.876-4.058l-1.456-1.455 1.413-1.415 1-1.001c.43-.43.915-1.224 1.428-2.368-5.593.867-9.018 4.292-11.074 9.818zM17 9.001L18 10c-1 3-4 6-8 6.5-2.669.334-4.336 2.167-5.002 5.5H3C4 16 6 2 21 2c-1 2.997-1.998 4.996-2.997 5.997L17 9.001z"
                                            />
                                        </svg>
                                    </div>
                                    <p class="text-gray-500">
                                        该企业暂无涉诉风险记录
                                    </p>
                                </div>
                            </template>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 无涉诉风险时的空状态展示 -->
        <div
            v-else
            class="text-gray-500 py-10 text-center bg-gray-50 rounded-lg mx-4 mb-4"
        >
            <div class="text-gray-300 text-3xl mb-2">⚖️</div>
            暂无涉诉风险记录
        </div>
    </div>
</template>

<script setup>
import { use } from "echarts/core";
import { CanvasRenderer } from "echarts/renderers";
import { BarChart, PieChart } from "echarts/charts";
import {
    GridComponent,
    TooltipComponent,
    TitleComponent,
    LegendComponent,
} from "echarts/components";
import VChart from "vue-echarts";

// 注册必须的组件
use([
    CanvasRenderer,
    BarChart,
    PieChart,
    GridComponent,
    TooltipComponent,
    TitleComponent,
    LegendComponent,
]);
const props = defineProps({
    data: {
        type: Object,
        required: true,
        default: () => [],
    },
    totalCompanies: {
        type: Number,
        required: true,
        default: 0,
    },
});
const totalCompanies = toRef(props, "totalCompanies");

const lawsuitCompanies = computed(() => props.data || []);

// 用于跟踪展开的企业卡片
const expandedCompanies = ref({});

// 切换展开/收起企业详情
const toggleCompanyExpand = (companyId, listType, index) => {
    // 创建唯一标识符，包含企业名称、列表类型和索引
    const uniqueKey = `${companyId}_${listType}_${index}`;
    expandedCompanies.value[uniqueKey] = !expandedCompanies.value[uniqueKey];
};

// 检查企业是否展开
const isCompanyExpanded = (companyId, listType, index) => {
    const uniqueKey = `${companyId}_${listType}_${index}`;
    return !!expandedCompanies.value[uniqueKey];
};

// 计算所有关联企业的总体涉诉风险统计
const allLawsuitStats = computed(() => {
    if (!lawsuitCompanies.value || lawsuitCompanies.value.length === 0)
        return null;

    // 初始化统计数据
    const stats = {
        totalCompanies: lawsuitCompanies.value.length,
        highRiskCompanies: 0,
        mediumRiskCompanies: 0,
        lowRiskCompanies: 0,
        sxbzxrCount: 0, // 失信被执行人总数
        xgbzxrCount: 0, // 限高被执行人总数
        totalRiskItems: 0, // 总风险事项
        normalOperatingCompanies: 0, // 正常经营企业
        canceledCompanies: 0, // 吊销注销企业
        typeStats: {}, // 按类型统计案件数
        areaStats: {}, // 按地区统计案件数
    };

    // 遍历所有涉诉企业
    lawsuitCompanies.value.forEach((company) => {
        if (!company.lawsuitInfo) return;

        // 统计企业经营状态
        if (company.basicInfo && company.basicInfo.regStatus) {
            if (
                company.basicInfo.regStatus.includes("注销") ||
                company.basicInfo.regStatus.includes("吊销")
            ) {
                stats.canceledCompanies++;
            } else if (
                company.basicInfo.regStatus.includes("存续") ||
                company.basicInfo.regStatus.includes("在营")
            ) {
                stats.normalOperatingCompanies++;
            }
        }

        // 统计风险等级
        const riskLevel = getRiskLevel(company).level;
        if (riskLevel === "high" || riskLevel === "medium-high") {
            stats.highRiskCompanies++;
        } else if (riskLevel === "medium" || riskLevel === "low-medium") {
            stats.mediumRiskCompanies++;
        } else {
            stats.lowRiskCompanies++;
        }

        // 统计失信被执行人
        if (
            company.lawsuitInfo.sxbzxr &&
            company.lawsuitInfo.sxbzxr.length > 0
        ) {
            stats.sxbzxrCount += company.lawsuitInfo.sxbzxr.length;
            stats.totalRiskItems += company.lawsuitInfo.sxbzxr.length;
            stats.typeStats["sxbzxr"] =
                (stats.typeStats["sxbzxr"] || 0) +
                company.lawsuitInfo.sxbzxr.length;
        }

        // 统计限高被执行人
        if (
            company.lawsuitInfo.xgbzxr &&
            company.lawsuitInfo.xgbzxr.length > 0
        ) {
            stats.xgbzxrCount += company.lawsuitInfo.xgbzxr.length;
            stats.totalRiskItems += company.lawsuitInfo.xgbzxr.length;
            stats.typeStats["xgbzxr"] =
                (stats.typeStats["xgbzxr"] || 0) +
                company.lawsuitInfo.xgbzxr.length;
        }

        // 统计案件数据
        if (company.lawsuitInfo.data) {
            const data = company.lawsuitInfo.data;
            // 按类型统计
            Object.keys(lawsuitTypeMap).forEach((type) => {
                if (
                    type !== "sxbzxr" &&
                    type !== "xgbzxr" &&
                    data[type] &&
                    Object.keys(data[type]).length > 0
                ) {
                    const typeData = data[type];
                    const count =
                        typeData.cases && typeData.cases.length
                            ? typeData.cases.length
                            : 0;

                    if (count > 0) {
                        if (!stats.typeStats[type]) stats.typeStats[type] = 0;
                        stats.typeStats[type] += count;
                        stats.totalRiskItems += count;
                    }

                    // 统计地区分布
                    if (typeData.cases) {
                        typeData.cases.forEach((caseItem) => {
                            if (caseItem.c_ssdy) {
                                const area = caseItem.c_ssdy
                                    .split("省")[0]
                                    .split("市")[0]
                                    .split("自治区")[0];
                                if (!stats.areaStats[area])
                                    stats.areaStats[area] = 0;
                                stats.areaStats[area]++;
                            }
                        });
                    }
                }
            });
        }
    });

    // 转换类型统计为数组格式，用于展示
    stats.typeList = Object.keys(stats.typeStats)
        .map((type) => ({
            type,
            count: stats.typeStats[type],
            name: getCaseTypeText(type),
            color: getCaseTypeColor(type),
            darkColor: getCaseTypeDarkColor(type),
        }))
        .sort((a, b) => b.count - a.count);

    // 转换地区统计为数组
    stats.areaList = Object.keys(stats.areaStats)
        .map((area) => ({
            area,
            count: stats.areaStats[area],
        }))
        .sort((a, b) => b.count - a.count);
    return stats;
});

const activeTabCase = ref(null);

// 设置当前活跃的案件类型标签
const setActiveTab = (type) => {
    activeTabCase.value = activeTabCase.value === type ? null : type;
};

// 检查是否是当前活跃的标签
const isActiveTab = (type) => {
    return activeTabCase.value === type;
};

// 关系映射表
const lawsuitTypeMap = {
    sxbzxr: {
        text: "失信被执行",
        color: "text-red-600 bg-red-50",
        darkColor: "bg-red-500",
    },
    xgbzxr: {
        text: "限高被执行",
        color: "text-orange-600 bg-orange-50",
        darkColor: "bg-orange-500",
    },
    civil: {
        text: "民事案件",
        color: "text-blue-600 bg-blue-50",
        darkColor: "bg-blue-500",
    },
    criminal: {
        text: "刑事案件",
        color: "text-red-600 bg-red-50",
        darkColor: "bg-red-500",
    },
    administrative: {
        text: "行政案件",
        color: "text-purple-600 bg-purple-50",
        darkColor: "bg-purple-500",
    },
    preservation: {
        text: "非诉保全审查",
        color: "text-amber-600 bg-amber-50",
        darkColor: "bg-amber-500",
    },
    implement: {
        text: "执行案件",
        color: "text-orange-600 bg-orange-50",
        darkColor: "bg-orange-500",
    },
    bankrupt: {
        text: "强制清算与破产案件",
        color: "text-rose-600 bg-rose-50",
        darkColor: "bg-rose-500",
    },
};

// 案件类型图标
const getCaseTypeIcon = (type) => {
    return "";
};

// 案件类型文本
const getCaseTypeText = (type) => {
    return lawsuitTypeMap[type]?.text || "其他案件";
};

// 案件类型颜色
const getCaseTypeColor = (type) => {
    return lawsuitTypeMap[type]?.color || "text-gray-600 bg-gray-50";
};

// 案件类型深色
const getCaseTypeDarkColor = (type) => {
    return lawsuitTypeMap[type]?.darkColor || "bg-gray-500";
};
// 格式化资本金额显示
const formatCapital = (capital, currency) => {
    if (!capital) return "—";

    // 检查是否包含"万"字或需要显示为万元
    let unit = "";
    let value = parseFloat(capital);

    // 处理原始数据中可能带有的单位
    if (typeof capital === "string" && capital.includes("万")) {
        unit = "万";
        // 提取数字部分
        const numMatch = capital.match(/[\d.]+/);
        value = numMatch ? parseFloat(numMatch[0]) : 0;
    } else if (value >= 10000) {
        // 大额数字转换为万元显示
        value = value / 10000;
        unit = "万";
    }

    // 格式化数字，保留两位小数（如果有小数部分）
    const formattedValue = value.toLocaleString("zh-CN", {
        minimumFractionDigits: 0,
        maximumFractionDigits: 2,
    });

    return `${formattedValue}${unit} ${currency || "人民币"}`;
};

// 获取企业状态对应的样式
const getStatusClass = (status) => {
    if (!status) return "bg-gray-100 text-gray-500";

    if (status.includes("注销") || status.includes("吊销")) {
        return "bg-red-50 text-red-600";
    } else if (status.includes("存续") || status.includes("在营")) {
        return "bg-green-50 text-green-600";
    } else if (status.includes("筹建") || status.includes("新设")) {
        return "bg-blue-50 text-blue-600";
    } else {
        return "bg-yellow-50 text-yellow-600";
    }
};

// 格式化日期显示
const formatDate = (dateStr) => {
    if (!dateStr) return "—";
    // 转换YYYY-MM-DD为年月日格式
    if (dateStr.includes("-")) {
        const parts = dateStr.split("-");
        if (parts.length === 3) {
            return `${parts[0]}年${parts[1]}月${parts[2]}日`;
        }
    }
    return dateStr; // 如果不是标准格式则返回原始字符串
};

// 获取涉诉风险等级
const getRiskLevel = (company) => {
    if (!company || !company.lawsuitInfo)
        return {
            level: "low",
            text: "低风险",
            color: "text-green-600 bg-green-50",
        };

    const lawsuit = company.lawsuitInfo;

    // 失信被执行人是最高风险
    if (lawsuit.sxbzxr && lawsuit.sxbzxr.length > 0) {
        return {
            level: "high",
            text: "高风险",
            color: "text-red-600 bg-red-50",
        };
    }

    // 限高被执行人是中高风险
    if (lawsuit.xgbzxr && lawsuit.xgbzxr.length > 0) {
        return {
            level: "medium-high",
            text: "中高风险",
            color: "text-orange-600 bg-orange-50",
        };
    }

    // 有涉诉数据的风险级别
    if (lawsuit.data && Object.keys(lawsuit.data).length > 0) {
        // 检查是否有未结案的案件
        const data = lawsuit.data;
        if (data.count && data.count_wei_total && data.count_wei_total > 0) {
            return {
                level: "medium",
                text: "中风险",
                color: "text-amber-600 bg-amber-50",
            };
        }

        // 只有已结案的为低中风险
        return {
            level: "low-medium",
            text: "低中风险",
            color: "text-yellow-600 bg-yellow-50",
        };
    }

    return {
        level: "low",
        text: "低风险",
        color: "text-green-600 bg-green-50",
    };
};

// 获取涉诉案件统计
const getLawsuitStats = (company) => {
    if (!company || !company.lawsuitInfo) return null;

    const stats = {
        total: 0,
        types: [],
    };

    // 统计各类型案件数量
    Object.keys(lawsuitTypeMap).forEach((type) => {
        let count = 0;

        if (type === "sxbzxr") {
            count =
                company.lawsuitInfo.sxbzxr &&
                company.lawsuitInfo.sxbzxr.length > 0
                    ? company.lawsuitInfo.sxbzxr.length
                    : 0;
        } else if (type === "xgbzxr") {
            count =
                company.lawsuitInfo.xgbzxr &&
                company.lawsuitInfo.xgbzxr.length > 0
                    ? company.lawsuitInfo.xgbzxr.length
                    : 0;
        } else if (
            company.lawsuitInfo.data &&
            company.lawsuitInfo.data[type] &&
            Object.keys(company.lawsuitInfo.data[type]).length > 0
        ) {
            const typeData = company.lawsuitInfo.data[type];
            count =
                typeData.cases && typeData.cases.length
                    ? typeData.cases.length
                    : 0;
        }

        if (count > 0) {
            stats.total += count;
            stats.types.push({
                type,
                count,
                name: getCaseTypeText(type),
                color: getCaseTypeColor(type),
                darkColor: getCaseTypeDarkColor(type),
            });
        }
    });

    return stats;
};

// 格式化金额显示（单位：万元）
const formatLawsuitMoney = (money) => {
    if (!money) return "—";

    const value = parseFloat(money);
    if (isNaN(value)) return "—";

    // 超过1亿显示亿元
    if (value >= 10000) {
        return (
            (value / 10000).toLocaleString("zh-CN", {
                minimumFractionDigits: 0,
                maximumFractionDigits: 2,
            }) + " 亿元"
        );
    }

    // 否则显示万元
    return (
        value.toLocaleString("zh-CN", {
            minimumFractionDigits: 0,
            maximumFractionDigits: 2,
        }) + " 万元"
    );
};

// 获取案件状态样式
const getCaseStatusClass = (status) => {
    if (!status) return "bg-gray-100 text-gray-500";

    if (status.includes("已结") || status.includes("已办结")) {
        return "bg-green-50 text-green-600";
    } else if (status.includes("执行中") || status.includes("审理中")) {
        return "bg-blue-50 text-blue-600";
    } else if (status.includes("未执行")) {
        return "bg-amber-50 text-amber-600";
    } else {
        return "bg-gray-100 text-gray-500";
    }
};

// 案件类型分布图表配置
const caseTypeChartOption = computed(() => {
    // 获取所有可能的案件类型，确保即使没有数据的类型也会显示
    const allCaseTypes = Object.keys(lawsuitTypeMap).map((key) => ({
        type: key,
        name: lawsuitTypeMap[key].text,
        icon: lawsuitTypeMap[key].icon,
        color: lawsuitTypeMap[key].color,
        darkColor: lawsuitTypeMap[key].darkColor,
        count: 0, // 默认为0
    }));

    // 如果有统计数据，更新数量
    if (
        allLawsuitStats.value &&
        allLawsuitStats.value.typeList &&
        allLawsuitStats.value.typeList.length > 0
    ) {
        // 用实际数据更新默认值
        allLawsuitStats.value.typeList.forEach((item) => {
            const existingType = allCaseTypes.find(
                (type) => type.type === item.type
            );
            if (existingType) {
                existingType.count = item.count;
            }
        });
    } else {
        // 如果没有任何数据，显示暂无数据的信息
        return {
            title: {
                text: "暂无数据",
                left: "center",
                top: "center",
                textStyle: {
                    fontSize: 14,
                    fontWeight: "normal",
                    color: "#aaa",
                },
            },
        };
    }

    // 准备柱状图数据
    const categories = allCaseTypes.map((item) => item.name);
    const values = allCaseTypes.map((item) => item.count);
    const colors = allCaseTypes.map((item) => {
        // 从 bg-blue-500 这样的格式中提取颜色
        if (item.darkColor.includes("blue")) return "#3b82f6";
        if (item.darkColor.includes("red")) return "#ef4444";
        if (item.darkColor.includes("purple")) return "#8b5cf6";
        if (item.darkColor.includes("amber")) return "#f59e0b";
        if (item.darkColor.includes("orange")) return "#f97316";
        if (item.darkColor.includes("rose")) return "#f43f5e";
        return "#6b7280"; // 默认灰色
    });

    // 为每种颜色创建渐变定义
    const colorGradients = colors.map((color) => {
        return {
            type: "linear",
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
                { offset: 0, color: color }, // 顶部色
                {
                    offset: 1,
                    color: color.replace(")", ", 0.5)").replace("rgb", "rgba"),
                }, // 底部色，透明度0.5
            ],
        };
    });

    return {
        tooltip: {
            trigger: "axis",
            formatter: function (params) {
                const dataIndex = params[0].dataIndex;
                return `${categories[dataIndex]}: ${values[dataIndex]}件`;
            },
        },
        grid: {
            left: "5%",
            right: "5%",
            bottom: "10%",
            top: "10%",
            containLabel: true,
        },
        xAxis: {
            type: "category",
            data: categories,
            axisLabel: {
                interval: 0,
                rotate: categories.length > 4 ? 30 : 0,
                fontSize: 10,
                color: "#666",
            },
            axisLine: {
                lineStyle: {
                    color: "#ddd",
                },
            },
        },
        yAxis: {
            type: "value",
            splitLine: {
                lineStyle: {
                    type: "dashed",
                    color: "#eee",
                },
            },
            axisLabel: {
                fontSize: 10,
                color: "#666",
            },
        },
        series: [
            {
                name: "案件数量",
                type: "bar",
                barWidth: "40%",
                data: values.map((value, index) => {
                    return {
                        value: value,
                        itemStyle: {
                            color: colorGradients[index],
                            shadowBlur: 10,
                            shadowColor: colors[index]
                                .replace(")", ", 0.3)")
                                .replace("rgb", "rgba"),
                            shadowOffsetY: 5,
                            borderRadius: [5, 5, 0, 0],
                        },
                    };
                }),
                emphasis: {
                    itemStyle: {
                        shadowBlur: 20,
                        shadowColor: "rgba(0, 0, 0, 0.5)",
                    },
                },
                label: {
                    show: true,
                    position: "top",
                    fontSize: 10,
                    color: "#666",
                },
            },
        ],
    };
});

// 在setup部分添加状态变量和计算属性
const activeCaseTypeFilter = ref("all"); // 当前选中的案件类型筛选

// 按案件类型筛选企业
const filteredLawsuitCompanies = computed(() => {
    if (activeCaseTypeFilter.value === "all") {
        return lawsuitCompanies.value;
    }

    return lawsuitCompanies.value.filter((company) => {
        if (!company.lawsuitInfo) return false;

        // 特殊筛选: 失信被执行人
        if (activeCaseTypeFilter.value === "sxbzxr") {
            return (
                company.lawsuitInfo.sxbzxr &&
                company.lawsuitInfo.sxbzxr.length > 0
            );
        }

        // 特殊筛选: 限高被执行人
        if (activeCaseTypeFilter.value === "xgbzxr") {
            return (
                company.lawsuitInfo.xgbzxr &&
                company.lawsuitInfo.xgbzxr.length > 0
            );
        }

        // 按案件类型筛选
        return (
            company.lawsuitInfo.data &&
            company.lawsuitInfo.data[activeCaseTypeFilter.value] &&
            company.lawsuitInfo.data[activeCaseTypeFilter.value].cases &&
            company.lawsuitInfo.data[activeCaseTypeFilter.value].cases.length >
                0
        );
    });
});

// 获取每种案件类型的企业数量
const caseTypeCompanyCounts = computed(() => {
    const counts = {
        all: lawsuitCompanies.value.length,
    };

    // 初始化所有案件类型的计数
    Object.keys(lawsuitTypeMap).forEach((type) => {
        counts[type] = 0;
    });

    // 计算每种类型的企业数量
    lawsuitCompanies.value.forEach((company) => {
        if (!company.lawsuitInfo) return;

        // 计算失信被执行人
        if (
            company.lawsuitInfo.sxbzxr &&
            company.lawsuitInfo.sxbzxr.length > 0
        ) {
            counts.sxbzxr++;
        }

        // 计算限高被执行人
        if (
            company.lawsuitInfo.xgbzxr &&
            company.lawsuitInfo.xgbzxr.length > 0
        ) {
            counts.xgbzxr++;
        }

        // 计算各类型案件
        if (company.lawsuitInfo.data) {
            Object.keys(company.lawsuitInfo.data).forEach((type) => {
                if (
                    company.lawsuitInfo.data[type] &&
                    company.lawsuitInfo.data[type].cases &&
                    company.lawsuitInfo.data[type].cases.length > 0
                ) {
                    counts[type]++;
                }
            });
        }
    });

    return counts;
});

// 设置当前筛选类型
const setCaseTypeFilter = (type) => {
    activeCaseTypeFilter.value = type;
};

// 获取企业涉及的案件类型
const getCompanyCaseTypes = (company) => {
    if (!company || !company.lawsuitInfo) return [];

    const caseTypes = [];

    // 先检查特殊案件类型（按重要性降序）
    // 1. 失信被执行人（最高风险）
    if (company.lawsuitInfo.sxbzxr && company.lawsuitInfo.sxbzxr.length > 0) {
        caseTypes.push({
            type: "sxbzxr",
            text: lawsuitTypeMap["sxbzxr"].text,
            color: lawsuitTypeMap["sxbzxr"].color,
        });
    }

    // 2. 限高被执行人
    if (company.lawsuitInfo.xgbzxr && company.lawsuitInfo.xgbzxr.length > 0) {
        caseTypes.push({
            type: "xgbzxr",
            text: lawsuitTypeMap["xgbzxr"].text,
            color: lawsuitTypeMap["xgbzxr"].color,
        });
    }

    // 3. 其他案件类型（按类型顺序排列）
    if (company.lawsuitInfo.data) {
        // 案件类型优先级顺序
        const typeOrder = [
            "criminal",
            "civil",
            "administrative",
            "implement",
            "bankrupt",
            "preservation",
        ];

        // 按优先级顺序检查各类型
        typeOrder.forEach((type) => {
            if (
                company.lawsuitInfo.data[type] &&
                company.lawsuitInfo.data[type].cases &&
                company.lawsuitInfo.data[type].cases.length > 0
            ) {
                caseTypes.push({
                    type,
                    text: lawsuitTypeMap[type].text,
                    color: lawsuitTypeMap[type].color,
                });
            }
        });
    }

    return caseTypes;
};

// 在setup部分添加状态变量和计算属性
const companyActiveTabCase = ref({});

// 设置当前活跃的案件类型标签
const setCompanyActiveTab = (companyId, type) => {
    companyActiveTabCase.value[companyId] = type;
};

// 检查是否是当前活跃的标签
const isCompanyActiveTab = (companyId, type) => {
    return companyActiveTabCase.value[companyId] === type;
};

// 获取企业当前的筛选标签，如果未设置则默认为null(全部)
const getCompanyActiveTab = (companyId) => {
    return companyActiveTabCase.value[companyId] !== undefined
        ? companyActiveTabCase.value[companyId]
        : null;
};

// 初始化企业筛选标签为全部
const initCompanyTabCase = (companyId) => {
    if (companyActiveTabCase.value[companyId] === undefined) {
        companyActiveTabCase.value[companyId] = null; // null 表示全部
    }
};

// 监听企业展开状态变化，初始化筛选状态
watch(
    expandedCompanies,
    (newVal) => {
        for (const key in newVal) {
            if (newVal[key]) {
                const companyId = key.split("_")[0];
                initCompanyTabCase(companyId);
            }
        }
    },
    { deep: true }
);

// 初始化所有企业默认筛选状态
onMounted(() => {
    if (lawsuitCompanies.value && lawsuitCompanies.value.length > 0) {
        lawsuitCompanies.value.forEach((company) => {
            initCompanyTabCase(company.orgName);
        });
    }
});
</script>

<style lang="scss" scoped></style>
