diff --git a/packages/bigscreen/dv/AppQxnDv.vue b/packages/bigscreen/dv/AppQxnDv.vue index b7da5ff3..400e8435 100644 --- a/packages/bigscreen/dv/AppQxnDv.vue +++ b/packages/bigscreen/dv/AppQxnDv.vue @@ -113,8 +113,25 @@ -
+
+
+
+ + 民警人数 + 214 +
+
+ + 辅警人数 + 214 +
+
+ + 其他 + 214 +
+
@@ -214,6 +231,7 @@ data () { return { + isShowInfo: false, value: '', lineData: [ { @@ -374,7 +392,7 @@ xAxis: { type: "category", axisTick: {show: false}, - axisLine: {show: false}, + axisLine: { lineStyle: { color: 'rgba(179, 223, 255, 0.4)' } }, axisLabel: {color: '#8FABBF', fontSize: 12}, }, yAxis: { @@ -445,6 +463,8 @@ barChart: { xAxis: { type: "category", + axisTick: {show: false}, + axisLine: { lineStyle: { color: 'rgba(179, 223, 255, 0.4)' } }, axisLabel: {color: '#8FABBF', fontSize: 12}, }, yAxis: { @@ -531,6 +551,12 @@ right: '6%', bottom: '6%' }, + yAxis: { + axisLine: {show: false}, + }, + xAxis: { + axisLine: {show: false}, + }, color: ['#59F7CA', '#62F2F8', '#F2B949', '#81C4E4', '#D8F2FD'], series: [ { @@ -549,7 +575,7 @@ normal: { textStyle: { color: '#9BB7D4', - fontSize: 16 + fontSize: 14 } } } @@ -611,6 +637,43 @@ margin-bottom: 12px; } + .total-info { + display: flex; + position: absolute; + flex-direction: column; + right: 11px; + top: 26px; + z-index: 11; + + .total-info__item { + display: flex; + align-items: center; + margin-bottom: 11px; + + &:last-child { + margin-bottom: 0; + } + + img { + width: 22px; + height: 22px; + } + + span { + width: 60px; + margin: 0 16px 0 6px; + color: #C6D6E6; + font-size: 14px; + } + + i { + font-style: normal; + font-size: 16px; + color: #fff; + } + } + } + .AppQxnDv-title { display: flex; position: relative; @@ -763,7 +826,6 @@ .right-left__middle { display: flex; - .left { width: 245px; margin-right: 12px; diff --git a/packages/bigscreen/dv/AppQxnEventDv.vue b/packages/bigscreen/dv/AppQxnEventDv.vue index 94a9f6dd..fee62797 100644 --- a/packages/bigscreen/dv/AppQxnEventDv.vue +++ b/packages/bigscreen/dv/AppQxnEventDv.vue @@ -536,8 +536,8 @@ xAxis: { type: "category", axisTick: {show: false}, - axisLine: {show: false}, - axisLabel: {color: '#8FABBF', fontSize: 12} + axisLabel: {color: '#8FABBF', fontSize: 12}, + axisLine: { lineStyle: { color: 'rgba(179, 223, 255, 0.4)' } } }, grid: { left: '0%', diff --git a/packages/bigscreen/dv/components/DvMap.vue b/packages/bigscreen/dv/components/DvMap.vue index 146b41d7..ef6129b3 100644 --- a/packages/bigscreen/dv/components/DvMap.vue +++ b/packages/bigscreen/dv/components/DvMap.vue @@ -1,6 +1,47 @@ @@ -14,7 +55,8 @@ export default { return { timer: null, v: `AiDvMap-${new Date().getTime()}`, - chart: null + chart: null, + isShowInfo: false } }, directives: { @@ -230,6 +272,9 @@ export default { ] } this.chart.setOption(option) + this.chart.on('click', e => { + this.isShowInfo = true + }) } }) }, @@ -261,11 +306,97 @@ export default {