<template>
  <div class="access-condition">
    <!-- 基本信息 -->
    <div class="basic-information">
      <div class="info-module-title"><span>基本信息</span></div>
      <!-- 基本信息表格 -->
      <table>
        <tr>
          <td class="table-key">资源平台分类</td>
          <td colspan="3">-</td>
        </tr>
        <tr>
          <td class="table-key">公司名称</td>
          <td>{{supplierAccessInfo.customerName ? supplierAccessInfo.customerName : "-"}}</td>
          <td class="table-key">注册资本（万元）</td>
          <td>{{supplierAccessInfo.registerCapital ? supplierAccessInfo.registerCapital : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">证件选择</td>
          <td>{{supplierAccessInfo.cardType ? supplierAccessInfo.cardType : "-"}}</td>
          <td class="table-key">统一社会信用代码</td>
          <td>{{supplierAccessInfo.unifySocialCode ? supplierAccessInfo.unifySocialCode : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">工商注册号</td>
          <td>{{supplierAccessInfo.registerNo ? supplierAccessInfo.registerNo : "-"}}</td>
          <td class="table-key">组织机构代码证号</td>
          <td>{{supplierAccessInfo.orgnizationCode ? supplierAccessInfo.orgnizationCode : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">税务登记号</td>
          <td colspan="3">{{supplierAccessInfo.businessLicense ? supplierAccessInfo.businessLicense : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">身份选择</td>
          <td>{{supplierAccessInfo.cardType ? supplierAccessInfo.cardType : "-"}}</td>
          <td class="table-key">法人身份证号/护照...</td>
          <td>{{supplierAccessInfo.idCard ? supplierAccessInfo.idCard : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">纳税人身份</td>
          <td>{{supplierAccessInfo.paytaxType ? supplierAccessInfo.paytaxType : "-"}}</td>
          <td class="table-key">纳税人税率</td>
          <td>{{supplierAccessInfo.taxRate ? supplierAccessInfo.taxRate : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key lot">享受优惠政策说明</td>
          <td colspan="3">-</td>
        </tr>
      </table>

      <table style="margin-top:16px;">
        <tr>
          <td class="table-key">法人代表</td>
          <td>{{supplierAccessInfo.representative ? supplierAccessInfo.representative : "-"}}</td>
          <td class="table-key">公司联系人</td>
          <td>{{supplierAccessInfo.contactPerson ? supplierAccessInfo.contactPerson : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">公司联系人电话</td>
          <td>{{supplierAccessInfo.contactPhone ? supplierAccessInfo.contactPhone : "-"}}</td>
          <td class="table-key">主项资质</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">公司性质</td>
          <td>{{supplierAccessInfo.customerProperty ? supplierAccessInfo.customerProperty : "-"}}</td>
          <td class="table-key">资质等级</td>
          <td>{{supplierAccessInfo.credential ? supplierAccessInfo.credential : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">施工承包范围</td>
          <td>{{supplierAccessInfo.constructJobScope ? supplierAccessInfo.constructJobScope : "-"}}</td>
          <td class="table-key">专业类别</td>
          <td>{{supplierAccessInfo.groupSpecialty ? supplierAccessInfo.groupSpecialty : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">公司注册地所属区域</td>
          <td>{{supplierAccessInfo.registerRegion ? supplierAccessInfo.registerRegion : "-"}}</td>
          <td class="table-key">公司注册地所属省</td>
          <td>{{supplierAccessInfo.registerProvince ? supplierAccessInfo.registerProvince : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">公司注册地所属城市</td>
          <td>{{supplierAccessInfo.registerCity ? supplierAccessInfo.registerCity : "-"}}</td>
          <td class="table-key">注册地址</td>
          <td>{{supplierAccessInfo.registerAddress ? supplierAccessInfo.registerAddress : "-"}}</td>
        </tr>
        <tr>
          <td class="table-key">开户行</td>
          <td>{{supplierAccessInfo.openBank ? supplierAccessInfo.openBank : "-"}}</td>
          <td class="table-key">银行账号</td>
          <td>{{supplierAccessInfo.bankAccount ? supplierAccessInfo.bankAccount : "-"}}</td>
        </tr>
      </table>

    </div>

    <!-- 上传证书及其他信息 -->
    <div class="certificate-details table-item">
      <div class="info-module-title"><span>上传证书及其他信息</span></div>

      <table class="table-box" border="0" cellspacing="0" >
        <thead>
        <td width="30%">证书类型</td>
        <td width="25%">到期时间</td>
        <td width="10%">状态</td>
        <td width="35%">查看</td>
        </thead>
        <template v-if="supplierAccessInfo.businessLicenseList&&supplierAccessInfo.businessLicenseList.length>0">
          <tr v-for="(item,index) in supplierAccessInfo.businessLicenseList">
            <td :rowspan="supplierAccessInfo.businessLicenseList.length" v-if="index == 0">营业执照</td>
            <td>{{supplierAccessInfo.expireDate1 || '--'}}</td>
            <td>{{supplierAccessInfo.status1}}</td>
            <td class="blue">
              <el-link :href="`${item.docLink}`" :underline="false" target="_blank">
                <span class="blue"> {{item.docName}}</span>
              </el-link>
            </td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>营业执照</td>
            <td>--</td>
            <td>--</td>
            <td>--</td>
          </tr>
        </template>
        <template v-if="supplierAccessInfo.orgCertificateList&&supplierAccessInfo.orgCertificateList.length>0">
          <tr v-for="(item,index) in supplierAccessInfo.orgCertificateList">
            <td :rowspan="supplierAccessInfo.orgCertificateList.length" v-if="index == 0">组织机构代码</td>
            <td>{{supplierAccessInfo.expireDate2 || '--'}}</td>
            <td>{{supplierAccessInfo.status2}}</td>
            <td class="blue">
              <el-link :href="`${item.docLink}`" :underline="false" target="_blank">
                <span class="blue"> {{item.docName}}</span>
              </el-link>
            </td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>组织机构代码</td>
            <td>--</td>
            <td>--</td>
            <td>--</td>
          </tr>
        </template>
        <template v-if="supplierAccessInfo.taxCertificateList&&supplierAccessInfo.taxCertificateList.length>0">
          <tr v-for="(item,index) in supplierAccessInfo.taxCertificateList">
            <td :rowspan="supplierAccessInfo.taxCertificateList.length" v-if="index == 0">税务登记证</td>
            <td>{{supplierAccessInfo.expireDate3 || '--'}}</td>
            <td>{{supplierAccessInfo.status3}}</td>
            <td class="blue">
              <el-link :href="`${item.docLink}`" :underline="false" target="_blank">
                <span class="blue"> {{item.docName}}</span>
              </el-link>
            </td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>税务登记证</td>
            <td>--</td>
            <td>--</td>
            <td>--</td>
          </tr>
        </template>
        <template v-if="supplierAccessInfo.qualificationCertificateList&&supplierAccessInfo.qualificationCertificateList.length>0">
          <tr v-for="(item,index) in supplierAccessInfo.qualificationCertificateList">
            <td :rowspan="supplierAccessInfo.qualificationCertificateList.length" v-if="index == 0">资质证书</td>
            <td>{{supplierAccessInfo.expireDate4 || '--'}}</td>
            <td>{{supplierAccessInfo.status4}}</td>
            <td class="blue">
              <el-link :href="`${item.docLink}`" :underline="false" target="_blank">
                <span class="blue"> {{item.docName}}</span>
              </el-link>
            </td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>资质证书</td>
            <td>--</td>
            <td>--</td>
            <td>--</td>
          </tr>
        </template>
        <template v-if="supplierAccessInfo.safetyCertificateList&&supplierAccessInfo.safetyCertificateList.length>0">
          <tr v-for="(item,index) in supplierAccessInfo.safetyCertificateList">
            <td :rowspan="supplierAccessInfo.safetyCertificateList.length" v-if="index == 0">安全生产</td>
            <td>{{supplierAccessInfo.expireDate5 || '--'}}</td>
            <td>{{supplierAccessInfo.status5}}</td>
            <td class="blue">
              <el-link :href="`${item.docLink}`" :underline="false" target="_blank">
                <span class="blue"> {{item.docName}}</span>
              </el-link>
            </td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>安全生产</td>
            <td>--</td>
            <td>--</td>
            <td>--</td>
          </tr>
        </template>
        <template v-if="supplierAccessInfo.ratepayerCertificateList&&supplierAccessInfo.ratepayerCertificateList.length>0">
          <tr v-for="(item,index) in supplierAccessInfo.ratepayerCertificateList">
            <td :rowspan="supplierAccessInfo.ratepayerCertificateList.length" v-if="index == 0">增值税一般纳税人资格证明</td>
            <td></td>
            <td></td>
            <td class="blue">
              <el-link :href="`${item.docLink}`" :underline="false" target="_blank">
                <span class="blue">{{item.docName}}</span>
              </el-link>
            </td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>增值税一般纳税人资格证明</td>
            <td>--</td>
            <td>--</td>
            <td>--</td>
          </tr>
        </template>
        <tr>
          <td>业绩报告</td>
          <td>--</td>
          <td>--</td>
          <td>--</td>
        </tr>
        <tr>
          <td>考察报告</td>
          <td>--</td>
          <td>--</td>
          <td>--</td>
        </tr>
        <tr>
          <td>其他</td>
          <td>--</td>
          <td>--</td>
          <td>--</td>
        </tr>
      </table>

    </div>

    <!-- 审批意见 -->
    <div class="approval-opinions">
      <div class="info-module-title"><span>审批意见</span></div>

      <!-- 项目部意见 -->
      <div class="project-opinion">
        <div class="opinion-title">项目部意见</div>
        <table>
          <tr>
            <td class="table-key">准入情况</td>
            <td colspan="3">{{supplierAccessInfo.isagree || '--'}}</td>
          </tr>
          <tr>
            <td class="table-key">经办人</td>
            <td>{{supplierAccessInfo.responsiblePerson || '--'}}</td>
            <td class="table-key">准入时间</td>
            <td>{{supplierAccessInfo.approveDate1 || '--'}}</td>
          </tr>
          <tr>
            <td class="table-key">商务经理</td>
            <td>{{supplierAccessInfo.businessManager || '--'}}</td>
            <td class="table-key">准入时间</td>
            <td>{{supplierAccessInfo.approveDate3 || '--'}}</td>
          </tr>
          <tr>
            <td class="table-key">项目经理</td>
            <td>{{supplierAccessInfo.projectManager || '--'}}</td>
            <td class="table-key">准入时间</td>
            <td>{{supplierAccessInfo.approveDate4 || '--'}}</td>
          </tr>
        </table>
      </div>

      <!-- 公司意见 -->
      <div class="company-opinion">
        <div class="opinion-title">公司意见</div>
        <table>
          <tr>
            <td class="table-key">公司意见</td>
            <td>{{supplierAccessInfo.purchasePrincipal || '--'}}</td>
            <td class="table-key">准入时间</td>
            <td>{{supplierAccessInfo.approveDate2 || '--'}}</td>
          </tr>
        </table>
      </div>

    </div>

  </div>
</template>
<script>
import { getSupplierAccessInfoApi } from "@/api/internalCooperation";
export default {
  name: "accessCondition",
  props: ['companyId', "companyInfo"],
  data() {
    return {
      comCompanyInfo: this.companyInfo,
      queryParams: {
        advisoryBodyCid: this.companyId,
      },
      supplierAccessInfo: {},
      textTabel: []
    };
  },
  //可访问data属性
  created() {
    this.init();
  },
  //计算集
  computed: {

  },
  //方法集
  methods: {
    async init() {
      try {
        const result = await getSupplierAccessInfoApi({
          customerName: this.comCompanyInfo.companyName
        });
        if (result.code == 200 && result.data) {
          this.supplierAccessInfo = { ...this.supplierAccessInfo, ...result.data };
        }
        console.log(result);
      } catch (error) {

      }
    }
  },
}
</script>
<style lang="scss" scoped>
.access-condition {
  width: 100%;
  height: 100%;
  padding: 16px;
  box-sizing: border-box;
  overflow: auto;

  .info-module-title {
    line-height: 24px;
    color: #232323;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    & > span {
      display: inline-block;
      position: relative;
      padding-left: 8px;
      box-sizing: border-box;
      &::before {
        content: "";
        position: absolute;
        left: 0px;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(35, 35, 35, 0.8);
        width: 2px;
        height: 14px;
      }
    }
  }

  table {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
    &,
    th,
    td {
      border: 1px solid #e6eaf1;
      box-sizing: border-box;
    }

    td {
      padding: 9px 12px;
      line-height: 22px;
      color: #232323;
      font-size: 12px;
    }

    .table-key {
      width: 140px;
      background: #f0f3fa;
      color: rgba(35, 35, 35, 0.8);

      &.lot {
        height: 62px;
      }
    }
  }

  .approval-opinions,
  .certificate-details {
    margin-top: 32px;
    .table-box {
      margin-top: 16px;
      border: 1px solid #e6e9f0;
      width: 100%;
      border-top: 0;
      thead {
        background: #f0f3fa;
      }
      tr:nth-child(2n + 1) {
        background: #f9fcff;
      }
      tr:hover {
        background: #dcebff;
      }
      td {
        border-top: 1px solid #e6e9f0;
        border-right: 1px solid #e6e9f0;
        height: auto;
        font-weight: 400;
        font-size: 12px;
        padding: 12px;
      }
      .blue {
        color: #0081ff;
        cursor: pointer;
      }
    }
  }

  .certificate-details {
    &.table-item {
      ::v-deep .el-table {
        .el-table__header-wrapper {
          position: static;
        }
      }
    }
  }

  .approval-opinions {
    .company-opinion,
    .project-opinion {
      margin-top: 16px;
      .opinion-title {
        color: #232323;
        font-size: 14px;
        line-height: 24px;
        margin-bottom: 16px;
      }
    }
  }
}
</style>
