<!--
  @description: 报表统计-专家等级占比
  @Modifier：肖文龙
  @routerPath:
  @date：  2021/02/26
-->
<template>
  <dl
    class="reportChart_crud"
    :style="{'height':height}"
  >
    <dt>
      专家等级占比
      <p class="right">
        <span>
          <i class="iconfont icon-xiazai1" @click="dowloadClick" />
        </span>
      </p>
    </dt>
    <dd>
      <pieChart
        ref="pieChart"
      />
    </dd>
  </dl>
</template>

<script>
/* api */
import { getExpertGradeInfo, exportExpertGradeInfo } from '@api/statisticalAnalysis/reportChart.js'
/* 公用方法*/
import { filterDictText, download } from '@/assets/js/utils'// 常用方法
/* 混入 */
import { expertGroupMixin } from './../../mixins/reportChartGroup.js'
/* 組件 */
import pieChart from './../../components/pieChart.vue'// 饼图-图表
export default {
  name: 'ExpertClassChart',
  components: {
    pieChart// 饼图-图表
  },
  inject: ['chartData'],
  props: {
    height: {
      type: String,
      default: '100%'
    }
  },
  data() {
    return {
      /* 字典信息-start */
      ...expertGroupMixin,
      /* 字典信息-end */
      // 查询条件
      searchData: {}
    }
  },
  methods: {
    // 下载
    dowloadClick() {
      const data = this.searchData
      exportExpertGradeInfo(data).then(res => {
        download(res, '专家等级占比信息表.xls')
      })
    },
    /**
     * 获取数据
     *  @param {searchData} Object 查询条件
    */
    initChart(searchData) {
      this.searchData = searchData
      const data = {
        ...searchData
      }
      getExpertGradeInfo(data).then(res => {
      // 图表数据
        const option = {
          unit: '个', // 计量单位
          title: {
            text: '专家\n单位'
          },
          series: {
            data: res.data.records.map(item => {
              return {
                value: item.expertNumber, // 专家数量
                name: filterDictText(this.expertClassList, item.expertGrade)// 专家等级占比
              }
            })
          }
        }
        this.$refs.pieChart.init(option)
      })
    }
  }
}
</script>
<style lang="less" scoped>
</style>
