Imdroid/security-monitor
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

优化首页

Browse Source
This commit is contained in:
weidong 2024-02-03 23:11:57 +08:00
parent 11cf68fbf6
commit 47cd76ee91
2 changed files with 174 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
sec-beidou/src/main/java/com/imdroid/beidou/controller/IndexController.java
View File

@ -1,13 +1,22 @@
package com.imdroid.beidou.controller; package com.imdroid.beidou.controller;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.imdroid.beidou.entity.Tenant;
import com.imdroid.secapi.dto.*;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller; import org.springframework.stereotype.Controller;
import org.springframework.ui.Model; import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.http.HttpSession; import javax.servlet.http.HttpSession;
import java.util.List;
@Controller @Controller
public class IndexController extends BasicController{ public class IndexController extends BasicController{
@Autowired
GnssDeviceMapper gnssDeviceMapper;
@Autowired
GnssStatusMapper statusMapper;
@RequestMapping("/") @RequestMapping("/")
public String index0(Model m, HttpSession session) { public String index0(Model m, HttpSession session) {
@ -24,6 +33,82 @@ public class IndexController extends BasicController{
@RequestMapping("/page/device_overview") @RequestMapping("/page/device_overview")
public String deviceOverview(Model m, HttpSession session) { public String deviceOverview(Model m, HttpSession session) {
initModel(m, session); initModel(m, session);
Long deviceDeployedNum;
Long deviceOnlineNum;
Long warning1Num;//一般告警
Long warning2Num;//严重告警
QueryWrapper<GnssDevice> deviceQueryWrapper = new QueryWrapper<>();
QueryWrapper<GnssStatus> statusQueryWrapper;
List<GnssStatus> deviceList;
if(tenantId == Tenant.SAAS_PROVIDER_ID){
// 统计所有企业设备
deviceQueryWrapper.ne("tenantid", tenantId);
deviceQueryWrapper.ne("opmode", GnssDevice.OP_MODE_UNUSE);
// 设备数量
deviceDeployedNum = gnssDeviceMapper.selectCount(deviceQueryWrapper);
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.ne("tenantid", tenantId);
statusQueryWrapper.isNotNull("latitude");
statusQueryWrapper.isNotNull("longitude");
deviceList = statusMapper.selectList(statusQueryWrapper);
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.ne("tenantid", tenantId);
statusQueryWrapper.ne("state", GnssStatus.STATE_OFFLINE);
deviceOnlineNum = statusMapper.selectCount(statusQueryWrapper);
// 告警统计
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.ne("tenantid", tenantId);
statusQueryWrapper.eq("warning", WarningCfg.LEVEL_1);
warning1Num = statusMapper.selectCount(statusQueryWrapper);
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.ne("tenantid", tenantId);
statusQueryWrapper.eq("warning", WarningCfg.LEVEL_2);
warning2Num = statusMapper.selectCount(statusQueryWrapper);
}
else{
// 统计本企业设备
// 统计所有企业设备
deviceQueryWrapper.eq("tenantid", tenantId);
deviceQueryWrapper.ne("opmode", GnssDevice.OP_MODE_UNUSE);
// 设备数量
deviceDeployedNum = gnssDeviceMapper.selectCount(deviceQueryWrapper);
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.ne("tenantid", tenantId);
statusQueryWrapper.isNotNull("latitude");
statusQueryWrapper.isNotNull("longitude");
deviceList = statusMapper.selectList(statusQueryWrapper);
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.eq("tenantid", tenantId);
statusQueryWrapper.ne("state", GnssStatus.STATE_OFFLINE);
deviceOnlineNum = statusMapper.selectCount(statusQueryWrapper);
// 告警统计
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.eq("tenantid", tenantId);
statusQueryWrapper.eq("warning", WarningCfg.LEVEL_1);
warning1Num = statusMapper.selectCount(statusQueryWrapper);
statusQueryWrapper = new QueryWrapper<>();
statusQueryWrapper.eq("tenantid", tenantId);
statusQueryWrapper.eq("warning", WarningCfg.LEVEL_2);
warning2Num = statusMapper.selectCount(statusQueryWrapper);
}
m.addAttribute("deviceDeployedNum", deviceDeployedNum);
m.addAttribute("deviceOnlineNum", deviceOnlineNum);
m.addAttribute("deviceOfflineNum", deviceDeployedNum - deviceOnlineNum);
m.addAttribute("warning1Num", warning1Num);
m.addAttribute("warning2Num", warning2Num);
m.addAttribute("warningTotalNum", warning1Num+warning2Num);
m.addAttribute("deviceList", deviceList);
return "/page/device_overview"; return "/page/device_overview";
} }

130
sec-beidou/src/main/resources/templates/page/device_overview.html
View File

@ -30,61 +30,108 @@
</style> </style>
</head> </head>
<body> <body>
<div class="layuimini-container"> <div class="layuimini-main">
<div class="layuimini-main welcome">
<div class="layui-row layui-col-space15">
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-card top-panel"> <div class="layui-row layui-col-space30">
<div class="layui-card-header">设备数量</div> <div class="layui-col-xs12 layui-col-md6">
<div class="layui-card-body"> <div class="layui-card top-panel">
<div class="layui-row layui-col-space5"> <div class="layui-card-header">设备数量</div>
<div class="layui-col-xs9 layui-col-md8 top-panel-number"> <div class="layui-card-body">
<a style="color: #1aa094">2,020</a><br> <div class="layui-row layui-col-space5">
</div> <div class="layui-col-xs9 layui-col-md8 top-panel-number">
<div class="layui-col-xs3 layui-col-md4"> <a style="color: #1aa094" th:text="${deviceOnlineNum}">2,020</a><br>
装机量 <a style="color: #bd3004">2040</a><br> </div>
在线数 <a style="color: #C0C0C0">2020</a> <div class="layui-col-xs3 layui-col-md4">
</div> 掉线数 <a style="color: #bd3004" th:text="${deviceOfflineNum}">0</a><br>
装机量 <a style="color: #000000" th:text="${deviceDeployedNum}">2020</a>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-card top-panel">
<div class="layui-card-header">告警统计</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space5">
<div class="layui-col-xs9 layui-col-md8 top-panel-number">
<a style="color: #f6c102" th:text="${warningTotalNum}">20</a><br>
</div>
<div class="layui-col-xs3 layui-col-md4">
严重 <a style="color: #bd3004" th:text="${warning2Num}">5</a><br>
一般 <a style="color: #f6c102" th:text="${warning1Num}">20</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="layui-col-xs12 layui-col-md6">
<div class="layui-card top-panel">
<div class="layui-card-header">告警统计</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space5">
<div class="layui-col-xs9 layui-col-md8 top-panel-number">
<a style="color: #1aa094">20</a><br>
</div>
<div class="layui-col-xs3 layui-col-md4">
严重 <a style="color: #bd3004">5</a><br>
一般 <a style="color: #C0C0C0">20</a>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
<div id="map-container" style="height: 85vh;weight :100vw"></div>
<div class="layui-row layui-col-space15">
<div class="layui-card top-panel">
<div id="map-container" class="layui-card-body" style="height: 85vh;weight :100vw"></div>
</div>
</div>
</div> </div>
<script type="text/javascript"> <script th:inline="javascript">
function initialize() { function initialize() {
var map = new BMapGL.Map("map-container"); // 创建Map实例 var map = new BMapGL.Map("map-container"); // 创建Map实例
var point = new BMapGL.Point(116.404, 39.915); // 创建点坐标 var point = new BMapGL.Point(116.404, 39.915);
map.centerAndZoom(point, 15); map.centerAndZoom(point, 6);
map.enableScrollWheelZoom(); map.enableScrollWheelZoom(true);
var deviceList=
[
[# th:each="device : ${deviceList}"]
{deviceid:[[${device.deviceid}]],
latitude:[[${device.latitude}]]/100,
longitude:[[${device.longitude}]]/100},
[/]
];
//console.log(deviceList);
translateCallback = function (data){
if(data.status === 0) {
var i=0;
for(; i<data.points.length; i++) {
map.addOverlay(new BMapGL.Marker(data.points[i]));
}
if(i>0) map.setCenter(data.points[i-1]);
}
}
let batch_id = 0;
var convertor = new BMapGL.Convertor();
//每秒转换10个坐标，否则会受百度并发限制
function timer() {
var pointArr = [];
var count = batch_id+10;
var totalNum = deviceList.length;
if(count>totalNum) count=totalNum;
for (var i = batch_id; i < count; i++) {
point = new BMapGL.Point(deviceList[i].longitude, deviceList[i].latitude);
pointArr.push(point);
}
convertor.translate(pointArr, 1, 5, translateCallback);
batch_id+=10;
// 函数内定时器的回调函数会继续调用 timer()
if(batch_id<totalNum) {
setTimeout(() => {
timer();
}, 500);
}
}
// 启动函数
timer()
} }
function loadScript() { function loadScript() {
var script = document.createElement("script"); var script = document.createElement("script");
script.src = "https://api.map.baidu.com/api?v=1.0&type=webgl&ak=4ef46ba62e8fba67b53a0becca4d05da&callback=initialize"; script.src = "https://api.map.baidu.com/api?v=1.0&type=webgl&ak=4ef46ba62e8fba67b53a0becca4d05da&callback=initialize";
@ -92,6 +139,7 @@
} }
loadScript(); loadScript();
</script> </script>
</body> </body>