| | |
| | | |
| | | body { |
| | | height: 100%; |
| | | background-color: #fff; |
| | | background-color: #f1f1f1; |
| | | border-radius: 5px; |
| | | box-shadow: 0 0 3px rgba(0,0,0,.3); |
| | | padding: 10px; |
| | | } |
| | | |
| | | /* ------------------------------------ 头部 ------------------------------------*/ |
| | | header { |
| | | border-radius: 5px; |
| | | box-shadow: 0 0 3px rgba(0,0,0,.3); |
| | | background-color: #fff; |
| | | height: 20%; |
| | | opacity: 0.8; |
| | | position: relative; |
| | | } |
| | | /* 分割线 */ |
| | | .header-hr { |
| | | border-radius: 5px; |
| | | border: 1px solid #777; |
| | | width: 80%; |
| | | position: absolute; |
| | | bottom: 0; |
| | | } |
| | | /* 系统运行状态 */ |
| | | .system-state { |
| | | float: left; |
| | | margin-left: 30px; |
| | | margin-top: 30px; |
| | | text-align: center; |
| | | color: #2d6aff; |
| | | } |
| | | .system-icon { |
| | | width: 100px; |
| | | height: 100px; |
| | | background-image: url("../image/stop48.png"); |
| | | background-repeat: no-repeat; |
| | | background-size:100% 100%; |
| | | background-position: top center; |
| | | cursor: pointer; |
| | | } |
| | | .system-state span { |
| | | display: inline-block; |
| | | padding-top: 10px; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | /* 状态显示 */ |
| | | .data-window { |
| | | padding-top: 20px; |
| | | float: left; |
| | | width: 70%; |
| | | text-align: center; |
| | | } |
| | | .data-window h1 { |
| | | font-size: 3em; |
| | | margin: 0; |
| | | letter-spacing: 1px; |
| | | font-weight: inherit; |
| | | } |
| | | |
| | | /* 颜色提示 */ |
| | | .tips { |
| | | position: absolute; |
| | | bottom: 7%; |
| | | left: 10%; |
| | | } |
| | | .tips-item { |
| | | margin-bottom: 0; |
| | | font-size: 0; |
| | | text-align: left; |
| | | } |
| | | .tips-item label { |
| | | display: inline-block; |
| | | width: 130px; |
| | | text-align: right; |
| | | font-size: xx-small; |
| | | } |
| | | .item-group { |
| | | display: inline-block; |
| | | } |
| | | .item-group span { |
| | | font-size: xx-small; |
| | | padding: 0 10px; |
| | | } |
| | | |
| | | /* ------------------------------------ 主体 ------------------------------------*/ |
| | | main { |
| | | height: 80%; |
| | | margin-top: 8px; |
| | | border-radius: 5px; |
| | | box-shadow: 0 0 3px rgba(0,0,0,.3); |
| | | background-color: #fff; |
| | | height: 75.8%; |
| | | position: relative; |
| | | } |
| | | |
| | |
| | | border: none; |
| | | background-color: transparent; |
| | | } |
| | | /* 自动 */ |
| | | .site-auto { |
| | | background-color: rgb(42,253,47); |
| | | } |
| | | /* 非自动/收到 */ |
| | | .site-unauto { |
| | | background-color: #aaaaaa; |
| | | } |
| | | /* 自动+有物+ID */ |
| | | .site-auto-run-id { |
| | | background-color: red; |
| | | } |
| | | /* 自动+有物 */ |
| | | .site-auto-run { |
| | | background-color: #fc29f8; |
| | | } |
| | | /* 自动+有物+ID */ |
| | | .site-auto-id { |
| | | background-color: yellow; |
| | | } |
| | | |
| | | |
| | | /* ------------------ 货架总成 ------------------ */ |
| | | .main-part { |
| | |
| | | top: 250px; |
| | | left: 600px; |
| | | } |
| | | |
| | | .main-part .lane { |
| | | margin-bottom: 30px; |
| | | } |
| | | /* 排号 */ |
| | | .row-no { |
| | | font-weight: bolder; |
| | | margin-left: 80px; |
| | | } |
| | | |
| | |
| | | cursor: pointer; |
| | | } |
| | | |
| | | /* 入库 */ |
| | | .machine-put { |
| | | background-color: #90d0f3; |
| | | } |
| | | /* 出库 */ |
| | | .machine-take { |
| | | background-color: yellow; |
| | | } |
| | | /* 库到库 */ |
| | | .machine-stock-move { |
| | | background-color: #0c24fb; |
| | | color: #fff; |
| | | } |
| | | /* 站到站 */ |
| | | .machine-site-move { |
| | | background-color: #faa328; |
| | | } |
| | | /* PToP */ |
| | | .machine-p-move { |
| | | background-color: #128014; |
| | | color: #fff; |
| | | } |
| | | /* 异常 */ |
| | | .machine-error { |
| | | background-color: red; |
| | | } |
| | | /* 自动 */ |
| | | .machine-auto { |
| | | background-color: rgb(42,253,47); |
| | | } |
| | | /* 非自动/收到 */ |
| | | .machine-unauto { |
| | | background-color: #aaaaaa; |
| | | } |
| | | |
| | | /* 堆垛机轨道 */ |
| | | .pathway { |
| | | margin-left: 30px; |
| | |
| | | color: #333 !important; |
| | | width: 90%; |
| | | margin-top: 10px; |
| | | z-index: -1; |
| | | } |
| | | |
| | | |
| | | /* 输送线相关 */ |
| | | .site:hover { |
| | | opacity: 0.7; |
| | | } |
| | | |
| | | /* 入库口 */ |
| | | .cargo-put { |
| | | top: 68px; |
| | | left: 413px; |
| | | position: absolute; |
| | | width: 50px; |
| | | height: 50px; |
| | | background-image: url("../image/fork_r.png"); |
| | | background-repeat: no-repeat; |
| | | background-size:100% 100%; |
| | | background-position: top center; |
| | | } |
| | | |
| | | /* 动画 */ |
| | | /*.machine {*/ |