<template>
  <div class="supplier">
    <div class="search-supplier">
      <div class="title_wrap i">
        <div class="enterprise_title">
          准入情况
        </div>
      </div>
      <div class="access-content">
        <el-tabs v-model="activeName" @tab-click="handleClick" class="tabpane w100">
          <el-tab-pane label="分包基本信息" name="first">
            <div class="acc-title">基本信息</div>
            <div class="main3-box">
              <p>
                <label class="label">资源平台分类</label>
                <span></span>
                <!--<span class="span-one">{{custmerInfo. || '&#45;&#45;'}}</span>-->
              </p>
              <p>
                <label class="label">公司名称</label>
                <span>{{custmerInfo.cusomerName || '--'}}</span>
                <label class="label">注册资本（万元）</label>
                <span>{{custmerInfo.registerCapital || '--'}}</span>
              </p>
              <p>
                <label class="label">证件选择</label>
                <span></span>
                <label class="label">统一社会信用代码</label>
                <span>{{custmerInfo.unifySocialCode || '--'}}</span>
              </p>
              <p>
                <label class="label">工商注册号</label>
                <span>{{custmerInfo.registerNo || '--'}}</span>
                <label class="label">组织机构代码证号</label>
                <span>{{custmerInfo.orgnizationCode || '--'}}</span>
              </p>
              <p>
                <label class="label">税务登记号</label>
                <span>{{custmerInfo.businessLicense || '--'}}</span>
              </p>
              <p>
                <label class="label">身份选择</label>
                <span>{{custmerInfo.cardType || '--'}}</span>
                <label class="label">法人身份证号/护照/其他</label>
                <span>{{custmerInfo.idCard || '--'}}</span>
              </p>
              <p>
                <label class="label">纳税人身份</label>
                <span>{{custmerInfo.paytaxType || '--'}}</span>
                <label class="label">纳税人税率(%)</label>
                <span>{{custmerInfo.taxRate || '--'}}</span>
              </p>
              <p>
                <label class="label">享受优惠政策说明</label>
                <span class="span-one" style="height: 64px"></span>
              </p>
            </div>
            <div class="main3-box">
              <p>
                <label class="label">法人代表</label>
                <span>{{custmerInfo.representative || '--'}}</span>
                <label class="label">公司联系人</label>
                <span>{{custmerInfo.contactPerson || '--'}}</span>
              </p>
              <p>
                <label class="label">公司联系人电话</label>
                <span>{{custmerInfo.contactPhone || '--'}}</span>
                <label class="label">主项资质</label>
                <span></span>
              </p>
              <p>
                <label class="label">公司性质</label>
                <span>{{custmerInfo.customerProperty || '--'}}</span>
                <label class="label">资质等级</label>
                <span>{{custmerInfo.credential || '--'}}</span>
              </p>
              <p>
                <label class="label">施工承包范围</label>
                <span>{{custmerInfo.constructJobScope || '--'}}</span>
                <label class="label">专业类别</label>
                <span>{{custmerInfo.groupSpecialty || '--'}}</span>
              </p>
              <p>
                <label class="label">公司注册地所属区域</label>
                <span>{{custmerInfo.registerRegion || '--'}}</span>
                <label class="label">公司注册地所属省</label>
                <span>{{custmerInfo.registerProvince || '--'}}</span>
              </p>
              <p>
                <label class="label">公司注册地所属城市</label>
                <span>{{custmerInfo.registerCity || '--'}}</span>
                <label class="label">注册地址</label>
                <span>{{custmerInfo.address || '--'}}</span>
              </p>
              <p>
                <label class="label">开户行</label>
                <span>{{custmerInfo.openBank || '--'}}</span>
                <label class="label">银行账号</label>
                <span>{{custmerInfo.bankAccount || '--'}}</span>
              </p>
            </div>
            <div class="acc-title i">上传证书及其他信息</div>
            <skeleton v-if="fbsisSkeleton"></skeleton>
            <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="custmerInfo.businessLicenseList&&custmerInfo.businessLicenseList.length>0">
                <tr v-for="(item,index) in custmerInfo.businessLicenseList">
                  <td :rowspan="custmerInfo.businessLicenseList.length" v-if="index == 0">营业执照</td>
                  <td>{{custmerInfo.expireDate1 || '--'}}</td>
                  <td>{{custmerInfo.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="custmerInfo.orgCertificateList&&custmerInfo.orgCertificateList.length>0">
                <tr v-for="(item,index) in custmerInfo.orgCertificateList">
                  <td :rowspan="custmerInfo.orgCertificateList.length" v-if="index == 0">组织机构代码</td>
                  <td>{{custmerInfo.expireDate2 || '--'}}</td>
                  <td>{{custmerInfo.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="custmerInfo.taxCertificateList&&custmerInfo.taxCertificateList.length>0">
                <tr v-for="(item,index) in custmerInfo.taxCertificateList">
                  <td :rowspan="custmerInfo.taxCertificateList.length" v-if="index == 0">税务登记证</td>
                  <td>{{custmerInfo.expireDate3 || '--'}}</td>
                  <td>{{custmerInfo.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="custmerInfo.qualificationCertificateList&&custmerInfo.qualificationCertificateList.length>0">
                <tr v-for="(item,index) in custmerInfo.qualificationCertificateList">
                  <td :rowspan="custmerInfo.qualificationCertificateList.length" v-if="index == 0">资质证书</td>
                  <td>{{custmerInfo.expireDate4 || '--'}}</td>
                  <td>{{custmerInfo.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="custmerInfo.safetyCertificateList&&custmerInfo.safetyCertificateList.length>0">
                <tr v-for="(item,index) in custmerInfo.safetyCertificateList">
                  <td :rowspan="custmerInfo.safetyCertificateList.length" v-if="index == 0">安全生产</td>
                  <td>{{custmerInfo.expireDate5 || '--'}}</td>
                  <td>{{custmerInfo.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="custmerInfo.ratepayerCertificateList&&custmerInfo.ratepayerCertificateList.length>0">
                <tr v-for="(item,index) in custmerInfo.ratepayerCertificateList">
                  <td :rowspan="custmerInfo.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 class="acc-title i">项目部意见</div>
            <div class="main3-box">
              <p>
                <label class="label">准入情况</label>
                <span>{{custmerInfo.isagree || '--'}}</span>
              </p>
              <p>
                <label class="label">经办人</label>
                <span>{{custmerInfo.responsiblePerson || '--'}}</span>
                <label class="label">准入时间</label>
                <span>{{custmerInfo.approveDate1 || '--'}}</span>
              </p>
              <p>
                <label class="label">商务经理</label>
                <span>{{custmerInfo.businessManager || '--'}}</span>
                <label class="label">准入时间</label>
                <span>{{custmerInfo.approveDate3 || '--'}}</span>
              </p>
              <p>
                <label class="label">项目经理</label>
                <span>{{custmerInfo.projectManager || '--'}}</span>
                <label class="label">准入时间</label>
                <span>{{custmerInfo.approveDate4 || '--'}}</span>
              </p>
            </div>
            <div class="acc-title i">公司意见</div>
            <div class="main3-box">
              <p>
                <label class="label">公司意见</label>
                <span>{{custmerInfo.purchasePrincipal || '--'}}</span>
                <label class="label">准入时间</label>
                <span>{{custmerInfo.approveDate2||'--'}}</span>
              </p>
            </div>
          </el-tab-pane>
          <el-tab-pane label="施工业绩" name="second">
            <div class="table-item-jf table-item-jf1 empty-table" v-if="!tableData.length && !isSkeleton">
              <img class="item-jf-img" src="@/assets/images/kong.png" alt="">
              <div class="item-jf-titel">暂无相关数据</div>
              <div class="item-jf-text">抱歉，暂无数据，试试更换搜索条件吧</div>
            </div>
            <skeleton v-if="isSkeleton"></skeleton>

            <div class="table-item-jf table-item" v-if="!isSkeleton&&tableData.length>0">
              <el-table :data="tableData" :header-cell-style="{ background:'#f0f3fa',color: 'rgba(35,35,35,0.8)'}"
                        v-sticky-header.always="{offsetTop : '0px',offsetBottom : '10px'}" class="table-item1 fixed-table" border highlight-current-row
                        :header-row-class-name="setHeaderRow" :cell-class-name="setCellClass" :row-class-name="setRowClass" :header-cell-class-name="setCellClass"
                        ref="theOwnerListTable">

                <el-table-column type="index" label="序号" :fixed="tableColumnFixed" width="60" :resizable="false">
                  <template slot-scope="scope">
                    <span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span>
                  </template>
                </el-table-column>
                <el-table-column label="标志性工程" :fixed="tableColumnFixed" prop="name1" width="300" :resizable="false">
                </el-table-column>

                <el-table-column label="年度" :resizable="false" width="100">
                  <template slot-scope="scope">
                    {{scope.row.name2||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="所在区域" :resizable="false" width="100">
                  <template slot-scope="scope">
                    {{scope.row.name3||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="所属省份"  :resizable="false" width="100">
                  <template slot-scope="scope">
                    {{scope.row.name4||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="施工面积（㎡）" :resizable="false" width="140">
                  <template slot-scope="scope">
                    {{scope.row.name5||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="年施工产值（亿）" :resizable="false" width="140">
                  <template slot-scope="scope">
                    {{scope.row.name6||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="所获荣誉" :resizable="false" width="100">
                  <template slot-scope="scope">
                    {{scope.row.name7||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="备注说明" :resizable="false">
                  <template slot-scope="scope">
                    {{scope.row.name8||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="考察项目" :resizable="false" width="300">
                  <template slot-scope="scope">
                    {{scope.row.name9||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="考察公司" :resizable="false" width="250">
                  <template slot-scope="scope">
                    {{scope.row.name10||"--"}}
                  </template>
                </el-table-column>

              </el-table>
            </div>
            <div class="pagination clearfix" v-show="total>pageSize">
              <el-pagination background :page-size="pageSize" :current-page.sync="pageNum" @current-change="handleCurrentChange" layout="prev, pager, next"
                             :total="total">
              </el-pagination>
            </div>

          </el-tab-pane>
          <el-tab-pane label="在施工程情况" name="third">
            <div class="table-item-jf table-item-jf1 empty-table" v-if="!tableData1.length && !isSkeleton">
              <img class="item-jf-img" src="@/assets/images/kong.png" alt="">
              <div class="item-jf-titel">暂无相关数据</div>
              <div class="item-jf-text">抱歉，暂无数据，试试更换搜索条件吧</div>
            </div>
            <skeleton v-if="isSkeleton"></skeleton>

            <div class="table-item-jf table-item" v-if="!isSkeleton&&tableData1.length>0">
              <el-table :data="tableData1" :header-cell-style="{ background:'#f0f3fa',color: 'rgba(35,35,35,0.8)'}"
                        v-sticky-header.always="{offsetTop : '0px',offsetBottom : '10px'}" class="table-item1 fixed-table" border highlight-current-row
                        :header-row-class-name="setHeaderRow" :cell-class-name="setCellClass" :row-class-name="setRowClass" :header-cell-class-name="setCellClass"
                        ref="theOwnerListTable">

                <el-table-column type="index" label="序号" :fixed="tableColumnFixed" width="60" :resizable="false">
                  <template slot-scope="scope">
                    <span>{{(pageNum - 1) *pageSize + scope.$index + 1}}</span>
                  </template>
                </el-table-column>
                <el-table-column label="工程名称" width="300" :fixed="tableColumnFixed" prop="name1" :resizable="false">
                </el-table-column>

                <el-table-column label="施工承包范围" :resizable="false" width="120">
                  <template slot-scope="scope">
                    {{scope.row.name2||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="建筑平面（㎡）" :resizable="false" width="120">
                  <template slot-scope="scope">
                    {{scope.row.name3||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="队长名称"  :resizable="false" width="100">
                  <template slot-scope="scope">
                    {{scope.row.name4||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="管理人员数量（人）" :resizable="false" width="150">
                  <template slot-scope="scope">
                    {{scope.row.name5||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="施工人员数量（人）" :resizable="false" width="150">
                  <template slot-scope="scope">
                    {{scope.row.name6||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="质量目标" :resizable="false" width="100">
                  <template slot-scope="scope">
                    {{scope.row.name7||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="备注说明" :resizable="false" width="150">
                  <template slot-scope="scope">
                    {{scope.row.name8||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="考察项目" :resizable="false" width="300">
                  <template slot-scope="scope">
                    {{scope.row.name9||"--"}}
                  </template>
                </el-table-column>
                <el-table-column label="考察公司" :resizable="false" width="260">
                  <template slot-scope="scope">
                    {{scope.row.name10||"--"}}
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="pagination clearfix" v-show="total>pageSize">
              <el-pagination background :page-size="pageSize" :current-page.sync="pageNum" @current-change="handleCurrentChange" layout="prev, pager, next"
                             :total="total">
              </el-pagination>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </div>

</template>

<script>
  import { encodeStr } from '@/assets/js/common.js'
  import '@/assets/styles/public.scss'
  import '@/assets/styles/supplierlist.scss'
  import skeleton from '@/views/project/projectList/component/skeleton'
  import { custmerInfo } from '@/api/supplier/supplier'

  export default {
    name: 'access',
    components:{skeleton},
    data(){
      return {
        encodeStr,
        activeName:'first',
        isSkeleton:false,
        fbsisSkeleton:false,
        total:2,
        tableData:[
          {name1:'黄阁水厂二期扩建工程设计咨询服务项目',name2:'2023年',name3:'华北地区',name4:'河北省',name5:'223.23',name6:'21233',name7:'优质工程',name8:'-',name9:'黄阁水厂二期扩建工程设计咨询服务项目',name10:'中国建筑一局第二建筑有限公司'},
          {name1:'黄阁水厂二期扩建工程设计咨询服务项目',name2:'2023年',name3:'华北地区',name4:'河北省',name5:'223.23',name6:'21233',name7:'优质工程',name8:'-',name9:'黄阁水厂二期扩建工程设计咨询服务项目',name10:'中国建筑一局第二建筑有限公司'},
        ],
        tableData1:[
          {name1:'黄阁水厂二期扩建工程设计咨询服务项目',name2:'2023年',name3:'233.33',name4:'张林',name5:'32',name6:'21233',name7:'优质工程',name8:'-',name9:'黄阁水厂二期扩建工程设计咨询服务项目',name10:'中国建筑一局第二建筑有限公司'},
          {name1:'黄阁水厂二期扩建工程设计咨询服务项目',name2:'2023年',name3:'233.33',name4:'张林',name5:'32',name6:'21233',name7:'优质工程',name8:'-',name9:'黄阁水厂二期扩建工程设计咨询服务项目',name10:'中国建筑一局第二建筑有限公司'},
        ],
        pageSize:20,
        pageNum:1,
        // table列是否悬浮
        tableColumnFixed: true,
        custmerInfo:{},

      }
    },
    created() {
      custmerInfo(this.$route.query.customerKey).then(res=>{
        console.log(res)
        this.custmerInfo = res.data
        let date = new Date().getTime()
        let d1 =  new Date(this.custmerInfo.expireDate1).getTime()
        let d2 =  new Date(this.custmerInfo.expireDate2).getTime()
        let d3 =  new Date(this.custmerInfo.expireDate3).getTime()
        let d4 =  new Date(this.custmerInfo.expireDate4).getTime()
        let d5 =  new Date(this.custmerInfo.expireDate5).getTime()
        this.custmerInfo.status1 = '--'
        this.custmerInfo.status2 = '--'
        this.custmerInfo.status3 = '--'
        this.custmerInfo.status4 = '--'
        this.custmerInfo.status5 = '--'
        if (d1) this.custmerInfo.status1 = d1 > date ? '有效' : '过期'
        if (d2) this.custmerInfo.status2 = d2 > date ? '有效' : '过期'
        if (d3) this.custmerInfo.status3 = d3 > date ? '有效' : '过期'
        if (d4) this.custmerInfo.status4 = d4 > date ? '有效' : '过期'
        if (d5) this.custmerInfo.status5 = d5>date?'有效':'过期'
      })
    },
    methods:{
      handleClick(){},
      handleCurrentChange(){},
      setHeaderRow() {
        return "owner-table-list-header";
      },
      setCellClass({ row, column, rowIndex, columnIndex }) {
        if (columnIndex == 1) {
          return "enterprise-name-column";
        }
      },
      setRowClass({ row, rowIndex }) {
        return "enterprise-name-row";
      },
    }
  }
</script>

<style scoped lang="scss">
.pagination{
  margin-top: 16px;
  text-align: right;
  margin-right: -10px;
}
</style>
