| | |
| | | <div style="display: flex; align-items: flex-start; gap: 20px; height: 70vh;"> |
| | | <!-- // 父级框 --> |
| | | <div class="img-zkdlpl" > |
| | | <div class="img-car1" :style="'z-index:999;left:212px;top:' + 1300*carPosition[0] + 'px;position:absolute;'"> |
| | | <!-- <div class="img-car1" :style="'z-index:999;left:212px;top:' + 1300*carPosition[0] + 'px;position:absolute;'"> |
| | | <div |
| | | v-for="(rect, index) in adjusta" |
| | | :key="rect.id" |
| | |
| | | ></div> |
| | | </div> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </div> |
| | | <el-card style="flex: 1; height: 500px; overflow-y: auto;"> |
| | | <div style="width: 100%; height: calc(100% - 35px); overflow-y: auto;max-height: 450px;"> |
| | | <el-card style="flex: 1; height: 700px;margin-top: 40px; overflow-y: auto;"> |
| | | <div style="width: 100%; height: calc(100% - 35px); overflow-y: auto;max-height: 550px;"> |
| | | <el-table height="550px" ref="table" border |
| | | :data="tableDatass" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="flowCardId" align="center" :label="$t('searchOrder.cardnumber')" min-width="140" /> |
| | |
| | | </el-table> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <div style="padding: 10px;display: flex;height:110px;margin-top: -170px;"> |
| | | <div v-for="(item, index) in tableDatae" :key="index" id="occupy"> |
| | | <el-col style="text-align:left;font-weight: bold;">#{{ item.device_id }}</el-col> |
| | | <el-col style="text-align:left;display:flex;justify-content: space-between;align-items: center;"> |
| | | <span>{{ $t('searchOrder.Usage') }}</span><span>{{ item.percentage }}%</span> |
| | | </el-col> |
| | | <hr style="width:80%;margin: 0 auto;" /> |
| | | <el-col style="text-align:left;display:flex;justify-content: space-between;align-items: center;"> |
| | | <span>{{ $t('searchOrder.free') }}</span><span>{{ item.count }}</span> |
| | | </el-col> |
| | | </div> |
| | | </div> |
| | | <div class="table-container"> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 3px;"> |
| | | <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;max-height: 140px;"> |
| | | <el-table height="120px" ref="table" |
| | | :row-class-name="tableRowClassName" |
| | | :data="tableDatad" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="glassId" align="center" :label="$t('searchOrder.intoglassid')" min-width="140" /> |
| | | <el-table-column prop="startSlot" align="center" :label="$t('searchOrder.startposition')" min-width="120" /> |
| | | <el-table-column prop="targetSlot" align="center" :label="$t('searchOrder.targetlocation')" min-width="120" /> |
| | | <el-table-column prop="taskState" align="center" :label="$t('searchOrder.taskstatus')" min-width="120"> |
| | | <template #default="scope"> |
| | | <el-tag type="success" >{{ scope.row.taskState==0? $t('searchOrder.filmenter') : $t('searchOrder.infilm') }}</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="isSame" align="center" :label="$t('searchOrder.whethersame')" min-width="120"> |
| | | <template #default="scope"> |
| | | <el-tag :type="getcasOnea(scope.row.isSame)"> |
| | | {{ getStatuscasOnea(scope.row.isSame) }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-card> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 3px;"> |
| | | <el-table height="120px" ref="table" |
| | | :data="tableDatac" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="glassId" align="center" :label="$t('searchOrder.outputglassID')" min-width="140" /> |
| | | <el-table-column prop="startSlot" align="center" :label="$t('searchOrder.startposition')" min-width="120" /> |
| | | <el-table-column prop="targetSlot" align="center" :label="$t('searchOrder.targetlocation')" min-width="120" /> |
| | | <el-table-column prop="taskState" align="center" :label="$t('searchOrder.taskstatus')" min-width="157"> |
| | | <template #default="scope"> |
| | | <el-tag type="success" >{{ scope.row.taskState==0? $t('searchOrder.filmenter') : $t('searchOrder.infilm') }}</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | </div> |
| | | </div> |
| | | <!-- 添加理片笼信息 --> |
| | |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="id" :label="$t('searchOrder.cagetableID')" align="center" min-width="100"/> |
| | | <!-- <el-table-column prop="id" :label="$t('searchOrder.cagetableID')" align="center" min-width="100"/> --> |
| | | <el-table-column prop="deviceId" align="center" :label="$t('searchOrder.cagenumber')" min-width="150" /> |
| | | <el-table-column prop="slot" align="center" :label="$t('searchOrder.gridnumber')" min-width="150" /> |
| | | <el-table-column |
| | |
| | | } |
| | | } |
| | | .img-zkdlpl{ |
| | | margin-left: 20px; |
| | | margin-top: 0px; |
| | | background-image:url('../../assets/zhongkong.png'); |
| | | margin-left: 40px; |
| | | margin-top: 8px; |
| | | background-image:url('/zklpl2.png'); |
| | | background-repeat: no-repeat; |
| | | background-attachment: local; |
| | | min-height: 500px; |
| | | width: 800px; |
| | | min-height: 800px; |
| | | width: 500px; |
| | | max-width: 100%; |
| | | background-size: 800px 500px; |
| | | background-size: 500px 800px; |
| | | overflow: hidden; |
| | | position:relative |
| | | } |
| | | .img-car1{ |
| | | display: flex; |
| | | background-image:url('../../assets/xiaoche.png'); |
| | | background-image:url('/xiaoche.png'); |
| | | position: absolute; |
| | | background-repeat: no-repeat; |
| | | background-attachment: local; |
| | |
| | | } |
| | | .img-car4{ |
| | | display: flex; |
| | | background-image:url('../../assets/xiaoche.png'); |
| | | background-image:url('/xiaoche.png'); |
| | | position: absolute; |
| | | background-repeat: no-repeat; |
| | | background-attachment: local; |