野心家
2023-10-27 77c5a9937bd6a2ffbb2a45c10fa5d65d66015397
src/main/webapp/views/monitor/index.html
@@ -15,7 +15,7 @@
        <div class="head">
            <div class="head-title">自动仓库监控平台</div>
            <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>
                <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>
            </div>
        </div>
        <div class="body">
@@ -23,7 +23,7 @@
                <div class="box">
                    <div class="box-title">测试状态</div>
                    <div class="box-body">
                        <div class="table-head" style="display: flex"><div style="flex: 1">库位号</div><div style="flex: 1">库位状态</div><div style="flex: 1">包号</div><div style="flex: 1">测试状态</div></div>
                        <div class="table-head" style="display: flex"><div style="flex: 1">库位号</div><div style="flex: 1">库位状态</div><div style="flex: 3">包号</div><div style="flex: 1">测试状态</div></div>
                        <div class="swiper" style="height: 85%">
                            <div class="swiper-wrapper table-item">
                            </div>
@@ -42,13 +42,7 @@
                </div>
                <div class="box">
                    <div class="box-title">合格率</div>
                    <div style="display: flex;"class="box-body">
                        <div class="box-body" id="barLabelRotation"></div>
                        <!--<div class="box-body3" >-->
                        <!--    <div class="percentage" id="thisWeek">60%</div>-->
                        <!--    <div class="percentage" id="lastWeek">40%</div>-->
                        <!--</div>-->
                    </div>
                    <div class="box-body" id="barLabelRotation"></div>
                </div>
            </div>
        </div>
@@ -56,8 +50,51 @@
</body>
</html>
<script>
    let url = 'http://192.168.4.34:8080/fnwms'
    var item = []
    // 左
    $('.time-tools').click(function () {
        exitFull();
    });
    $('.head-title').click(function () {
        full();
    });
    //开始全屏
    function full() {
        var docElm = document.documentElement;
        //W3C
        if (docElm.requestFullscreen) {
            docElm.requestFullscreen();
        }
        //FireFox
        else if (docElm.mozRequestFullScreen) {
            docElm.mozRequestFullScreen();
        }
        //Chrome等
        else if (docElm.webkitRequestFullScreen) {
            docElm.webkitRequestFullScreen();
        }
        //IE11
        else if (elem.msRequestFullscreen) {
            elem.msRequestFullscreen();
        }
    }
    //退出全屏
    function exitFull() {
        if (document.exitFullscreen) {
            document.exitFullscreen();
        }
        else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        }
        else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        }
        else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }
    let url = 'http://10.12.55.200:8080/fnwms'
    var item = [{locNo: '1',locSts: '1',mk: '1',packStatus$: '1'}]
    var year = '2020';
    var month = '05';
    var day = '01';
@@ -77,16 +114,28 @@
        setDate();
    },1000)
    setInterval(()=>{
        //location.reload()
    },10000)
        location.reload()
    },600000)
    function initTest() {
        console.log(item)
        var box = ''
        var el
        var len = item.length
        var autoplay = true
        var css = 'table-td'
        if (len == 0) {
            box = "<div class='swiper-none'>暂无测试数据</div>"
        } else if (len < 5) {
            var itemInfo = {locNo: '',locSts: '',mk: '',packStatus$: ''}
            for (var j = 0; j < 5-len;j++) {
                css = 'table-td2'
                autoplay = false
                item.push(itemInfo)
            }
        }
        for (var i = 0; i < item.length; i++) {
            el = "<div class='swiper-slide table-td'><div style='flex: 1'>"
            el = "<div class='swiper-slide "+ css + " '><div style='flex: 1'>"
                + item[i].locNo + "</div><div style='flex: 1'>"
                + item[i].locSts  + "</div><div style='flex: 1'>"
                + item[i].locSts  + "</div><div style='flex: 3'>"
                + item[i].mk  + "</div><div style='flex: 1'>"
                + item[i].packStatus$
                + "</div></div>"
@@ -96,7 +145,7 @@
        var mySwiper = new Swiper ('.swiper', {
            direction: 'vertical', // 垂直切换选项
            loop: true, // 循环模式选项
            autoplay:true,
            autoplay:autoplay,
            slidesPerView: 5,
        })
    }
@@ -108,13 +157,12 @@
        $('#bar-hour').text(hour);
        $('#bar-minute').text(minute);
        $('#bar-second').text(second);
        $('#bar-week').text(week);
    }
    /**
     * 获取时间
     */
    function getDate() {
        http.get("http://localhost:9090/fnwcs/monitor/date", null, function (res) {
        http.get("http://10.12.55.200:8080/fnwcs/monitor/date", null, function (res) {
            if (res.code === 200){
                year = res.data.year;
                month = res.data.month;
@@ -147,7 +195,7 @@
            }
        },
        legend: {
            textStyle:{color:'#FFF'},
            textStyle:{color:'#FFF',},
        },
        grid: {
            left: '3%',
@@ -163,7 +211,7 @@
                        color: '#FFF'
                    }
                },
                data: ['其他', '测试库位', '静置库位', '测试前暂存库为', '测试失败库位']
                data: ['测试库位', '静置库位', '暂存库位', 'NG库位']
            }
        ],
        yAxis: [
@@ -232,7 +280,7 @@
            }
        },
        legend: {
            textStyle:{color:'#FFF'},
            textStyle:{color:'#FFF',fontSize:14},
        },
        grid: {
            left: '3%',
@@ -261,26 +309,27 @@
            {
                name: '合格',
                type: 'bar',
                itemStyle: {
                  normal: {
                      label: {
                          show: true,
                          position: 'top'
                      }
                  }
                stack: 'Ad',
                label: {
                    show: true,
                    fontSize: 16,
                    fontWeight: 'bold',
                    position: 'top',
                    color: '#FFF',
                    offset: [15,5],
                },
                z:99,
                barWidth:'50%',
                data: [10, 1]
            },
            {
                name: '不合格',
                type: 'bar',
                itemStyle: {
                    normal: {
                        label: {
                            show: true,
                            position: 'top'
                        }
                    }
                stack: 'Ad',
                label: {
                    show: true,
                    fontSize: 14,fontWeight: 'bold',
                    position: 'top',offset: [-15,5],
                },
                data: [9, 3]
            }
@@ -298,10 +347,9 @@
        legend: {
            icon: 'roundRect',
            data: ['出库', '入库'],
            textStyle:{color:'#FFF'},
            textStyle:{color:'#FFF',fontSize:14},
        },
        grid: { // 图表距离边框的距离,可用百分比和数字(px)配置
            top: '20%',
            left: '3%',
            right: '5%',
            bottom: '5%',
@@ -409,7 +457,6 @@
            }
        });
    }
    function initBasicInformation() {
        $.ajax({
            url: url+"/mobile/pack/basic/information",
@@ -420,7 +467,7 @@
                    for (var i = 0; i < res.data.length; i++) {
                        array.push(res.data[i])
                    }
                    item =  array
                    item = array
                }
            }
        });