| body { | 
|     margin: 0; | 
|     padding: 0; | 
|     background-color: rgb(108, 167, 168); | 
| } | 
|   | 
| .pointContainer { | 
|     display: flex; | 
|     justify-content: center; | 
| } | 
|   | 
| .item { | 
|     width: 35px; | 
|     height: 35px; | 
|     border-right: none; | 
|     cursor: default; | 
|     color: rgb(194, 76, 65); | 
|     display: flex; | 
|     justify-content: center; | 
|     align-items: center; | 
|     user-select: none; | 
|     background: #f0f0f0; | 
| } | 
|   | 
| /* 站点 */ | 
| .site { | 
|     color: #333; | 
|     height: 35px; | 
|     width: 35px; | 
|     cursor: pointer; | 
|     text-align: center; | 
|     background-color: rgb(120, 255, 129); | 
|     font-size: 13px; | 
|     display: flex; | 
|     justify-content: center; | 
|     align-items: center; | 
|     user-select: none; | 
| } | 
|   | 
| /*空站点*/ | 
| .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); | 
| } | 
|   | 
| /*空闲*/ | 
| .shuttle-idle { | 
|     background-color: rgb(120, 255, 129); | 
| } | 
|   | 
| /*作业中*/ | 
| .shuttle-working { | 
|     background-color: rgb(196, 196, 0); | 
| } | 
|   | 
| /*等待确认*/ | 
| .shuttle-waiting { | 
|     background-color: rgb(184, 184, 184); | 
| } | 
|   | 
| /*充电中*/ | 
| .shuttle-charging { | 
|     background-color: rgb(250, 81, 246); | 
| } | 
|   | 
| /*充电任务等待确认*/ | 
| .shuttle-charging-waiting { | 
|     background-color: rgb(58, 77, 249); | 
| } | 
|   | 
| /*故障修复中*/ | 
| .shuttle-fixing { | 
|     background-color: rgb(252, 48, 48); | 
| } | 
|   | 
| /*离线*/ | 
| .shuttle-offline { | 
|     background-color: rgb(0, 0, 0); | 
| } | 
|   | 
| /*空闲*/ | 
| .lift-idle { | 
|     background-color: rgb(120, 255, 129); | 
| } | 
|   | 
| /*作业中*/ | 
| .lift-working { | 
|     background-color: rgb(196, 196, 0); | 
| } | 
|   | 
| /*等待确认*/ | 
| .lift-waiting { | 
|     background-color: rgb(184, 184, 184); | 
| } | 
|   | 
| /*离线*/ | 
| .lift-offline { | 
|     background-color: rgb(0, 0, 0); | 
| } | 
|   | 
| /* 输送设备弹窗 */ | 
| #siteWindow { | 
|     width: 300px; | 
|     height: 340px; | 
|     position: fixed; | 
|     left: 50%; | 
|     top: 50%; | 
|     transform: translate(-50%, -50%); | 
|     border-radius: 20px 20px 0 0; | 
|     overflow: hidden; | 
| } | 
|   | 
| #siteWindow-head { | 
|     width: 300px; | 
|     height: 55px; | 
|     background: #73fe7a; | 
|     font-weight: 700; | 
|     display: flex; | 
|     justify-content: space-between; | 
|     align-items: center; | 
| } | 
|   | 
| #siteWindow-head .detailed { | 
|     display: inline-block; | 
|     background: none; | 
|     color: #00000; | 
|     margin-left: 20px; | 
| } | 
|   | 
| #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-right: 20px; | 
| } | 
|   | 
| .siteWindow-body { | 
|     height: 285px; | 
|     padding: 6px; | 
|     background: rgba(0, 0, 0, .6); | 
| } | 
|   | 
| #siteWindow .form-item, | 
| #siteWindow .form-item-checkbox { | 
|     display: flex; | 
|     justify-content: space-between; | 
|     margin-top: 5px; | 
| } | 
|   | 
| #siteWindow .form-item-label span, | 
| #siteWindow .form-item-label-checkbox span { | 
|     color: #fff; | 
| } | 
|   | 
| #siteWindow 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; | 
| } | 
|   | 
| .floorBtnBox { | 
|     margin-bottom: 10px; | 
| } | 
|   | 
| .floorBtnBox button { | 
|     width: 110px; | 
|     height: 40px; | 
| } | 
|   | 
| .footer { | 
|     width: 100%; | 
|     height: 23%; | 
|     position: absolute; | 
|     bottom: 3.2%; | 
| } | 
|   | 
| .line-status { | 
|     float: left; | 
|     width: 15%; | 
|     height: 100%; | 
|     background-color: rgba(0, 0, 0, 0.3); | 
|     border-radius: 15px; | 
|     margin-left: 1%; | 
| } | 
|   | 
| /* 控制表头 */ | 
| .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; | 
| } | 
|   | 
| /* 条码扫描器 */ | 
| .bar-code { | 
|     display: inline-block; | 
|     float: left; | 
|     position: fixed; | 
|     width: 34%; | 
|     height: 23%; | 
|     background-color: rgba(0, 0, 0, 0.3); | 
|     border-radius: 15px; | 
|     margin-left: 1%; | 
|     overflow: hidden; | 
| } | 
|   | 
| .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; | 
| } | 
|   | 
| .allStatus { | 
|     margin-left: 5%; | 
|     font-size: 14px; | 
|     color: #FFFFFF; | 
| } | 
|   | 
| .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;*/ | 
| } | 
|   | 
| .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; | 
| } | 
|   | 
| /*扫码表单*/ | 
| .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; | 
|     overflow: hidden; | 
| } | 
|   | 
| .table-head { | 
|     width: 100%; | 
|     height: 27px; | 
|     background: linear-gradient(to right, rgb(94, 193, 184), rgb(12, 71, 63)); | 
| } | 
|   | 
| #code { | 
|     background-image: url(../images/status_bar_2.png); | 
|     background-repeat: no-repeat; | 
|     margin-left: 2%; | 
| } | 
|   | 
| .table-body li { | 
|     background-color: #5D7677; | 
| } | 
|   | 
| .table-body li:nth-child(even) { | 
|     background-color: #4A6565; | 
| } | 
|   | 
| .state-ss { | 
|     margin-left: 60px; | 
| } | 
|   | 
| .shuttle-status-box { | 
|     height: 100px; | 
|     overflow-y: scroll; | 
|     overflow-x: hidden; | 
| } | 
|   | 
| .lift-status-box { | 
|     height: 120px; | 
|     overflow-y: scroll; | 
|     overflow-x: hidden; | 
| } | 
|   | 
| .right { | 
|     float: right; | 
|     text-indent: 10px; | 
|     padding-right: 10px; | 
| } | 
|   | 
| /*=============== SCROLL BAR ===============*/ | 
| ::-webkit-scrollbar { | 
|     width: .6rem; | 
|     border-radius: .5rem; | 
|     background-color: hsl(228, 8%, 76%); | 
| } | 
|   | 
| ::-webkit-scrollbar-thumb { | 
|     background-color: hsl(228, 8%, 64%); | 
|     border-radius: .5rem; | 
| } | 
|   | 
| ::-webkit-scrollbar-thumb:hover { | 
|     background-color: hsl(228, 8%, 54%); | 
| } | 
|   | 
| .sxcar{ | 
|     width: 35px; | 
|     height: 35px; | 
|     background-image: url(../images/sxcar.png); | 
|     background-size: 100% 100%; | 
|     position: absolute; | 
|     top: 0; | 
|     left: 0; | 
|     display: flex; | 
|     justify-content: center; | 
|     align-items: center; | 
|     text-shadow: 2px 2px 4px #000000; | 
|     font-size: 18px; | 
|     transition: all 0.8s; | 
|     user-select: none; | 
| } |