<template>
    <div>
      <BaseDialog
        width="770px"
        :isShow.sync="isCertDetailDialog"
        title="详情"
        @close="close"
        :appendToBody="true"
        :confirmStatus="false"
        :isShowFooter="false"
      >
        <div class="content">
          <detailList :column="2" :border="true" :listLabel="listLabel" :listData="listData"></detailList>
        </div>
        <div style="height: 1px; width: 100%; background: #DDDDDD; margin: 30px 0;"></div>
        <div>
          <el-table
            :data="tableData"
            style="width: 100%; text-align: center;"
            :border="true"
            fit
            :header-cell-style="{
              color: '#333',
              fontSize: '14px',
              'text-align': 'center'
            }"
            :cell-style="{
              'text-align': 'center'
            }"
          >
            <el-table-column prop="itemClass" label="主项/增项">
              <template slot-scope="scope">
                {{ scope.row.itemClass === 1 ? '主项' : '增项' }}
              </template>
            </el-table-column>
            <el-table-column prop="qualificationCategory" label="资质类别/等级">
            </el-table-column>
            <el-table-column prop="applicationDate" label="申请日期">
              <template slot-scope="scope">
                {{  $methodsTools.timestampFormat(scope.row.applicationDate) }}
              </template>
            </el-table-column>
          </el-table>
        </div>
      </BaseDialog>
    </div>
  </template>
  
  <script>
   import detailList from '@/views/companyManagement/component/detailList'
  export default {
    components: { detailList },
    data() {
      return {
        listData: {},
        listLabel: [
            { label: '企业名称', value: 'companyName'  },
            { label: '证书名称', value: 'certificateName'  },
            { label: '证书编号', value: 'certificateNumber'  },
            { label: '发证日期', value: 'issuanceDate', type: 'time'  },
            { label: '有效日期', value: 'effectiveDate', long: 'effectiveFlag',type: 'time'  },
            { label: '发证机关', value: 'issuingAuthority'  },
            { label: '注册资本', value: 'registeredCapital'  },
            { label: '联系电话', value: 'contactPhone'  },
            { label: '预览', value: 'previewImg', type: 'img'},
            { label: '备注', value: 'companyCertificateRemarks'  },
          ],
        ruleForm: {},
        isCertDetailDialog: false,
        tableData: []
      };
    },
  
    mounted() {},
  
    methods: {
        openBoxs(row) {
          console.log(row, 'row')
          this.isCertDetailDialog = true
          this.listData = row
          this.tableData = JSON.parse(row.text) || []
        },
        close() {},
    },
  };
</script>
  
<style lang="scss" scoped>
.content {

/deep/ .el-descriptions-item__label.is-bordered-label {
  color: #333;
  font-weight: bold;
  width: 110px;
}
/deep/ .el-descriptions--medium.is-bordered .el-descriptions-item__cell {
    width: 255px;
}
}
</style>
  