<!--
  @description: 报表统计-供应商统计
  @Modifier：肖文龙
  @routerPath:
  @date：  2021/01/27
-->

<template>
  <div>
    <div class="reportChart-content">
      <!-- 统计分析-供应商统计-搜索条件 -->
      <supplierStatisticsSearch />
      <!-- 统计分析-总汇组件 -->
      <statisticsCrud :list="crudList" />
      <el-row :gutter="crudObj.gutter" class="el-row-x-1">
        <!-- 供应商地区分布地图 -->
        <el-col :span="14">
          <supplierAreaMapCard reportchart="reportChart" :height="heightData.supplierAreaMapCard_h" />
        </el-col>
        <el-col :span="10">
          <el-row class="el-row-y-2">
            <!-- 中标供应商占比 -->
            <el-col>
              <winBidSupplierRateCurd reportchart="reportChart" :height="heightData.winBidSupplierRateCurd_h" />
            </el-col>
            <el-col>
              <!-- 供应商级别 -->
              <!-- <el-col>
                <supplierLevelChart reportchart="reportChart" :height="heightData.supplierLevelChart_h" />
              </el-col> -->
              <!-- 供应商类别 -->
              <el-col>
                <supplierCategoryChart reportchart="reportChart" :height="heightData.supplierCategoryChart_h" />
              </el-col>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
      <!-- 弃标次数TOP -->
      <!-- <el-col :span="12">
          <supplierUnBIdNumberTOP :height="heightData.supplierUnBIdNumberTOP_h" />
        </el-col> -->
      <el-row :gutter="crudObj.gutter" class="el-row-x-1">
        <!-- 供应商供货范围TOP -->
        <el-col :span="12">
          <supplierSupplyScopeTOP reportchart="reportChart" :height="heightData.supplierSupplyScopeTOP_h" />
        </el-col>
        <!-- 中标次数TOP -->
        <el-col :span="12">
          <supplierWinBIdNumberTOP reportchart="reportChart" :height="heightData.supplierWinBIdNumberTOP_h" />
        </el-col>
      </el-row>
      <el-row :gutter="crudObj.gutter" class="el-row-x-1">
        <!-- 中标金额 -->
        <el-col :span="12">
          <supplierWinBIdMoneyTOP reportchart="reportChart" :height="heightData.supplierWinBIdMoneyTOP_h" />
        </el-col>
        <!-- 投标次数TOP -->
        <el-col :span="12">
          <supplierTenderBIdNumberTOP reportchart="reportChart" :height="heightData.supplierTenderBIdNumberTOP_h" />
        </el-col>
      </el-row>
      <el-row :gutter="crudObj.gutter" class="el-row-x-1">
        <!-- 供应商活跃度 -->
        <el-col :span="24">
          <!-- <supplierRegionTOP reportchart="reportChart" :height="heightData.supplierRegionTOP_h" /> -->
          <supplierActivity reportchart="reportChart" :height="heightData.supplierActivity_h" />
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
/* api */
import { getSupplierStatisticInfoNumber } from '@api/statisticalAnalysis/reportChart.js'
/* 公共方法*/
import { addChineseUnit } from '@/assets/js/utils' // 为数字加上单位：万或亿
/* 组件 */
import supplierStatisticsSearch from './supplierStatisticsSearch.vue' // 统计分析-供应商统计-搜索条件
import statisticsCrud from './../../components/statisticsCrud.vue' // 统计分析-总汇组件图
import winBidSupplierRateCurd from './../winBidSupplierRate/winBidSupplierRateCurd.vue' // 中标供应商占比
import supplierWinBIdMoneyTOP from './../supplierWinBIdMoney/supplierWinBIdMoneyTOP.vue' // 中标金额TOP
import supplierWinBIdNumberTOP from './../supplierWinBIdNumber/supplierWinBIdNumberTOP.vue' // 中标次数TOP
import supplierTenderBIdNumberTOP from './../supplierTenderBIdNumber/supplierTenderBIdNumberTOP.vue' // 投标次数TOP
import supplierUnBIdNumberTOP from './../supplierUnBIdNumber/supplierUnBIdNumberTOP.vue' // 弃标次数TOP
import supplierActivity from './../supplierActivity/supplierActivity.vue' // 供应商活跃度
import supplierSupplyScopeTOP from './../supplierSupplyScope/supplierSupplyScopeTOP.vue' // 供应商供货范围TOP

import supplierAreaMapCard from './../supplierAreaMap/supplierAreaMapCard.vue' // 供应商地区分布地图
// import supplierLevelChart from './../supplierLevel/supplierLevelChart.vue' // 供应商级别
import supplierCategoryChart from './../supplierCategory/supplierCategoryChart.vue' // 供应商类别

export default {
  name: 'SupplierStatisticsChart',
  inject: ['crudObj'],
  components: {
    supplierStatisticsSearch, // 供应商统计-搜索条件
    statisticsCrud, // 统计分析-总汇组件
    winBidSupplierRateCurd, // 中标供应商占比
    supplierWinBIdMoneyTOP, // 中标金额TOP
    supplierWinBIdNumberTOP, // 中标次数TOP
    supplierTenderBIdNumberTOP, // 投标次数TOP
    supplierUnBIdNumberTOP, // 弃标次数TOP
    supplierActivity, // 供应商活跃度
    supplierSupplyScopeTOP, // 供应商供货范围TOP
    supplierAreaMapCard, // 供应商地区分布地图
    // supplierLevelChart, // 供应商级别
    supplierCategoryChart // 供应商类别
  },
  data() {
    return {
      // echarts 高度换算
      heightData: {
        search_h: '2.6875rem', // 搜索条件的高度
        statisticsCrud_h: '4.75rem', // 总汇组件高度
        h_p: '1.875rem', // 间距
        supplierAreaMapCard_h: '', // 供应商地区分布地图
        winBidSupplierRateCurd_h: '', // 中标供应商占比
        // supplierLevelChart_h: '', // 供应商级别
        supplierWinBIdMoneyTOP_h: '', // 中标金额TOP
        supplierWinBIdNumberTOP_h: '', // 中标次数TOP
        supplierTenderBIdNumberTOP_h: '', // 投标次数TOP
        supplierUnBIdNumberTOP_h: '', // 弃标次数TOP
        supplierActivity_h: '', // 供应商活跃度
        supplierSupplyScopeTOP_h: '', // 供应商供货范围TOP
        supplierCategoryChart_h: '' // 供应商类别
      },
      // 统计汇总
      crudList: []
    }
  },
  created() {
    this.initHeightData()// 高度计算
  },
  methods: {
    // 高度计算
    initHeightData() {
      // 供应商地区分布地图高度
      if (this.crudObj.height_default) {
        this.heightData.supplierAreaMapCard_h = this.crudObj.height_default
      } else {
        this.heightData.supplierAreaMapCard_h = 'calc( ' +
        this.crudObj.height + ' - ' +
        this.crudObj.header_H + ' - ' +
        this.heightData.search_h + ' - ' +
        this.heightData.h_p + ' - ' +
        this.heightData.statisticsCrud_h + ')'
      }
      // 中标次数TOP
      this.heightData.supplierWinBIdNumberTOP_h = `calc((${this.heightData.supplierAreaMapCard_h} - .625rem) / 2)`
      // 中标供应商占比
      this.heightData.winBidSupplierRateCurd_h = this.heightData.supplierWinBIdNumberTOP_h
      // 供应商级别
      // this.heightData.supplierLevelChart_h = this.heightData.supplierWinBIdNumberTOP_h
      // 中标次数TOP
      this.heightData.supplierWinBIdMoneyTOP_h = this.heightData.supplierWinBIdNumberTOP_h
      // // 投标次数TOP
      this.heightData.supplierTenderBIdNumberTOP_h = this.heightData.supplierWinBIdNumberTOP_h
      // // 弃标次数TOP
      // this.heightData.supplierUnBIdNumberTOP_h = this.heightData.supplierWinBIdNumberTOP_h
      // // 供应商活跃度
      this.heightData.supplierActivity_h = this.heightData.supplierWinBIdNumberTOP_h
      // // 供应商供货范围TOP
      this.heightData.supplierSupplyScopeTOP_h = this.heightData.supplierWinBIdNumberTOP_h
      // 供应商类别
      this.heightData.supplierCategoryChart_h = this.heightData.supplierWinBIdNumberTOP_h
    },
    /**
     * 获取平台运营情况信息数据
     *  @param {searchData} Object 查询条件
    */
    initChart(searchData) {
      const data = {
        ...searchData
      }
      getSupplierStatisticInfoNumber(data).then(res => {
        this.crudData(res.data)// 统计汇总
      })
    },
    // 统计汇总
    crudData(data) {
      this.crudList = [
        {
          name: '注册供应商',
          value: addChineseUnit(data.registeredSupplierNumber),
          suffix: '个',
          width: '12%',
          code: '00'
        },
        {
          name: '初审供应商',
          value: addChineseUnit(data.supplierTotalNumber),
          suffix: '个',
          width: '12%',
          code: '00'
        },
        {
          name: '合格供应商',
          value: addChineseUnit(data.qualifiedSupplierNumber),
          suffix: '个',
          width: '15%',
          code: '00'
        },
        {
          name: '中标供应商',
          value: addChineseUnit(data.winningSupplierNumber),
          suffix: '个',
          width: '12%',
          code: '00'
        },
        {
          name: '黑名单',
          value: addChineseUnit(data.noQualifiedSupplierNumber),
          suffix: '个',
          width: '12%',
          code: '00'
        },
        {
          name: '合格率',
          value: data.qualifiedSupplierRate,
          suffix: '%',
          width: '12%',
          code: '00'
        }, {
          name: '境内初审供应商',
          value: addChineseUnit(data.territoryNumber),
          suffix: '个',
          width: '12%',
          code: '00'
        }, {
          name: '境外初审供应商',
          value: addChineseUnit(data.abroadNumber),
          suffix: '个',
          width: '12%',
          code: '00'
        }
        // {
        //   name: '供应商初审',
        //   value: addChineseUnit(data.auditNumber),
        //   suffix: '个',
        //   width: '11%',
        //   code: '00'
        // }
      ]
    }
  }
}
</script>
<style lang="less" scoped>
</style>
