<template>
    <div class="p-4 card space-y-4">
        <!-- 黑名单信息 -->
        <div class="">
            <!-- <LTitle title="银行卡黑名单" type="blue-green" class="mb-4"></LTitle> -->

            <div class="space-y-4">
                <div v-for="(value, key) in data" :key="key" class="flex justify-between items-center">
                    <div class="font-medium">{{ labelMap[key] }}</div>
                    <div
                        :class="['text-white rounded-lg font-bold py-1 px-2', { 'bg-red-500': value === '1', 'bg-green-500': value === '0' }]">
                        {{ value === '0' ? '未存在' : '被列入该黑名单' }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup>
import { defineProps } from 'vue'

// 接收 props
const props = defineProps({
    data: {
        type: Object,
        required: true,
    },
    params: {
        type: Object,
        required: true,
    }
})
// 映射黑名单标签
const labelMap = {
    onlineBlack: "线上卡号黑名单",
    offlineBlack: "线下卡号黑名单",
    badCardHolder: "不良持卡人名单",
    fraudTrans: "交易欺诈名单",
    otherBlack: "其他卡号黑名单",
    caseRelated: "涉案卡片"
}


</script>

<style scoped>
/* 添加需要的样式 */
</style>