#

whycq

2023-03-29 44f10e71d146093d1a90afb13c0cb1af930349f4

#

 src/main/webapp/views/monitor.css

@@ -53,8 +53,14 @@
    height: 100%;
    /*background-color: #f1f1f1;*/
    color: #ffffff;

}
.aData {
    display: flex;
}
.bData {
    display: none;
}
.canves-header {
    position: relative;
    height: 10%;

 src/main/webapp/views/monitor.html

@@ -41,17 +41,29 @@
                    <!--<div class="time-tools">-->
                    <!--    <span id="bar-year"></span>-<span id="bar-month"></span>-<span id="bar-day"></span> <span id="bar-hour"></span>:<span id="bar-minute"></span>:<span id="bar-second"></span>&nbsp;&nbsp;<span id="bar-week"></span>-->
                    <!--</div>-->
                    <div class="canves1">
                        <div style="width: 25%;height: 100%;font-size: 30px;display: flex;flex-direction: column;justify-content: space-around;display: none">
                    <div class="canves1 aData">
                        <div style="width: 25%;height: 100%;font-size: 30px;display: flex;flex-direction: column;justify-content: space-around;">
                            <div style="width: 100%;height: 100px;line-height: 100px;text-align: center">累计行走：10869米</div>
                            <div style="width: 100%;height: 100px;line-height: 100px;text-align: center">累计行走：10869米</div>
                            <div style="width: 100%;height: 100px;line-height: 100px;text-align: center">累计行走：10869米</div>
                            <div style="width: 100%;height: 100px;line-height: 100px;text-align: center">累计行走：10869米</div>
                        </div>
                        <div id="ledData" style="width: 50%;height: 100%;font-size: 30px;display: flex;flex-direction: column;justify-content: space-around;background-color: #93D1FF;text-align: center;display: none">
                        <div id="ledData" style="width: 50%;height: 100%;font-size: 30px;display: flex;flex-direction: column;justify-content: space-around;background-color: #93D1FF;text-align: center;">
                            AUTOMATIC WAREHOUSE WCS MONITORING DIAGRAM
                        </div>
                        <div id="ledData1" style="width: 100%;height: 100%;font-size: 30px;display: flex;flex-direction: column;background-color: #93D1FF;">
                        <div style="width: 25%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;">
                            <div style="width: 80%;height: 40%">
                                <div id="line-charts"></div>
                            </div>
                            <div style="width: 80%;height: 40%">
                                <div id="pie-charts"></div>
                            </div>
                        </div>

                    </div>
                    <div class="canves1 bData">
                        <!--展示出库信息-->
                        <div id="ledData4" style="width: 100%;height: 100%;font-size: 30px;display: flex;flex-direction: column;background-color: #93D1FF;display: none">
                            <div class="info-head">
                                <!--头部-->
                                <div style="flex: 2">托盘码:80001289</div>
@@ -66,14 +78,6 @@
                                <div style="flex: 2">西瓜</div>
                                <div style="flex: 2">500g</div>
                                <div style="flex: 1">30</div>
                            </div>
                        </div>
                        <div style="width: 25%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;display: none">
                            <div style="width: 80%;height: 40%">
                                <div id="line-charts"></div>
                            </div>
                            <div style="width: 80%;height: 40%">
                                <div id="pie-charts"></div>
                            </div>
                        </div>
                    </div>
@@ -355,21 +359,25 @@
</html>
<script>
    var inputValue = ''
    // lcd切换按钮
    $(function() {
        $(".label").click(function() {
            $(this).addClass("abc").siblings().removeClass("abc");
        });
    });
    // 全选按钮
    $("#selectAll").click(function(){
        $('input:checkbox[name=monitor]').each(function () {
            $(this).prop("checked",true);
        })
    });
    // 取消全选按钮
    $("#unSelectAll").click(function(){
        $('input:checkbox[name=monitor]').each(function () {
            $(this).prop("checked",false);
        })
    });
    // 发送节目按钮
    $('#sendMessage').click(function () {
        var sendMessage = $('#sendContent').val()
        inputValue = ''
@@ -386,6 +394,7 @@
        })

    })
    // 移除节目按钮
    $('#removeMessage').click(function () {
        var sendMessage = 'K'
        $('input:checkbox[name=monitor]').each(function () {
@@ -432,11 +441,11 @@
    $('.lcd').click(function () {
        var id = this.id.split("-")[1];
        switch (id) {
            case 1:
            case '1':
                crnId = 1;
                lcdId = 100;
                break;
            case 2:
            case '2':
                crnId = 2;
                lcdId = 110;
                break;
@@ -454,48 +463,63 @@
        getProgram(lcdId)
    }, 1000);


    // 出库信息
    function getInfo(ledId) {
        console.log(ledId)
        $.ajax({
            url: baseUrl+"/monitor/led",
            data: {ledId:ledId},
            method: 'GET',
            success: function (res) {
                if (lcdControll == 3) {
                    $('#ledData')
                if (lcdControll < 3) {
                    $('.aData').attr('display','none')

                }
            }
        });
    }

    // 异常信息
    function getError(ledId) {
        $.ajax({
            url: baseUrl+"/monitor/led/error",
            data: {ledId:ledId},
            method: 'GET',
            success: function (res) {
                if (lcdControll == 2) {
                    $('#ledData').text(res.data)
                if (lcdControll < 4) {
                    if (res.data == null) {
                        lcdControll = 0
                    } else {
                        lcdControll = 3
                        $('.bData').attr('display','none')
                        $('.aData').attr('display','flex')
                        $('#ledData').text(res.data)
                        console.log('**')
                    }
                }
            }
        });
    }

    // 节目信息
    function getProgram(ledId) {
        console.log(ledId)
        $.ajax({
            url: baseUrl+"/monitor/led/program",
            data: {ledId:ledId},
            method: 'GET',
            success: function (res) {
                console.log(res)
                if (res.data != '') {
                    lcdControll = 4
                    $('.bData').attr('display','none')
                    $('.aData').attr('display','flex')
                    $('#ledData').text(res.data)
                } else {
                    lcdControll = 0
                    console.log("2222")
                }
            }
        });
    }





    /***********************************************************************************/
    /************************************ 堆垛机速度 *************************************/