<!--
  @description: 报表统计-采购系统完成项目及成交金额
  @Modifier：杨胜国
  @routerPath:
  @date：  2021/03/06
-->
<template>
  <dl
    class="reportChart_crud"
    :style="{'height':height}"
  >
    <dt>
      系统完成项目数量及成交金额
      <p class="right">
        <span>
          <i class="iconfont icon-xiazai1" @click="dowloadClick" />
        </span>
      </p>
    </dt>
    <dd>
      <tableChart
        class="echart-dom"
        :option="option"
      />
    </dd>
  </dl>
</template>

<script>
/* api */
import { listPurchaseCompletedInfo, exportPurchaseCompletedInfo } from '@api/statisticalAnalysis/reportChart.js'

/* 公用方法*/
import { filterDictText, download } from '@/assets/js/utils'
import { indexPurGroupMixin } from './../../mixins/reportChartGroup.js'

/* 組件 */
import tableChart from './../../components/tableChart'// table列表渲染组件
export default {
  name: 'ProcurementCompletionProject',
  components: {
    tableChart// table列表渲染组件
  },
  mixins: [],
  props: {
    height: {
      type: String,
      default: '100%'
    }
  },
  data() {
    return {
      // dd_height: 'calc(' + this.height + ' - 8.5rem)', // 内容的高度
      /* 字典信息-start */
      ...indexPurGroupMixin,
      /* 字典信息-end */
      option: {
        // 标题
        thead: [
          { lable: '指标', prop: 'tenderType', align: 'left' },
          { lable: '当月数量（个）', prop: 'monthNum', align: 'center' },
          { lable: '当月金额（万元）', prop: 'monthMoney', align: 'center' },
          { lable: '累计完成数量（个）', prop: 'totalNum', align: 'center' },
          { lable: '累计完成金额（万元）', prop: 'totalMoney', align: 'center' }
        ],
        // 渲染数据
        data: []
      },
      // 查询条件
      searchData: {}
    }
  },
  methods: {
    filterDictText,
    // 下载导出
    dowloadClick() {
      exportPurchaseCompletedInfo(this.searchData).then(res => {
        download(res, '采购系统完成项目及成交金额.xls')
      })
    },
    /**
     * 获取数据
     *  @param {searchData} Object 查询条件
    */
    initChart(searchData) {
      this.searchData = searchData
      this.option.data = []
      const data = {
        ...searchData
      }
      listPurchaseCompletedInfo(data).then(res => {
        // this.option.data.push(...res.data)
        const optVal = {
          tenderType: '总采购项目',
          monthNum: 0,
          monthMoney: 0,
          totalNum: 0,
          totalMoney: 0
        }
        res.data.forEach(item => {
          // 计算合计
          optVal.monthNum += item.monthNum
          optVal.monthMoney += item.monthMoney
          optVal.totalNum += item.totalNum
          optVal.totalMoney += item.totalMoney
          this.option.data.push({
            ...item,
            tenderType: filterDictText(this.indexPurchaseList, item.tenderType)
          })
        })
        // 处理数据 数字类型是以64位的IEEE 754格式存储的。 保留两位小数
        if (!isNaN(parseFloat(optVal.totalMoney))) {
          optVal.totalMoney = optVal.totalMoney.toFixed(2)
        }
        if (!isNaN(parseFloat(optVal.monthMoney))) {
          optVal.monthMoney = optVal.monthMoney.toFixed(2)
        }
        // 加入数组
        this.option.data.push({
          ...optVal
        })
      })
    },
    // 查看
    detail() {

    }
  }
}
</script>
<style lang="less" scoped>
</style>
