<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title id="headTitle">三一油管看板</title>
<link href="css/index.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="wrap" id="bodyApp" v-cloak>
<!--背景图片和物料设备名称-->
<div class="head">
<div class="box boxCont box_one">
<div><span class="head-span">工序ID:</span><span style="width:120px;">{{ materia1.taskId}}</span></div>
<div> <span class="head-span">设备名称:</span><span style="width:120px;">{{materia1.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia1.stateValue)}}</span></div>
</div>
<div class="box2">
<div class="box_one boxCont">
<div> <span class="head-span">工序ID:</span><span style="width:120px;">{{ materia2.taskId}}</span></div>
<div><span class="head-span">设备名称:</span><span style="width:120px;">{{materia2.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia2.stateValue)}}</span> </div>
</div>
<div class="box_two boxCont">
<div> <span class="head-span">工序ID:</span><span style="width:120px;">{{ materia3.taskId }}</span></div>
<div><span class="head-span">设备名称:</span><span style="width:120px;">{{materia3.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia3.stateValue)}}</span> </div>
</div>
<div class="box_three boxCont">
<div> <span class="head-span">工序ID:</span><span style="width:120px;">{{ materia4.taskId }}</span></div>
<div><span class="head-span">设备名称:</span><span style="width:120px;">{{materia4.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia4.stateValue)}}</span> </div>
</div>
</div>
<div class="box3">
<div class="box_five boxCont" style=" margin-left: 190px;">
<div> <span class="head-span">工序ID:</span><span style="width:120px;">{{ materia6.taskId }}</span></div>
<div><span class="head-span">设备名称:</span><span style="width:120px;">{{materia6.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia6.stateValue)}}</span> </div>
</div>
<div class="box_four boxCont">
<div> <span class="head-span">工序ID:</span><span style="width:120px;">{{ materia5_1.taskId }}</span></div>
<div><span class="head-span">设备名称:</span><span style="width:120px;">{{materia5_1.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia5_1.stateValue)}}</span> </div>
<div> <span class="head-span">工序ID:</span><span style="width:120px;">{{ materia5_2.taskId }}</span></div>
<div><span class="head-span">设备名称:</span><span style="width:120px;">{{materia5_2.name}}</span></div>
<div><span class="head-span">设备状态:</span><span style="width:120px;">{{getEquipmentState(materia5_2.stateValue)}}</span> </div>
</div>
</div>
</div>
<!--列表信息-->
<div class="cont">
<!--生产总产量和当前工单-->
<fieldset class="left" width="200px">
<legend class="title-font">生产总产量和当前工单</legend>
<div class="left_top">
<div class="left_top_title">
{{pipeOrderList.title}}<span class="red_word">{{pipeOrderList.sumcount}}</span>个
</div>
<div class="produced">
<ul>
<li v-for="(value, index) in pipeOrderList.pipeOrderfinished">{{value.materialCode}}：已生产1个</li>
</ul>
</div>
</div>
<div class="left_bottom">
<div class="left_bottom_title">当前月份生产工单:</div>
<div class="tablebox">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table-hover" >
<thead>
<tr>
<th style="width: 5% ">序号</th>
<th style="width: 45%">物料设备名称</th>
<th style="width: 10% ">数量</th>
<th style="width: 20%">折弯类型</th>
<th style="width: 20% ">已生产数</th>
</tr>
</thead>
<tbody>
<tr v-for="(value, index) in pipeOrderList.pipeOrderAll">
<td style="width: 5% ">{{index+1}}</td>
<td style="width: 45%">{{value.materialCode}}</td>
<td style="width: 10% ">{{value.num}}</td>
<td style="width: 20%">{{value.bendType}}</td>
<td style="width: 20% ">{{value.production}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</fieldset>
<!--桁车任务-->
<fieldset class="center" style="width:250px;">
<legend class="title-font">桁车信息</legend>
<div class="produced girderVehicle">
<ul>
<li v-for="(value, index) in girderVehicleList.girderVehicleState">设备 {{value.equipmentTypeTemplateCode}}：{{ getEquipmentState(value.informationValue)}}</li>
</ul>
<ul>
<li v-for="(value, index) in girderVehicleList.girderVehicleTask">任务 {{value.equipmentTypeTemplateCode}}：
{{ value.informationValue}}</li>
</ul>
</div>
</fieldset>
<!--切割方案-->
<fieldset class="center-cutplan" style="width: 640px;">
<legend class="title-font">切割方案</legend>
<div class="produced">
<div class="tablebox">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table-hover">
<thead>
<tr>
<th style="width: 8% ">{{cutplanTitle.index}}</th>
<th style="width: 30%">{{cutplanTitle.WONumber}}</th>
<th style="width: 15%">{{cutplanTitle.wcsProductType}}</th>
<th style="width: 9% ">{{cutplanTitle.materialLength}}</th>
<th style="width: 9% ">{{cutplanTitle.thickness}}</th>
<th style="width: 15%">{{cutplanTitle.flange1}}</th>
<th style="width: 15%">{{cutplanTitle.flange2}}</th>
</tr>
</thead>
<tbody>
<tr v-for="(value, index) in cutplan">
<td style="width: 8% ">{{index+1}}</td>
<td style="width: 30%">{{value.WONumber}}</td>
<td style="width: 15%">{{value.wcsProductType}}</td>
<td style="width: 9% ">{{value.materialLength}}</td>
<td style="width: 9% ">{{value.thickness}}</td>
<td style="width: 15%">{{value.flange1}}</td>
<td style="width: 15%">{{value.flange2}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</fieldset>
<!--AGV信息-->
<fieldset class="right" style="width:205px;">
<legend class="title-font">AGV信息</legend>
<div class="produced">
<div v-for="(value, index) in avgList.agvState">
<span style="display: inline-block; width: 140px; text-align: right;padding-bottom:15px;">设备{{value.equipmentTypeTemplateCode}}：</span>
<span>{{getEquipmentState(value.informationValue)}}</span>
</div>
<br /><br />
<div v-for="(value, index) in avgList.agvMaterialBoxNumberOfFlange">
<span style="display: inline-block; width: 140px; text-align: right;padding-bottom:15px;"> 法兰型号 {{avgList.agvMaterialBoxFlangeType[index].informationValue}}：</span>
<span>数量{{value.informationValue}}个</span>
</div>
</div>
</fieldset>
</div>
</div>
<!-- message tip-->
<div id="progressBar" class="progressBar" style="display: none;" >
<div class="load-3" style=" padding-top: 20%;">
<div class="k-line2 k-line12-1"></div>
<div class="k-line2 k-line12-2"></div>
<div class="k-line2 k-line12-3"></div>
<div class="k-line2 k-line12-4"></div>
<div class="k-line2 k-line12-5"></div>
<div class="k-line2 k-line12-6"></div>
<div class="k-line2 k-line12-7"></div>
<div class="k-line2 k-line12-8"></div>
</div>
</div>
<script src="js/vue.js"></script>
<script src="js/index.js?v=1.0"></script>
</body>
</html>