#

luxiaotao1123

2022-12-16 261a155bfc3dd5b51c207af23b3ef631253dcfd6

 src/main/webapp/views/console.html

@@ -16,15 +16,27 @@
        <h6>AUTOMATIC WAREHOUSE WCS MONITORING DIAGRAM</h6>
    </header>
    <main class="main">
        <!--第1列（宽度 70px） -->
<!--        <div class="site-row site-row-1">-->
<!--            <div class="site-k" style="height:39px;width:70px;"></div>-->
<!--            <div id="site-173" class="site" style="height: 18px;line-height: 18px;margin-bottom: 85px">173</div>-->
<!--        </div>-->
        <!-- 1F -->
        <div class="site-row site-row-title site-row-title-1">
            <span>1F</span>
        </div>
        <!--第1列 -->
        <div class="site-row site-row-1">
            <div id="site-102" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 340px">102</div>

            <div id="site-101" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 20px">101</div>

            <div id="site-100" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 184px">100</div>
        </div>
        <!--第2列-->
        <div class="site-row site-row-2">
            <div id="site-1000" class="site" style="height: 18px;line-height: 18px;">1000</div>
            <div id="site-2000" class="site" style="height: 18px;line-height: 18px;">2000</div>
            <!-- 台车轨道 -->
            <div id="car-track-1" class="car-track">
                <div></div>
            </div>
            <!-- 台车实例 -->
            <div id="site-1000" class="site car" style="top: 584px">1000</div>
            <div id="site-2000" class="site car" style="top: 0">2000</div>
        </div>
        <!-- 第3列 -->
        <div class="site-row site-row-3">
@@ -55,6 +67,33 @@

            <div id="site-104" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 184px">104</div>
            <div id="site-105" class="site" style="height: 18px;line-height: 18px;width:80px;">105</div>
        </div>

        <!-- 2F -->
        <div class="site-row site-row-title site-row-title-2">
            <span>2F</span>
        </div>

        <div class="site-row site-row-5">
            <div id="site-203" class="site" style="height: 18px;line-height: 18px;width:80px;">203</div>
            <div id="site-202" class="site" style="height: 18px;line-height: 18px;width:80px;">202</div>
            <div id="site-200" class="site" style="height: 18px;line-height: 18px;width:80px;">200</div>
        </div>

        <div class="site-row site-row-6">
            <div id="site-204" class="site" style="height: 18px;line-height: 18px;width:80px;">204</div>
            <div id="site-201" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 20px">201</div>
        </div>

        <div class="site-row site-row-7">
            <div id="site-205" class="site" style="height: 18px;line-height: 18px;width:80px;">205</div>
        </div>

        <div class="site-row site-row-8">
            <div id="site-209" class="site" style="height: 18px;line-height: 18px;width:80px;">209</div>
            <div id="site-208" class="site" style="height: 18px;line-height: 18px;width:80px;">208</div>
            <div id="site-207" class="site" style="height: 18px;line-height: 18px;width:80px;">207</div>
            <div id="site-206" class="site" style="height: 18px;line-height: 18px;width:80px;">206</div>
        </div>

        <!-- 货架 + 堆垛机 + 入库站点 -->
@@ -1334,18 +1373,21 @@
                        tData1 = tData
                    } else if (tData.length<=10){
                        tData1 = tData.slice(0,5)
                        tData.splice(0,5)
                        tData2 = tData
                        // tData.splice(0,4)
                        tData2 = tData.splice(5,10)
                    } else if(tData.length<=15){
                        tData1 = tData.slice(0,5)
                        tData2 = tData.slice(6,10)
                        tData.splice(0,10)
                        tData3 = tData
                        tData2 = tData.slice(5,10)
                        // tData.splice(0,10)
                        tData3 = tData.slice(10,15)
                    } else {
                        tData = tData.slice(-15)
                        tData1 = tData.slice(-15)
                        tData2 = tData.slice(-10)
                        tData3 = tData.slice(-5)
                        tData1 = tData.slice(0,5)
                        tData2 = tData.slice(5,10)
                        tData3 = tData.slice(10,15)
                        // tData = tData.slice(-15)
                        // tData1 = tData.slice(-15)
                        // tData2 = tData.slice(-10)
                        // tData3 = tData.slice(-5)

                    }
                }
@@ -1356,8 +1398,6 @@
        getCodeData();
        renderBarCode();
    }, 1000)




    function renderBarCode() {
@@ -1374,6 +1414,61 @@
            $('#barcode3').append(str3)
        }
    }

    // 小车偏移动画
    function carAnimate(id, target) {
        if (id === 1000) {
            let targetTop = 130;
            switch (target) {
                case 110:
                    targetTop += 0;
                    break;
                case 109:
                    targetTop += 60;
                    break;
                case 108:
                    targetTop += 100;
                    break;
                case 107:
                    targetTop += 180;
                    break;
                case 106:
                    targetTop += 220;
                    break;
                default:
                    return;
            }
            $("#site-" + id).animate({top: targetTop+'px'}, 1000);
        } else if (id === 2000) {
            let targetTop = 130;
            switch (target) {
                case 226:
                    targetTop += 0;
                    break;
                case 225:
                    targetTop += 60;
                    break;
                case 224:
                    targetTop += 100;
                    break;
                case 223:
                    targetTop += 180;
                    break;
                case 222:
                    targetTop += 220;
                    break;
                case 214:
                    targetTop += 280;
                    break;
                case 220:
                    targetTop += 320;
                    break;
                default:
                    return;
            }
            $("#site-" + id).animate({top: targetTop+'px'}, 1000);
        }
    }
</script>
<script type="text/javascript">
    // 弹窗站点信息