| | |
| | | </template> |
| | | |
| | | <script> |
| | | import QueryForm from '@/components/common/QueryForm' |
| | | // import QueryForm from '@/components/common/QueryForm' |
| | | import * as echarts from 'echarts' |
| | | import { hiddenDangerDataPost } from '@/api/business/hiddenDanger' |
| | | import dayjs from 'dayjs' |
| | | export default { |
| | | components: { |
| | | QueryForm, |
| | | // QueryForm, |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | options: [ |
| | | { label: '待处理', value: '0' }, |
| | | { label: '已处理', value: '1' }, |
| | | { label: '已退回', value: '2' }, |
| | | { label: '已退回', value: '2' } |
| | | ] |
| | | }, |
| | | { |
| | |
| | | this.initDept() |
| | | this.initDept3() |
| | | }) |
| | | |
| | | } |
| | | }) |
| | | |
| | | }, |
| | | changeForm(e) { |
| | | this.getData() |
| | |
| | | this.typeList.forEach(i => { |
| | | total += i.total |
| | | }) |
| | | let colors = ['#d75a44', '#e39f4d', '#f0d05f', '#7ac7f6', '#4469ee', '#698af0','#86a2f1','#a1b4f6','#a0b5f5', '#9fb5f4', '#b6c7f7', '#c8d5f8'] |
| | | let option = { |
| | | const colors = ['#d75a44', '#e39f4d', '#f0d05f', '#7ac7f6', '#4469ee', '#698af0', '#86a2f1', '#a1b4f6', '#a0b5f5', '#9fb5f4', '#b6c7f7', '#c8d5f8'] |
| | | const option = { |
| | | grid: { |
| | | left: '0%', |
| | | right: '0%', |
| | |
| | | left: '45%', |
| | | textStyle: { |
| | | color: '#666666', |
| | | fontSize: 13, |
| | | }, |
| | | fontSize: 13 |
| | | } |
| | | }, { |
| | | text: total, |
| | | top: '50%', |
| | |
| | | textStyle: { |
| | | color: '#080404', |
| | | fontSize: 16, |
| | | fontWeight: 'bold', |
| | | }, |
| | | fontWeight: 'bold' |
| | | } |
| | | }], |
| | | legend: { |
| | | left: 'center', |
| | |
| | | type: 'pie', |
| | | radius: ['34%', '50%'], |
| | | label: { |
| | | formatter: "{a|{b}}\n\n{c} | {d}%", |
| | | formatter: '{a|{b}}\n\n{c} | {d}%', |
| | | rich: { |
| | | a: { |
| | | color: '#333333', |
| | |
| | | initDept() { |
| | | const myChart = echarts.init(document.querySelector('.echart2')) |
| | | |
| | | let option = { |
| | | const option = { |
| | | grid: { |
| | | left: '10%', |
| | | right: '10%', |
| | |
| | | name: '隐患数', |
| | | minInterval: 1, |
| | | axisLine: { |
| | | show: true, |
| | | show: true |
| | | } |
| | | }, |
| | | series: [ |
| | |
| | | show: true, // 显示标签 |
| | | position: 'top', // 让标签显示在柱子顶部 |
| | | color: '#666666', // 文字颜色 |
| | | fontSize: 14, // 文字大小 |
| | | fontSize: 14 // 文字大小 |
| | | } |
| | | } |
| | | ] |
| | |
| | | |
| | | const myChart = echarts.init(document.querySelector('#echart3')) |
| | | |
| | | let names = this.yearList.map(item => item.name) |
| | | let datas = this.yearList.map(item => item.total) |
| | | const names = this.yearList.map(item => item.name) |
| | | const datas = this.yearList.map(item => item.total) |
| | | |
| | | let option = { |
| | | const option = { |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | |
| | | axisLabel: { |
| | | formatter: function (value) { |
| | | // 四舍五入到最近的整数 |
| | | return Math.round(value); |
| | | return Math.round(value) |
| | | } |
| | | } |
| | | }, |
| | |
| | | |
| | | .main_table { |
| | | display: flex; |
| | | align-items: start; |
| | | align-items: flex-start; |
| | | justify-content: space-between; |
| | | .main_table_echart { |
| | | width: 64%; |
| | |
| | | |
| | | .main_content { |
| | | display: flex; |
| | | align-items: start; |
| | | align-items: flex-start; |
| | | justify-content: space-between; |
| | | height: 500px; |
| | | margin-bottom: 10px; |