<!--
  @description: 统计报表-可视化图表模版
  @Modifier：肖文龙
  @routerPath:/reportChart
  @date：  2021/01/27
-->
<template>
  <div class="reportChart-main-review">
    <!-- 头部 -->
    <statisticsChartHeader :tabs="tabs" @tabChange="tabChange" />
    <!-- ------tabs------ -->
    <div>
      <!-- 平台运营情况 00 -->
      <runStatisticsChart v-if="tab.code==='00'" reportchart="reportChart" />
      <!-- 采购项目统计 01 -->
      <procStatisticsChart v-if="tab.code==='01'" reportchart="reportChart" />
      <!-- 采购计划统计 02 -->
      <planStatisticsChart v-if="tab.code==='02'" reportchart="reportChart" />
      <!-- 供应商统计 03 -->
      <supplierStatisticsChart v-if="tab.code==='03'" reportchart="reportChart" />
      <!-- 采购单位统计 04 -->
      <buyerStatisticsChart v-if="tab.code==='04'" reportchart="reportChart" />
      <!-- 价格统计 05 -->
      <priceStatisticsChart v-if="tab.code==='05'" reportchart="reportChart" />
      <!-- 专家统计 06 -->
      <expertStatisticsChart v-if="tab.code==='06'" reportchart="reportChart" />
      <!-- 异常统计 07 -->
      <abnormalStatistics v-if="tab.code==='07'" reportchart="reportChart" />
      <!-- 统计维度说明 08 -->
      <statisticsExplain v-if="tab.code==='08'" />
    </div>
    <!-- ------tabs------ -->
  </div>
</template>
<script>
/* 组件 */
import statisticsChartHeader from './components/statisticsChartHeader'// 头部
import runStatisticsChart from './runStatistics/runStatisticsChart/runStatisticsChart'// 平台运营情况
import procStatisticsChart from './procStatistics/procStatisticsChart/procStatisticsChart'// 采购项目统计
import planStatisticsChart from './planStatistics/planStatisticsChart/planStatisticsChart'// 采购计划统计
import supplierStatisticsChart from './supplierStatistics/supplierStatisticsChart/supplierStatisticsChart'// 供应商统计
import buyerStatisticsChart from './buyerStatistics/buyerStatisticsChart/buyerStatisticsChart'// 采购单位统计
import priceStatisticsChart from './priceStatistics/priceStatisticsChart/priceStatisticsChart'// 价格统计
import expertStatisticsChart from './expertStatistics/expertStatistics/expertStatisticsChart'// 专家统计
import abnormalStatistics from './abnormalStatistics/abnormalStatistics/abnormalStatisticsChart'// 异常统计
import statisticsExplain from './statisticsExplain/statisticsExplain'// 统计维度说明
export default {
  name: 'ReportChart',
  provide() {
    return {
      chartData: this.chartData, // E chart样式
      crudObj: this.crudData // 板块信息
    }
  },
  components: {
    statisticsChartHeader, // 头部
    runStatisticsChart, // 平台运营情况
    procStatisticsChart, // 采购项目统计
    planStatisticsChart, // 采购计划统计
    supplierStatisticsChart, // 供应商统计
    buyerStatisticsChart, // 采购单位统计
    priceStatisticsChart, // 价格统计
    expertStatisticsChart, // 专家统计
    abnormalStatistics, // 异常统计
    statisticsExplain// 统计维度说明
  },
  data() {
    return {
      // 板块信息
      crudData: {
        gutter: 10, // 栅格间隔
        height_default: '46.3125rem', // 默认内容高度
        height: '100vh', // 内容高度
        header_H: '7.875rem' // 头部的高度
      },
      // E chart样式 全局控制
      chartData: {
        mainBg: 'rgba(11, 21, 74, 1)', // 背景色
        highlightBg: 'rgba(15, 28, 93, 1)', // 背景色-高亮
        borderColor: 'rgba(255,255,255,0.15)', // 边框颜色
        textColor: '#fff' // 文本颜色
      },
      // tabs
      tabs: [
        {
          name: '平台运营情况', code: '00'
        },
        {
          name: '采购计划统计', code: '02'
        },
        {
          name: '采购项目统计', code: '01'
        },
        {
          name: '供应商统计', code: '03'
        },
        /*        {
          name: '采购单位统计', code: '04'
        },*/
        {
          name: '价格库统计', code: '05'
        },
        {
          name: '专家统计', code: '06'
        },
        {
          name: '异常统计', code: '07'
        },
        {
          name: '统计维度说明', code: '08'
        }
      ],
      tab: {}
    }
  },
  methods: {
    // tab页切换时
    tabChange(tab) {
      this.tab = tab
    }
  }
}
</script>
<style lang="less">
@import "./reportChart.less";

</style>
