<template>
  <div class="el-container">
    <el-descriptions class="margin-top" title="" :column="3" border style="width: 100%">
      <el-descriptions-item label="法人代表姓名" :label-style="labelStyle" :content-style="contentStyle">{{ personInfo.legalPersonName }}</el-descriptions-item>
      <el-descriptions-item label="法人代表手机号" :label-style="labelStyle" :content-style="contentStyle">{{ personInfo.legalPersonPhone }}</el-descriptions-item>
      <el-descriptions-item label="法人代表证件" :label-style="labelStyle">{{ personInfo.legalPersonCertificateTypeName }}  {{ personInfo.legalPersonCertificateCode }}</el-descriptions-item>

      <el-descriptions-item label="业务负责人姓名">{{ personInfo.businessLeaderName }}</el-descriptions-item>
      <el-descriptions-item label="业务负责人手机号">{{ personInfo.businessLeaderPhone }}</el-descriptions-item>
      <el-descriptions-item label="业务负责人证件">{{ personInfo.businessLeaderCertificateTypeName }}  {{ personInfo.businessLeaderCertificateCode }}</el-descriptions-item>

      <el-descriptions-item label="备用联系人姓名">{{ personInfo.backupPersonName }}</el-descriptions-item>
      <el-descriptions-item label="备用联系人手机号" >{{ personInfo.backupPersonPhone }}</el-descriptions-item>
      <el-descriptions-item label="备用联系人证件">{{ personInfo.backupPersonCertificateTypeName }}  {{ personInfo.backupPersonCertificateCode }}</el-descriptions-item>

      <el-descriptions-item label="技术负责人姓名">{{ personInfo.technicalLeaderName }}</el-descriptions-item>
      <el-descriptions-item label="技术负责人手机号">{{ personInfo.technicalLeaderPhone }}</el-descriptions-item>
      <el-descriptions-item label="技术负责人证件">{{ personInfo.technicalLeaderCertificateTypeName }}  {{ personInfo.technicalLeaderCertificateCode }}</el-descriptions-item>

      <el-descriptions-item label="售后负责人姓名">{{ personInfo.saleLeaderName }}</el-descriptions-item>
      <el-descriptions-item label="售后负责人手机号">{{ personInfo.saleLeaderPhone }}</el-descriptions-item>
      <el-descriptions-item label="售后负责人证件">{{ personInfo.saleLeaderCertificateTypeName }}  {{ personInfo.saleLeaderCertificateCode }}</el-descriptions-item>

      <el-descriptions-item label="财务负责人姓名">{{ personInfo.financeLeaderName }}</el-descriptions-item>
      <el-descriptions-item label="财务负责人手机号">{{ personInfo.financeLeaderPhone }}</el-descriptions-item>
      <el-descriptions-item label="财务负责人证件">{{ personInfo.financeLeaderCertificateTypeName }}  {{ personInfo.financeLeaderCertificateCode }}</el-descriptions-item>
      <el-descriptions-item label="附件下载" span="3">
        <el-link :href="baseUrl + personInfo.legalPersonCertificateFrontScan" :disabled="personInfo.legalPersonCertificateFrontScan === '#'" type="primary" target="_blank">法人代表证件照正面</el-link> |
        <el-link :href="baseUrl + personInfo.legalPersonCertificateBackScan" :disabled="personInfo.legalPersonCertificateBackScan === '#'" type="primary" target="_blank">法人代表证件照背面</el-link> |
        <el-link :href="baseUrl + personInfo.businessLeaderCertificateFrontScan" :disabled="personInfo.businessLeaderCertificateFrontScan === '#'" type="primary" target="_blank">业务负责人证件照正面</el-link> |
        <el-link :href="baseUrl + personInfo.businessLeaderCertificateBackScan" :disabled="personInfo.businessLeaderCertificateBackScan === '#'" type="primary" target="_blank">业务负责人证件照背面</el-link>
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
export default {
  name: 'PersonInfoDetail',
  data() {
    return {
      personInfo: {
        legalPersonName: '',
        legalPersonPhone: '',
        legalPersonCertificateCode: '',
        legalPersonCertificateTypeName: '',
        legalPersonCertificateFrontScan: '#',
        legalPersonCertificateBackScan: '#',
        businessLeaderName: '',
        businessLeaderCertificateTypeName: '',
        businessLeaderCertificateCode: '',
        businessLeaderPhone: '',
        businessLeaderCertificateFrontScan: '#',
        businessLeaderCertificateBackScan: '#',
        backupPersonName: '',
        backupPersonPhone: '',
        backupPersonCertificateTypeName: '',
        backupPersonCertificateCode: '',
        technicalLeaderName: '',
        technicalLeaderPhone: '',
        technicalLeaderCertificateTypeName: '',
        technicalLeaderCertificateCode: '',
        saleLeaderName: '',
        saleLeaderPhone: '',
        saleLeaderCertificateTypeName: '',
        saleLeaderCertificateCode: '',
        financeLeaderName: '',
        financeLeaderPhone: '',
        financeLeaderCertificateTypeName: '',
        financeLeaderCertificateCode: ''
      },
      baseUrl: '',
      labelStyle: {
        width: '15%'
      },
      contentStyle: {
        width: '15%'
      }
    }
  },
  methods: {
    showPersonDetail(person) {
      this.personInfo = person

      this.baseUrl = this.baseConfig.baseUrl + '/static/'
    }
  }
}
</script>

<style scoped>

</style>