<!-- * @Description:投资占比 * @Author: 王晓颖 * @Date: 2020-12-01 11:18:41 --> <template> <single-layout title="城镇人均消费支出构成"> <div style="width: 100%;height:100%;box-sizing:border-box;padding:0.05rem"> <simple-pie-chart :id="data.id" :width="data.width" :height="data.height" :seriesData="data.data"> </simple-pie-chart> </div> </single-layout> </template> <script> import SimplePieChart from '@/components/pieChart/simplePieChart' import SingleLayout from '@/components/layout/singleLayout' import {getYear} from '@/utils/formatDate' import {fetchProjectInvestmentByType} from '@/api/projectManage' import mockData from '../../../../../../static/industrialEconomy.json' export default { name: 'TownPie', components: {SingleLayout, SimplePieChart}, data () { return { year: getYear(), data: { id: 'town-pie', width: '100%', height: '100%', legend: ['教育、文化、娱乐', '医疗保健', '交通信息', '生活用品及服务', '居住', '衣着', '食品、烟酒', '其他用品和服务'], data: [ {value: 0, name: '教育、文化、娱乐'}, {value: 0, name: '医疗保健'}, {value: 0, name: '交通信息'}, {value: 0, name: '生活用品及服务'}, {value: 0, name: '居住'}, {value: 0, name: '衣着'}, {value: 0, name: '食品、烟酒'}, {value: 0, name: '其他用品和服务'} ] } } }, created () { // this.getData() this.data.data = mockData.right.expense.pieTown }, methods: { getData () { // fetchProjectInvestmentByType(this.year).then(response => { // if (response.code === 200) { // this.data.legend = response.data.map(item => item.type) // const data = response.data.map(item => { // return { // name: item.type, // value: item.value // } // }) // this.data.data = data // } // }) } } } </script> <style rel="stylesheet/scss" lang="scss" scoped> </style>