<template>
    <tr>
        <td colspan="10" style="background: #bdd6ec;color: #db0039;text-align:left">网贷状况统计*（涉及金额部分单位为：元）</td>
    </tr>
    <tr>
        <td colspan="10" style="text-align:left">本人网贷共{{props.sum}}家，本页是第{{props.index + 1}}家</td>
    </tr>
    <tr>
        <td class="label" colspan="2">贷款机构</td>
        <td colspan="3">{{props.data.loanPlatform}}</td>
        <td class="label" colspan="2">贷款所属银行名称</td>
        <td colspan="3">{{props.data.bank}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">网贷状态(正常/逾期)</td>
        <td colspan="3">{{props.data.loanStatus
                  ? LoanStatus?.find((v) => v.value === props.data.loanStatus)?.label
                  : ''}}</td>
        <td class="label" colspan="2">贷款审批额度</td>
        <td colspan="3">{{props.data.quota}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">网贷类型</td>
        <td colspan="3">{{props.data.lendingType}}</td>
        <td class="label" colspan="2">还款方式</td>
        <td colspan="3">{{props.data.repayType}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">欠款金额</td>
        <td colspan="3">{{props.data.debt}}</td>
        <td class="label" colspan="2">贷款到账金额</td>
        <td colspan="3">{{props.data.receivedAmount}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">贷款期数</td>
        <td colspan="3">{{props.data.period}}</td>
        <td class="label" colspan="2">已还期数</td>
        <td colspan="3">{{props.data.repayPeriod}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">贷款笔数</td>
        <td colspan="3">{{props.data.lendingNum}}</td>
        <td class="label" colspan="2">逾期期数</td>
        <td colspan="3">{{props.data.beOverduePeriod}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">是否被代偿或起诉</td>
        <td colspan="3">{{props.data.hasSue == 'Y' ? '是' : '否'}}</td>
        <td class="label" colspan="2">还款日</td>
        <td colspan="3">{{props.data.repayDate}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">代扣银行及卡号</td>
        <td colspan="3">{{props.data.bankCard}}</td>
        <td class="label" colspan="2">贷款支付密码</td>
        <td colspan="3">{{props.data.payPassword}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">最后一次还款时间</td>
        <td colspan="3">{{props.data.lastRepaymentDate}}</td>
        <td class="label" colspan="2">最后一次还款金额</td>
        <td colspan="3">{{props.data.lastRepaymentAmount}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">贷款担保人姓名</td>
        <td colspan="3">{{props.data.guarantorName}}</td>
        <td class="label" colspan="2">贷款担保人关系</td>
        <td colspan="3">{{props.data.roleDesc}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">贷款担保人联系方式</td>
        <td colspan="3">{{props.data.guarantorPhone}}</td>
        <td class="label" colspan="2">紧急联系人姓名</td>
        <td colspan="3">{{props.data.liaisonName}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">银行预留手机号码</td>
        <td colspan="3">{{props.data.bankPhone}}</td>
        <td class="label" colspan="2">催收情况</td>
        <td colspan="3">{{props.data.collectionDesc}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">逾期后是否有过协商方案</td>
        <td colspan="3">{{props.data.hasNegotiateCase == 'Y' ? '是' : '否'}}</td>
        <td class="label" colspan="2">负债情况</td>
        <td colspan="3">{{props.data.liabilities}}</td>
    </tr>
    <tr>
        <td class="label" colspan="2">是否连续还款</td>
        <td colspan="8">{{props.data.hasContinuousRepay == 'Y' ? '是' : '否'}}</td>
    </tr>
</template>
<script setup lang="jsx" name="caseDetail">
    import { useDict } from '@/hooks/useDict';
    import { ref, computed, reactive, onBeforeMount } from 'vue';
    const { LoanStatus } = useDict("LoanStatus");

    const props = defineProps({
        data: Object,
        index: Number,
        sum: Number
    })
</script>
<style lang="scss" scoped>
table {
  width: calc(100%);
  border-collapse: collapse;
}
td {
  border: 1px solid #000;
  width: 150px;
  background: #fff;
  line-height: 11px;
  height: 40px;
  font-size: 14px;
  padding-left: 5px;
  color: #000;
  word-wrap:break-word;
  word-break:break-all;
  -webkit-print-color-adjust: exact;
  text-align: center;
  &.label {
    -webkit-print-color-adjust: exact;
    background-color: #dfeaf5;
    font-weight: 400 !important;
  }
}
</style>