change - 设备监测页面初步修改,后端接口完善

main
wenjy 3 years ago
parent 2cd5053fa7
commit 8e99db156c

@ -0,0 +1,173 @@
package com.ruoyi.web.controller.iot;
import com.alibaba.fastjson.JSONArray;
import com.ruoyi.system.domain.BaseMonitorunitInfo;
import com.ruoyi.system.domain.BaseSensorInfo;
import com.ruoyi.system.domain.dto.BaseMonitorunitInfoDto;
import com.ruoyi.system.domain.dto.BaseSensorInfoDto;
import com.ruoyi.system.service.IBaseMonitorunitInfoService;
import com.ruoyi.system.service.IBaseSensorInfoService;
import lombok.Data;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.util.ArrayList;
import java.util.List;
import java.util.stream.Collectors;
/**
*
*
* @author WenJY
* @date 20220315 10:25
*/
@Controller
@RequestMapping("/iot/deviceMonitor")
public class DeviceMonitorController {
@Autowired private IBaseMonitorunitInfoService baseMonitorunitInfoService;
@Autowired private IBaseSensorInfoService baseSensorInfoService;
/**
*
*
* @author WenJY
* @date 2022/3/15 10:27
* @return java.lang.String
*/
@GetMapping("/getMonitorUnitTree")
@ResponseBody
public String getMonitorUnitTree() {
List<BaseMonitorunitInfoDto> baseMonitorunitInfoDtos =
baseMonitorunitInfoService.selectBaseMonitorunitInfoDtoList(
new BaseMonitorunitInfo(null, null, null, null, 0L));
List<BaseMonitorunitInfoDto> collect =
baseMonitorunitInfoDtos.stream()
.filter(x -> x.getParentId().isEmpty())
.collect(Collectors.toList());
List<JsonRootBean> jsonResult = new ArrayList<>();
collect.forEach(
x -> {
List<String> tags = new ArrayList<>();
List<Nodes> nodes = new ArrayList<>();
List<BaseMonitorunitInfoDto> collect1 =
baseMonitorunitInfoDtos.stream()
.filter(y -> y.getParentId().equals(x.getMonitorunitId()))
.collect(Collectors.toList());
tags.add(collect1.size() + "");
collect1.forEach(
z -> {
List<String> nodesTags = new ArrayList<>();
nodesTags.add("0");
nodes.add(new Nodes(z.getMonitorunitName(), z.getMonitorunitId(), nodesTags));
});
jsonResult.add(
new JsonRootBean(x.getMonitorunitName(), x.getMonitorunitId(), tags, nodes));
});
return JSONArray.toJSONString(jsonResult);
}
/**
*
*
* @author WenJY
* @date 2022/3/15 13:52
* @param monitorunitId
* @return java.lang.String
*/
@GetMapping("/getMonitorUnitInfo")
@ResponseBody
public String getMonitorUnitInfo(String monitorunitId) {
List<BaseMonitorunitInfoDto> baseMonitorunitInfoDtos =
baseMonitorunitInfoService.selectBaseMonitorunitInfoDtoList(
new BaseMonitorunitInfo(monitorunitId));
return JSONArray.toJSONString(baseMonitorunitInfoDtos);
}
/**
*
*
* @author WenJY
* @date 2022/3/15 13:52
* @param monitorunitId
* @return java.lang.String
*/
@GetMapping("/getSensorInfo")
@ResponseBody
public String getSensorInfo(String monitorunitId) {
List<BaseSensorInfoDto> baseSensorInfoDtos = new ArrayList<>();
List<BaseMonitorunitInfoDto> baseMonitorunitInfoDtos =
baseMonitorunitInfoService.selectBaseMonitorunitInfoDtoList(
new BaseMonitorunitInfo(monitorunitId));
baseMonitorunitInfoDtos.forEach(
x -> {
/*if(x.getParentId().isEmpty()){
BaseMonitorunitInfo baseMonitorunitInfo = new BaseMonitorunitInfo();
baseMonitorunitInfo.setParentId(x.getMonitorunitId());
List<BaseMonitorunitInfoDto> baseMonitorunitInfoDtos1 = baseMonitorunitInfoService.selectBaseMonitorunitInfoDtoList(baseMonitorunitInfo);
baseMonitorunitInfoDtos1.forEach(y->{
List<BaseSensorInfoDto> baseSensorInfoDtos1 = baseSensorInfoService.selectBaseSensorInfoList(new BaseSensorInfo(null, null, null, y.getMonitorunitId()));
baseSensorInfoDtos.addAll(baseSensorInfoDtos1);
});
}else{
List<BaseSensorInfoDto> baseSensorInfoDtos1 = baseSensorInfoService.selectBaseSensorInfoList(new BaseSensorInfo(null, null, null, x.getMonitorunitId()));
baseSensorInfoDtos.addAll(baseSensorInfoDtos1);
}*/
List<BaseSensorInfoDto> baseSensorInfoDtos1 =
baseSensorInfoService.selectBaseSensorInfoList(
new BaseSensorInfo(null, null, null, x.getMonitorunitId()));
baseSensorInfoDtos.addAll(baseSensorInfoDtos1);
});
return JSONArray.toJSONString(baseSensorInfoDtos);
}
}
@Data
class JsonRootBean {
public JsonRootBean() {}
public JsonRootBean(String text, String href, List<String> tags, List<Nodes> nodes) {
this.text = text;
this.href = href;
this.tags = tags;
this.nodes = nodes;
}
private String text;
private String href;
private List<String> tags;
private List<Nodes> nodes;
}
@Data
class Nodes {
public Nodes() {}
public Nodes(String text, String href, List<String> tags) {
this.text = text;
this.href = href;
this.tags = tags;
}
private String text;
private String href;
private List<String> tags;
}

@ -20,6 +20,27 @@
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.7.1/jquery.contextMenu.min.css">
<style>
div::-webkit-scrollbar {
/*滚动条整体样式*/
width: 5px;
/*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
div::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius: 10px;
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #004EA1;
}
div::-webkit-scrollbar-track {
/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 10px;
background: white;
}
#company-name {
position: absolute;
top: 2%;
@ -334,6 +355,7 @@
}
.sensor-Text {
display: flex;
width: 29%;
height: 35%;
position: absolute;
@ -342,8 +364,14 @@
border: 0px solid red;
color: #00f9ff;
padding: 1em 0.5em 1em 1.5em;
/*background: url(/img/sensor-block-active.png) no-repeat #00000000;*/
/*background-size: 100% 100%;*/
align-items: flex-start;
justify-content: space-around;
flex-wrap: nowrap;
flex-direction: column;
align-content: stretch;
overflow-x: hidden;
overflow-y: auto;
}
</style>
@ -376,10 +404,10 @@
<div id="transformer-name">监控单元</div>
<div id="transformer-model">
<img src="../../static/img/transformer-noshadow-lg.png" th:src="@{/img/transformer-noshadow-lg.png}" alt="监控单元">
<!--<img src="../../static/img/transformer-noshadow-lg.png" th:src="@{/img/transformer-noshadow-lg.png}" alt="监控单元">-->
</div>
<div class="sensor-Text">
<div class="sensor-Text" id="sensor-text">
<p>设备编号:<span>10kv 主变压器001</span></p>
<p>设备型号:<span>SC(B)10型干式电力变压器</span></p>
<p>启用时间:<span>2020年1月20日</span></p>
@ -391,6 +419,7 @@
<nav class="nav search-bar d-inline-block" id="main-search-bar">
<form action="#" class="search-form-nav">
<input id="monitorUnitId" name="monitorUnitId" type="hidden">
<label for="monitor-unit" class="search-label">监控单元:</label>
<input type="text" class="form-control d-inline-block" id="monitor-unit" name="monitor-unit"
placeholder="请输入监控单元">
@ -408,112 +437,8 @@
<div id="sensor-card-group">
</div>
</body>
<script th:inline="javascript">
/*let info = [
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>变压器监控单元`,
id:'byq',
pid:'',
items: [
{
id:'1#byq',
pid:'byq',
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>1#变压器`,
},
{
id:'2#byq',
pid:'byq',
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>2#变压器`,
},
{
id:'3#byq',
pid:'byq',
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>3#变压器`,
},
{
id:'4#byq',
pid:'byq',
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>4#变压器`,
},
],
},
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>隔离开关监控单元`,
items: [
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>1#隔离开关`,
},
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>2#隔离开关`,
},
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>3#隔离开关`,
},
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>4#隔离开关`,
},
],
},
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>电流互感器监控单元`,
items: [
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>1#电流互感器`,
}
],
},
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>电压互感器监控单元`,
items: [
{
name: `<i class="fa-solid fa-caret-right sidebar-item-icon"></i>1#电压互感器`,
}
],
},
];
$(()=>{
sidebarList.renderSideBarList(document.getElementById("sensor-list-inner"), info)
})
const sidebarList = {
parent: null,
switchTo(firstLevelIndex, secondLevelIndex) {
this.parent.querySelectorAll(".sidebar-second-level").forEach((value, key) => {
value.classList.remove("active")
})
this.parent.children[firstLevelIndex].children[1].children[0].children[secondLevelIndex].children[0].classList.add("active")
console.log(this.parent.children[firstLevelIndex].children[1].children[0].children[secondLevelIndex].children[0])
},
renderSideBarList(parent, list) {
this.parent = parent
parent.innerHTML = ''
for (let firstLevel of Object.entries(list)) {
let html = ''
html += `<li>
<button class="btn collapsed sidebar-first-level" data-bs-toggle="collapse" data-bs-target="#transformer-collapse-${firstLevel[0]}" aria-expanded="false">
${firstLevel[1].name}
</button>
<div class="collapse" id="transformer-collapse-${firstLevel[0]}">
<ul class="list-unstyled pb-1" id='${firstLevel[1].id}'>`
for (let secondLevel of Object.entries(firstLevel[1].items)) {
html += `<li><a href="javascript:sidebarList.switchTo(${firstLevel[0]}, ${secondLevel[0]})" id='${secondLevel[1].id}' class="btn sidebar-second-level">${secondLevel[1].name}</a></li>`
}
html += `</ul>
</div>
</li>`
parent.innerHTML += html
}
}
}*/
<script th:inline="javascript">
class SensorCardsViewModel extends AbstractViewModel {
constructor(idOrElement, parent = null, volatileMode = false) {
@ -561,103 +486,105 @@
<div class="conn-status">${this.get("conn-status")}</div>
<div class="collect-time">${this.get("datetime")}</div>
</div>
</div>`
</div>`
}
}
function sensorCollectionRefresh(monitorUnitId) {
$.ajax({
url: "/iot/deviceMonitor/getSensorInfo?monitorunitId=" + monitorUnitId,
type: "get",
dataType: 'JSON',
success: (res) => {
$("#sensor-card-group").html("");
const sensorCollection = new ViewModelCollection(document.getElementById("sensor-card-group"))
$(() => {
for (let i = 0; i < res.length; i++) {
sensorCollection.push(
new SensorCardsViewModel("sensor-card-1", document.getElementById("sensor-card-group")),
new SensorCardsViewModel("sensor-card-2", document.getElementById("sensor-card-group")),
new SensorCardsViewModel("sensor-card-3", document.getElementById("sensor-card-group")),
new SensorCardsViewModel("sensor-card-4", document.getElementById("sensor-card-group")),
new SensorCardsViewModel("sensor-card-5", document.getElementById("sensor-card-group")),
new SensorCardsViewModel("sensor-card-" + i, document.getElementById("sensor-card-group")),
)
}
for (let i = 0; i < 5; i++) {
const vm = sensorCollection.get(i)
vm.set("title", "10kV I、II段母联110开关柜_上触头B相_温度传感器_XP00028C08")
vm.set("temperature", "47.5°C")
for (let i = 0; i < res.length; i++) {
const vm = sensorCollection.get(i);
vm.set("title", res[i].sensorName)
vm.set("temperature", "--")
vm.set("battery-icon", `<i class="fa-solid fa-battery-full battery-icon"></i>`)
vm.set("status", "启用")
vm.set("conn-status", "在线")
vm.set("datetime", "10:00:00")
switch (res[i].sensorStatus) {
case 0:
vm.set("status", "在线")
break;
case 1:
vm.set("status", "离线")
break;
case 2:
vm.set("status", "告警")
break;
default:
vm.set("status", "异常")
break;
}
vm.set("conn-status", "")
vm.set("datetime", formatter(new Date(), "hh:mm:ss"))
}
sensorCollection.refresh()
},
error: () => {
console.log("失败");
}
})
}
</script>
<!-- Script -->
<!--<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>-->
<!--<script src="https://cdn.bootcss.com/bootstrap-treeview/1.2.0/bootstrap-treeview.min.js"></script>-->
<script type="text/javascript">
$(function () {
var defaultData = [
{
text: '变压器单元',
href: '#parent1',
tags: ['2'],
nodes: [
{
text: '1#变压器',
href: '#1#变压器',
tags: ['0'],
var search = function () {
$.ajax({
url: "/iot/deviceMonitor/getMonitorUnitTree", // 发送的路径
type: "get", // 发送方式
dataType: 'JSON', // 反序列化
//data:{v1,v2}, // 发送的数据
success: (res) => { // 成功获取到后端返回结果的回调函数
initSelectableTree(res);
return res;
},
{
text: '2#变压器',
href: '#2#变压器',
tags: ['0']
error: () => { // 发送失败的回调函数
console.log("失败");
}
]
},
{
text: '隔离开关单元',
href: '#parent2',
tags: ['0'],
nodes: []
},
{
text: '电流互感器单元',
href: '#parent3',
tags: ['0'],
nodes: []
},
{
text: '电压互感器单元',
href: '#parent4',
tags: ['0'],
nodes: []
},
{
text: '电容互感器单元',
href: '#parent5',
tags: ['0'],
nodes: []
})
}
];
var initSelectableTree = function () {
var initSelectableTree = function (defaultData) {
return $('#treeview-selectable').treeview({
data: defaultData,
multiSelect: $('#chk-select-multi').is(':checked'),
onNodeSelected: function (event, node) {
$('#selectable-output').prepend('<p>' + node.text + ' was selected</p>');
monitorUnitModule(node.href);
sensorCollectionRefresh(node.href);
},
onNodeUnselected: function (event, node) {
$('#selectable-output').prepend('<p>' + node.text + ' was unselected</p>');
}
});
};
var $selectableTree = initSelectableTree();
var $selectableTree = initSelectableTree(search());
var findSelectableNodes = function () {
return $selectableTree.treeview('search', [$('#input-select-node').val(), {
ignoreCase: false,
exactMatch: false
exactMatch: false,
}]);
};
var selectableNodes = findSelectableNodes();
@ -666,8 +593,60 @@
selectableNodes = findSelectableNodes();
$('.select-node').prop('disabled', !(selectableNodes.length >= 1));
});
});
</script>
<script type="text/javascript">
$(() => {
monitorUnitModule("BYQ")
sensorCollectionRefresh("BYQ");
})
const monitorUnitModule = function (monitorUnitId) {
$.ajax({
url: "/iot/deviceMonitor/getMonitorUnitInfo?monitorunitId=" + monitorUnitId,
type: "get",
dataType: 'JSON',
success: (res) => {
$('#transformer-model').html("");
let e = '<img src="' + res[0].monitorunitImage + '" >';
$("#transformer-model").append(e);
$('#sensor-text').html("");
let html = '<p>设备编号:<span>' + res[0].monitorunitId + '</span></p>\n' +
' <p>设备型号:<span>' + res[0].monitorunitName + '</span></p>\n' +
' <p>启用时间:<span>' + formatter(res[0].createTime, "yyyy-MM-dd") + '</span></p>\n' +
' <p>所属变电站:<span>' + res[0].substationName + '</span></p>';
$("#sensor-text").append(html);
},
error: () => {
console.log("失败");
}
})
}
</script>
<script type="text/javascript">
function formatter(thistime, fmt) {
let $this = new Date(thistime)
let o = {
'M+': $this.getMonth() + 1,
'd+': $this.getDate(),
'h+': $this.getHours(),
'm+': $this.getMinutes(),
's+': $this.getSeconds(),
'q+': Math.floor(($this.getMonth() + 3) / 3),
'S': $this.getMilliseconds()
}
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, ($this.getFullYear() + '').substr(4 - RegExp.$1.length))
}
for (var k in o) {
if (new RegExp('(' + k + ')').test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
}
}
return fmt
}
</script>
</html>

@ -22,6 +22,14 @@ public class BaseMonitorunitInfo extends TreeEntity
this.monitorunitId = monitorunitId;
}
public BaseMonitorunitInfo(String monitorunitId, String monitorunitName, String monitorunitType, String substationId, Long enableFlag) {
this.monitorunitId = monitorunitId;
this.monitorunitName = monitorunitName;
this.monitorunitType = monitorunitType;
this.substationId = substationId;
this.enableFlag = enableFlag;
}
/** 主键标识 */
private Long objId;

@ -61,7 +61,7 @@
<select id="selectBaseMonitorunitInfoDtoList" parameterType="BaseMonitorunitInfo" resultMap="BaseMonitorunitInfoDtoResult">
select t1.objid, t1.monitorunit_id, t1.monitorunit_name,t1.monitorunit_Status, t1.parent_id, t3.MonitorUnit_Name as parent_name,
t1.monitorunit_type,t2.MonitorUnitType_Name, t1.substation_id,t4.Substation_Name,t1.Monitorunit_Image,
t1.enable_flag from base_monitorunit_info t1
t1.enable_flag,t1.Create_Time from base_monitorunit_info t1
left join base_monitorunit_type t2 on t1.MonitorUnit_Type = t2.MonitorUnitType_Id
left join base_monitorunit_info t3 on t1.Parent_Id = t3.MonitorUnit_Id
left join base_substation_info t4 on t1.Substation_Id = t4.Substation_Id

Loading…
Cancel
Save