
<!--
  @description: 桌面-采购单组件
  @Modifier：wxy
  @routerPath:/procurement/procurementDesktop
  @date： 2020-09-01 11:42:39
-->
<template>
  <div class="contentFram clearfix">
    <div class="item">
      <p class="title p0-16">
        <i class="iconfonts iconfont icon-xunjia" />询价
      </p>
      <div class="p16 itemList">
        <ul v-if="tableData[0]!=null &&tableData[0].length!=0">
          <li>维护采购单 （<span :class="tableData[0].galleryPurchaseOrderNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryPurchaseOrderNum }}</span>）</li>
          <li>公告发布 （<span :class="tableData[0].galleryRelBulletinNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryRelBulletinNum }}</span>）</li>
          <li>评审中 （<span :class="tableData[0].galleryUnderReviewNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryUnderReviewNum }}</span>）</li>
          <li>中选审批 （<span :class="tableData[0].galleryApprovalNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryApprovalNum }}</span>）</li>
          <li>中选审批驳回 （<span :class="tableData[0].galleryApprovalBackNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryApprovalBackNum }}</span>）</li>
          <li>结果公告发布 （<span :class="tableData[0].galleryResultBulletinNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryResultBulletinNum }}</span>）</li>
          <li>采购终止 （<span :class="tableData[0].galleryPurchaseStopNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryPurchaseStopNum }}</span>）</li>
          <li>流标 （<span :class="tableData[0].galleryFailBulletinNum !== '0' ? 'cols' : ''">{{ tableData[0].galleryFailBulletinNum }}</span>）</li>
        </ul>
      </div>
    </div>
    <div class="item">
      <p class="title p0-16">
        <i class="iconfonts iconfont icon-danyilaiyuan" />单一来源
      </p>
      <div class="p16 itemList">
        <ul v-if="tableData[1]!=null &&tableData[1].length!=0">
          <li>维护采购单 （<span :class="tableData[1].galleryPurchaseOrderNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryPurchaseOrderNum }}</span>）</li>
          <li>公告发布 （<span :class="tableData[1].galleryRelBulletinNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryRelBulletinNum }}</span>）</li>
          <li>评审中 （<span :class="tableData[1].galleryUnderReviewNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryUnderReviewNum }}</span>）</li>
          <li>中选审批 （<span :class="tableData[1].galleryApprovalNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryApprovalNum }}</span>）</li>
          <li>中选审批驳回 （<span :class="tableData[1].galleryApprovalBackNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryApprovalBackNum }}</span>）</li>
          <li>结果公告发布 （<span :class="tableData[1].galleryResultBulletinNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryResultBulletinNum }}</span>）</li>
          <li>采购终止 （<span :class="tableData[1].galleryPurchaseStopNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryPurchaseStopNum }}</span>）</li>
          <li>流标 （<span :class="tableData[1].galleryFailBulletinNum !== '0' ? 'cols' : ''">{{ tableData[1].galleryFailBulletinNum }}</span>）</li>
        </ul>
      </div>
    </div>
    <div class="item">
      <p class="title p0-16">
        <i class="iconfonts iconfont icon-jingzhengxingtanpan" />竞争性谈判
      </p>
      <div class="p16 itemList">
        <ul v-if="tableData[2]!=null &&tableData[2].length!=0">
          <li>维护采购单 （<span :class="tableData[2].galleryPurchaseOrderNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryPurchaseOrderNum }}</span>）</li>
          <li>公告发布 （<span :class="tableData[2].galleryRelBulletinNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryRelBulletinNum }}</span>）</li>
          <li>评审中 （<span :class="tableData[2].galleryUnderReviewNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryUnderReviewNum }}</span>）</li>
          <li>中选审批 （<span :class="tableData[2].galleryApprovalNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryApprovalNum }}</span>）</li>
          <li>中选审批驳回 （<span :class="tableData[2].galleryApprovalBackNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryApprovalBackNum }}</span>）</li>
          <li>结果公告发布 （<span :class="tableData[2].galleryResultBulletinNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryResultBulletinNum }}</span>）</li>
          <li>采购终止 （<span :class="tableData[2].galleryPurchaseStopNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryPurchaseStopNum }}</span>）</li>
          <li>流标 （<span :class="tableData[2].galleryFailBulletinNum !== '0' ? 'cols' : ''">{{ tableData[2].galleryFailBulletinNum }}</span>）</li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    // 采购单数据
    tableData: {
      type: Array,
      default: function() {
        return []
      }
    }
  }
}
</script>

<style lang='less' scoped>
  @import '~@assets/style/common/public.less';
  .item{
    width: 32.3%;
    float: left;
    background: #fff;
    border-left: 1px solid @cut-off;
    border-right: 1px solid @cut-off;
    border-bottom:1px solid @cut-off ;
    &:nth-child(1){
      border-top: 1px solid #F3893D;
    }
    &:nth-child(2){
      margin: 0 1.5%;
      border-top: 1px solid @hyacinthine;
    }
    &:nth-child(3){
      border-top: 1px solid @green;
    }
    .itemList{
      min-height: 201px;
    }
    p{
      border-bottom: 1px solid @cut-off;
      .iconfonts{
        color:@hyacinthine;
        margin-right:8px;
      }
    }
    ul{
      li{
        padding: 0 10px;
        // list-style: disc;
        line-height: 40px;
        .cols{
          color: red;
        }
        span{
          color: #b4b3b3;
        }
      }

    }
  }
</style>
