Merge branch 'master' of http://139.196.74.78:10010/r/drone/command-center-dashboard
| | |
| | | type: 'shadow', |
| | | }, |
| | | }, |
| | | legend: {}, |
| | | grid: { |
| | | left: '3%', |
| | | right: '4%', |
| | | bottom: '3%', |
| | | top: '5%', |
| | | left: 0, |
| | | right: 0, |
| | | bottom: 0, |
| | | containLabel: true, |
| | | }, |
| | | xAxis: [ |
| | | { |
| | | type: 'category', |
| | | data: ['暴露垃圾', '占道'], |
| | | axisLabel: { |
| | | rotate: -45, // 旋转角度 |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | data: ['暴露垃圾', '占道','暴露垃圾', '占道','暴露垃圾', '占道','暴露垃圾', '占道',], |
| | | }, |
| | | ], |
| | | yAxis: [ |
| | | { |
| | | type: 'value', |
| | | axisLabel: { |
| | | interval: 0, // 显示所有标签 |
| | | color: '#FFFFFF', |
| | | fontFamily: 'Source Han Sans CN, Source Han Sans CN', |
| | | fontWeight: 400, |
| | | fontSize: 10, |
| | | }, |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: '#ffffff', |
| | | }, |
| | | }, |
| | | splitLine: { |
| | | lineStyle: { |
| | | color: 'rgba(255, 255, 255, 0.1)', |
| | | type: 'dashed', // 设置为虚线 |
| | | }, |
| | | }, |
| | | }, |
| | | ], |
| | | series: [ |
| | |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | data: [120, 132], |
| | | itemStyle: { |
| | | color: '#FF8E8E', // 设置颜色 |
| | | }, |
| | | data: [120, 132,120, 132,120, 132,120, 132,], |
| | | }, |
| | | { |
| | | name: '已完成', |
| | |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | data: [220, 182], |
| | | data: [120, 132,120, 132,120, 132,120, 132,], |
| | | }, |
| | | { |
| | | name: '已完成1', |
| | | type: 'bar', |
| | | stack: 'Ad', |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | data: [120, 132,120, 132,120, 132,120, 132,], |
| | | }, |
| | | { |
| | | name: '已完成2', |
| | | type: 'bar', |
| | | stack: 'Ad', |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | data: [120, 132,120, 132,120, 132,120, 132,], |
| | | }, |
| | | { |
| | | name: '完成率', |
| | | type: 'line', |
| | | itemStyle: { |
| | | color: '#0CEBF7', // 设置颜色 |
| | | }, |
| | | lineStyle: { |
| | | width: 2, // 线条宽度 |
| | | type: 'solid', // 线条类型 |
| | | }, |
| | | symbol: 'circle', // 数据点符号 |
| | | symbolSize: 6, // 数据点符号大小 |
| | | emphasis: { |
| | | focus: 'series', |
| | | }, |
| | | data: [50, 55, 60, 65, 70, 75, 80, 85], // 示例数据,根据实际完成率计算 |
| | | }, |
| | | ], |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | const chart = echarts.init(echartsRef.value); |
| | | |
| | | chart.setOption(option); |
| | | window.addEventListener('resize', () => { |
| | | chart.resize(); |
| | | }); |
| | | }); |
| | | </script> |
| | | |
| | |
| | | <style scoped lang="scss"> |
| | | .homeRightSelect { |
| | | width: 356px; |
| | | |
| | | :deep() { |
| | | .el-select__wrapper { |
| | | background: linear-gradient(90deg, #195bad 0%, rgba(25, 91, 173, 0) 100%); |
| | | min-height: 28px; |
| | | height: 28px; |
| | | box-shadow: none; |
| | | border: 1px solid #306fca; |
| | | } |
| | |
| | | .el-select__placeholder { |
| | | font-family: Microsoft YaHei, Microsoft YaHei, serif; |
| | | color: #ffffff; |
| | | font-size: 14px; |
| | | } |
| | | } |
| | | } |
| | |
| | | |
| | | .dateTime{ |
| | | width: 356px; |
| | | margin: 15px 0 8px 0; |
| | | } |
| | | |
| | | .overviewData { |
| | |
| | | justify-content: space-between; |
| | | width: 356px; |
| | | height: 23px; |
| | | margin-top: 16px; |
| | | |
| | | &--left-img { |
| | | width: 16px; |
| | |
| | | |
| | | .chart { |
| | | width: 356px; |
| | | height: 182px; |
| | | height: 190px; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | import Synergy from '@/views/Home/components/HomeRight/Synergy.vue'; |
| | | import TaskAchievements from '@/views/Home/components/HomeRight/TaskAchievements.vue'; |
| | | import EventOverview from '@/views/Home/components/HomeRight/EventOverview.vue'; |
| | | |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |