<template>
|
<div class="Linebox" >
|
<div class="card">
|
<div class="card-header">
|
<div id="lines2">
|
<div class="card-body">{{ device.deviceName }}<br />
|
-{{ device.childDeviceCode }}-
|
</div>
|
</div>
|
</div>
|
<div class="card-body">
|
<ul class="list-group lis">
|
<li class="list-group-item list-group-item-dark">读取信号</li>
|
<li class="list-group-item list-group-item-secondary">任务号：{{
|
device.data.command.taskNum }}</li>
|
<li class="list-group-item list-group-item-secondary">托盘号：{{
|
device.data.command.barcode }}</li>
|
<li class="list-group-item list-group-item-secondary">终点地址：{{
|
device.data.command.targetAddress }}</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[6])">扫码站台入库请求</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[4])">堆垛机出库站台请求</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[2])">堆垛机入库站台请求</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[0])">线体出库口请求</li>
|
</ul>
|
<ul class="list-group lis">
|
<li class="list-group-item list-group-item-dark">写入信号</li>
|
<li class="list-group-item list-group-item-secondary">任务号：{{
|
device.data.commandWrite.taskNum }}</li>
|
<li class="list-group-item list-group-item-secondary">托盘号：{{
|
device.data.commandWrite.barcode }}</li>
|
<li class="list-group-item list-group-item-secondary">终点地址：{{
|
device.data.commandWrite.targetAddress }}</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[7])">扫码站台入库请求</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[5])">堆垛机出库站台请求</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[3])">堆垛机入库站台请求</li>
|
<li :class="getSignalClass(device.data.writeInteractiveSignal[1])">线体出库口请求</li>
|
</ul>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script setup>
|
import { defineProps } from "vue";
|
|
// 定义组件属性
|
const props = defineProps({
|
device: {
|
type: Object,
|
required: true
|
}
|
});
|
|
// 获取信号类名
|
const getSignalClass = (signal) => {
|
// console.log("🚀 ~ getSignalClass ~ signal:", signal)
|
return signal !== true ? 'list-group-item list-group-item-danger' : 'list-group-item list-group-item-success';
|
};
|
</script>
|
|
<style scoped>
|
/* .Stackerbox{
|
width: 220px;
|
float: left;
|
} */
|
.Linebox{
|
width: 500px;
|
float: left;
|
}
|
.box1{
|
float: left;
|
}
|
.card-body{
|
text-align: center;
|
border-radius: 6% ;
|
}
|
.Stacker{
|
background-color: burlywood;
|
}
|
.lis{
|
float: left;
|
width: 233px;
|
}
|
</style>
|
