<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>-</td>
          <td class="table-key">注册资本（万元）</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">证件选择</td>
          <td>-</td>
          <td class="table-key">统一社会信用代码</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">工商注册号</td>
          <td>-</td>
          <td class="table-key">组织机构代码证号</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">税务登记号</td>
          <td colspan="3">-</td>
        </tr>
        <tr>
          <td class="table-key">身份选择</td>
          <td>-</td>
          <td class="table-key">法人身份证号/护照...</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">纳税人身份</td>
          <td>-</td>
          <td class="table-key">纳税人税率</td>
          <td>-</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>-</td>
          <td class="table-key">公司联系人</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">公司联系人电话</td>
          <td>-</td>
          <td class="table-key">主项资质</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">公司性质</td>
          <td>-</td>
          <td class="table-key">资质等级</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">施工承包范围</td>
          <td>-</td>
          <td class="table-key">专业类别</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">公司注册地所属区域</td>
          <td>-</td>
          <td class="table-key">公司注册地所属省</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">公司注册地所属城市</td>
          <td>-</td>
          <td class="table-key">注册地址</td>
          <td>-</td>
        </tr>
        <tr>
          <td class="table-key">开户行</td>
          <td>-</td>
          <td class="table-key">银行账号</td>
          <td>-</td>
        </tr>
      </table>

    </div>

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

      <el-table :data="textTabel" border stripe>
        <el-table-column label="证书类型" width="194px">
        </el-table-column>
        <el-table-column label="到期时间" width="194px">
        </el-table-column>
        <el-table-column label="状态" width="194px">
        </el-table-column>
        <el-table-column label="查看" min-width="194px">
        </el-table-column>
        <el-table-column label="操作" width="194px">
        </el-table-column>
      </el-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">-</td>
          </tr>
          <tr>
            <td class="table-key">经办人</td>
            <td>-</td>
            <td class="table-key">准入时间</td>
            <td>-</td>
          </tr>
          <tr>
            <td class="table-key">商务经理</td>
            <td>-</td>
            <td class="table-key">准入时间</td>
            <td>-</td>
          </tr>
          <tr>
            <td class="table-key">项目经理</td>
            <td>-</td>
            <td class="table-key">准入时间</td>
            <td>-</td>
          </tr>
        </table>
      </div>

      <!-- 公司意见 -->
      <div class="company-opinion">
        <div class="opinion-title">公司意见</div>
        <table>
          <tr>
            <td class="table-key">公司意见</td>
            <td>-</td>
            <td class="table-key">准入时间</td>
            <td>-</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;
  }

  .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>
