Merge remote-tracking branch 'origin/visu_environment' into visu_environment

src/api/bigdata.js

@@ -149,3 +149,12 @@ export function getRlt(param) {
     data : param
   })
 }
+
+//车辆信息统计
+export function selectCarCount(data) {
+  return request({
+    url: '/center-fire/VisuForestCloudBigDataController/selectCarCount',
+    method: 'get',
+    params:data
+  })
+}

src/views/bigdata/bigdata.vue

@@ -116,6 +116,12 @@
           </div>
           <chartDetector></chartDetector>
         </div>
+        <div class="b-con mg-b-20">
+          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
+            <span>车辆资源统计</span>
+          </div>
+          <chartPit></chartPit>
+        </div>
       </div>
     </div>
 
@@ -142,6 +148,7 @@ import chartNoBurningArea from './chart-noBurningArea.vue' //10 禁烧区分布
 // import chartWeatherStation from './chart-weatherStation.vue' //14 气象站、、
 import chartEquipmentDistribution from './chart-equipmentDistribution' //16 设备分布、、
 import chartDetector from './chart-detector' //16 设备分布、、
+import chartPit from './chart-pit' //16 设备分布、、
 import { getRlt } from '@/api/bigdata'
 import {
   fontConfig

src/views/bigdata/chart-pit.vue

@@ -0,0 +1,79 @@
+<!-- **************************************NO.6 矿坑*************************************** -->
+<template>
+	<div class="chart-container">
+		<div id="pit1" style="width: 100%; height:23vh;">
+		</div>
+	</div>
+</template>
+
+<script>
+  import { selectCarCount } from '@/api/bigdata'
+	import * as echarts from 'echarts';
+	export default {
+		name: 'pit1',
+		data() {
+			return {
+				count: 0,
+
+        title:'',
+        visible:false,
+
+			}
+		},
+    mounted() {
+      this.selectCarCount();
+    },
+
+    methods: {
+      selectCarCount(){
+        selectCarCount({areaType:"4"}).then(resp => {
+          this.myEcharts(resp.data);
+        })
+      },
+			myEcharts(data) {
+				var chartDom = document.getElementById('pit1');
+				var myChart = echarts.init(chartDom);
+				var color = ['#02CDFF', '#62FBE7', '#7930FF','#ef5f9d','#ecb935'];
+				var option;
+				option = {
+				    color:color,
+				    tooltip : {
+				        trigger: 'item',
+				        formatter: "{b}: {c}"
+				    },
+				    toolbox: {
+				        show : true,
+				    },
+				    series : [
+				        {
+				            type:'pie',
+				            roseType: true,
+				            radius : ['50%', '70%'],
+				            label: {
+				              show: true,
+				              formatter: "{b} {c}",
+                      textStyle: {
+                          fontSize: 10 ,
+                      }
+				            },
+				            data:data
+				        }
+				    ]
+				};
+				option && myChart.setOption(option);
+			},
+
+		},
+
+	}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+	.chart-container {
+		width: 100%;
+		height: auto;
+		position: relative;
+		padding-bottom: 10px;
+		display: flex;
+	}
+</style>