<template>
    <div class="credit-container">
      <div class="title_wrap">
        <div class="enterprise_title">
          信用中国
        </div>
      </div>
      <div class="label-item">
        <span @click="item.number ? labelClick(item.name) : ''" :class="{'color' : nameColor == item.name,'disabled': !item.number}" v-for="item in labelList">{{item.name}} {{item.number}}</span>
      </div>
      <div class="detail-cont">
        <template v-for="item in xzxkList">
          <info-table class="info-tab" v-if="nameColor === '行政许可'" :list="defaultList" :obj="item" :labelWidth="labelWidth"></info-table>
        </template>
        <template v-for="item in xzcfList">
          <info-table class="info-tab" v-if="nameColor === '行政处罚'" :list="defaultList1" :obj="item" :labelWidth="labelWidth"></info-table>
        </template>
        <template v-for="item in cssxList">
          <info-table class="info-tab" v-if="nameColor === '诚实守信'" :list="defaultList2" :obj="item" :labelWidth="labelWidth"></info-table>
        </template>
        <template v-for="item in yzsxList">
          <info-table class="info-tab" v-if="nameColor === '严重失信主体名单'" :list="defaultList3" :obj="item" :labelWidth="labelWidth"></info-table>
        </template>
        <template v-for="item in jyycList">
          <info-table class="info-tab" v-if="nameColor === '经营异常'" :list="defaultList4" :obj="item" :labelWidth="labelWidth"></info-table>
        </template>
      </div>
    </div>
</template>

<script>
  import skeleton from '../component/skeleton';
  import InfoTable from '../component/infoTable1';
  import { selectChinaXzxkPage,selectChinaXzcfPage,selectChinaNsxydjPage,selectChinaYzsxztmdPage,selectChinaJyycPage } from '@/api/detail/party-a/credit';
  export default {
    name: "credit",
    components: {
      skeleton,InfoTable
    },
    props: ['companyId'],
    data() {
      return {
        isSkeleton:false,
        nameColor:'行政许可',
        labelList:[
          {
            number:0,
            name:'行政许可',
          },
          {
            number:0,
            name:'行政处罚',
          },
          {
            number:0,
            name:'诚实守信',
          },
          {
            number:0,
            name:'严重失信主体名单',
          },
          {
            number:0,
            name:'经营异常',
          },
        ],
        labelWidth: 250,
        xzxkList:[],
        xzcfList:[],
        cssxList:[],
        yzsxList:[],
        jyycList:[],
        defaultList: [
          // { name: '工程名称', prop: 'name', slot: true  },
          { name: '行政许可决定文书号', prop: 'deciWritNo'},
          { name: '行政许可决定文书名称', prop: 'deciWritName' },
          { name: '许可类别', prop: 'permitType' },
          { name: '许可编号', prop: 'permitNo' },
          { name: '许可决定日期', prop: 'deciTime' },
          { name: '有效期自', prop: 'valiEnd'},
          { name: '有效期至', prop: 'valiBegin' },
          { name: '许可内容', prop: 'content' },
          { name: '许可机关', prop: 'office' },
          { name: '许可机关统一社会信用代码', prop: 'officeCreditCode' },
          { name: '数据来源单位', prop: 'dataSourceOffice' },
          { name: '数据来源单位统一社会信用代码', prop: 'dataSourceOfficeCreditCode'},
        ],
        defaultList1: [
          // { name: '工程名称', prop: 'name', slot: true  },
          { name: '行政处罚决定书文号', prop: 'punishDeciNo'},
          { name: '处罚类别', prop: 'punishCate' },
          { name: '处罚决定日期', prop: 'punishTime' },
          { name: '处罚内容', prop: 'punishResult' },
          { name: '罚款金额（万元）', prop: 'punishAmount' },
          { name: '没收违法所得、没收非法财物的金额（万元）', prop: 'confiscateAmount' },
          { name: '暂扣或吊销证照名称及编号', prop: 'detainNameNo'},
          { name: '违法行为类型', prop: 'illegalType' },
          { name: '违法事实', prop: 'illegalFact' },
          { name: '处罚依据', prop: 'punishAccord' },
          { name: '处罚机关', prop: 'punishOffice' },
          { name: '处罚机关统一社会信用代码', prop: 'punishOfficeCreditCode' },
          { name: '数据来源单位', prop: 'dataSource' },
          { name: '数据来源统一社会信用代码', prop: 'dataSourceCreditCode' },
        ],
        defaultList2: [
          { name: '纳税信用级别', prop: 'type'},
          { name: '评价来源', prop: 'dataSource' },
          { name: '评价年度', prop: 'apprYear', style: true},
        ],
        defaultList3: [
          { name: '失信被执行人姓名/名称', prop: 'iname'},
          { name: '身份证号码/组织机构代码', prop: 'cardnumber' },
          { name: '执行法院', prop: 'court_name' },
          { name: '立案时间', prop: 'reg_date' },
          { name: '案号', prop: 'case_code' },
          { name: '做出执行依据单位', prop: 'gist_unit' },
          { name: '生效法律文书确定的义务', prop: 'duty'},
          { name: '被执行人的履行情况', prop: 'performance' },
          { name: '失信被执行人行为具体情形', prop: 'disreput_type_name' },
          { name: '发布时间', prop: 'publish_date' },
          { name: '已履行部分', prop: 'performed_part' },
          { name: '未履行部分', prop: 'unperform_part' },
          { name: '数据来源', prop: 'dataSource', style: true},
        ],
        defaultList4: [
          { name: '案号', prop: 'caseNo'},
          { name: '经营异常类型', prop: 'type' },
          { name: '列入经营异常名录原因类型名称', prop: 'causeTypeName' },
          { name: '拖欠天数', prop: 'lateDays' },
          { name: '涉及金额（元）', prop: 'relateAmount' },
          { name: '列入日期', prop: 'foundTime' },
          { name: '列入机关', prop: 'officeName'},
          { name: '数据来源', prop: 'dataSource' },
        ],
      }
    },
    created() {
      this.getSelectChinaXzxkPage()
      this.getSelectChinaXzcfPage()
      this.getSelectChinaNsxydjPage()
      this.getSelectChinaYzsxztmdPage()
      this.getSelectChinaJyycPage()
    },
    //计算集
    computed: {

    },
    //方法集
    methods: {
      async getSelectChinaXzxkPage(){
        let params = {
          cid: this.companyId,
        };
        let res = await selectChinaXzxkPage(params);
        if (res.code == 200) {
          this.xzxkList=res.rows
          this.labelList[0].number=res.total
        }
      },
      async getSelectChinaXzcfPage(){
        let params = {
          cid: this.companyId,
          // cid: 3610,
        };
        let res = await selectChinaXzcfPage(params);
        if (res.code == 200) {
          this.xzcfList=res.rows
          this.labelList[1].number=res.total
        }
      },
      async getSelectChinaNsxydjPage(){
        let params = {
          cid: this.companyId,
          // cid: 104261407,
        };
        let res = await selectChinaNsxydjPage(params);
        if (res.code == 200) {
          this.cssxList=res.rows
          this.labelList[2].number=res.total
        }
      },
      async getSelectChinaYzsxztmdPage(){
        let params = {
          cid: this.companyId,
          // cid: 6109993,
        };
        let res = await selectChinaYzsxztmdPage(params);
        if (res.code == 200) {
          this.yzsxList=res.rows
          this.labelList[3].number=res.total
        }
      },
      async getSelectChinaJyycPage(){
        let params = {
          cid: this.companyId,
          // cid: 6109993,
        };
        let res = await selectChinaJyycPage(params);
        if (res.code == 200) {
          this.jyycList=res.rows
          this.labelList[4].number=res.total
        }
      },
      labelClick(value){
        this.nameColor=value
      },
    }
  }
</script>

<style lang="scss" scoped>
  .credit-container{
    .title_wrap{
      border-bottom: 0;
    }
    .label-item{
      padding: 0 16px;
      span{
        display: inline-block;
        height: 38px;
        border-radius: 4px;
        line-height: 38px;
        border: 1px solid #DCDFE6;
        color: #232323;
        font-size: 14px;
        margin-right: 8px;
        padding: 0 12px;
        cursor: pointer;
      }
      .color{
        background: rgba(0, 129, 255, 0.1);
        border: 1px solid rgba(0, 129, 255, 0.1);
        color: #0081FF;
      }
      .disabled{
        color: #bdbdbd;
        border: 1px solid #eaeaea;
        cursor: not-allowed;
      }
    }
    .info-tab{
      margin-bottom: 16px;
    }
    .detail-cont{
      padding: 16px;
    }
  }
</style>
