zy-wcs.git - Gitblit

parent: b20aaa67 | 补丁 | 提交 | ignore whitespace

luxiaotao1123

2023-02-15 05568de30fe834365d4c45277b76bbee9cb2a9d7

5个文件已修改

4个文件已添加

	src/main/webapp/static/css/pipeline.css	4 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/static/css/render.css	529 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/static/images/zy-logo.png	补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/static/js/console.js	181 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/static/js/console.map.js	472 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/console.html	986 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/crn.html	7 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/pipeline.html	8 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/ste.html	24 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史

 src/main/webapp/static/css/pipeline.css

@@ -50,14 +50,16 @@
    border-width: 1px;
    border-style: solid;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.io-mode-oper legend {
    text-align: center;
    padding: 0 10px;
    font-size: 16px;
    font-weight: 300;
}

}


/* 站点表格 */

 src/main/webapp/static/css/render.css

New file
@@ -0,0 +1,529 @@
* {
    margin: 0;
    padding: 0;
    overflow: hidden;
}
body {
    height: 1080px;
    width: 1920px;
}
#main {
    height: 100%;
    width: 100%;
    background-color: rgb(108,167,168);
}
.head {
    height: 10%;
    width: 100%;
    color: #FFFFFF;
}
.head-left {
    height: 100%;
    width: 20%;
    display: inline-block;
}
.head-right {
    height: 100%;
    width: 30%;
    display: inline-block;
    float: right;
}
.head h1 {
    display: inline;
    margin-top: 2%;
    margin-left: 2%;
    font-weight: 400;
    letter-spacing:3px;
}
.head h6 {
    display: inline;
    margin-left: 2%;
    font-weight: 400;
}

img {
    float: right;
    margin-top: 10px;
    margin-right: 10px;
}
.rack {
    position: absolute;
    display: inline-block;
}
.rackDescs {
    height: 100%;
    width: 100%;
    position: absolute;
    display: inline-block;
    text-align: center;
}
.stn {
    text-align: center;
    background-color: rgb(120,255,129);
    position: absolute;
}
.crn {
    position: absolute;
    display: inline-block;
    background-color: #00ff90;
    z-index: 999;
}
.track {
    position: absolute;
    display: inline-block;
    background-color: #000000;
    z-index: 5;
}
.item {
    border: 1px solid rgb(194,76,65);
    color: rgb(194,76,65);
    height: 100%;
    width: 100%;
}

.floorBtn {
    position: absolute;
    border-radius: 5px;
    left: 1750px;
    width: 90px;
    height: 40px;
    color: #ffffff;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 5px;
    cursor:pointer;
    transition: all 0.3s ease;
    font-family: 'Lato', sans-serif;
    background: transparent;
    box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5), 7px 7px 20px 0px rgba(0, 0, 0, 0.1),
    4px 4px 5px 0px rgba(0, 0, 0, 0.1);
}
/* 16 */
.btn-16 {
    border: none;
    color: #fff;
}
.btn-16:after {
    position: absolute;
    content: '';
    width: 0;
    height: 100%;
    top: 0;
    left: 0;
    direction: rtl;
    z-index: -1;
    box-shadow: -7px -7px 20px 0px #fff9, -4px -4px 5px 0px #fff9, 7px 7px 20px 0px #0002,
    4px 4px 5px 0px #0001;
    transition: all 0.3s ease;
}
.btn-16:hover {
    color: #323131;
}
.btn-16:hover:after {
    left: auto;
    right: 0;
    width: 100%;
}
.btn-16:active {
    top: 2px;
}






/*操作显示栏*/
#body {
    width: 100%;
    height: 23%    ;
    position: absolute;
    bottom: 2.5%;
}
/* 控制开关 */
.system-state {
    display: inline-block;
    width: 15%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 15px;
    margin-left: 1%;
}
/* 堆垛机状态 */
.machine-status {
    display: inline-block;
    width: 15%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 15px;
    margin-left: 1%;
}
.state-ss {
    margin-left: 60px;

}

/* 输送线状态 */
.line-status {
    display: inline-block;
    width: 15%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 15px;
    margin-left: 1%;
}
.line-ss {
    display: inline-block;
    float: right;
    height: 15px;
    width: 40px;
    margin-top: 10px;
    margin-right: 15px;
    line-height: 15px;
    text-align: center;
    background-color: rgba(5, 5, 5, 0.3);
    color: #ffdd00;
}
/* 条码扫描器 */
.bar-code {
    display: inline-block;
    width: 49%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 15px;
    margin-left: 1%;
}
/*扫码表单*/
.tablebox {
    display: inline-block;
    width: 290px;
    height: 162px;
    margin-left: 1.5%;
    color: white;
    font-size: 14px;
    list-style: none;
    line-height: 27px;
    text-indent: 10px;
}
.table-head {
    width: 100%;
    height: 27px;
    background:linear-gradient(to right, rgb(94, 193, 184),rgb(12,71,63));
}
.right {
    float: right;
    text-indent: 10px;
    padding-right: 10px;
}
.table-body li {
    background-color: #5D7677;
}
.table-body li:nth-child(even) {
    background-color: #4A6565;
}



/* 控制表头 */
.body-head {
    height: 35px;
    width: 100%;
    background-image: url(../images/status_bar_1.png);
    background-repeat: no-repeat;
    margin-left: 5%;
    margin-top: 20px;
    text-indent: 25px;
    color: white;
}


.system-icon-open {
    width: 153px;
    height: 153px;
    background-image: url(../images/start48.png);
    display: inline-block;
}
.system-icon-close {
    width: 153px;
    height: 153px;
    background-image: url(../images/stop48.png);
    display: inline-block;
}
.switch_r {
    color: #FFFFFF;
    font-size: 14px;
    width: 130px;
    height: 153px;
    float: right;
    padding-top: 30px;
}
#system-run-desc {
    font-size: 20px;
    margin-top: 15px;
}
.state {
    height: 34px;
    width: 200px;
    background-color: rgba(255,255,255,0.1);
    background-image: url(../images/stacker.png);
    background-repeat: no-repeat;
    border-radius: 17px 0 0 17px;
    padding-left: 50px;
    line-height: 34px;
    margin-bottom: 10px;
    margin-left: 5%;
    color: #FFFFFF;
    font-size: 10px;
}
.states {
    background-image: url(../images/line.png);
    margin-bottom:54px;
}
.button {
    margin-left: 5%;
    font-size: 14px;
    color: #FFFFFF;
}
/* 站点 */
.site {
    position: absolute;
    color: #333;
    cursor: pointer;
    text-align: center;
    background-color: rgb(120,255,129);
    font-size: 14px;
    z-index: 9;
}
/*空站点*/
.site-k {
    border: 1px solid rgb(108,167,168);
    background-color: rgb(108, 167, 168);
}
/* 入库 */
.machine-put-flag {
    padding: 0 10px;
    background-color: rgb(163,214,242);
}
/* 出库 */
.machine-take-flag {
    padding: 0 10px;
    background-color: rgb(151,180,0);
}
/* 库到库 */
.machine-stock-move-flag {
    padding: 0 10px;
    background-color: rgb(58,77,249);
}
/* 站到站 */
.machine-site-move-flag {
    padding: 0 10px;
    background-color: rgb(240,140,10);
}
/* PToP */
.machine-p-move-flag {
    padding: 0 10px;
    background-color: rgb(29,152,23);
}
/* 异常 */
.machine-error-flag {
    padding: 0 10px;
    background-color: rgb(252,48,48);
}
/* 自动 */
.machine-auto-flag {
    padding: 0 10px;
    background-color: rgb(132,255,115);
}
/* 非自动/手动 */
.machine-unauto-flag {
    padding: 0 10px;
    background-color: rgb(184,184,184);
}
/* 自动+有物+ID */
.site-auto-run-id {
    background-color: rgb(252,48,48);
}
/* 自动+有物 */
.site-auto-run {
    background-color: rgb(250,81,246);
}
/* 自动+ID */
.site-auto-id {
    background-color: rgb(196,196,0);
}
/* 自动 */
.site-auto {
    background-color: rgb(120,255,129);
}
/* 非自动/手动 */
.site-unauto {
    background-color: rgb(184,184,184);
}
#code {
    background-image: url(../images/status_bar_2.png);
    background-repeat: no-repeat;
    margin-left: 2%;
}
/* 堆垛机 */
.machine {
    position: absolute;
    background-color: rgb(108,167,168);
    /*margin-left: 1116px;*/
    height: 20px;
    width: 80px;
    background-image: url("../images/Crane_auto.png");
    background-repeat: no-repeat;
    background-size:100% 100%;
    background-position: top center;
    cursor: pointer;
    z-index: 99;
}
/* 入库 */
.machine-pakin {
    background-image: url("../images/Crane_store.png");
}
/* 出库 */
.machine-pakout {
    background-image: url("../images/Crane_retrieve.png");
}
/* 库到库 */
.machine-stock-move {
    background-image: url("../images/Crane_loctoloc.png");
}
/* 站到站 */
.machine-site-move {
    background-image: url("../images/Crane_stntostn.png");
}
/* p to p */
.machine-p-move {
    background-image: url("../images/Crane_hptoohp.png");
}
/* 异常 */
.machine-error {
    background-image: url("../images/Crane_error.png");
}
/* 自动 */
.machine-auto {
    background-image: url("../images/Crane_auto.png");
}
/* 非自动/收到 */
.machine-un-auto {
    background-image: url("../images/Crane_manual.png");
}

/* 堆垛机弹窗 */
#crnWindow {
    width: 291px;
    height: 365px;
    background-image: url(../images/Popup-yellow.png);
    position: fixed;
    color:white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 101;
}
/* 输送设备弹窗 */
#siteWindow {
    width: 291px;
    height: 336px;
    background-image: url(../images/Popup-green.png);
    position: fixed;
    color:white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 101;
}
#siteWindow-head {
    width: 291px;
    height: 55px;
    line-height: 55px;
    margin-left: 25px;
    color: #000000;
    font-weight: 700;
    letter-spacing: 2px;
}
#siteWindow-head .detailed {
    display: inline-block;
}
#siteWindow-head button {
    width: 25px;
    height: 25px;
    padding: 0px;
    border: none;
    border-radius: 25px;
    background-image: url(../images/siteclose.png);
    display: inline-block;
    float: right;
    margin-top: 15px;
    margin-right: 50px;
}
#crnWindow-head {
    width: 291px;
    height: 55px;
    line-height: 55px;
    margin-left: 55px;
    color: #000000;
    font-weight: 700;
    letter-spacing: 2px;

}
#crnWindow-head .detailed {
    display: inline-block;
}
#crnWindow-head button {
    width: 25px;
    height: 25px;
    padding: 0px;
    border: none;
    border-radius: 25px;
    background-image: url(../images/siteclose.png);
    display: inline-block;
    float: right;
    margin-top: 15px;
    margin-right: 80px;
}



/* 弹窗 */
form .form-item {
    display: inline-block;
    padding-left: 10px;
}
form .form-item-label {
    display: inline-block;
    width: 90px;
    font-size: 10px;
}
form .form-item-input {
    display: inline-block;
    width: 180px;

}
form .form-item-input input {
    background-color: rgba(255,255,255,.3);
    color: #FFFFFF;
    padding: 0;
    border: none;
    border-radius: 2px;
    height: 18px;
    padding-left: 10px;
}
/* checkbox */
form .form-item-checkbox {
    display: inline-block;
    padding-left: 10px;
    width: 20%;
}
form .form-item-label-checkbox {
    display: inline-block;
    width: auto;
    font-size: 14px;
}
form .form-item-input-checkbox {
    display: inline-block;
    width: auto;

}

 src/main/webapp/static/images/zy-logo.png


 src/main/webapp/static/js/console.js

New file
@@ -0,0 +1,181 @@
// 库位图
let total = [],
    rack = '',
    racks = '',
    rackDesc = '',
    rackDescs = '',
    crn = '',
    crns = '',
    track = '',
    tracks = '',
    stn = '',
    stns = '',
    stnArr = [],
    floorBtn = '',
    floorBtns = '',
    floorBtnss = '',
    floorInfo='';  // 库区信息
let rackss = mapInfo.racks,
    rackDescss = mapInfo.rackDescs,
    crnss = mapInfo.crns,
    areas = mapInfo.areas[0].floors,
    floorId;
function getMap() {
    // 货架
    for (let i = 0;i < rackss.length;i++) {
        let bay ='' // 单个库位
        let bays = '' // 库位集合
        let maxBayNo = rackss[i].maxBayNo // 最大库位号
        let minBayNo = rackss[i].minBayNo // 最小库位号
        let bLen
        let interval // 间隔数

        if (maxBayNo<35) {
            interval = 1
            bLen = maxBayNo / interval // 库位个数
        } else {
            interval = 2
            bLen = maxBayNo / interval // 库位个数
        }
        let bayWidth // 单个库位宽度
        let bNum // 库位号码

        if (minBayNo % 2 == 0) { // 从2开始
            if(interval == 1) {
                bLen = bLen - 1
            } else if (interval == 2) {
                if (maxBayNo % 2 == 0) { // 偶数
                    bLen = bLen
                } else { // 奇数
                    maxBayNo = maxBayNo + 1
                    bLen = maxBayNo / interval // 库位个数
                }
            }
        } else { // 从1开始
            if(interval == 1) {
                bLen = bLen
            } else if (interval == 2) {
                if (maxBayNo % 2 == 0) { // 偶数
                    bLen = bLen
                } else { // 奇数
                    bLen = bLen + 1
                }
            }
        }
        bayWidth = rackss[i].width / bLen
        // hpPosition 0 表示货架序号 左->右 1 表示货架序号 左<-右
        if (mapInfo.hpPosition == 1) {
            bNum = maxBayNo
            for (let j = bLen; j > 0; j--) {
                bay = "<button class='item' style='width: "+ bayWidth +"px'>" + bNum + "</button>"
                bays = bays + bay
                bNum = bNum - interval;
            }
        }else {
            bNum = minBayNo
            for (let j = 0; j < bLen; j++) {
                bay = "<button class='item' style='width: "+ bayWidth +"px'>" + bNum + "</button>"
                bays = bays + bay
                bNum = bNum + interval;
            }
        }

        rack = "<div class='rack' id='" + rackss[i].id +
            "'style='width:"+ rackss[i].width +
            "px;height: "+ rackss[i].height+
            "px;top: "+ rackss[i].top +
            "px;left: "+ rackss[i].left +
            "px'>" + bays + "</div>"
        racks = racks + rack
        // getCrnInfo(minBayNo);
    }
    // 货架描述
    for (let i = 0;i < rackDescss.length;i++) {
        rackDesc = "<div class='rackDescs' id='" + rackDescss[i].id +
            "'style='width:"+ rackDescss[i].width +
            "px;height: "+ rackDescss[i].height+
            "px;line-height: "+ rackDescss[i].height+
            "px;top: "+ rackDescss[i].top +
            "px;left: "+ rackDescss[i].left +
            "px'>" + rackDescss[i].text + "</div>"
        rackDescs = rackDescs + rackDesc
    }
    // 堆垛机和地轨
    for (let i = 0;i < crnss.length;i++) {
        if (crnss[i].type == "crane") {
            crn = "<div class='machine' id='" + crnss[i].id +
                "'style='width:"+ crnss[i].width +
                "px;height: "+ crnss[i].height+
                "px;top: "+ crnss[i].top +
                "px;left: "+ crnss[i].left +
                "px'></div>"
            crns = crns + crn
        } else {
            track = "<div class='track' id='" + crnss[i].id +
                "'style='width:"+ crnss[i].width +
                "px;height: "+ crnss[i].height+
                "px;top: "+ crnss[i].top +
                "px;left: "+ crnss[i].left +
                "px'>" + crnss[i].text + "</div>"
            tracks = tracks + track
        }
    }
    // 楼层
    for (let i = 0; i < areas.length;i++) {

        let stnss = areas[i].stns
        let floor = areas[i].text
        floorId = areas[i].id
        var position = (i+1)*100
        floorBtn =
            "<button class='floorBtn btn-16' onclick='changFloor("+i+")' style='top: "+position+"px;'>" + floor +"</button>"
        if (mapInfo.areas[0].floors.length == 1) {
            floorBtnss = ''
        } else {
            floorBtnss =  floorBtnss + floorBtn
        }
        // 每层的 输送线站点
        var index = i
        var n = 1
        stnArr[index] = ''
        total[index] = ''
        for (let j = 0; j < stnss.length; j++) {
            if (stnss[j].type == "stn") {
                stn = "<div class='site' id='" + stnss[j].id +
                    "'style='width:"+ stnss[j].width +
                    "px;height: "+ stnss[j].height+
                    "px;line-height: "+ stnss[j].height+
                    "px;top: "+ stnss[j].top +
                    "px;left: "+ stnss[j].left +
                    "px'>" + stnss[j].text + "</div>"
                stnArr[i] = stnArr[i] + stn
                total[i] = n++
            } else if(stnss[j].type == "track"){
                stn = "<div class='track' id='" + stnss[j].id +
                    "'style='width:"+ stnss[j].width +
                    "px;height: "+ stnss[j].height+
                    "px;line-height: "+ stnss[j].height+
                    "px;top: "+ stnss[j].top +
                    "px;left: "+ stnss[j].left +
                    "px'>" + stnss[j].text  + "</div>"
                stnArr[i] = stnArr[i] + stn
            }

        }

    }
    floorInfo = racks + rackDescs + tracks + crns + stnArr[0] + floorBtnss

    $(".main-part").append(floorInfo)
    $("#line-total").html(total[0])
    // listenChange();

}
function changFloor(e) {
    $(".main-part").empty()  // 清空节点
    floorInfo = racks  + stnArr[e] +rackDescs + crns + tracks + floorBtnss
    $(".main-part").append(floorInfo)
    $("#line-total").empty()
    $("#line-total").html(total[e])
    // listenChange();
}

 src/main/webapp/static/js/console.map.js

New file
@@ -0,0 +1,472 @@
mapInfo = {
    "mapName": "SZFZWCS",
    "rackCount": 18,
    "crnCount": 7,
    "stbCount": 77,
    "hpPosition": 0,
    "minBayNo": 2,
    "floors": 1,
    "racks": [
        {
            "type": "rack",
            "id": "rack1",
            "top": 160,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack2",
            "top": 210,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack3",
            "top": 230,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack4",
            "top": 250,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack5",
            "top": 270,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack6",
            "top": 290,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack7",
            "top": 310,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack8",
            "top": 330,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack9",
            "top": 350,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack10",
            "top": 370,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack11",
            "top": 390,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack12",
            "top": 410,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
        {
            "type": "rack",
            "id": "rack13",
            "top": 462,
            "left": 500,
            "width": 900,
            "height": 22,
            "minBayNo": 1,
            "maxBayNo": 25
        },
    ],
    "rackDescs": [
        {
            "type": "rackDescs",
            "id": "lb_desc1",
            "text": "#1",
            "top": 160,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc2",
            "text": "#2",
            "top": 210,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc3",
            "text": "#3",
            "top": 230,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc4",
            "text": "#4",
            "top": 250,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc5",
            "text": "#5",
            "top": 270,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc6",
            "text": "#6",
            "top": 290,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc7",
            "text": "#7",
            "top": 310,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc8",
            "text": "#8",
            "top": 330,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc9",
            "text": "#9",
            "top": 350,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc10",
            "text": "#10",
            "top": 370,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc11",
            "text": "#11",
            "top": 390,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc12",
            "text": "#12",
            "top": 410,
            "left": 1400,
            "width": 30,
            "height": 23
        },
        {
            "type": "rackDescs",
            "id": "lb_desc13",
            "text": "#13",
            "top": 462,
            "left": 1400,
            "width": 30,
            "height": 23
        },
    ],
    "crns": [
        {
            "type": "track",
            "id": "lb_track1",
            "text": "",
            "top": 198,
            "left": 440,
            "width": 1020,
            "height": 2
        },
        {
            "type": "track",
            "id": "lb_track2",
            "text": "",
            "top": 450,
            "left": 440,
            "width": 1020,
            "height": 2
        },
        {
            "type": "crane",
            "id": "crn-1",
            "text": "1",
            "top": 185,
            "left": 805,
            "width": 93,
            "height": 22
        },
        {
            "type": "crane",
            "id": "crn-2",
            "text": "2",
            "top": 438,
            "left": 805,
            "width": 93,
            "height": 22
        }

    ],
    "areas": [
        {
            "type": "Control_floor",
            "id": "tabControl_floor1",
            "text": "楼层",
            "top": 68,
            "left": 80,
            "width": 1845,
            "height": 676,
            "floors": [
                {
                    "type": "floor",
                    "id": "page_floor1",
                    "text": "1F",
                    "top": 4,
                    "left": 22,
                    "width": 1819,
                    "height": 668,
                    "stns": [
                        {
                            "type": "stn",
                            "id": "site-102",
                            "text": "102",
                            "top": 213,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-101",
                            "text": "101",
                            "top": 235,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-100",
                            "text": "100",
                            "top": 235,
                            "left": 356,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-112",
                            "text": "112",
                            "top": 412,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-111",
                            "text": "111",
                            "top": 390,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-110",
                            "text": "110",
                            "top": 390,
                            "left": 356,
                            "width": 70,
                            "height": 20
                        },
                    ]
                },
                {
                    "type": "floor",
                    "id": "page_floor2",
                    "text": "2F",
                    "top": 4,
                    "left": 22,
                    "width": 1819,
                    "height": 668,
                    "stns": [
                        {
                            "type": "stn",
                            "id": "site-203",
                            "text": "203",
                            "top": 163,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-202",
                            "text": "202",
                            "top": 141,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-201",
                            "text": "201",
                            "top": 141,
                            "left": 500,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-200",
                            "text": "200",
                            "top": 141,
                            "left": 572,
                            "width": 70,
                            "height": 20
                        },
                    ]
                },
                {
                    "type": "floor",
                    "id": "page_floor3",
                    "text": "3F",
                    "top": 4,
                    "left": 22,
                    "width": 1819,
                    "height": 668,
                    "stns": [
                        {
                            "type": "stn",
                            "id": "site-303",
                            "text": "303",
                            "top": 163,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-302",
                            "text": "302",
                            "top": 141,
                            "left": 428,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-301",
                            "text": "301",
                            "top": 141,
                            "left": 500,
                            "width": 70,
                            "height": 20
                        },
                        {
                            "type": "stn",
                            "id": "site-300",
                            "text": "300",
                            "top": 141,
                            "left": 572,
                            "width": 70,
                            "height": 20
                        },
                    ]
                }

            ]
        }
    ]
}

 src/main/webapp/views/console.html

@@ -16,85 +16,37 @@
        <h6>AUTOMATIC WAREHOUSE WCS MONITORING DIAGRAM</h6>
    </header>
    <main class="main">
        <!-- 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 class="site-row site-row-1" id="fool1">
            <div id="site-102" class="site" style="height: 38px;line-height: 38px;width:156px;">102</div>

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

            <div id="site-100" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 184px">100</div>
            <div id="site-100" class="site" style="height: 38px;line-height: 38px;width:156px;">100</div>
        </div>
        <!--第2列-->
        <div class="site-row site-row-2">
            <!-- 台车轨道 -->
            <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">
            <div id="site-118" class="site" style="height: 18px;line-height: 18px;width:80px;">118</div>
        <div class="site-row site-row-2" id="fool2" style="display: none">
            <div id="site-202" class="site" style="height: 38px;line-height: 38px;width:156px;">202</div>

            <div id="site-115" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 47px">115</div>
            <div id="site-201" class="site" style="height: 38px;line-height: 38px;width:156px;">201</div>

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

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

            <div id="site-103" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 184px">103</div>
        </div>
        <!-- 第4列 -->
        <div class="site-row site-row-4">
            <div id="site-119" class="site" style="height: 18px;line-height: 18px;width:80px;">119</div>

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

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

            <div id="site-111" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 25px">111</div>
            <div id="site-110" class="site" style="height: 18px;line-height: 18px;width:80px;">110</div>
            <div id="site-109" class="site" style="height: 18px;line-height: 18px;width:80px;">109</div>
            <div id="site-108" class="site" style="height: 18px;line-height: 18px;width:80px;">108</div>

            <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 id="site-200" class="site" style="height: 38px;line-height: 38px;width:156px;">200</div>
        </div>

        <!-- 2F -->
        <div class="site-row site-row-title site-row-title-2">
            <span>2F</span>
        <!--第3列-->
        <div class="site-row site-row-3" id="fool3" style="display: none">
            <div id="site-302" class="site" style="height: 38px;line-height: 38px;width:156px;">302</div>

            <div id="site-301" class="site" style="height: 38px;line-height: 38px;width:156px;">301</div>

            <div id="site-300" class="site" style="height: 38px;line-height: 38px;width:156px;">300</div>
        </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>
            <button class="floorBtn  btn-16" onclick="changFloor(1)" style="margin-top: 150px">1F</button>
            <button class="floorBtn  btn-16" onclick="changFloor(2)" style="margin-top: 200px">2F</button>
            <button class="floorBtn  btn-16" onclick="changFloor(3)" style="margin-top: 250px">3F</button>

        <!-- 货架 + 堆垛机 + 入库站点 -->
        <div class="main-part">
@@ -106,8 +58,8 @@
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
@@ -115,28 +67,15 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">32#</span>
                    <span class="row-no">1#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
@@ -144,63 +83,15 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">31#</span>
                </div>
                <!-- 3号堆垛机 -->
                <div class="crn">
                    <hr class="pathway">
                    <div id="crn-3" class="machine"></div>
                </div>
                <!-- 货架 -->
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">30#</span>
                    <span class="row-no">2#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
@@ -208,28 +99,15 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">29#</span>
                    <span class="row-no">3#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item" style="border: none;background-color: #6ca7a8"></button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
@@ -237,610 +115,15 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">28#</span>
                    <span class="row-no">4#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">27#</span>
                </div>
                <span class="row-no"></span>
                <!-- 货架 -->
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">26#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">25#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">24#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">23#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">22#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">21#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">20#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">19#</span>
                </div>
                <!-- 货架 -->
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">18#</span>
                </div>

                <!-- 堆垛机 -->
                <div class="crn">
                    <hr class="pathway">
                    <div id="crn-2" class="machine"></div>
                    <div id="crn-1" class="machine"></div>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">17#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">16#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">15#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">14#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">13#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">12#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">11#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">10#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">9#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">8#</span>
                </div>
                <span class="row-no"></span>

                <!-- 货架 -->
                <div class="stock-group">
                    <button class="item">1</button>
@@ -856,77 +139,6 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">7#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">6#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">5#</span>
                </div>
                <div class="stock-group">
@@ -943,20 +155,7 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">4#</span>
                    <span class="row-no">6#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
@@ -972,20 +171,7 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">3#</span>
                    <span class="row-no">7#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
@@ -1001,25 +187,7 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">2#</span>
                </div>
                <!-- 堆垛机 -->
                <div class="crn">
                    <hr class="pathway">
                    <div id="crn-1" class="machine"></div>
                    <span class="row-no">8#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
@@ -1035,20 +203,39 @@
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <button class="item">14</button>
                    <button class="item">15</button>
                    <button class="item">16</button>
                    <button class="item">17</button>
                    <button class="item">18</button>
                    <button class="item">19</button>
                    <button class="item">20</button>
                    <button class="item">21</button>
                    <button class="item">22</button>
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <button class="item">26</button>
                    <span class="row-no">1#</span>
                    <span class="row-no">9#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <span class="row-no">10#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
                    <button class="item">3</button>
                    <button class="item">4</button>
                    <button class="item">5</button>
                    <button class="item">6</button>
                    <button class="item">7</button>
                    <button class="item">8</button>
                    <button class="item">9</button>
                    <button class="item">10</button>
                    <button class="item">11</button>
                    <button class="item">12</button>
                    <button class="item">13</button>
                    <span class="row-no">11#</span>
                </div>
            </div>
        </div>
@@ -1072,11 +259,11 @@
                <span>堆垛机 1</span>
                <span class="state-ss machine-put-flag    ">入库</span>
            </div>
            <div class="state">
                <span>堆垛机 2</span>
                <span class="state-ss machine-auto-flag    ">自动</span>
<!--            <div class="state">-->
<!--                <span>堆垛机 2</span>-->
<!--                <span class="state-ss machine-auto-flag    ">自动</span>-->

            </div>
<!--            </div>-->
            <div class="button"><span>所有状态</span></div>
            <div class="button item-group">
                <span class="machine-put-flag">入库</span>
@@ -1094,7 +281,7 @@
            <div class="body-head">输送线状态</div>
            <div class="state states">
                <span>运输线总数</span>
                <span class="line-ss">48</span>
                <span class="line-ss">9</span>
            </div>
            <div class="button"><span>所有状态</span></div>
            <div class="button item-group">
@@ -1862,5 +1049,28 @@
    }


     //楼层切换按钮
    function changFloor(x) {
        switch (x) {
            case 1:
                $('#fool1').css("display","block")
                $('#fool2').css("display","none")
                $('#fool3').css("display","none")
                return
            case 2:
                $('#fool1').css("display","none")
                $('#fool2').css("display","block")
                $('#fool3').css("display","none")
                return
            case 3:
                $('#fool1').css("display","none")
                $('#fool2').css("display","none")
                $('#fool3').css("display","block")
                return
            default:
                return;

        }
    }

</script>

 src/main/webapp/views/crn.html

@@ -65,12 +65,6 @@
                    <!--            <span>&nbsp;</span>-->
                    <input id="crn2" disabled="disabled">
                </div>
                <div class="crn-command-item" style="margin-top: 25px">
                    <label>3#</label>
<!--                    <button id="demoBtn-3" class="demoBtn" onclick="demoSwitch(this.id)" disabled> - </button>-->
                    <!--            <span>&nbsp;</span>-->
                    <input id="crn3" disabled="disabled">
                </div>
            </div>
            <!-- 堆垛机状态位信息 -->
            <div class="crn-state">
@@ -138,7 +132,6 @@
                    <div class="select-container">
                        <label><input type="radio" name="crnSelect" value="1" checked>&nbsp;1号堆垛机</label>
                        <label><input type="radio" name="crnSelect" value="2">&nbsp;2号堆垛机</label>
                        <label><input type="radio" name="crnSelect" value="3">&nbsp;3号堆垛机</label>
                    </div>
                </div>
                <!-- 源站/源库位 选择 -->

 src/main/webapp/views/pipeline.html

@@ -15,7 +15,7 @@
    <style>
        .io-mode-box {
            float: left;
            width: 25%;
            /*width: 25%;*/
            text-align: center;
        }
        .io-mode-box label {
@@ -23,7 +23,7 @@
        }
        .ioModeBtn {
            vertical-align: middle;
            width: 50%;
            width: 25%;
            height: 30px;
            left: 0;
            top: 0;
@@ -66,10 +66,6 @@
                            <div class="io-mode-box">
                                <label>2#</label>
                                <button id="io-mode-2" class="ioModeBtn" onclick="ioModeSwitch(this.id)"> - </button>
                            </div>
                            <div class="io-mode-box">
                                <label>3#</label>
                                <button id="io-mode-3" class="ioModeBtn" onclick="ioModeSwitch(this.id)"> - </button>
                            </div>
                        </fieldset>
                    </div>

 src/main/webapp/views/ste.html

@@ -26,26 +26,6 @@
                        <button class="demoBtn pos-btn">数据维护</button>
                        <button id="mode-1" class="demoBtn mode-btn" > - </button>
                    </div>
                    <div data-steNo="2" class="ste-command-item">
                        <label>2#</label>
                        <button class="demoBtn pos-btn">数据维护</button>
                        <button id="mode-2" class="demoBtn mode-btn" > - </button>
                    </div>
                    <div data-steNo="3" class="ste-command-item">
                        <label>3#</label>
                        <button class="demoBtn pos-btn">数据维护</button>
                        <button id="mode-3" class="demoBtn mode-btn" > - </button>
                    </div>
                    <div data-steNo="4" class="ste-command-item">
                        <label>4#</label>
                        <button class="demoBtn pos-btn">数据维护</button>
                        <button id="mode-4" class="demoBtn mode-btn" > - </button>
                    </div>
                    <div data-steNo="5" class="ste-command-item">
                        <label>5#</label>
                        <button class="demoBtn pos-btn">数据维护</button>
                        <button id="mode-5" class="demoBtn mode-btn" > - </button>
                    </div>
                </div>
                <!-- 堆垛机状态位信息 -->
                <div class="ste-state">
@@ -109,10 +89,6 @@
                        <span class="select-title">穿梭车号</span>
                        <div class="select-container">
                            <label><input type="radio" name="steSelect" value="1" checked>&nbsp;1号穿梭车</label>
                            <label><input type="radio" name="steSelect" value="2">&nbsp;2号穿梭车</label>
                            <label><input type="radio" name="steSelect" value="3">&nbsp;3号穿梭车</label>
                            <label><input type="radio" name="steSelect" value="4">&nbsp;4号穿梭车</label>
                            <label><input type="radio" name="steSelect" value="5">&nbsp;5号穿梭车</label>
                        </div>
                    </div>
                </div>

			@@ -50,14 +50,16 @@
			border-width: 1px;
			border-style: solid;
			height: 100%;
			display: grid;
			grid-template-columns: 1fr 1fr;
			}
			.io-mode-oper legend {
			text-align: center;
			padding: 0 10px;
			font-size: 16px;
			font-weight: 300;
			}

			}


			/* 站点表格 */

New file
			@@ -0,0 +1,529 @@
			* {
			margin: 0;
			padding: 0;
			overflow: hidden;
			}
			body {
			height: 1080px;
			width: 1920px;
			}
			#main {
			height: 100%;
			width: 100%;
			background-color: rgb(108,167,168);
			}
			.head {
			height: 10%;
			width: 100%;
			color: #FFFFFF;
			}
			.head-left {
			height: 100%;
			width: 20%;
			display: inline-block;
			}
			.head-right {
			height: 100%;
			width: 30%;
			display: inline-block;
			float: right;
			}
			.head h1 {
			display: inline;
			margin-top: 2%;
			margin-left: 2%;
			font-weight: 400;
			letter-spacing:3px;
			}
			.head h6 {
			display: inline;
			margin-left: 2%;
			font-weight: 400;
			}

			img {
			float: right;
			margin-top: 10px;
			margin-right: 10px;
			}
			.rack {
			position: absolute;
			display: inline-block;
			}
			.rackDescs {
			height: 100%;
			width: 100%;
			position: absolute;
			display: inline-block;
			text-align: center;
			}
			.stn {
			text-align: center;
			background-color: rgb(120,255,129);
			position: absolute;
			}
			.crn {
			position: absolute;
			display: inline-block;
			background-color: #00ff90;
			z-index: 999;
			}
			.track {
			position: absolute;
			display: inline-block;
			background-color: #000000;
			z-index: 5;
			}
			.item {
			border: 1px solid rgb(194,76,65);
			color: rgb(194,76,65);
			height: 100%;
			width: 100%;
			}

			.floorBtn {
			position: absolute;
			border-radius: 5px;
			left: 1750px;
			width: 90px;
			height: 40px;
			color: #ffffff;
			font-size: 24px;
			font-weight: 500;
			letter-spacing: 5px;
			cursor:pointer;
			transition: all 0.3s ease;
			font-family: 'Lato', sans-serif;
			background: transparent;
			box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5), 7px 7px 20px 0px rgba(0, 0, 0, 0.1),
			4px 4px 5px 0px rgba(0, 0, 0, 0.1);
			}
			/* 16 */
			.btn-16 {
			border: none;
			color: #fff;
			}
			.btn-16:after {
			position: absolute;
			content: '';
			width: 0;
			height: 100%;
			top: 0;
			left: 0;
			direction: rtl;
			z-index: -1;
			box-shadow: -7px -7px 20px 0px #fff9, -4px -4px 5px 0px #fff9, 7px 7px 20px 0px #0002,
			4px 4px 5px 0px #0001;
			transition: all 0.3s ease;
			}
			.btn-16:hover {
			color: #323131;
			}
			.btn-16:hover:after {
			left: auto;
			right: 0;
			width: 100%;
			}
			.btn-16:active {
			top: 2px;
			}






			/操作显示栏/
			#body {
			width: 100%;
			height: 23% ;
			position: absolute;
			bottom: 2.5%;
			}
			/* 控制开关 */
			.system-state {
			display: inline-block;
			width: 15%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.3);
			border-radius: 15px;
			margin-left: 1%;
			}
			/* 堆垛机状态 */
			.machine-status {
			display: inline-block;
			width: 15%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.3);
			border-radius: 15px;
			margin-left: 1%;
			}
			.state-ss {
			margin-left: 60px;

			}

			/* 输送线状态 */
			.line-status {
			display: inline-block;
			width: 15%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.3);
			border-radius: 15px;
			margin-left: 1%;
			}
			.line-ss {
			display: inline-block;
			float: right;
			height: 15px;
			width: 40px;
			margin-top: 10px;
			margin-right: 15px;
			line-height: 15px;
			text-align: center;
			background-color: rgba(5, 5, 5, 0.3);
			color: #ffdd00;
			}
			/* 条码扫描器 */
			.bar-code {
			display: inline-block;
			width: 49%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.3);
			border-radius: 15px;
			margin-left: 1%;
			}
			/扫码表单/
			.tablebox {
			display: inline-block;
			width: 290px;
			height: 162px;
			margin-left: 1.5%;
			color: white;
			font-size: 14px;
			list-style: none;
			line-height: 27px;
			text-indent: 10px;
			}
			.table-head {
			width: 100%;
			height: 27px;
			background:linear-gradient(to right, rgb(94, 193, 184),rgb(12,71,63));
			}
			.right {
			float: right;
			text-indent: 10px;
			padding-right: 10px;
			}
			.table-body li {
			background-color: #5D7677;
			}
			.table-body li:nth-child(even) {
			background-color: #4A6565;
			}



			/* 控制表头 */
			.body-head {
			height: 35px;
			width: 100%;
			background-image: url(../images/status_bar_1.png);
			background-repeat: no-repeat;
			margin-left: 5%;
			margin-top: 20px;
			text-indent: 25px;
			color: white;
			}


			.system-icon-open {
			width: 153px;
			height: 153px;
			background-image: url(../images/start48.png);
			display: inline-block;
			}
			.system-icon-close {
			width: 153px;
			height: 153px;
			background-image: url(../images/stop48.png);
			display: inline-block;
			}
			.switch_r {
			color: #FFFFFF;
			font-size: 14px;
			width: 130px;
			height: 153px;
			float: right;
			padding-top: 30px;
			}
			#system-run-desc {
			font-size: 20px;
			margin-top: 15px;
			}
			.state {
			height: 34px;
			width: 200px;
			background-color: rgba(255,255,255,0.1);
			background-image: url(../images/stacker.png);
			background-repeat: no-repeat;
			border-radius: 17px 0 0 17px;
			padding-left: 50px;
			line-height: 34px;
			margin-bottom: 10px;
			margin-left: 5%;
			color: #FFFFFF;
			font-size: 10px;
			}
			.states {
			background-image: url(../images/line.png);
			margin-bottom:54px;
			}
			.button {
			margin-left: 5%;
			font-size: 14px;
			color: #FFFFFF;
			}
			/* 站点 */
			.site {
			position: absolute;
			color: #333;
			cursor: pointer;
			text-align: center;
			background-color: rgb(120,255,129);
			font-size: 14px;
			z-index: 9;
			}
			/空站点/
			.site-k {
			border: 1px solid rgb(108,167,168);
			background-color: rgb(108, 167, 168);
			}
			/* 入库 */
			.machine-put-flag {
			padding: 0 10px;
			background-color: rgb(163,214,242);
			}
			/* 出库 */
			.machine-take-flag {
			padding: 0 10px;
			background-color: rgb(151,180,0);
			}
			/* 库到库 */
			.machine-stock-move-flag {
			padding: 0 10px;
			background-color: rgb(58,77,249);
			}
			/* 站到站 */
			.machine-site-move-flag {
			padding: 0 10px;
			background-color: rgb(240,140,10);
			}
			/* PToP */
			.machine-p-move-flag {
			padding: 0 10px;
			background-color: rgb(29,152,23);
			}
			/* 异常 */
			.machine-error-flag {
			padding: 0 10px;
			background-color: rgb(252,48,48);
			}
			/* 自动 */
			.machine-auto-flag {
			padding: 0 10px;
			background-color: rgb(132,255,115);
			}
			/* 非自动/手动 */
			.machine-unauto-flag {
			padding: 0 10px;
			background-color: rgb(184,184,184);
			}
			/* 自动+有物+ID */
			.site-auto-run-id {
			background-color: rgb(252,48,48);
			}
			/* 自动+有物 */
			.site-auto-run {
			background-color: rgb(250,81,246);
			}
			/* 自动+ID */
			.site-auto-id {
			background-color: rgb(196,196,0);
			}
			/* 自动 */
			.site-auto {
			background-color: rgb(120,255,129);
			}
			/* 非自动/手动 */
			.site-unauto {
			background-color: rgb(184,184,184);
			}
			#code {
			background-image: url(../images/status_bar_2.png);
			background-repeat: no-repeat;
			margin-left: 2%;
			}
			/* 堆垛机 */
			.machine {
			position: absolute;
			background-color: rgb(108,167,168);
			/margin-left: 1116px;/
			height: 20px;
			width: 80px;
			background-image: url("../images/Crane_auto.png");
			background-repeat: no-repeat;
			background-size:100% 100%;
			background-position: top center;
			cursor: pointer;
			z-index: 99;
			}
			/* 入库 */
			.machine-pakin {
			background-image: url("../images/Crane_store.png");
			}
			/* 出库 */
			.machine-pakout {
			background-image: url("../images/Crane_retrieve.png");
			}
			/* 库到库 */
			.machine-stock-move {
			background-image: url("../images/Crane_loctoloc.png");
			}
			/* 站到站 */
			.machine-site-move {
			background-image: url("../images/Crane_stntostn.png");
			}
			/* p to p */
			.machine-p-move {
			background-image: url("../images/Crane_hptoohp.png");
			}
			/* 异常 */
			.machine-error {
			background-image: url("../images/Crane_error.png");
			}
			/* 自动 */
			.machine-auto {
			background-image: url("../images/Crane_auto.png");
			}
			/* 非自动/收到 */
			.machine-un-auto {
			background-image: url("../images/Crane_manual.png");
			}

			/* 堆垛机弹窗 */
			#crnWindow {
			width: 291px;
			height: 365px;
			background-image: url(../images/Popup-yellow.png);
			position: fixed;
			color:white;
			left: 50%;
			top: 50%;
			transform: translate(-50%,-50%);
			z-index: 101;
			}
			/* 输送设备弹窗 */
			#siteWindow {
			width: 291px;
			height: 336px;
			background-image: url(../images/Popup-green.png);
			position: fixed;
			color:white;
			left: 50%;
			top: 50%;
			transform: translate(-50%,-50%);
			z-index: 101;
			}
			#siteWindow-head {
			width: 291px;
			height: 55px;
			line-height: 55px;
			margin-left: 25px;
			color: #000000;
			font-weight: 700;
			letter-spacing: 2px;
			}
			#siteWindow-head .detailed {
			display: inline-block;
			}
			#siteWindow-head button {
			width: 25px;
			height: 25px;
			padding: 0px;
			border: none;
			border-radius: 25px;
			background-image: url(../images/siteclose.png);
			display: inline-block;
			float: right;
			margin-top: 15px;
			margin-right: 50px;
			}
			#crnWindow-head {
			width: 291px;
			height: 55px;
			line-height: 55px;
			margin-left: 55px;
			color: #000000;
			font-weight: 700;
			letter-spacing: 2px;

			}
			#crnWindow-head .detailed {
			display: inline-block;
			}
			#crnWindow-head button {
			width: 25px;
			height: 25px;
			padding: 0px;
			border: none;
			border-radius: 25px;
			background-image: url(../images/siteclose.png);
			display: inline-block;
			float: right;
			margin-top: 15px;
			margin-right: 80px;
			}



			/* 弹窗 */
			form .form-item {
			display: inline-block;
			padding-left: 10px;
			}
			form .form-item-label {
			display: inline-block;
			width: 90px;
			font-size: 10px;
			}
			form .form-item-input {
			display: inline-block;
			width: 180px;

			}
			form .form-item-input input {
			background-color: rgba(255,255,255,.3);
			color: #FFFFFF;
			padding: 0;
			border: none;
			border-radius: 2px;
			height: 18px;
			padding-left: 10px;
			}
			/* checkbox */
			form .form-item-checkbox {
			display: inline-block;
			padding-left: 10px;
			width: 20%;
			}
			form .form-item-label-checkbox {
			display: inline-block;
			width: auto;
			font-size: 14px;
			}
			form .form-item-input-checkbox {
			display: inline-block;
			width: auto;

			}

New file
			@@ -0,0 +1,181 @@
			// 库位图
			let total = [],
			rack = '',
			racks = '',
			rackDesc = '',
			rackDescs = '',
			crn = '',
			crns = '',
			track = '',
			tracks = '',
			stn = '',
			stns = '',
			stnArr = [],
			floorBtn = '',
			floorBtns = '',
			floorBtnss = '',
			floorInfo=''; // 库区信息
			let rackss = mapInfo.racks,
			rackDescss = mapInfo.rackDescs,
			crnss = mapInfo.crns,
			areas = mapInfo.areas[0].floors,
			floorId;
			function getMap() {
			// 货架
			for (let i = 0;i < rackss.length;i++) {
			let bay ='' // 单个库位
			let bays = '' // 库位集合
			let maxBayNo = rackss[i].maxBayNo // 最大库位号
			let minBayNo = rackss[i].minBayNo // 最小库位号
			let bLen
			let interval // 间隔数

			if (maxBayNo<35) {
			interval = 1
			bLen = maxBayNo / interval // 库位个数
			} else {
			interval = 2
			bLen = maxBayNo / interval // 库位个数
			}
			let bayWidth // 单个库位宽度
			let bNum // 库位号码

			if (minBayNo % 2 == 0) { // 从2开始
			if(interval == 1) {
			bLen = bLen - 1
			} else if (interval == 2) {
			if (maxBayNo % 2 == 0) { // 偶数
			bLen = bLen
			} else { // 奇数
			maxBayNo = maxBayNo + 1
			bLen = maxBayNo / interval // 库位个数
			}
			}
			} else { // 从1开始
			if(interval == 1) {
			bLen = bLen
			} else if (interval == 2) {
			if (maxBayNo % 2 == 0) { // 偶数
			bLen = bLen
			} else { // 奇数
			bLen = bLen + 1
			}
			}
			}
			bayWidth = rackss[i].width / bLen
			// hpPosition 0 表示货架序号左->右 1 表示货架序号左<-右
			if (mapInfo.hpPosition == 1) {
			bNum = maxBayNo
			for (let j = bLen; j > 0; j--) {
			bay = "<button class='item' style='width: "+ bayWidth +"px'>" + bNum + "</button>"
			bays = bays + bay
			bNum = bNum - interval;
			}
			}else {
			bNum = minBayNo
			for (let j = 0; j < bLen; j++) {
			bay = "<button class='item' style='width: "+ bayWidth +"px'>" + bNum + "</button>"
			bays = bays + bay
			bNum = bNum + interval;
			}
			}

			rack = "<div class='rack' id='" + rackss[i].id +
			"'style='width:"+ rackss[i].width +
			"px;height: "+ rackss[i].height+
			"px;top: "+ rackss[i].top +
			"px;left: "+ rackss[i].left +
			"px'>" + bays + "</div>"
			racks = racks + rack
			// getCrnInfo(minBayNo);
			}
			// 货架描述
			for (let i = 0;i < rackDescss.length;i++) {
			rackDesc = "<div class='rackDescs' id='" + rackDescss[i].id +
			"'style='width:"+ rackDescss[i].width +
			"px;height: "+ rackDescss[i].height+
			"px;line-height: "+ rackDescss[i].height+
			"px;top: "+ rackDescss[i].top +
			"px;left: "+ rackDescss[i].left +
			"px'>" + rackDescss[i].text + "</div>"
			rackDescs = rackDescs + rackDesc
			}
			// 堆垛机和地轨
			for (let i = 0;i < crnss.length;i++) {
			if (crnss[i].type == "crane") {
			crn = "<div class='machine' id='" + crnss[i].id +
			"'style='width:"+ crnss[i].width +
			"px;height: "+ crnss[i].height+
			"px;top: "+ crnss[i].top +
			"px;left: "+ crnss[i].left +
			"px'></div>"
			crns = crns + crn
			} else {
			track = "<div class='track' id='" + crnss[i].id +
			"'style='width:"+ crnss[i].width +
			"px;height: "+ crnss[i].height+
			"px;top: "+ crnss[i].top +
			"px;left: "+ crnss[i].left +
			"px'>" + crnss[i].text + "</div>"
			tracks = tracks + track
			}
			}
			// 楼层
			for (let i = 0; i < areas.length;i++) {

			let stnss = areas[i].stns
			let floor = areas[i].text
			floorId = areas[i].id
			var position = (i+1)*100
			floorBtn =
			"<button class='floorBtn btn-16' onclick='changFloor("+i+")' style='top: "+position+"px;'>" + floor +"</button>"
			if (mapInfo.areas[0].floors.length == 1) {
			floorBtnss = ''
			} else {
			floorBtnss = floorBtnss + floorBtn
			}
			// 每层的输送线站点
			var index = i
			var n = 1
			stnArr[index] = ''
			total[index] = ''
			for (let j = 0; j < stnss.length; j++) {
			if (stnss[j].type == "stn") {
			stn = "<div class='site' id='" + stnss[j].id +
			"'style='width:"+ stnss[j].width +
			"px;height: "+ stnss[j].height+
			"px;line-height: "+ stnss[j].height+
			"px;top: "+ stnss[j].top +
			"px;left: "+ stnss[j].left +
			"px'>" + stnss[j].text + "</div>"
			stnArr[i] = stnArr[i] + stn
			total[i] = n++
			} else if(stnss[j].type == "track"){
			stn = "<div class='track' id='" + stnss[j].id +
			"'style='width:"+ stnss[j].width +
			"px;height: "+ stnss[j].height+
			"px;line-height: "+ stnss[j].height+
			"px;top: "+ stnss[j].top +
			"px;left: "+ stnss[j].left +
			"px'>" + stnss[j].text + "</div>"
			stnArr[i] = stnArr[i] + stn
			}

			}

			}
			floorInfo = racks + rackDescs + tracks + crns + stnArr[0] + floorBtnss

			$(".main-part").append(floorInfo)
			$("#line-total").html(total[0])
			// listenChange();

			}
			function changFloor(e) {
			$(".main-part").empty() // 清空节点
			floorInfo = racks + stnArr[e] +rackDescs + crns + tracks + floorBtnss
			$(".main-part").append(floorInfo)
			$("#line-total").empty()
			$("#line-total").html(total[e])
			// listenChange();
			}

New file
			@@ -0,0 +1,472 @@
			mapInfo = {
			"mapName": "SZFZWCS",
			"rackCount": 18,
			"crnCount": 7,
			"stbCount": 77,
			"hpPosition": 0,
			"minBayNo": 2,
			"floors": 1,
			"racks": [
			{
			"type": "rack",
			"id": "rack1",
			"top": 160,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack2",
			"top": 210,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack3",
			"top": 230,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack4",
			"top": 250,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack5",
			"top": 270,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack6",
			"top": 290,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack7",
			"top": 310,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack8",
			"top": 330,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack9",
			"top": 350,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack10",
			"top": 370,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack11",
			"top": 390,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack12",
			"top": 410,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			{
			"type": "rack",
			"id": "rack13",
			"top": 462,
			"left": 500,
			"width": 900,
			"height": 22,
			"minBayNo": 1,
			"maxBayNo": 25
			},
			],
			"rackDescs": [
			{
			"type": "rackDescs",
			"id": "lb_desc1",
			"text": "#1",
			"top": 160,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc2",
			"text": "#2",
			"top": 210,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc3",
			"text": "#3",
			"top": 230,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc4",
			"text": "#4",
			"top": 250,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc5",
			"text": "#5",
			"top": 270,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc6",
			"text": "#6",
			"top": 290,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc7",
			"text": "#7",
			"top": 310,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc8",
			"text": "#8",
			"top": 330,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc9",
			"text": "#9",
			"top": 350,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc10",
			"text": "#10",
			"top": 370,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc11",
			"text": "#11",
			"top": 390,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc12",
			"text": "#12",
			"top": 410,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			{
			"type": "rackDescs",
			"id": "lb_desc13",
			"text": "#13",
			"top": 462,
			"left": 1400,
			"width": 30,
			"height": 23
			},
			],
			"crns": [
			{
			"type": "track",
			"id": "lb_track1",
			"text": "",
			"top": 198,
			"left": 440,
			"width": 1020,
			"height": 2
			},
			{
			"type": "track",
			"id": "lb_track2",
			"text": "",
			"top": 450,
			"left": 440,
			"width": 1020,
			"height": 2
			},
			{
			"type": "crane",
			"id": "crn-1",
			"text": "1",
			"top": 185,
			"left": 805,
			"width": 93,
			"height": 22
			},
			{
			"type": "crane",
			"id": "crn-2",
			"text": "2",
			"top": 438,
			"left": 805,
			"width": 93,
			"height": 22
			}

			],
			"areas": [
			{
			"type": "Control_floor",
			"id": "tabControl_floor1",
			"text": "楼层",
			"top": 68,
			"left": 80,
			"width": 1845,
			"height": 676,
			"floors": [
			{
			"type": "floor",
			"id": "page_floor1",
			"text": "1F",
			"top": 4,
			"left": 22,
			"width": 1819,
			"height": 668,
			"stns": [
			{
			"type": "stn",
			"id": "site-102",
			"text": "102",
			"top": 213,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-101",
			"text": "101",
			"top": 235,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-100",
			"text": "100",
			"top": 235,
			"left": 356,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-112",
			"text": "112",
			"top": 412,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-111",
			"text": "111",
			"top": 390,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-110",
			"text": "110",
			"top": 390,
			"left": 356,
			"width": 70,
			"height": 20
			},
			]
			},
			{
			"type": "floor",
			"id": "page_floor2",
			"text": "2F",
			"top": 4,
			"left": 22,
			"width": 1819,
			"height": 668,
			"stns": [
			{
			"type": "stn",
			"id": "site-203",
			"text": "203",
			"top": 163,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-202",
			"text": "202",
			"top": 141,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-201",
			"text": "201",
			"top": 141,
			"left": 500,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-200",
			"text": "200",
			"top": 141,
			"left": 572,
			"width": 70,
			"height": 20
			},
			]
			},
			{
			"type": "floor",
			"id": "page_floor3",
			"text": "3F",
			"top": 4,
			"left": 22,
			"width": 1819,
			"height": 668,
			"stns": [
			{
			"type": "stn",
			"id": "site-303",
			"text": "303",
			"top": 163,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-302",
			"text": "302",
			"top": 141,
			"left": 428,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-301",
			"text": "301",
			"top": 141,
			"left": 500,
			"width": 70,
			"height": 20
			},
			{
			"type": "stn",
			"id": "site-300",
			"text": "300",
			"top": 141,
			"left": 572,
			"width": 70,
			"height": 20
			},
			]
			}

			]
			}
			]
			}

			@@ -65,12 +65,6 @@
			<!-- <span> </span>-->
			<input id="crn2" disabled="disabled">
			</div>
			<div class="crn-command-item" style="margin-top: 25px">
			<label>3#</label>
			<!-- <button id="demoBtn-3" class="demoBtn" onclick="demoSwitch(this.id)" disabled> - </button>-->
			<!-- <span> </span>-->
			<input id="crn3" disabled="disabled">
			</div>
			</div>
			<!-- 堆垛机状态位信息 -->
			<div class="crn-state">
			@@ -138,7 +132,6 @@
			<div class="select-container">
			<label><input type="radio" name="crnSelect" value="1" checked> 1号堆垛机</label>
			<label><input type="radio" name="crnSelect" value="2"> 2号堆垛机</label>
			<label><input type="radio" name="crnSelect" value="3"> 3号堆垛机</label>
			</div>
			</div>
			<!-- 源站/源库位选择 -->

			@@ -15,7 +15,7 @@
			<style>
			.io-mode-box {
			float: left;
			width: 25%;
			/width: 25%;/
			text-align: center;
			}
			.io-mode-box label {
			@@ -23,7 +23,7 @@
			}
			.ioModeBtn {
			vertical-align: middle;
			width: 50%;
			width: 25%;
			height: 30px;
			left: 0;
			top: 0;
			@@ -66,10 +66,6 @@
			<div class="io-mode-box">
			<label>2#</label>
			<button id="io-mode-2" class="ioModeBtn" onclick="ioModeSwitch(this.id)"> - </button>
			</div>
			<div class="io-mode-box">
			<label>3#</label>
			<button id="io-mode-3" class="ioModeBtn" onclick="ioModeSwitch(this.id)"> - </button>
			</div>
			</fieldset>
			</div>

			@@ -26,26 +26,6 @@
			<button class="demoBtn pos-btn">数据维护</button>
			<button id="mode-1" class="demoBtn mode-btn" > - </button>
			</div>
			<div data-steNo="2" class="ste-command-item">
			<label>2#</label>
			<button class="demoBtn pos-btn">数据维护</button>
			<button id="mode-2" class="demoBtn mode-btn" > - </button>
			</div>
			<div data-steNo="3" class="ste-command-item">
			<label>3#</label>
			<button class="demoBtn pos-btn">数据维护</button>
			<button id="mode-3" class="demoBtn mode-btn" > - </button>
			</div>
			<div data-steNo="4" class="ste-command-item">
			<label>4#</label>
			<button class="demoBtn pos-btn">数据维护</button>
			<button id="mode-4" class="demoBtn mode-btn" > - </button>
			</div>
			<div data-steNo="5" class="ste-command-item">
			<label>5#</label>
			<button class="demoBtn pos-btn">数据维护</button>
			<button id="mode-5" class="demoBtn mode-btn" > - </button>
			</div>
			</div>
			<!-- 堆垛机状态位信息 -->
			<div class="ste-state">
			@@ -109,10 +89,6 @@
			<span class="select-title">穿梭车号</span>
			<div class="select-container">
			<label><input type="radio" name="steSelect" value="1" checked> 1号穿梭车</label>
			<label><input type="radio" name="steSelect" value="2"> 2号穿梭车</label>
			<label><input type="radio" name="steSelect" value="3"> 3号穿梭车</label>
			<label><input type="radio" name="steSelect" value="4"> 4号穿梭车</label>
			<label><input type="radio" name="steSelect" value="5"> 5号穿梭车</label>
			</div>
			</div>
			</div>