#

luxiaotao1123

2022-10-20 a1d5e46f2f5405e7adbbea0b34673e54b2a5ebca

#

 src/main/webapp/static/css/console.css

@@ -289,54 +289,39 @@
    top: 122px;
}
.site-row-1 {
    top: 327px;
    left: 417px;
    top: 67px;
    left: 392px;
}
.site-row-1 .site {
    width: 80px;
}
.site-row-2 {
    top: 327px;
    left: 499px;
    top: 67px;
    left: 474px;
}
.site-row-2 .site {
    width: 70px;
    width: 80px;
}
.site-row-3 {
    top: 327px;
    left: 571px;
    top: 67px;
    left: 556px;
}
.site-row-3 .site {
    width: 80px;
}
.site-row-4 {
    top: 327px;
    left: 653px;
    top: 67px;
    left: 638px;
}
.site-row-4 .site {
    width: 70px;
}
/* 输送线第5列 */
.site-row-5 {
    top: 213px;
    left: 725px;
}
.site-row-5 .site {
    width: 70px;
    width: 80px;
}

.site-row-6 {
    top: 213px;
    left: 797px;
}
.site-row-6 .site {
    width: 70px;
}

/* ------------------ 货架总成 ------------------ */
.main-part {
    position: absolute;
    top: 100px;
    top: 20px;
    left: 720px;
}
.main-part .lane {
@@ -360,18 +345,10 @@
    border-right: none;
    cursor: inherit;
    color: rgb(194,76,65);
    transition: .3s;
}
.stock-group .item:last-of-type {
    border-right: 1px solid rgb(194,76,65);
}
.stock-group .item-hide {
    opacity: .7;
}
/*.stock-group .item-hide:hover {*/
/*    opacity: 0;*/
/*}*/

.stock-group::after, .stock-group::before {
    content: "";
    display: table;

 src/main/webapp/views/console.html

@@ -16,57 +16,60 @@
        <h6>AUTOMATIC WAREHOUSE WCS MONITORING DIAGRAM</h6>
    </header>
    <main class="main">
        <!-- 第1列 -->
        <!--第1列 -->
        <div class="site-row site-row-1">
            <div id="site-100" class="site" style="height: 36px;line-height: 36px;">100</div>
            <div id="site-200" class="site" style="height: 30px;line-height: 30px;margin-top: 26px;">200</div>
            <div id="site-102" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 340px">102</div>

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

            <div id="site-100" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 184px">100</div>
        </div>
        <!-- 第2列-->
        <!--第2列-->
        <div class="site-row site-row-2">
            <div id="site-101" class="site" style="height: 36px;line-height: 36px;">101</div>
            <div id="site-300" class="site" style="height: 24px;line-height: 24px;">300</div>
            <div id="site-201" class="site" style="height: 30px;line-height: 30px;">201</div>
            <!-- 台车轨道 -->
            <div id="car-track-1" class="car-track">
                <div></div>
            </div>
            <!-- 台车实例 -->
            <div id="site-1000" class="site car" style="top: 584px">1000</div>
            <div id="site-2000" class="site car" style="top: 0">2000</div>
        </div>
        <!-- 第3列 -->
        <div class="site-row site-row-3">
            <div id="site-102" class="site" style="height: 36px;line-height: 36px;">102</div>
            <div id="site-202" class="site" style="height: 30px;line-height: 30px;margin-top: 26px;">202</div>
            <div id="site-118" class="site" style="height: 18px;line-height: 18px;width:80px;">118</div>

            <div id="site-115" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 47px">115</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-103" class="site" style="height: 36px;line-height: 36px;">103</div>
            <div id="site-203" class="site" style="height: 30px;line-height: 30px;margin-top: 26px;">203</div>
        </div>
        <!-- 第5列 -->
        <div class="site-row site-row-5">
            <div id="site-107" class="site" style="height: 36px;line-height: 36px;">107</div>
            <div id="site-106" class="site" style="height: 36px;line-height: 36px;">106</div>
            <div id="site-105" class="site" style="height: 36px;line-height: 36px;">105</div>
            <div id="site-104" class="site" style="height: 36px;line-height: 36px;">104</div>
            <div id="site-119" class="site" style="height: 18px;line-height: 18px;width:80px;">119</div>

            <div id="site-204" class="site" style="height: 30px;line-height: 30px;margin-top: 26px">204</div>
            <div id="site-205" class="site" style="height: 32px;line-height: 32px;">205</div>
            <div id="site-206" class="site" style="height: 32px;line-height: 32px;">206</div>
            <div id="site-207" class="site" style="height: 32px;line-height: 32px;">207</div>
        </div>
        <!-- 第6列 -->
        <div class="site-row site-row-6">
            <div id="site-108" class="site" style="height: 36px;line-height: 36px;">108</div>
            <div id="site-109" class="site" style="height: 36px;line-height: 36px;">109</div>
            <div id="site-110" class="site" style="height: 36px;line-height: 36px;">110</div>
            <div id="site-111" class="site" style="height: 36px;line-height: 36px;">111</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-211" class="site" style="height: 30px;line-height: 30px;margin-top: 26px">211</div>
            <div id="site-210" class="site" style="height: 32px;line-height: 32px;">210</div>
            <div id="site-209" class="site" style="height: 32px;line-height: 32px;">209</div>
            <div id="site-208" class="site" style="height: 32px;line-height: 32px;">208</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>

        <!-- 货架 + 堆垛机 + 入库站点 -->
        <div class="main-part">
            <div class="lane">
            <!-- 第一组 -->
            <div class="lane" style="margin-bottom: 280px">
                <!-- 货架 -->
                <!-- 1号堆垛机 -->
                <div class="stock-group">
                    <button class="item">1</button>
                    <button class="item">2</button>
@@ -93,7 +96,8 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">1#</span>
                    <button class="item">26</button>
                    <span class="row-no">32#</span>
                </div>
                <div class="stock-group">
                    <button class="item">1</button>
@@ -121,46 +125,21 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">2#</span>
                    <button class="item">26</button>
                    <span class="row-no">31#</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>
                    <span class="row-no">3#</span>
                </div>
                <!-- 3号堆垛机 -->
                <div class="crn">
                    <hr class="pathway">
                    <div id="crn-1" class="machine"></div>
                    <div id="crn-3" class="machine"></div>
                </div>
                <!-- 货架 -->
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 30px">2</button>
                    <button class="item item-hide">3</button>
                    <button class="item item-hide">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -181,13 +160,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">4#</span>
                    <button class="item">26</button>
                    <span class="row-no">30#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 30px">2</button>
                    <button class="item item-hide">3</button>
                    <button class="item item-hide">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -208,13 +189,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">5#</span>
                    <button class="item">26</button>
                    <span class="row-no">29#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 30px">2</button>
                    <button class="item item-hide">3</button>
                    <button class="item item-hide">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -235,11 +218,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">6#</span>
                    <button class="item">26</button>
                    <span class="row-no">28#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -260,11 +247,46 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">7#</span>
                    <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 item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -285,11 +307,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">8#</span>
                    <button class="item">26</button>
                    <span class="row-no">25#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -310,11 +336,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">9#</span>
                    <button class="item">26</button>
                    <span class="row-no">24#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -335,11 +365,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">10#</span>
                    <button class="item">26</button>
                    <span class="row-no">23#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -360,7 +394,125 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">11#</span>
                    <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">
@@ -368,8 +520,11 @@
                    <div id="crn-2" class="machine"></div>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -390,137 +545,15 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">12#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">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>
                    <span class="row-no">13#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">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>
                    <span class="row-no">14#</span>
                </div>
                <!-- 货架 -->
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">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>
                    <span class="row-no">15#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">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>
                    <span class="row-no">16#</span>
                </div>
                <div class="stock-group">
                    <button class="item item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">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 item-hide" style="margin-left: 90px">4</button>
                    <button class="item item-hide">5</button>
                    <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>
@@ -541,15 +574,426 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">18#</span>
                    <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>
                    <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">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">
                    <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">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">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">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">2#</span>
                </div>
                <!-- 堆垛机 -->
                <div class="crn">
                    <hr class="pathway">
                    <div id="crn-3" class="machine"></div>
                    <div id="crn-1" class="machine"></div>
                </div>
                <div class="stock-group">
                    <button class="item" style="margin-left: 60px">3</button>
                    <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>
@@ -572,59 +1016,8 @@
                    <button class="item">23</button>
                    <button class="item">24</button>
                    <button class="item">25</button>
                    <span class="row-no">19#</span>
                </div>
                <div class="stock-group">
                    <button class="item" style="margin-left: 60px">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>
                    <span class="row-no">20#</span>
                </div>
                <div class="stock-group">
                    <button class="item" style="margin-left: 60px">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>
                    <span class="row-no">21#</span>
                    <button class="item">26</button>
                    <span class="row-no">1#</span>
                </div>
            </div>
        </div>
@@ -989,6 +1382,61 @@
            $('#barcode3').append(str3)
        }
    }

    // 小车偏移动画
    function carAnimate(id, target) {
        if (id === 1000) {
            let targetTop = 130;
            switch (target) {
                case 110:
                    targetTop += 0;
                    break;
                case 109:
                    targetTop += 60;
                    break;
                case 108:
                    targetTop += 100;
                    break;
                case 107:
                    targetTop += 180;
                    break;
                case 106:
                    targetTop += 220;
                    break;
                default:
                    return;
            }
            $("#site-" + id).animate({top: targetTop+'px'}, 1000);
        } else if (id === 2000) {
            let targetTop = 130;
            switch (target) {
                case 226:
                    targetTop += 0;
                    break;
                case 225:
                    targetTop += 60;
                    break;
                case 224:
                    targetTop += 100;
                    break;
                case 223:
                    targetTop += 180;
                    break;
                case 222:
                    targetTop += 220;
                    break;
                case 214:
                    targetTop += 280;
                    break;
                case 220:
                    targetTop += 320;
                    break;
                default:
                    return;
            }
            $("#site-" + id).animate({top: targetTop+'px'}, 1000);
        }
    }
</script>
<script type="text/javascript">
    // 弹窗站点信息
@@ -1175,6 +1623,9 @@
                        } else {
                            siteEl.html(sites[i].siteId);
                        }
                        if (i+1===8) {
                            carAnimate(i+1, Number(sites[i].nearbySta));
                        }
                    }
                } else if (res.code === 403){
                    parent.location.href = baseUrl+"/login";
@@ -1281,19 +1732,103 @@
        }
    }

</script>
<script>
    const items = document.querySelectorAll('.item-hide')
    items.forEach((item)=> {
        item.addEventListener('mouseenter', function () {
            items.forEach((item)=> {
                item.style.opacity= 0;
            })
        })
        item.addEventListener('mouseleave', function () {
            items.forEach((item)=> {
                item.style.opacity= .7;
            })
        })
    })
    // 页面点击事件监听 ---------------------------------------------------------

    // 输送设备点击事件
    // $('.site').on('click', function () {
    //     var id = this.id.split("-")[1];
    //     if (id === undefined) {
    //         return;
    //     }
    //     layer.open({
    //         title: id + " 站点信息详情",
    //         closeBtn: 0,
    //         skin: 'layui-layer-lan',
    //         offset: '180px',
    //         type: 1,
    //         shadeClose: true,
    //         content: $('#siteWindow'),
    //         area: ['35rem', '18rem'],
    //         btn: ['确定', '关闭'],
    //         success: function(layero, index){
    //             http.post(baseUrl+"/console/site/detail", {siteId: id}, function (res) {
    //                 for (var val in res.data) {
    //                     var find = $("#siteWindow").find(":input[name='" + val + "']");
    //                     if (find[0].type==='text') {
    //                         find.val(res.data[val]);
    //                     } else if (find[0].type === 'checkbox') {
    //                         find.attr("checked", res.data[val] === 'Y');
    //                     }
    //                 }
    //             })
    //         },
    //         end: function () {
    //             $(':input', $("#siteWindow")).val('').removeAttr('checked').removeAttr('selected');
    //         }
    //     });
    // });

    // 堆垛机点击事件
    // $('.machine').on('click', function () {
    //     var id = this.id.split("-")[1];
    //     layer.open({
    //         title: id+"号堆垛机",
    //         skin: 'layui-layer-lan',
    //         closeBtn: 0,
    //         type: 1,
    //         offset: '150px',
    //         shadeClose: true,
    //         content: $("#crnWindow"),
    //         area: ['40rem', '20rem'],
    //         btn: ['确定', '关闭'],
    //         success: function(layero, index){
    //             http.post(baseUrl+"/console/crn/detail", {crnNo: id}, function (res) {
    //                 for (var val in res.data) {
    //                     var find = $("#crnWindow").find(":input[name='" + val + "']");
    //                     if (find[0].type==='text') {
    //                         find.val(res.data[val]);
    //                     } else if (find[0].type === 'checkbox') {
    //                         find.attr("checked", res.data[val] === 'Y');
    //                     }
    //                 }
    //             })
    //         },
    //         end: function () {
    //             $(':input', $("#crnWindow")).val('').removeAttr('checked').removeAttr('selected');
    //         }
    //     });
    // });


    // 小车偏移动画
    function carAnimate(id, target) {
        var targetTop = 122;
        if (id === 8) {
            switch (target) {
                case 1:
                    targetTop += 160;
                    break;
                case 2:
                    targetTop += 140;
                    break;
                case 3:
                    targetTop += 80;
                    break;
                case 4:
                    targetTop += 40;
                    break;
                case 7:
                    targetTop += 0;
                    break;
                default:
                    return;
            }
        } else {
            return;
        }
        $("#site-" + id).animate({top: targetTop+'px'}, 1000);
    }



</script>