穿梭车、提升机、主控界面优化

Junjie

2023-04-14 f27968397dd2d37add528bf7937ebd6905762a09

 src/main/webapp/views/console.html

@@ -5,6 +5,7 @@
    <title>WCS控制中心</title>
    <link rel="stylesheet" href="../static/css/console.css">
    <link rel="stylesheet" href="../static/css/animate.min.css">
    <link rel="stylesheet" href="../static/css/toggle-switch.css">
    <script src="../static/js/jquery/jquery-3.3.1.min.js"></script>
    <script src="../static/js/layer/layer.js"></script>
    <script type="text/javascript" src="../static/js/common.js"></script>
@@ -38,35 +39,56 @@
        <div class="system-state">
            <div class="body-head">总开关</div>
            <div class="switch">
                <div id="system-icon" class="system-icon-open" onclick="systemSwitch()"></div>
                <label id="system-toggle" class="toggle-switch" style="margin-left: 20px;">
                    <input id="system-toggle-checked" checked="checked" type="checkbox">
                    <div class="button">
                        <div class="light"></div>
                        <div class="dots"></div>
                        <div class="characters"></div>
                        <div class="shine"></div>
                        <div class="shadow"></div>
                    </div>
                </label>

                <div class="switch_r">
                    <p>系统状态</p>
                    <p id="system-run-desc">系统运行中</p>
                </div>
            </div>
        </div>
        <!-- 堆垛机状态 -->
        <div class="machine-status">
            <div class="body-head">堆垛机状态</div>
        <!-- 四向穿梭车状态 -->
        <div class="line-status">
            <div class="body-head">穿梭车状态</div>
            <div class="state">
                <span>堆垛机 1</span>
                <span class="state-ss machine-put-flag   ">入库</span>
                <span>四向穿梭车 1</span>
                <span class="state-ss shuttle-idle">空闲</span>
            </div>
<!--            <div class="state">-->
<!--                <span>堆垛机 2</span>-->
<!--                <span class="state-ss machine-auto-flag   ">自动</span>-->

<!--            </div>-->
            <div class="state">
                <span>四向穿梭车 2</span>
                <span class="state-ss shuttle-idle">空闲</span>
            </div>
            <div class="button"><span>所有状态</span></div>
            <div class="button item-group">
                <span class="machine-put-flag">入库</span>
                <span class="machine-take-flag">出库</span>
                <span class="machine-stock-move-flag">库到库</span>
                <span class="machine-site-move-flag">站到站</span>
                <span class="machine-p-move-flag">PToP</span>
                <span class="machine-error-flag">异常</span>
                <span class="machine-auto-flag">自动</span>
                <span class="machine-unauto-flag">非自动/手动</span>
                <span class="shuttle-idle">空闲</span>
                <span class="shuttle-working">作业中</span>
                <span class="shuttle-waiting">等待确认</span>
                <span class="shuttle-charging">充电中</span>
                <span class="shuttle-charging-waiting">充电任务等待确认</span>
                <span class="shuttle-fixing">故障修复中</span>
            </div>
        </div>
        <!-- 提升机状态 -->
        <div class="line-status">
            <div class="body-head">提升机状态</div>
            <div class="state states">
                <span>提升机</span>
                <span class="state-ss shuttle-idle">空闲</span>
            </div>
            <div class="button"><span>所有状态</span></div>
            <div class="button item-group">
                <span class="lift-idle">空闲</span>
                <span class="lift-working">作业中</span>
                <span class="lift-waiting">等待确认</span>
            </div>
        </div>
        <!-- 输送线状态 -->
@@ -101,14 +123,6 @@
                    <li><span>条码名称</span><span class="right">扫码时间</span></li>
                </div>
                <div id="barcode2" class="table-body">

                </div>
            </div>
            <div class="tablebox">
                <div class="table-head">
                    <li><span>条码名称</span><span class="right">扫码时间</span></li>
                </div>
                <div id="barcode3" class="table-body">

                </div>
            </div>
@@ -758,7 +772,6 @@
    })



    var crn1Position = 0;
    var crn2Position = 0;
    var crn3Position = 0;
@@ -781,6 +794,12 @@
    setInterval(function () {
        getSitesInfo();
    }, 3000);

    $("#system-toggle").on("click",(e) => {
        systemSwitch()
        e.stopPropagation();//表示阻止向父元素冒泡
        e.preventDefault();//阻止 方法阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交或者a标签）。
    })

    // 系统运行开关
    function systemSwitch() {
@@ -813,11 +832,11 @@
                layer.close(index);
                if (res.code === 200){
                    if (res.data.status) {
                        $('#system-icon').attr("class", "system-icon-open");
                        $('#system-toggle-checked').attr("checked", true);
                        $('#system-run-desc').html("系统运行中...");
                        parent.systemRunning = true;
                    } else {
                        $('#system-icon').attr("class", "system-icon-close");
                        $('#system-toggle-checked').attr("checked", false);
                        $('#system-run-desc').html("系统已停止!");
                        parent.systemRunning = false;
                    }