更新数据可视化

ruoyi-ui/src/views/JiHeExpressway/pages/datav/roadNet/index.vue

@@ -13,7 +13,7 @@
                 <div class="info info_02 keep-ratio" origin="left">
                     <p v-if="item.dataGreen"><span>{{ item.dataGreen.title }}:</span><em class="green">{{
                 item.dataGreen.value }}</em><i v-if="item.dataGreen.unit">{{ item.dataGreen.unit }}</i></p>
-                    <p v-if="item.dataRed"><span>{{ item.dataRed.title }}:</span><em class="red">{{ item.dataRed.value
+                    <p v-if="item.dataRed"><span>{{ item.dataRed.title }}:</span><em :class="item.dataRed.color">{{ item.dataRed.value
                             }}</em><i v-if="item.dataRed.unit">{{ item.dataRed.unit }}</i></p>
                 </div>
             </div>
@@ -28,7 +28,7 @@
                 <img class="arrow arrow_03" src="./img/arrowRight.svg" alt="">
                 <div class="manageTotal">
                     <h4 class="keep-ratio">济菏运管中心</h4>
-                    <p>内存：<em>20.79</em>/62.36GB CPU：<em>1.00</em>/12<br>存储：<em>25.68</em>/2328.93GB</p>
+                    <p>内存：<em>{{ summaryMem.memUsed }}</em>/{{ summaryMem.memTotal }}GB CPU：<em>{{ summaryMem.cpuUsed }}</em>/{{ summaryMem.cputTotal }}<br>存储：<em>{{ summaryMem.filUsed }}</em>/{{ summaryMem.filTotal }}GB</p>
                 </div>
                 <ul class="manageDetail">
                     <li v-for="item in manage">
@@ -128,6 +128,7 @@ export default {
     data() {
         return {
             summary: [],
+            summaryMem:{},
             manage: [],
             apply: [],
             positionArr: [
@@ -152,7 +153,7 @@ export default {
     },
     mounted() {
         this.initData();
-        this.mockData();
+        // this.mockData();
     },
     methods: {
         mockData() {
@@ -187,94 +188,252 @@ export default {
             this.summary = [
                 {
                     width: 287,
-                    dataAll: { title: "接入设备总数", value: 3015, unit: "套" },
+                    dataAll: { title: "接入设备总数", value: '-', unit: "套" },
-                    dataGreen: { title: "设备类型数", value: 55, unit: "类" },
+                    dataGreen: { title: "设备类型数", value: '-', unit: "类" },
-                    dataRed: { title: "故障数", value: 207, unit: "套" }
+                    dataRed: { title: "故障数", value: '-', unit: "套", color:'red' }
                 },
                 {
                     width: 376,
-                    dataAll: { title: "接入数据总数", value: 1251446, unit: "条" },
+                    dataAll: { title: "接入数据总数", value: '-', unit: "条" },
-                    dataGreen: { title: "昨日接入数", value: 20624577, unit: "条" },
+                    dataGreen: { title: "昨日接入数", value: '-', unit: "条" },
-                    dataRed: { title: "环比", value: 0.04, unit: "%" }
+                    dataRed: { title: "环比", value: '-', unit: "%", color:'red' }
                 },
                 {
                     width: 287,
                     dataAll: { title: "存储占用量", value: 32, unit: "GB" },
                     dataGreen: { title: "昨日新增", value: 55, unit: "GB" },
-                    dataRed: { title: "环比", value: 20.5, unit: "%" }
+                    dataRed: { title: "环比", value: 20.5, unit: "%", color:'red' }
                 },
                 {
                     width: 376,
                     dataAll: { title: "服务调用总数", value: 752524, unit: "次" },
                     dataGreen: { title: "昨日服务数", value: 21034145, unit: "次" },
-                    dataRed: { title: "环比", value: 0.04, unit: "%" }
+                    dataRed: { title: "环比", value: 0.04, unit: "%" , color:'red'}
                 },
                 {
                     width: 226,
-                    dataAll: { title: "内存", value: 0, total: 1800, unit: "G" },
+                    dataAll: { title: "内存", value: '-', total: '-', unit: "G" },
-                    dataGreen: { title: "使用率", value: 70.73, unit: "%" }
+                    dataGreen: { title: "使用率", value: '-', unit: "%" }
                 },
                 {
                     width: 226,
-                    dataAll: { title: "CPU", value: 0, total: 126, unit: "" },
+                    dataAll: { title: "CPU", value: '-', total: '-', unit: "" },
-                    dataGreen: { title: "使用率", value: 56.35, unit: "%" }
+                    dataGreen: { title: "使用率", value: '-', unit: "%" }
                 }
             ];
-            const _manage = [
+            
-                { title: "ETC门架", value: 25800 },
+            // 上1 设备数量
-                { title: "雷达", value: 25800 },
+            request({ url: 'business/metrics/device/count', method: 'get'}).then(res=>{
-                { title: "一类交调站", value: 25800 },
+                if (res.code != 200) return;
-                { title: "气象监测", value: 25800 },
+                this.summary[0].dataAll.value = res.data;
-                { title: "事件预警", value: 25800 },
+            });
-                { title: "基础数据", value: 25800 },
+            request({ url: 'business/metrics/product/count', method: 'get'}).then(res=>{
-                { title: "摄像机", value: 25800 },
+                if (res.code != 200) return;
-                { title: "智能设备箱", value: 25800 }
+                this.summary[0].dataGreen.value = res.data;
+            });
+            request({ url: 'business/metrics/device-abnormal/count', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.summary[0].dataRed.value = res.data;
+            });
+            
+
+            //上2 接入设备数量
+            let startTime = moment('1990-01-01 00:00:00').format('YYYY-MM-DD HH:mm:ss');
+            let endTime = moment().format('YYYY-MM-DD HH:mm:ss');
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{
+                startTime,
+                endTime,
+                periodType:'year'
+            }}).then(res=>{
+                if (res.code != 200) return;
+                this.summary[1].dataAll.value = res.data;
+            });
+            
+            startTime = moment().subtract(1, 'days').format('YYYY-MM-DD') + ' 00:00:00';
+            endTime = moment().subtract(1, 'days').format('YYYY-MM-DD') + ' 23:59:59';
+
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{
+                startTime,
+                endTime,
+                periodType:'year'
+            }}).then(res=>{
+                if (res.code != 200) return;
+               this.summary[1].dataGreen.value = res.data;
+                startTime = moment().subtract(2, 'days').format('YYYY-MM-DD') + ' 00:00:00';
+                endTime = moment().subtract(2, 'days').format('YYYY-MM-DD') + ' 23:59:59';
+                request({ url: 'business/metrics/message-access/count', method: 'get',params:{
+                    startTime,
+                    endTime,
+                    periodType:'year'
+                }}).then(res2=>{
+                    if (res2.code != 200) return;
+                    let res3 = ((res.data-res2.data)/res2.data * 10000/100);
+                    this.summary[1].dataRed.value = res3.toFixed(2);
+                    this.summary[1].dataRed.color = res3>0?'green':'red';
+                });
+            });
+
+            // 上3 存储占用量
+            // request({ url: 'business/metrics/iot-server/monitor-previous', method: 'get'}).then(res=>{
+            //     console.log(res,'----------------')
+            // })
+           
+
+            //上5 内存占用
+            request({ url: 'business/metrics/iot-server/monitor', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.summary[4].dataAll.value = res.data.mem.used;
+                this.summary[4].dataAll.total = res.data.mem.total;
+                this.summary[4].dataGreen.value = (res.data.mem.used/res.data.mem.total* 10000/100).toFixed(2);;
+
+                this.summary[5].dataAll.value = res.data.cpu.used;
+                this.summary[5].dataAll.total = res.data.cpu.free;
+                this.summary[5].dataGreen.value = res.data.cpu.used //(res.data.cpu.used/res.data.cpu.total* 10000/100).toFixed(2);;
+                let arySysFiles = res.data.sysFiles;
+                let filTotal = 0;
+                let filUsed = 0;
+                arySysFiles.forEach(e => {
+                    filTotal+= parseFloat(e.total.substr(0,e.total.length-3))
+                    filUsed+= parseFloat(e.used.substr(0,e.used.length-3))
+                });
+                this.summaryMem = {
+                    memUsed: res.data.mem.used,
+                    memTotal: res.data.mem.total,
+                    cpuUsed: res.data.cpu.used,
+                    cpuTotal: res.data.cpu.free,
+                    filUsed: filUsed.toFixed(1),
+                    filTotal: filTotal.toFixed(1),
+                }
+            });
+            
+
+
+            this.manage = [
+                { title: "ETC门架", value: '-' },
+                { title: "雷达", value: '-' },
+                { title: "一类交调站", value: '-' },
+                { title: "气象监测", value: '-' },
+                { title: "事件预警", value: '-' },
+                { title: "基础数据", value: '-' },
+                { title: "摄像机", value: '-' },
+                { title: "智能设备箱", value: '-' }
             ];
+            // 门架流水数据统计
+            request({ url: 'business/odsTollEtctuData/countNumber', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[0].value = res.data;
+            });
+            startTime = moment('1990-01-01 00:00:00').format('YYYY-MM-DD HH:mm:ss');
+            endTime = moment().format('YYYY-MM-DD HH:mm:ss');
+            const param = {
+                startTime,
+                endTime,
+                periodType:'year'
+            }
+            //雷达
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{...param, productId: 'hmbld'}}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[1].value = res.data;
+            });
+            //一类交调站
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{...param, productId: 'zc-yzsqkdc-3131'}}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[2].value = res.data;
+            });
+            //气象监测
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{...param, productId: 'zc-meteorological'}}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[3].value = res.data;
+            });
+            //摄像机
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{...param, productId: 'video-event'}}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[6].value = res.data;
+            });
+            //智能设备箱
+            request({ url: 'business/metrics/message-access/count', method: 'get',params:{...param, productId: 'zc-shebeixiang-1883'}}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[7].value = res.data;
+            });
+            //基础数据 
+            request({ url: 'business/moduleCall/basicDataNumber', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[5].value = res.data;
+            });
+           
+            //事件预警
+            request({ url: 'business/warning/countNumber?warningSource', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.manage[4].value = res.data;
+            });
+
 
             //非机预警数据使用情况
-            const _dataShare = [
+            this.dataShare = [
                 { title: '', value: '' },
                 { title: '', value: '' },
-                { title: "收费站出口流水数据统计", value: 26805 },
+                { title: "收费站出口流水数据统计", value: '-' },
-                { title: "当天门架牌识流水数据统计", value: 26805 },
+                { title: "当天门架牌识流水数据统计", value: '-' },
-                { title: "收费站入口流水数据统计 ", value: 26805 },
+                { title: "收费站入口流水数据统计 ", value: '-' },
-                { title: "数据共享中心内存使用情况", value: 26805 },
+                { title: "上月累计车流量", value: '-' },
-                { title: "基础数据统计", value: 26805 },
+                { title: "在途车流量", value: '-' },
                 { title: "非机预警数据使用情况", value: '-' },
-                { title: "门架流水数据统计", value: 26805 },
+                { title: "数据共享中心内存使用情况", value: '-' },
-                { title: "数据共享中心CPU使用情况", value: 26805 },
+                { title: "年度累计车流量", value: '-' },
                 { title: '', value: '' },
                 { title: '', value: '' },
             ];
             
-            const warningNumber = await request({ url: 'business/warning/countNumber?warningSource=6', method: 'get'});
-            if (warningNumber.code != 200) return;
-            _dataShare[7].value = warningNumber.data;
 
-            const odsExpNumber = await request({ url: 'business/odsTollExpassData/countNumber', method: 'get'});
+            request({ url: 'business/odsTollExpassData/countNumber', method: 'get'}).then(res=>{
-            if (odsExpNumber.code != 200) return;
+                if (res.code != 200) return;
-            _dataShare[2].value = odsExpNumber.data;
+                this.dataShare[2].value = res.data;
+            });
 
-            const odsEnpNumber = await request({ url: 'business/odsTollEnpassData/countNumber', method: 'get'});
+            request({ url: 'business/odsTollEnpassData/countNumber', method: 'get'}).then(res=>{
-            if (odsEnpNumber.code != 200) return;
+                if (res.code != 200) return;
-            _dataShare[4].value = odsEnpNumber.data;
+                this.dataShare[4].value = res.data;
+            });
             
          
-            const odsViuNumber = await request({ url: 'business/odsTollViuData/countNumber', method: 'get'});
+            request({ url: 'business/odsTollViuData/countNumber', method: 'get'}).then(res=>{
-            if (odsViuNumber.code != 200) return;
+                if (res.code != 200) return;
-            _dataShare[3].value = odsViuNumber.data;
+                this.dataShare[3].value = res.data;
+            });
+            // 上月累计车流量
+            request({ url: 'business/traffic-statistics/history/accumulated-flow', method: 'get',params:{
+                periodType: 2,
+                startTime: moment().subtract(1, 'month').format('YYYY-MM')  + '-01 00:00:00',
+                endTime: moment().format('YYYY-MM') + '-01 00:00:00'
+            }}).then(res=>{
+                if (res.code != 200) return;
+                this.dataShare[5].value = res.data[0]?.trafficVolume || 0;
+            });
+            // 在途车流量
+            request({ url: 'business/traffic-statistics/current/in-transit-vehicles', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.dataShare[6].value = res.data[0]['total_flow'];
+            });
 
+            request({ url: 'business/traffic-statistics/history/accumulated-flow', method: 'get',params:{
+                periodType: 1,
+                startTime: moment().format('YYYY') + '-01-01 00:00:00',
+                endTime: moment().format('YYYY-MM-DD HH:mm:ss')
+            }}).then(res=>{
+                if (res.code != 200) return;
+                this.dataShare[9].value = res.data[0].trafficVolume;
+            });
+            
+            request({ url: 'business/warning/countNumber?warningSource=6', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                this.dataShare[7].value = res.data;
+            });
+            request({ url: 'business/traffic-statistics/current/average-speed', method: 'get'}).then(res=>{
+                if (res.code != 200) return;
+                // this.dataShare[3].value = res.data;
+                console.log(res)
+            });
      
-            // 门架流水数据统计
-            const odsEtcNumber = await request({ url: 'business/odsTollEtctuData/countNumber', method: 'get'});
-            if (odsEtcNumber.code != 200) return;
-            _manage[0].value = odsEtcNumber.data;
-            const basicNumber = await request({ url: 'business/moduleCall/basicDataNumber', method: 'get'});
-            if (basicNumber.code != 200) return;
-            _manage[5].value = basicNumber.data;
-
-            this.manage = _manage;
-            this.dataShare = _dataShare;
 
             //设备调用次数查询
             //