| | |
| | | import { mapGetters } from 'vuex'; |
| | | import { getJobEventByStatus, getJobEventTotal, getFly, getFlyTime } from '@/api/home/index'; |
| | | import overviewImg1 from '@/assets/images/workbench/tc1.png'; |
| | | import overviewImg2 from '@/assets/images/workbench/tc2.png'; |
| | | import overviewImg3 from '@/assets/images/workbench/tc3.png'; |
| | | import overviewImg4 from '@/assets/images/workbench/tc4.png'; |
| | | import overviewImg5 from '@/assets/images/workbench/tc5.png'; |
| | | import overviewImg6 from '@/assets/images/workbench/tc6.png'; |
| | | import flyImg1 from '@/assets/images/workbench/fy2.png'; |
| | | import flyImg2 from '@/assets/images/workbench/fy3.png'; |
| | | import flyImg3 from '@/assets/images/workbench/fy4.png'; |
| | | import overviewImg2 from '@/assets/images/workbench/tc2.svg'; |
| | | import overviewImg3 from '@/assets/images/workbench/tc3.svg'; |
| | | import overviewImg4 from '@/assets/images/workbench/tc4.svg'; |
| | | import overviewImg5 from '@/assets/images/workbench/tc5.svg'; |
| | | |
| | | import flyImg1 from '@/assets/images/workbench/fy2.svg'; |
| | | import flyImg2 from '@/assets/images/workbench/fy3.svg'; |
| | | import flyImg3 from '@/assets/images/workbench/fy4.svg'; |
| | | import statistics from './components/statistics.vue'; |
| | | import { ElMessage } from 'element-plus'; |
| | | let checked = ref('CURRENT_YEAR'); |
| | |
| | | const data = { |
| | | total: { |
| | | title: '总计', |
| | | |
| | | figure: totalNum.toString(), // 动态计算总数 |
| | | }, |
| | | data: val.map(item => ({ |
| | |
| | | textStyle: { |
| | | color: 'rgba(28, 31, 35, 0.80)', |
| | | fontSize: '12px', |
| | | fontWeight: 'normal', |
| | | fontWeight: 'bold', |
| | | }, |
| | | subtext: data.total.figure, |
| | | subtextStyle: { |
| | |
| | | fontWeight: '600', |
| | | }, |
| | | top: '40%', |
| | | left: '53%', |
| | | left: '48%', |
| | | textAlign: 'center', // 文本对齐 |
| | | }, |
| | | series: [ |
| | | { |
| | | name: '', |
| | | type: 'pie', |
| | | radius: ['40%', '55%'], |
| | | radius: ['43%', '63%'], |
| | | avoidLabelOverlap: true, |
| | | left: '10%', |
| | | left: '-2%', |
| | | label: { |
| | | formatter: params => { |
| | | return `{a|${params.name}}: ${params.data.rate}%`; |
| | | // 使用 b 样式标记包裹百分比数值 |
| | | return `{a|${params.name}}: {b|${params.data.rate}%}`; |
| | | }, |
| | | alignTo: 'labelLine', |
| | | overflow: 'truncate', |
| | | rich: { |
| | | a: { |
| | | color: 'rgba(28, 31, 35, 0.80)', |
| | | fontSize: '12px', |
| | | fontSize: 12, // 建议去掉引号使用数字 |
| | | }, |
| | | b: { |
| | | color: '#1C1F23', |
| | | fontSize: '14px', |
| | | fontWeight: '600', |
| | | fontSize: 14, |
| | | fontWeight: 'bold', // 确保加粗 |
| | | }, |
| | | }, |
| | | }, |
| | | labelLine: { |
| | | show: true, |
| | | length: 5, // 调整引导线长度 |
| | | length2: 15, |
| | | lineStyle: { |
| | | cap: 'round', |
| | | }, |
| | |
| | | font-weight: bold; |
| | | font-size: 16px; |
| | | color: #363636; |
| | | font-family: 'YouSheBiaoTiHei'; |
| | | font-family: 'Source Han Sans CN'; |
| | | span { |
| | | margin-right: 4px; |
| | | } |
| | |
| | | height: 100%; |
| | | line-height: 32px; |
| | | cursor: pointer; |
| | | font-family: 'Source Han Sans CN'; |
| | | font-weight: 400; |
| | | font-size: 14px; |
| | | color: #1441FF; |
| | | } |
| | | .card-item:first-child { |
| | | border-right: 1px solid #e5e5e5; |
| | |
| | | .workOrder { |
| | | margin-top: 21px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | border-bottom: 1px solid #dfdfdf; |
| | | .card-group { |
| | | width: 40%; |
| | |
| | | color: #7c8091; |
| | | } |
| | | .total-number { |
| | | font-family: 'YouSheBiaoTiHei'; |
| | | font-family: 'Source Han Sans CN'; |
| | | |
| | | font-weight: bold; |
| | | font-size: 32px; |
| | |
| | | text-align: left; |
| | | } |
| | | .status-value { |
| | | font-family: 'YouSheBiaoTiHei'; |
| | | font-family: 'Source Han Sans CN'; |
| | | font-weight: bold; |
| | | font-size: 30px; |
| | | color: #363636; |
| | | margin: 5px 0; |
| | | // font-style: italic; |
| | | display: inline-block; |