增加:主界面选择系统页面，统计实时刷新，低电量人员数据显示

zhitong.yu

2024-05-11 b72f8f8d58417eb6fb29672d8ac17cfafa46775c

 src/main/webapp/Home/HomeJs/Home.js

@@ -66,6 +66,9 @@
        ]]
    });

    


    table.render({
        elem: '#fence'
        ,url: '/hxzkuwb/findfence'
@@ -99,6 +102,9 @@
    });





    table.render({
        elem: '#person'
        ,url: '/hxzkuwb/findperson'
@@ -130,6 +136,20 @@
            ,{field: 'redius', title: '聚集半径',width:150}
            ,{field: 'shichang', title: '聚集时长',width:165}
            ,{field: 'weixianpin', title: '危险品名称',width:170}
        ]]
    });

    table.render({
        elem: '#PowerPerson'
        ,url: '/hxzkuwb/findPowerPerson'
        ,skin: 'nob'
        ,height:300
        ,limit: 5
        ,page: true //开启分页
        ,cols: [[ //表头
            { field: 'tagid', title: '编号',width:100}
            ,{field: 'name', title: '姓名',width: 100}
            ,{field: 'power', title: '电量',width: 100,templet: '#titleTplPower'}
        ]]
    });

@@ -175,37 +195,7 @@



    $.get("/hxzkuwb/findMapShow",function (data){
        $(".MapShow").append('<li style="width: 100px;display: inline-block"><a href="javascript:;"  onClick="yckb()" style="width: 100px;display: inline-block;font-size: 12px;color: '+data[0].color+'" id="ykcbs">隐藏看板</a></li>')
        if(data[0].ishow == "显示"){
            $(".MapShow").append('<li style="width: 100px;display: inline-block"><input type="checkbox" id="sanweis" onClick="Qh1()"  style="position: relative;top: 2px"/><a href="javascript:;"  class="ts1" style="font-size: 12px;color: '+data[0].color+'" onClick="Qh1()" id="qh1">三维地图</a></li>')
        }else{
            Qh2();
        }
        if(data[1].ishow == "显示"){
            $(".MapShow").append('<li style="width: 100px;display: inline-block"><input type="checkbox" id="baidus" onClick="Qh()" style="position: relative;top: 2px"/><a href="javascript:;" class="ts1" style="font-size: 12px;color: '+data[0].color+'" onClick="Qh()" id="qh2">'+data[1].type+'</a></li>')
        }else{
            // $("#ditu2").hide();
            Qh1();
        }
        $(".MapShow").append('<li onclick="xianshilixians()" style="width: 100px;display: inline-block"><input type="checkbox" id="xianshilixian"   style="position: relative;top: 2px"/><a href="javascript:;" style="font-size: 12px;color: '+data[0].color+'">显示离线</a></li>')
        $(".MapShow").append('<li class="ctrls" style="width: 100px;display: inline-block"><a href="javascript:;" style="font-size: 12px;color: '+data[0].color+'" title="按住CTRL按键可以旋转改变地图视角">CTRL旋转地图</a></li>')
        $(".MapShow").append('<li class="qhPingMian" style="font-size: 12px;width: 100px;display: inline-block"><select id="mySelect" onchange="TuCeng()" style="border: none;background: none;color: '+data[0].color+'"><option style="color: black">切换图层</option></select></li>')
        $(".MapShow").append('<li class="qhWeiLan" style="display: inline-block;font-size: 12px;color: white;width: 100px;"><a  onclick="qhweil()" id="weilanxs" style="color: '+data[0].color+'" href="javascript:;">隐藏围栏</a></li>')
        $(".MapShow").append('<li class="MapType" onclick="init()" style="cursor: pointer;font-size: 12px;width: 100px;display: inline-block;color: '+data[0].color+'"><a href="javascript:;" style="font-size: 12px;cursor:pointer" title="">地球</a></li>')
        $(".qhPingMian").hide();
        // 获取下拉框的 DOM 元素
       $.post("/hxzkuwb/qiehuanditu_option.do",function (data){
            if (data.length == 1){
                $(".qhPingMian").hide();
            }else{
                for (var i = 0 ; i < data.length;i++){
                    var mapname = data[i].mapname.split('.')
                    $("#mySelect").append('<option style="color: black" value="'+data[i].floor+'">'+mapname[0]+'</option>')
                }
            }
       })
    })

    // $(".Ditu").click(function (){
    //     $(".MapShow").empty();
    //     layer.tips('操作成功','.Ditu');
@@ -509,9 +499,9 @@
    table.on('tool(warning)', function(obj){
        var data = obj.data;
        $("#warningid").val(data.objectid)
        console.log(data.type)
        $("#warningidtype").text(data.type)
        $("#warningMsg").show();
        $("#idwar").val(data.id);
        layer.msg('操作成功')
    })
});
@@ -596,9 +586,6 @@
    ]
};
option && myChart.setOption(option);



function tubiaotongji() {
    var tu = [];

@@ -628,6 +615,10 @@
    var username = $(".kahao").text();
    var context = $("#context1").val();
    var data = "username="+username1+"&context="+context+"&tagid="+username
    if (context.length <2 || context.length >30){
        layer.msg('当前输入内容有误，字符长度不能小于2并且不能大于30')
        return;
    }
    $.get("/hxzkuwb/sendMsg",data,function(data){

    })
@@ -642,6 +633,16 @@
    if(username == "" || username == null){
        layer.msg("请输入设备ID")
    }else{
       if (username.length < 2){
           layer.msg('当前输入内容有误，字符长度不能小于2')
           return
       }

        if (context.length <2 || context.length > 30){
            layer.msg('当前输入内容有误，字符长度不能小于2并且不能大于30')
            return;
        }

        var dts = "username="+username1;
        $.get("/hxzkuwb/findUserRole",dts,function (data){
            if(data.juese=="访客"){
@@ -679,3 +680,150 @@
        window.location='../index.jsp'
    }
},2000)


setInterval(function (){
    if (localStorage.getItem("KuangXuan") != null && localStorage.getItem("KuangXuan1") == "true"){
        $("#JianZhuMsg").empty();
        KuangXuanPerson()
    }
    var SanWei = localStorage.getItem("SanWei_JianZhu")
    if (SanWei != null){
        $("#JianZhuMsg").animate({right: '-1%'}, 500);

    }else{
        $("#JianZhuMsg").animate({right: '-25%'}, 500);

    }
    if (localStorage.getItem("DiaoYong_SanWeiFlOoor")!= null){
        $("#JianZhuMsg").empty();
        SanWeiJianZhuXinXi();
    }
},1000)


function SanWeiJianZhuXinXi(){
    var FID= localStorage.getItem("SanWei_JianZhuFID");
    var Name= localStorage.getItem("SanWei_JianZhu");
    console.log(FID)
    //根据FID查询他的楼层
    var data = "fid="+FID
    var num = "";
    $.get("/hxzkuwb/FindTongJiAreaList",data,function (data){
        if (data.dangerlevel == 1){
            data.dangerlevel = "甲类"
        }
        if (data.dangerlevel == 2){
            data.dangerlevel = "乙类"
        }
        if (data.dangerlevel == 3){
            data.dangerlevel = "丙类"
        }
        if (data.dangerlevel == 4){
            data.dangerlevel = "丁类"
        }
        if (data.dangerlevel == 5){
            data.dangerlevel = "戊类"
        }
        $("#JianZhuMsg").append('<div style="margin-top: 15%;margin-bottom:5%;margin-left: 5%;width: 85%"><h2 style="margin-top: 0%;display: inline-block;;color: white;font-size: 14px" id="JzMc">'+Name+'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;区域等级：'+data.dangerlevel+'</h2><h2 style="margin-top: 0%;display: inline-block;float: right;color: white;font-size: 14px">总人数：<span id="zongnumes"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img onclick="GuanBiMsg()" src="../Home/HomeImg/clos.png" style="cursor:pointer;width: 20px;height: 20px;"></h2></div>')
        for (var i = 1 ; i <= data.floornum; i++){
            $("#JianZhuMsg").append('' +
                '<div id="LouCeng'+i+'"  style="overflow-x: hidden;overflow-y: scroll;height: 5%;margin-top: 7%;margin-left: 5%;width: 94%">' +
                '<h2 style="display: inline-block;font-weight: bold;color: black;font-size: 15px">当前楼层：'+i+'层</h2>' +
                '<h2 style="margin-top: 0%;display: inline-block;font-weight: bold;color: black;font-size: 14px;margin-left: 30%">人数：<span id="numes'+i+'" style="display: inline-block;width: 10%">0</span></h2>' +
                '<h2 style="display: inline-block;font-size: 14px;font-weight: bold;margin-left: 10%;cursor:pointer;"  onclick="LouCeng('+i+')">展开/合并</h2><img style="width: 20px;height: 20px;" src="../Home/HomeImg/xiala.png"> ' +
                '<div style="margin-top: 5%;margin-left: 1%;width: 90%;">' +
                '<div class="layui-collapse" id="floor'+i+'"></div>')
        }
        num = data.floornum;
    })
    var data ="baoliu39="+FID;
   $.get("/hxzkuwb/findSanWeiFloorPerson",data,function (data){
        var floor1 = 0;
        var floor2 = 0;
        var floor3 = 0;
        var floor4 = 0;
        var floor5 = 0;
        var floor6 = 0;
       for (var i = 0; i < data.length;i++){
           if(data[i].pfloor == "0"){
               $("#floor1").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right">编号：'+data[i].ptagid+'</span></h2>')
            floor1++;
               $("#numes1").text(floor1)
           }
           if(data[i].pfloor == "1") {
               $("#floor2").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right">编号：'+data[i].ptagid+'</span></h2>')
               floor2++;
               $("#numes2").text(floor2)

           }
           if (data[i].pfloor == "2") {
               $("#floor3").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right">编号：'+data[i].ptagid+'</span></h2>')
               floor3++;
               $("#numes3").text(floor3)

           }
           if (data[i].pfloor == "3") {
               $("#floor4").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right">编号：'+data[i].ptagid+'</span></h2>')
               floor4++;
               $("#numes4").text(floor4)

           }
           if (data[i].pfloor == "4") {
               $("#floor5").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right">编号：'+data[i].ptagid+'</span></h2>')
               floor5++;
               $("#numes5").text(floor5)

           }
           if (data[i].pfloor == "5") {
               $("#floor6").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right">编号：'+data[i].ptagid+'</span></h2>')
               floor6++;
               $("#numes6").text(floor6)

           }
       }
       var zong = floor1+floor2+floor3+floor4+floor5+floor6;
       $("#zongnumes").text(zong+"人")
   })
    localStorage.removeItem("DiaoYong_SanWeiFlOoor")
}

function LouCeng(num){
    var elementWidth = $("#LouCeng" + num).height();
    var parentWidth = $("#JianZhuMsg").parent().height();
    var widthPercentage = (elementWidth / parentWidth) * 100;
    console.log(widthPercentage);
    if (widthPercentage>80){
        $("#LouCeng"+num).animate({"height":"5%"},1000)
    }else{
        $("#LouCeng"+num).animate({"height":"85%"},1000)

    }
}
function GuanBiMsg(){
    localStorage.removeItem("SanWei_JianZhu")
}


function KuangXuanPerson(){
    var FIDS = localStorage.getItem("KuangXuan");
    var data = "FID="+FIDS
    $.get("/hxzkuwb/FindFIDPersons",data,function (data){
        var floor1 = 0;
        $("#JianZhuMsg").append('<div id="KuangNum" style="margin-top: 17%;margin-left: 5%;color: white"></div>')
        $("#JianZhuMsg").append('<div id="Kuanges" style="overflow-y: scroll;height: 85%;margin-top: 5%"></div>')
            for (var i = 0; i < data.length;i++){
                    $("#Kuanges").append('<div onclick="personMsgtid('+data[i].ptagid+')" class="layui-colla-item" style="background-color: rgba(255, 255, 255, 0)"><h2 class="layui-colla-title" style="background-color: rgba(255, 255, 255, 0)"><img src="HomeImg/PersonShi.png" style="width: 25px;height: 25px"/><span style="display: inline-block;margin-left: 20px">姓名：'+data[i].pname+'</span><span style="display: inline-block;float: right;margin-right: 5%">编号：'+data[i].ptagid+'</span></h2>')
                    floor1++;
            }
            $("#KuangNum").text("总人数："+floor1)
        localStorage.setItem("SanWei_JianZhu","111")
       setTimeout(function (){
           localStorage.setItem("KuangXuan1","false")
       },500)
    })
}