<script setup lang="tsx">
import { ContentWrap } from '@/components/ContentWrap';
import { ElButton } from "element-plus"
import { reactive, ref, unref } from 'vue'
import { propTypes } from '@/utils/propTypes'

const systemUse = reactive({
  title:"客户信息( 校验已通过 )",
  tableInfo:[
    {
      columnName:"客户号：",
      columnValue:"custCode",
    },
    {
      columnName:"客户名称：",
      columnValue:"custName",
    },
    {
      columnName:"客户类型：",
      columnValue:"",
    },
    {
      columnName:"客户证件类型：",
      columnValue:"",
    },
    {
      columnName:"客户证件号码：",
      columnValue:"",
    },
    {
      columnName:"电话号码：",
      columnValue:"",
    },
    {
      columnName:"次数：",
      columnValue:"",
    },
    {
      columnName:"总金额：",
      columnValue:"",
    },
    {
      columnName:"规则编码：",
      columnValue:"",
    },
    {
      columnName:"规则名称：",
      columnValue:"",
    },
  ],//table信息显示
  tableData:{},
})
const props = defineProps({
  searchStatus: propTypes.bool.def(false),
  customerInfo:propTypes.object.def({})
})
const editCustomerInfo = ()=>{

}
const detailCustomerInfo = ()=>{

}
const returnCustomerInfo = ()=>{

}
</script>

<template>
  <ContentWrap>
    <table>
      <tr>
        <th colspan="6" class="title">{{ systemUse.title }}</th>
      </tr>
      <tr>
        <th>客户号：</th>
        <td>{{ props.customerInfo.custCode }}</td>
        <th>客户名称：</th>
        <td>{{ props.customerInfo.custName }}</td>
        <th>客户类型：</th>
        <td>对私</td>
      </tr>
      <tr>
        <th>客户证件类型：</th>
        <td>居民身份证</td>
        <th>客户证件号码：</th>
        <td>632124200110263676</td>
        <th>电话号码：</th>
        <td>18897033113</td>
      </tr>
      <tr>
        <th>次数：</th>
        <td>{{ props.customerInfo.tranRecord }}</td>
        <th>总金额：</th>
        <td>{{ props.customerInfo.tranAmount }}</td>
        <th>规则编码：</th>
        <td>{{ props.customerInfo.ruleCode }}</td>
      </tr>
      <tr>
        <th>规则名称：</th>
        <td colspan="5">自然人客户银行账户与其他的银行账户之间当日单笔或者累计人民币50万元以上（含50万元）、外币等值10万美元以上（含10万美元）的境内款项划转。</td>
      </tr>
      <tr>
        <td colspan="6">
          <ElButton type="primary" @click="editCustomerInfo()">编辑</ElButton>
          <ElButton type="primary" @click="detailCustomerInfo()">详细</ElButton>
          <!-- <ElButton type="primary" @click="returnCustomerInfo()">返回</ElButton> -->
        </td>
      </tr>
    </table>
  </ContentWrap>
</template>

<style scoped lang="scss">
  table{
    border:1px solid #eee;
    border-collapse:collapse;
    background-color: #e5f6fb;
    font-size: 15px;
    th,td{
      width:16.7%;
      height:30px;
      line-height:30px;
      border:1px solid #999;
    }
    th{
      text-align:right;
    }
    td{
      font-size: 16px;
    }
    .title{
      text-align:center;
      background-color: #51c7ee;

    }
  }
  
</style>