<!--
  @description: 报表统计-采购单位统计
  @Modifier：肖文龙
  @routerPath:
  @date：  2021/01/29
-->

<template>
  <div>
    <div class="reportChart-content">
      <!-- 统计分析-采购单位统计-搜索条件 -->
      <buyerStatisticsSearch />
      <div v-show="roleFlag()">
        <el-row :gutter="crudObj.gutter" class="el-row-x-1">
          <!-- 采购单位地区分布TOP -->
          <!-- <el-col :span="12">
          <buyerRegionTOP :height="heightData.buyerRegionTOP_h" />
        </el-col> -->
          <!-- 采购单位准入供应商 -->
          <el-col :span="12">
            <buyerAndAdmitSupplier reportchart="reportChart" :height="heightData.buyerAndAdmitSupplier_h" />
          </el-col>
          <!-- 采购单位合格供应商分布 -->
          <el-col :span="12">
            <buyerAndQualifiedSupplier reportchart="reportChart" :height="heightData.buyerAndQualifiedSupplier_h" />
          </el-col>
        </el-row>
        <el-row :gutter="crudObj.gutter" class="el-row-x-1">
          <!-- 采购单位计划完成率TOP -->
          <el-col :span="12">
            <buyerAndPlanCompletionRateTOP reportchart="reportChart" :height="heightData.buyerAndPlanCompletionRateTOP_h" />
          </el-col>
          <!-- 不同采购方式发布的项目数量及完成情况 -->
          <el-col :span="12">
            <bidProjectCompletionRate reportchart="reportChart" :height="heightData.bidProjectCompletionRate_h" />
          </el-col>
        </el-row>
      </div>
      <div v-show="!roleFlag()">
        <el-row :gutter="crudObj.gutter" class="el-row-x-1">
          <!-- 采购单位准入供应商 -->
          <el-col :span="12">
            <buyerAndAdmitSupplier reportchart="reportChart" :height="heightData.buyerAndAdmitSupplier_h" />
          </el-col>
          <!-- 不同采购方式发布的项目数量及完成情况 -->
          <el-col :span="12">
            <bidProjectCompletionRate reportchart="reportChart" :height="heightData.bidProjectCompletionRate_h" />
          </el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>
<script>
/* api */
import { getRolesOfCheckBuyers } from '@api/statisticalAnalysis/reportChart.js'
/* 公共方法*/
import { addChineseUnit } from '@/assets/js/utils' // 为数字加上单位：万或亿
/* 组件 */
import buyerStatisticsSearch from './buyerStatisticsSearch.vue' // 统计分析-采购单位统计-搜索条件
// import buyerRegionTOP from './../buyerRegion/buyerRegionTOP.vue' // 采购单位地区分布TOP
import buyerAndAdmitSupplier from '../buyerAndAdmitSupplier/buyerAndAdmitSupplier.vue' // 统计分析-采购单位统计-采购单位准入供应商
import buyerAndQualifiedSupplier from './../buyerAndQualifiedSupplier/buyerAndQualifiedSupplierChart.vue' // 采购单位合格供应商分布
import buyerAndPlanCompletionRateTOP from './../buyerAndPlanCompletionRate/buyerAndPlanCompletionRateTOP.vue' // 采购单位计划完成率TOP
import bidProjectCompletionRate from './../bidProjectCompletionRate/bidProjectCompletionRate.vue' // 不同采购方式发布的项目数量及完成情况

export default {
  inject: ['crudObj'],
  components: {
    buyerStatisticsSearch, // 采购单位统计-搜索条件
    // buyerRegionTOP, // 采购单位地区分布TOP
    buyerAndAdmitSupplier, // 统计分析-采购单位统计-采购单位准入供应商
    buyerAndQualifiedSupplier, // 采购单位合格供应商分布
    buyerAndPlanCompletionRateTOP, // 采购单位计划完成率TOP
    bidProjectCompletionRate // 不同采购方式发布的项目数量及完成情况
  },
  data() {
    return {
      // echarts 高度换算
      heightData: {
        search_h: '2.6875rem', // 搜索条件的高度
        h_p: '1.875rem', // 间距
        buyerAndAdmitSupplier_h: '', // 采购单位地区分布TOP
        buyerAndQualifiedSupplier_h: '', // 采购单位合格供应商分布
        buyerAndPlanCompletionRateTOP_h: '', // 采购单位计划完成率TOP
        bidProjectCompletionRate_h: '' // 不同采购方式发布的项目数量及完成情况
      },
      roleCode: '', // 角色code
      // 统计汇总
      crudList: [],
      // 获取有权限的角色
      roleOfData: []
    }
  },
  created() {
    this.initHeightData()// 高度计算
    this.crudData()// 统计汇总
    this.initRole() // 获取有权限的角色接口
  },
  methods: {
    initRole() {
      // 获取有权限的角色接口
      getRolesOfCheckBuyers().then(res => {
        this.roleOfData = res.data.split(',')
      })
    },
    // 高度计算
    initHeightData() {
      // 计算content一减去头部的高度
      let bidAndProcMapCharts_h = ''
      if (this.crudObj.height_default) {
        bidAndProcMapCharts_h = this.crudObj.height_default
      } else {
        bidAndProcMapCharts_h = 'calc( ' +
        this.crudObj.height + ' - ' +
        this.crudObj.header_H + ' - ' +
        this.heightData.search_h + ' - ' +
        ')'
      }

      // 采购单位地区分布TOP
      // 保留六行 对齐 多减5rem
      this.heightData.buyerAndAdmitSupplier_h = `calc(((${bidAndProcMapCharts_h} - 5.625rem ) / 2))`
      // 采购单位合格供应商分布
      this.heightData.buyerAndQualifiedSupplier_h = this.heightData.buyerAndAdmitSupplier_h
      // 采购单位计划完成率TOP
      this.heightData.buyerAndPlanCompletionRateTOP_h = this.heightData.buyerAndAdmitSupplier_h
      // 不同采购方式发布的项目数量及完成情况
      this.heightData.bidProjectCompletionRate_h = this.heightData.buyerAndAdmitSupplier_h
    },
    roleFlag() {
      /*
        项目经理 11
        采购人 10
        工业区领导：buyerleader
        审计监督：sjjd
        平台运营: operation
        股份领导:gufenleader
      */
      this.roleCode = this.$store.getters.info.currentRol.roleCode // 角色code
      // 是否包含当前角色 若是不展示此模块 否 展示此模块
      if (this.roleOfData.includes(this.roleCode)) {
        return false
      } else {
        return true
      }
    },
    // 统计汇总
    crudData() {
      this.crudList = [
        {
          name: '在库供应商数量',
          value: addChineseUnit(23340.00),
          suffix: '个',
          width: '25%',
          code: '00'
        },
        {
          name: '合格供应商数量',
          value: addChineseUnit(2330.00),
          suffix: '个',
          width: '25%',
          code: '00'
        },
        {
          name: '不合格供应商数量',
          value: 20.00,
          suffix: '个',
          width: '25%',
          code: '00'
        },
        {
          name: '合格率',
          value: 33.03,
          suffix: '%',
          width: '25%',
          code: '00'
        }
      ]
    }
  }
}
</script>
<style lang="less" scoped>
</style>
