change-智慧场景、设备监控页面修改，显示内容调整

ruoyi-admin/src/main/java/com/ruoyi/web/controller/iot/DeviceMonitorController.java

@@ -88,6 +88,25 @@ public class DeviceMonitorController {
     return JSONArray.toJSONString(jsonResult);
   }
 
+
+  /**
+   * 获取第一个监控设备
+   * @author WenJY
+   * @date 2022/3/24 13:44
+   * @return java.lang.String
+   */
+  @GetMapping("/getFirstMonitorUnit")
+  @ResponseBody
+  public String getFirstMonitorUnit(){
+      String monitorunitId = "";
+      List<BaseMonitorunitInfo> baseMonitorunitInfos = baseMonitorunitInfoService.selectBaseMonitorunitInfoList(new BaseMonitorunitInfo());
+      if(baseMonitorunitInfos.size() > 0){
+          BaseMonitorunitInfo baseMonitorunitInfo = baseMonitorunitInfos.stream().filter(x -> !x.getParentId().isEmpty()).collect(Collectors.toList()).get(0);
+          monitorunitId = baseMonitorunitInfo.getMonitorunitId();
+      }
+      return monitorunitId;
+  }
+
   /**
    * 监控单元模块
    *
@@ -155,6 +174,8 @@ public class DeviceMonitorController {
 
                         info.put("sensorId", y.getSensorId());
 
+                        info.put("sensorName", y.getSensorName());
+
                         info.put("edgeId", y.getEdgeId());
 
                         info.put("sensorLocation", y.getSensorLocation());

ruoyi-admin/src/main/resources/static/js/Iot-ui/deviceMonitor.js

@@ -47,7 +47,7 @@ const createDeviceModule = function (sensor,params) {
     let html = '<div class="card sensor-card" style="border: 0px solid red;margin-right: 2%;margin-top:2%;overflow-x: hidden; overflow-y: auto;">';
     switch (sensor.datatype) {
         case "temperature":
-            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 70%;height: 15%;;display: flex;flex-direction: column;justify-content: center;">${sensor.sensorId}</div>`;
+            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 70%;height: 15%;;display: flex;flex-direction: column;justify-content: center;">${sensor.sensorName}</div>`;
 
             html += '<div style="position: absolute;width: 98%;height: 65%;border-top: 1px dashed #1CA2E7;border-bottom: 1px dashed #1CA2E7;left:1%;overflow-x: hidden; overflow-y: auto;display: flex;flex-direction: column;justify-content: center;">';
             for (let i=0; i<params.length; i++) {
@@ -64,7 +64,7 @@ const createDeviceModule = function (sensor,params) {
 
         case "image":
             html += '<div onclick="imgOnclick(this)"  style="position: absolute;width: 100%;height: 100%;border: 0px solid red">';
-            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 100%;border:0px solid #00f9ff;height: 15%;display: flex;align-items: center;">${sensor.sensorId}&nbsp;&nbsp;<span id=${sensor.sensorId+"sensorStatus"}>${sensor['sensorStatus'] == null ? "-" : sensorStatus(sensor['sensorStatus'])}</span></div>`
+            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 100%;border:0px solid #00f9ff;height: 15%;display: flex;align-items: center;">${sensor.sensorName}&nbsp;&nbsp;<span id=${sensor.sensorId+"sensorStatus"}>${sensor['sensorStatus'] == null ? "-" : sensorStatus(sensor['sensorStatus'])}</span></div>`
             html += '<div class="example" style="position: absolute;height: 80%;width: 52%;border-right: 1px dashed #1CA2E7;left: 1%;display: flex;align-items: center;justify-content: center;">';
                 let imgurl = sensor.imgstr.replace("D:/ruoyi/uploadPath","/profile");
             html += '<img id="'+sensor.sensorId+"imgstr"+'" src="'+imgurl+'" display="inline-block" vertical-align="middle" width="100%" height="80%">'
@@ -85,7 +85,7 @@ const createDeviceModule = function (sensor,params) {
             break;
 
         case "smoke":
-            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 70%;height: 15%;;display: flex;flex-direction: column;justify-content: center;">${sensor.sensorId}</div>`;
+            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 70%;height: 15%;;display: flex;flex-direction: column;justify-content: center;">${sensor.sensorName}</div>`;
 
             html += '<div style="position: absolute;width: 98%;height: 65%;border-top: 1px dashed #1CA2E7;border-bottom: 1px dashed #1CA2E7;left:1%;overflow-x: hidden; overflow-y: auto;display: flex;flex-direction: column;justify-content: center;">';
             for (let i=0; i<params.length; i++) {
@@ -102,7 +102,7 @@ const createDeviceModule = function (sensor,params) {
             break;
 
         case "platen":
-            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 70%;height: 15%;;display: flex;flex-direction: column;justify-content: center;">${sensor.sensorId}</div>`;
+            html += `<div style="padding-left: 20px;padding-top: 10px;font-size: 80%;color: #00f9ff;width: 70%;height: 15%;;display: flex;flex-direction: column;justify-content: center;">${sensor.sensorName}</div>`;
 
             html += '<div style="position: absolute;width: 98%;height: 65%;border-top: 1px dashed #1CA2E7;border-bottom: 1px dashed #1CA2E7;left:1%;overflow-x: hidden; overflow-y: auto;display: flex;flex-direction: column;justify-content: center;">';
             for (let i=0; i<params.length; i++) {

ruoyi-admin/src/main/resources/templates/section/substation.html

@@ -331,7 +331,7 @@
                                 e += '<span style="border:1px solid red;background-color:#2E2F44;border-radius:5px;margin-left: 5%">&nbsp;&nbsp;异常&nbsp;&nbsp;</span>';
                                 break
                         }
-                        e += '</div><div style="text-align:center;" onclick="window.location = ' + '\'' + datas[j].unitUrl + '\'"><img src="' + datas[j].monitorunitImage + '" display="inline-block" vertical-align="middle" width="70%" ></div></li>';
+                        e += '</div><div style="text-align:center;" onclick="window.location = ' + '\'' + datas[j].unitUrl +'\'"><img src="' + datas[j].monitorunitImage + '" display="inline-block" vertical-align="middle" width="70%" ></div></li>';
                         ul.append(e);
                     }
                 } else {      // 当超过一页时

ruoyi-admin/src/main/resources/templates/section/transformer-detail.html

@@ -439,7 +439,6 @@
                placeholder="请输入传感器名称">
 
         <button class="btn btn-primary search-btn">搜索</button>
-        <!--            <button type="reset" class="btn btn-outline-primary reset-btn">重置</button>-->
     </form>
 </nav>
 <div id="sensor-card-group">
@@ -449,13 +448,11 @@
 <script type="text/javascript">
 
     $(function () {
-
         var search = function () {
             $.ajax({
                 url: "/iot/deviceMonitor/getMonitorUnitTree",  // 发送的路径
                 type: "get",  // 发送方式
                 dataType: 'JSON',  // 反序列化
-                //data:{v1,v2},  // 发送的数据
                 success: (res) => {  // 成功获取到后端返回结果的回调函数
                     initSelectableTree(res);
                     return res;
@@ -472,8 +469,10 @@
                 multiSelect: $('#chk-select-multi').is(':checked'),
                 onNodeSelected: function (event, node) {
                     $('#selectable-output').prepend('<p>' + node.text + ' was selected</p>');
+                    if(node.nodeId > 0){
                         monitorUnitModule(node.href);
                         sensorCollectionRefresh(node.href);
+                    }
                 },
                 onNodeUnselected: function (event, node) {
                     $('#selectable-output').prepend('<p>' + node.text + ' was unselected</p>');
@@ -484,7 +483,6 @@
         var $selectableTree = initSelectableTree(search());
 
         var findSelectableNodes = function () {
-
             return $selectableTree.treeview('search', [$('#input-select-node').val(), {
                 ignoreCase: false,
                 exactMatch: false,
@@ -501,8 +499,23 @@
 
 <script type="text/javascript">
     $(() => {
-        monitorUnitModule("BYQ")
+        let unitId = getParams("id");
-        sensorCollectionRefresh("BYQ");
+        if( unitId != null) {
+            monitorUnitModule(unitId)
+            sensorCollectionRefresh(unitId);
+        }else{
+            $.ajax({
+                url: "/iot/deviceMonitor/getFirstMonitorUnit",
+                type: "get",
+                success: (res) => {
+                    monitorUnitModule(res)
+                    sensorCollectionRefresh(res);
+                },
+                error: () => {
+                    console.log("失败");
+                }
+            })
+        }
     })
     const monitorUnitModule = function (monitorUnitId) {
         $.ajax({
@@ -515,7 +528,7 @@
                 $("#transformer-model").append(e);
 
                 $('#sensor-text').html("");
-                let html = '<p>设备编号：<span>' + res[0].monitorunitId + '</span></p>\n' +
+                let html = '<p>设备编号：<span>' + res[0].monitorunitName + '</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>';
@@ -529,6 +542,15 @@
 </script>
 
 <script type="text/javascript">
+    function getParams(key) {
+        var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)");
+        var r = window.location.search.substr(1).match(reg);
+        if (r != null) {
+            return unescape(r[2]);
+        }
+        return null;
+    };
+
     function formatter(thistime, fmt) {
         let $this = new Date(thistime)
         let o = {