<!-- * @Description:案件来源 * @Author: 王晓颖 * @Date: 2020-09-04 18:41:53 --> <template> <single-layout title="违章事故来源"> <div style="width: 100%;height:100%;padding:0rem 0.1rem"> <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 { fetchCaseFrom } from '@/api/smartTraffic' import SingleLayout from '@/components/layout/singleLayout' export default { name: 'trafficPeccancyFromPie', components: {SingleLayout, SimplePieChart}, data () { return { data: { id: 'traffic-case-from-pie', width: '100%', height: '100%', legend: ['电警卡口', '移动抓拍', '手动录入', '道路管控'], data: [ {value: 34, name: '电警卡口'}, {value: 34, name: '移动抓拍'}, {value: 34, name: '手动录入'}, {value: 34, name: '道路管控'} ] } } }, created () { this.getData() }, methods: { getData () { fetchCaseFrom().then(response => { if (response.code === 200) { const data = response.data this.data.legend = data.map(item => { return item.name }) this.data.data = response.data } }) } } } </script> <style rel="stylesheet/scss" lang="scss" scoped> </style>