totalExpenses.vue

<template>
  <div>
      <div class="d-flex search-box jc-end">
        <el-select v-model="selectYear" size="mini" style="width:1.4rem;" @change="getFee('')">
            <el-option
                v-for="item in yearList"
                :key="item"
                :label="item"
                :value="item">
            </el-option>
            </el-select>
        </div>
        <barChart @downData="downData" :message="dataList" idstr="totalExpenses" class="heightCut68"></barChart>
  </div>
</template>

<script>
import barChart from '@/components/echarts/barChart' // 费用统计 柱图
import * as API_OPERATION from '@/api/con.operation'
export default {
  components: { barChart },
  data () {
    return {
      selectYear: '',
      yearList: [],
      selectId: '',
      dataList: {}
    }
  },
  mounted () {
    this.getFeeYear()
  },
  methods: {
    async getFeeYear () {
      const _data = await API_OPERATION.getFeeYear()
      if (!_data.data) { return false }
      this.yearList = _data.data
      this.selectYear = this.yearList[0]
      this.getFee()
    },
    async getFee (param, isLeaf) {
      this.selectId = param || null
      const _data = await API_OPERATION.getFee({ center: this.selectId, date: this.selectYear })
      if (!_data.data) { return false }
      this.dataList = {
        parentId: param || '',
        isLeaf: isLeaf,
        xAxis: _data.data.xAxis,
        idxs: _data.data.idxs,
        data: _data.data.data,
        yAxis: '单位：万元'
      }
    },
    downData (item) {
      // console.log('传来的值:', item)
      if (!item) {
        this.getFee('', false)
      } else {
        this.getFee(item, true)
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>