Newer
Older
CloudBrainNew / src / views / industrialEconomy / components / expense / components / countryBar.vue
<template>
  <div style="width: 100%;height:100%;margin: 1em 0em">
    <!--<assets-total style="height: 15%;padding-bottom:0.05rem;"/>-->
    <simple-horizontal-bar-chart
      :id="options.id"
      :unit="options.unit"
      :height="options.height"
      :xAxisData="options.xAxisData"
      :seriesData="options.seriesData"
    />
  </div>
</template>

<script>
import ColorfulHorizontalBarChart from '@/components/barChart/colorfulHorizontalBarChart'
import ColorfulBarChart from '@/components/barChart/colorfulBarChart'
import SimpleHorizontalBarChart from '../../../../../components/barChart/simpleHorizontalBarChart'
// import AssetsTotal from './AssetsTotal'
import mockData from '../../../../../../static/industrialEconomy.json'
// import {fetchCommunityCount} from '@/api/community'
export default {
  name: 'CountryBar',
  components: { SimpleHorizontalBarChart, ColorfulBarChart, ColorfulHorizontalBarChart},
  data () {
    return {
      options: {
        id: 'country-bar',
        height: '100%',
        width: '100%',
        unit: '',
        xAxisData: ['教育、文化、娱乐', '医疗保健', '交通信息', '生活用品及服务',
          '居住', '衣着', '食品、烟酒', '其他用品和服务'],
        seriesData: [0, 0, 0, 0, 0, 0, 0, 0]
      }
    }
  },
  created () {
    // this.getData()
    this.options.xAxisData = mockData.right.expense.barCountry.xAxisData
    this.options.seriesData = mockData.right.expense.barCountry.seriesData
    this.options.unit = mockData.right.expense.barCountry.unit
  },
  methods: {
    getData () {
      // fetchCommunityCount().then(response => {
      //   if (response.code === 200) {
      //     this.options.xAxisData = []
      //     this.options.seriesData = []
      //     for (let i = 0; i < response.data.length; i++) {
      //       if (Number(response.data[i].value) !== 0) {
      //         this.options.xAxisData.push(response.data[i].name)
      //         this.options.seriesData.push(response.data[i].value)
      //       }
      //     }
      //     // const data = response.datas
      //     // this.options.xAxisData = data.map(item => { return item.name })
      //     // this.options.seriesData = data.map(item => { return item.value })
      //   }
      // })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>

</style>