diff --git a/ruoyi-admin/src/main/resources/static/img/thermometer1.png b/ruoyi-admin/src/main/resources/static/img/thermometer1.png
new file mode 100644
index 0000000..ff0b81c
Binary files /dev/null and b/ruoyi-admin/src/main/resources/static/img/thermometer1.png differ
diff --git a/ruoyi-admin/src/main/resources/templates/index.html b/ruoyi-admin/src/main/resources/templates/index.html
index cf8c4ea..645dba9 100644
--- a/ruoyi-admin/src/main/resources/templates/index.html
+++ b/ruoyi-admin/src/main/resources/templates/index.html
@@ -301,6 +301,9 @@ if($.common.isNotEmpty(skin)){
 	$("body").addClass([[${skinName}]]);
 }
 
+$('#fullScreen').on('click', function () {
+  $(document).toggleFullScreen();
+});
 function tankuan(){
     $(".tipfloat").animate({height:"show"},800);
 }
diff --git a/ruoyi-admin/src/main/resources/templates/report/TemperatureArrayTreemap.html b/ruoyi-admin/src/main/resources/templates/report/TemperatureArrayTreemap.html
index 131f4e9..08d9d20 100644
--- a/ruoyi-admin/src/main/resources/templates/report/TemperatureArrayTreemap.html
+++ b/ruoyi-admin/src/main/resources/templates/report/TemperatureArrayTreemap.html
@@ -1,246 +1,285 @@
 <!DOCTYPE html>
-<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
+<html lang="zh" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" xmlns:th="http://www.thymeleaf.org">
 <head>
-    <th:block th:include="include :: header('温度阵列传感器曲线')" />
-    <th:block th:include="include :: layout-latest-css" />
-    <th:block th:include="include :: ztree-css" />
-    <th:block th:include="include :: datetimepicker-css" />
+  <th:block th:include="include :: header('温度阵列传感器曲线')"/>
+  <th:block th:include="include :: layout-latest-css"/>
+  <th:block th:include="include :: ztree-css"/>
+  <th:block th:include="include :: datetimepicker-css"/>
 </head>
+<style>
+  .item {
+    text-align: center;
+    display: inline-block;
+    margin: 0 0.5vw;
+    vertical-align: top;
+    position: relative;
+  }
+
+  .item .children {
+    margin-top: 4vw;
+    position: relative;
+  }
+
+  .item .line {
+    position: absolute;
+    height: 1vw;
+    width: 2px;
+    background-color: #235bcb;
+    left: 50%;
+    transform: translate(-50%, -100%);
+  }
+
+  .item .line1 {
+    position: absolute;
+    height: 2px;
+    width: calc(50% + 0.5vw + 2px);
+    background-color: #235bcb;
+    left: calc(-0.5vw - 2px);
+    transform: translateY(-1vw);
+  }
+
+  .item .line2 {
+    position: absolute;
+    height: 2px;
+    width: calc(50% + 0.5vw + 2px);
+    background-color: #235bcb;
+    left: 50%;
+    transform: translateY(-1vw);
+  }
+
+
+  .item .children .line3 {
+    position: absolute;
+    height: 3vw;
+    width: 2px;
+    background-color: #235bcb;
+    left: 50%;
+    transform: translate(-50%, -4vw);
+  }
+</style>
 <body class="gray-bg">
 
 <div class="ui-layout-west">
-    <div class="box box-main">
-        <div class="box-header">
-            <div class="box-title">
-                <i class="fa icon-grid"></i> 测控点信息
-            </div>
-            <div class="box-tools pull-right">
-                <a type="button" class="btn btn-box-tool" href="#" onclick="dept()" title="测控点信息"><i class="fa fa-edit"></i></a>
-                <button type="button" class="btn btn-box-tool" id="btnExpand" title="展开" style="display:none;"><i class="fa fa-chevron-up"></i></button>
-                <button type="button" class="btn btn-box-tool" id="btnCollapse" title="折叠"><i class="fa fa-chevron-down"></i></button>
-                <button type="button" class="btn btn-box-tool" id="btnRefresh" title="刷新"><i class="fa fa-refresh"></i></button>
-            </div>
-        </div>
-        <div class="ui-layout-content">
-            <div id="tree" class="ztree"></div>
-        </div>
+  <div class="box box-main">
+    <div class="box-header">
+      <div class="box-title">
+        <i class="fa icon-grid"></i> 测控点信息
+      </div>
+      <div class="box-tools pull-right">
+        <a class="btn btn-box-tool" href="#" onclick="dept()" title="测控点信息" type="button"><i class="fa fa-edit"></i></a>
+        <button class="btn btn-box-tool" id="btnExpand" style="display:none;" title="展开" type="button"><i
+                class="fa fa-chevron-up"></i></button>
+        <button class="btn btn-box-tool" id="btnCollapse" title="折叠" type="button"><i class="fa fa-chevron-down"></i>
+        </button>
+        <button class="btn btn-box-tool" id="btnRefresh" title="刷新" type="button"><i class="fa fa-refresh"></i></button>
+      </div>
     </div>
+    <div class="ui-layout-content">
+      <div class="ztree" id="tree"></div>
+    </div>
+  </div>
 </div>
 
 <div class="ui-layout-center">
-    <div class="container-div">
-        <div class="row">
-            <div class="col-sm-12 search-collapse">
-                <form id="formId">
-                    <input type="hidden" id="monitorId" name="monitorId">
-                    <div class="select-list">
-                        <ul>
-                            <li class="select-time">
-                                <label>采集时间：</label><input type="text" class="form-control" style="width: 150px"  id="laydate-demo-3" placeholder="开始时间" name="params[beginCollectTime]"/>
-                                <span>-</span>
-                                <input type="text" class="form-control" id="laydate-demo-4" style="width: 150px"  placeholder="结束时间" name="params[endCollectTime]"/>
-                            </li>
-                            <li>
-                            </li>
+  <div class="container-div">
+    <div class="row">
+      <div class="col-sm-12 search-collapse">
+        <form id="formId">
+          <input id="monitorId" name="monitorId" type="hidden">
+          <div class="select-list">
+            <ul>
+              <li class="select-time">
+                <label>采集时间：</label><input class="form-control" id="laydate-demo-3" name="params[beginCollectTime]"
+                                           placeholder="开始时间"
+                                           style="width: 150px" type="text"/>
+                <span>-</span>
+                <input class="form-control" id="laydate-demo-4" name="params[endCollectTime]" placeholder="结束时间"
+                       style="width: 150px"
+                       type="text"/>
+              </li>
+              <li>
+              </li>
 
-                        </ul>
-                    </div>
-                </form>
-            </div>
-            <div class="ibox-content" style="margin-top: 80px;margin-right: 0px;">
-                <div class="echarts" id="echarts-line-chart" style="height: 620px"></div>
-            </div>
-<!--            <div class="col-sm-12 select-table table-striped">-->
-<!--                <table id="bootstrap-table"></table>-->
-<!--            </div>-->
+            </ul>
+          </div>
+        </form>
+      </div>
+      <div class="ibox-content" style="margin-top: 80px;margin-right: 0px;">
+        <div class="treeContent" id="treeContent">
         </div>
+      </div>
+      <!--            <div class="col-sm-12 select-table table-striped">-->
+      <!--                <table id="bootstrap-table"></table>-->
+      <!--            </div>-->
     </div>
+  </div>
 </div>
 
-<th:block th:include="include :: footer" />
-<th:block th:include="include :: layout-latest-js" />
-<th:block th:include="include :: ztree-js" />
-<th:block th:include="include :: echarts-js" />
-<th:block th:include="include :: datetimepicker-js" />
+<th:block th:include="include :: footer"/>
+<th:block th:include="include :: layout-latest-js"/>
+<th:block th:include="include :: ztree-js"/>
+<th:block th:include="include :: echarts-js"/>
+<th:block th:include="include :: datetimepicker-js"/>
 <script th:inline="javascript">
-    var prefix = ctx + "system/ArrayTemperatureData"
-    var timedata=[];
-    var tempreturedata=[];
-    var humdata=[];
-    layui.use('laydate', function(){
-        var laydate = layui.laydate;
+  var prefix = ctx + "system/ArrayTemperatureData"
+  var timedata = [];
+  var tempreturedata = [];
+  var humdata = [];
+  layui.use('laydate', function () {
+    var laydate = layui.laydate;
 
-        laydate.render({
-            elem: '#laydate-demo-3',
-            type: 'datetime',
-            trigger: 'click'
-        });
-
-        laydate.render({
-            elem: '#laydate-demo-4',
-            type: 'datetime',
-            trigger: 'click'
-        });
+    laydate.render({
+      elem: '#laydate-demo-3',
+      type: 'datetime',
+      trigger: 'click'
     });
-    $(function() {
-        var panehHidden = false;
-        getdata(null);
-        if ($(this).width() < 769) {
-            panehHidden = true;
-        }
-        $('body').layout({ initClosed: panehHidden, west__size: 185 });
-        queryDeptTree();
-    });
-
-    function queryDeptTree()
-    {
-        var url = ctx + "system/Monitor/treeData?monitorType=30";
-        var options = {
-            url: url,
-            expandLevel: 1,
-            onClick : zOnClick,
-
-        };
-        $.tree.init(options);
-        function zOnClick(event, treeId, treeNode) {
-            $("#monitorId").val(treeNode.id);
-            $.table.search();
-            getdata(treeNode.id);
+
+    laydate.render({
+      elem: '#laydate-demo-4',
+      type: 'datetime',
+      trigger: 'click'
+    });
+  });
+  $(function () {
+    var panehHidden = false;
+    getdata(null);
+    if ($(this).width() < 769) {
+      panehHidden = true;
+    }
+    $('body').layout({initClosed: panehHidden, west__size: 185});
+    queryDeptTree();
+  });
+
+  function queryDeptTree() {
+    var url = ctx + "system/Monitor/treeData?monitorType=30";
+    var options = {
+      url: url,
+      expandLevel: 1,
+      onClick: zOnClick,
+
+    };
+    $.tree.init(options);
+
+    function zOnClick(event, treeId, treeNode) {
+      $("#monitorId").val(treeNode.id);
+      $.table.search();
+      getdata(treeNode.id);
+    }
+  }
+
+  $('#btnExpand').click(function () {
+    $._tree.expandAll(true);
+    $(this).hide();
+    $('#btnCollapse').show();
+  });
+
+  $('#btnCollapse').click(function () {
+    $._tree.expandAll(false);
+    $(this).hide();
+    $('#btnExpand').show();
+  });
+
+  $('#btnRefresh').click(function () {
+    queryDeptTree();
+  });
+
+  /* 社区信息 */
+  function dept() {
+    var url = ctx + "system/Monitor";
+    $.modal.openTab("测控点信息", url);
+  }
+
+  function handleTree(data, id, parentId, children) {
+    let config = {
+      id: id || 'id',
+      parentId: parentId || 'parentId',
+      childrenList: children || 'children'
+    };
+
+    var childrenListMap = {};
+    var nodeIds = {};
+    var tree = [];
+
+    for (let d of data) {
+      let parentId = d[config.parentId];
+      if (childrenListMap[parentId] == null) {
+        childrenListMap[parentId] = [];
+      }
+      nodeIds[d[config.id]] = d;
+      childrenListMap[parentId].push(d);
+    }
+
+    for (let d of data) {
+      let parentId = d[config.parentId];
+      if (nodeIds[parentId] == null) {
+        tree.push(d);
+      }
+    }
+
+    for (let t of tree) {
+      adaptToChildrenList(t);
+    }
+
+    function adaptToChildrenList(o) {
+      if (childrenListMap[o[config.id]] !== null) {
+        o[config.childrenList] = childrenListMap[o[config.id]];
+      }
+      if (o[config.childrenList]) {
+        for (let c of o[config.childrenList]) {
+          adaptToChildrenList(c);
         }
+      }
     }
 
-    $('#btnExpand').click(function() {
-        $._tree.expandAll(true);
-        $(this).hide();
-        $('#btnCollapse').show();
+    return tree;
+  }
+
+  const getItem = (e, k) => {
+    console.log(k)
+    let res = ``
+    e.forEach((v, index) => {
+      let html = `
+          <div class="item">
+          ${k > 0 ? `
+          <div class="line"></div>
+          ${index === 0 ? `` : `<div class="line1"></div>`}
+          ${(index === e.length - 1) ? `` : `<div class="line2"></div>`}
+          ` : ''}
+            <div class="thermometer">
+              <img alt="" height="54px" src="/img/thermometer1.png" width="50px">
+            </div>
+            <div class="name" style="color: #3b4472">${v.monitorName}</div>
+            <div class="temperature" style="color: #cb2f2c">${v.maxTemperature}℃</div>
+            ${v.children?.length > 0 ? `<div class="children"><div class="line3"></div>${getItem(v.children, k + 1)}</div>` : ''}
+          </div>
+      `
+      res += html
+    })
+    return res
+  }
+
+  function getdata(monitorId) {
+    var formData = new FormData();
+    formData.append("monitorId", monitorId);
+    formData.append("params[beginCollectTime]", $("#laydate-demo-3").val());
+    formData.append("params[endCollectTime]", $("#laydate-demo-4").val());
+    $.ajax({
+      url: prefix + "/getTemperatureArrayTreemap",
+      type: 'post',
+      cache: false,
+      data: formData,
+      processData: false,
+      contentType: false,
+      dataType: "json",
+      success: function (result) {
+        let data = handleTree(result.data, 'monitorId', 'pMonitorId', 'children')
+        console.log(data)
+        $('#treeContent').html(getItem(data, 0))
+
+      }
     });
+  }
 
-    $('#btnCollapse').click(function() {
-        $._tree.expandAll(false);
-        $(this).hide();
-        $('#btnExpand').show();
-    });
-
-    $('#btnRefresh').click(function() {
-        queryDeptTree();
-    });
-
-    /* 社区信息 */
-    function dept() {
-        var url = ctx + "system/Monitor";
-        $.modal.openTab("测控点信息", url);
-    }
-
-    function getdata(monitorId) {
-        var formData = new FormData();
-        formData.append("monitorId",monitorId);
-        formData.append("params[beginCollectTime]",$("#laydate-demo-3").val());
-        formData.append("params[endCollectTime]",$("#laydate-demo-4").val());
-        $.ajax({
-            url: prefix + "/getTemperatureArrayTreemap",
-            type: 'post',
-            cache: false,
-            data: formData,
-            processData: false,
-            contentType: false,
-            dataType: "json",
-            success: function(result) {
-                console.log(result);
-                result.data.forEach(function(e){
-                    // console.log(e.fluxData);
-                    timedata.push(e.collectTime);
-                    tempreturedata.push(e.tempreture);
-                    // humdata.push(e.humidity);
-                });
-                design();
-            }
-        });
-    }
-
-    function design() {
-        var lineChart = echarts.init(document.getElementById("echarts-line-chart"));
-        var lineoption = {
-            title: {
-                text: '温度阵列传感器最高温度曲线',
-                left: 'center'
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    animation: false
-                }
-            },
-            legend: {
-                data: ['温度'],
-                left: 10
-            },
-            toolbox: {
-                feature: {
-                    dataZoom: {
-                        yAxisIndex: 'none'
-                    },
-                    restore: {},
-                    saveAsImage: {}
-                }
-            },
-            axisPointer: {
-                link: { xAxisIndex: 'all' }
-            },
-            dataZoom: [
-                {
-                    show: true,
-                    realtime: true,
-                    start: 0,
-                    end: 100,
-                    xAxisIndex: 0
-                },
-                {
-                    type: 'inside',
-                    realtime: true,
-                    start: 30,
-                    end: 70,
-                    xAxisIndex: 0
-                }
-            ],
-            grid: {
-                left: 50,
-                right: 50,
-                height: '60%' // 调整height值以适应图表位置
-            },
-            xAxis: {
-                type: 'category',
-                boundaryGap: false,
-                axisLine: { onZero: true },
-                data: timedata
-            },
-            yAxis: {
-                name: '温度',
-                type: 'value'
-            },
-            series: [
-                {
-                    name: '温度',
-                    type: 'line',
-                    symbolSize: 8,
-                    hoverAnimation: false,
-                    data: tempreturedata,
-                    smooth: true,
-                    markPoint: {
-                        data: [
-                            { type: 'max', name: '最大值' },
-                            { type: 'min', name: '最小值' }
-                        ]
-                    },
-                }
-            ]
-        };
-
-        lineChart.setOption(lineoption,true);
-        $(window).resize(lineChart.resize);
-        timedata.splice(0,timedata.length);
-        tempreturedata.splice(0,tempreturedata.length);
-        humdata.splice(0,humdata.length);
-    }
 </script>
 </body>
-</html>
\ No newline at end of file
+</html>
