| | |
| | | color: #303133; |
| | | } |
| | | |
| | | .deviceContainer { |
| | | display: flex; |
| | | justify-content: space-around; |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .deviceBox { |
| | | width: 600px; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | .devpBox { |
| | | margin-top: 20px; |
| | | } |
| | |
| | | } |
| | | |
| | | .deviceItem { |
| | | width: 300px; |
| | | width: 200px; |
| | | height: 40px; |
| | | } |
| | | |
| | | .devpDeviceBox { |
| | | width: 230px; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | .devpDeviceItem { |
| | |
| | | <div slot="header" class="clearfix"> |
| | | <span>堆垛机</span> |
| | | </div> |
| | | <el-carousel :interval="4000" type="card" :height="crnListHeight"> |
| | | <el-carousel-item v-for="(item,index) in crnList" :key="index"> |
| | | <div ref="crnCarousel" class="deviceBox"> |
| | | <div class="deviceHeader">{{item.crnNo}}号堆垛机</div> |
| | | <div class="deviceBody"> |
| | | <div class="deviceItem"> |
| | | <span>堆垛机:</span> |
| | | <span>{{ item.crnNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>工作号:</span> |
| | | <span>{{ item.workNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>模式:</span> |
| | | <span><el-tag :type="item.statusType == '自动' ? 'success':'danger'">{{ item.statusType }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>任务状态:</span> |
| | | <span><el-tag :type="item.wrkStatus == 0 ? '':'success'">{{ item.wrkStatus$ }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>设备状态:</span> |
| | | <span><el-tag :type="item.deviceStatus == '自动' ? 'success':'danger'">{{ item.deviceStatus }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>有物:</span> |
| | | <span><el-tag :type="item.loading == '无物' ? '':'success'">{{ item.loading }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>列:</span> |
| | | <span>{{ item.bay }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>层:</span> |
| | | <span>{{ item.lev }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>故障代码:</span> |
| | | <span>{{ item.warnCode }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>故障描述:</span> |
| | | <span>{{ item.error }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>源站:</span> |
| | | <span>{{ item.sourceStaNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>目标站:</span> |
| | | <span>{{ item.staNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>源库位:</span> |
| | | <span>{{ item.sourceLocNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>目标库位:</span> |
| | | <span>{{ item.locNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>货叉定位:</span> |
| | | <span>{{ item.forkOffset }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>载货台定位:</span> |
| | | <span>{{ item.liftPos }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行在定位:</span> |
| | | <span>{{ item.walkPos }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行速度(m/min):</span> |
| | | <span>{{ item.xspeed }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>升降速度(m/min):</span> |
| | | <span>{{ item.yspeed }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>叉牙速度(m/min):</span> |
| | | <span>{{ item.zspeed }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行距离(Km):</span> |
| | | <span>{{ item.xdistance }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>升降距离(Km):</span> |
| | | <span>{{ item.ydistance }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行时长(H):</span> |
| | | <span>{{ item.xduration }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>升降时长(H):</span> |
| | | <span>{{ item.yduration }}</span> |
| | | </div> |
| | | <div class="deviceContainer"> |
| | | <div v-for="(item,index) in crnList" :key="index" class="deviceBox"> |
| | | <div class="deviceHeader">{{item.crnNo}}号堆垛机</div> |
| | | <div class="deviceBody"> |
| | | <div class="deviceItem"> |
| | | <span>堆垛机:</span> |
| | | <span>{{ item.crnNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>工作号:</span> |
| | | <span>{{ item.workNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>模式:</span> |
| | | <span><el-tag :type="item.statusType == '自动' ? 'success':'danger'">{{ item.statusType }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>任务状态:</span> |
| | | <span><el-tag :type="item.wrkStatus == 0 ? '':'success'">{{ item.wrkStatus$ }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>设备状态:</span> |
| | | <span><el-tag :type="item.deviceStatus == '自动' ? 'success':'danger'">{{ item.deviceStatus }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>有物:</span> |
| | | <span><el-tag :type="item.loading == '无物' ? '':'success'">{{ item.loading }}</el-tag></span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>列:</span> |
| | | <span>{{ item.bay }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>层:</span> |
| | | <span>{{ item.lev }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>故障代码:</span> |
| | | <span>{{ item.warnCode }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>故障描述:</span> |
| | | <span>{{ item.error }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>源站:</span> |
| | | <span>{{ item.sourceStaNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>目标站:</span> |
| | | <span>{{ item.staNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>源库位:</span> |
| | | <span>{{ item.sourceLocNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>目标库位:</span> |
| | | <span>{{ item.locNo }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>货叉定位:</span> |
| | | <span>{{ item.forkOffset }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>载货台定位:</span> |
| | | <span>{{ item.liftPos }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行在定位:</span> |
| | | <span>{{ item.walkPos }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行速度(m/min):</span> |
| | | <span>{{ item.xspeed }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>升降速度(m/min):</span> |
| | | <span>{{ item.yspeed }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>叉牙速度(m/min):</span> |
| | | <span>{{ item.zspeed }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行距离(Km):</span> |
| | | <span>{{ item.xdistance }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>升降距离(Km):</span> |
| | | <span>{{ item.ydistance }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>走行时长(H):</span> |
| | | <span>{{ item.xduration }}</span> |
| | | </div> |
| | | <div class="deviceItem"> |
| | | <span>升降时长(H):</span> |
| | | <span>{{ item.yduration }}</span> |
| | | </div> |
| | | </div> |
| | | </el-carousel-item> |
| | | </el-carousel> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | |
| | | <el-card class="box-card devpBox"> |
| | | <div slot="header" class="clearfix"> |
| | | <span>输送线</span> |
| | | </div> |
| | | <el-carousel :interval="4000" type="card" :height="devpListHeight"> |
| | | <el-carousel-item v-for="(val,index) in devpList" :key="index" w> |
| | | <div style="display: flex;justify-content: space-around;width: 100%;"> |
| | | <div v-for="(item,idx) in val" :key="idx" class="devpDeviceBox"> |
| | | <div class="deviceHeader">{{item.devNo}}号站点</div> |
| | | <div class="deviceBody"> |
| | | <div class="devpDeviceItem"> |
| | | <span>站点:</span> |
| | | <span>{{ item.devNo }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>工作号:</span> |
| | | <span>{{ item.workNo }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>自动:</span> |
| | | <span>{{ item.autoing }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>有物:</span> |
| | | <span>{{ item.loading }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>可入:</span> |
| | | <span>{{ item.inEnable }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>可出:</span> |
| | | <span>{{ item.outEnable }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>入库标记:</span> |
| | | <span>{{ item.pakMk }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>空板信号:</span> |
| | | <span>{{ item.emptyMk }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>目标站:</span> |
| | | <span>{{ item.staNo }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>高低库位:</span> |
| | | <span>{{ item.locType1 }}</span> |
| | | </div> |
| | | <div v-for="(val,index) in devpList" :key="index" w> |
| | | <div style="display: flex;justify-content: space-around;width: 100%;margin-top: 20px;"> |
| | | <div v-for="(item,idx) in val" :key="idx" class="devpDeviceBox"> |
| | | <div class="deviceHeader">{{item.devNo}}号站点</div> |
| | | <div class="deviceBody"> |
| | | <div class="devpDeviceItem"> |
| | | <span>站点:</span> |
| | | <span>{{ item.devNo }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>工作号:</span> |
| | | <span>{{ item.workNo }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>自动:</span> |
| | | <span>{{ item.autoing }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>有物:</span> |
| | | <span>{{ item.loading }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>可入:</span> |
| | | <span>{{ item.inEnable }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>可出:</span> |
| | | <span>{{ item.outEnable }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>入库标记:</span> |
| | | <span>{{ item.pakMk }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>空板信号:</span> |
| | | <span>{{ item.emptyMk }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>目标站:</span> |
| | | <span>{{ item.staNo }}</span> |
| | | </div> |
| | | <div class="devpDeviceItem"> |
| | | <span>高低库位:</span> |
| | | <span>{{ item.locType1 }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-carousel-item> |
| | | </el-carousel> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <script> |
| | |
| | | let list = [] |
| | | let tmp = [] |
| | | res.data.forEach((item,index) => { |
| | | if (index % 3 == 0) { |
| | | if (index % 5 == 0) { |
| | | if (tmp.length != 0) { |
| | | list.push(tmp) |
| | | } |