| | |
| | | |
| | | <!--杞﹂棿涔嬩笂鐨勮緤閬撶嚎--> |
| | | <div class="box" style="margin-left: 170px;"> |
| | | <div style="height: 1px;"></div> |
| | | <div v-for="items in plcList_one.section_four" class="box_sto" |
| | | :style="{ 'background-color': getBackgroundColor2(items.r_wheel_SN) }"> |
| | | <el-tooltip class="item" effect="dark" placement="right"> |
| | |
| | | <div style="width: 40px;height: 43px;" :style="{ 'background-color': getBackgroundColor4(items.c_machine_state) }"></div> |
| | | <div style="width: 100px;"> |
| | | <el-tooltip class="item" effect="dark" placement="right"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div style="width: 100px;">杞﹁疆SN鍙凤細{{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>鐩墠鏆傛棤杞﹁疆淇℃伅</div> |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div style="display: flex;"> |
| | | <div v-for="items in plcList_one.section_six"> |
| | | <el-tooltip class="item" effect="dark" placement="top"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_stoy"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div style="display: flex;margin-left: 5px;"> |
| | | <div v-for="items in plcList_one.section_seven"> |
| | | <el-tooltip class="item" effect="dark" placement="top"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_stoy"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div style="width: 40px;height: 43px;" :style="{ 'background-color': getBackgroundColor4(items.c_machine_state) }"></div> |
| | | <div style="width: 100px;"> |
| | | <el-tooltip class="item" effect="dark" placement="right"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>鐩墠鏆傛棤杞﹁疆淇℃伅</div> |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div v-for="items in plcList_one.section_three" class="box_sto" |
| | | :style="{ 'background-color': getBackgroundColor2(items.r_wheel_SN) }"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_sto_dt"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div v-for="items in plcList_one.section_two" class="box_sto" |
| | | :style="{ 'background-color': getBackgroundColor2(items.r_wheel_SN) }"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_sto_dt"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div> |
| | | <div> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN !== ''"> |
| | | <template #content v-if="items.r_wheel_SN !== '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | </template> |
| | | <div class="box2_sto_yj" :style="{ 'background-color': getBackgroundColor4(items.g_gantry_state) }"> |
| | | <img src="../../../assets/imgs/jxscl.png" style="width: 100%;" |
| | | v-if="items.r_wheel_SN != ''"> |
| | | v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/jxsk.png" style="width: 100%;" v-else> |
| | | </div> |
| | | </el-tooltip> |
| | |
| | | <div style="width: 40px;height: 43px;" :style="{ 'background-color': getBackgroundColor4(items.c_machine_state) }"></div> |
| | | <div style="width: 100px;"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>鐩墠鏆傛棤杞﹁疆淇℃伅</div> |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div style="display: flex;"> |
| | | <div v-for="items in plcList_one.section_eight"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_stoy"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''&& items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div style="display: flex;margin-left: 5px;"> |
| | | <div v-for="items in plcList_one.section_nine"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_stoy"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div style="width: 40px;height: 43px;" :style="{ 'background-color': getBackgroundColor4(items.c_machine_state) }"></div> |
| | | <div style="width: 100px;"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>鐩墠鏆傛棤杞﹁疆淇℃伅</div> |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" style="margin: 0px auto;" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div> |
| | | <div> |
| | | <el-tooltip class="item" effect="dark" placement="top"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | </template> |
| | | <div style="border: 1px solid #ffffff; width: 45px; height: 67px; "> |
| | | <img src="../../../assets/imgs/tuyoujilun.png" style="width: 100%;" |
| | | v-if="items.r_wheel_SN != ''"> |
| | | v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/tuyouji.png" style="width: 100%;" v-else> |
| | | </div> |
| | | </el-tooltip> |
| | |
| | | <div> |
| | | <div> |
| | | <el-tooltip class="item" effect="dark" placement="top"> |
| | | <template #content v-if="items.r_wheel_SN !== ''"> |
| | | <template #content v-if="items.r_wheel_SN !== '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | </template> |
| | | <div class="box2_sto_yj"> |
| | | <img src="../../../assets/imgs/jxscl.png" style="width: 100%;" |
| | | v-if="items.r_wheel_SN != ''"> |
| | | v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/jxsk.png" style="width: 100%;" v-else> |
| | | </div> |
| | | </el-tooltip> |
| | |
| | | <div v-for="items in plcList_one.section_one" class="box_sto" |
| | | :style="{ 'background-color': getBackgroundColor2(items.r_wheel_SN) }"> |
| | | <el-tooltip class="item" effect="dark" placement="right"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_sto_dt"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | <div v-for="items in plcList_one.section_thirteen" class="box_sto2" |
| | | :style="{ 'background-color': getBackgroundColor2(items.r_wheel_SN) }"> |
| | | <el-tooltip class="item" effect="dark" placement="left"> |
| | | <template #content v-if="items.r_wheel_SN != ''"> |
| | | <template #content v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <div>r_wheel_SN锛歿{ items.r_wheel_SN }}</div> |
| | | <div>r_wheel_type锛歿{ items.r_wheel_type }}</div> |
| | | <div>r_part_status锛歿{ items.r_part_status }}</div> |
| | |
| | | <div>stackerNo:{{ items.stackerNo }}</div> |
| | | </template> |
| | | <div class="box_sto_dt"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != ''"> |
| | | <div class="quan_div" v-if="items.r_wheel_SN != '' && items.r_wheel_SN != null"> |
| | | <img src="../../../assets/imgs/pcs_lun.png" style="width: 100%;"> |
| | | </div> |
| | | <div v-else>{{ items.stackerNo }}</div> |
| | |
| | | } |
| | | </script> |
| | | |
| | | <style> |
| | | <style scoped> |
| | | .contents { |
| | | display: flex; |
| | | align-items: flex-end; |
| | |
| | | .box { |
| | | background-color: rgb(129, 179, 182); |
| | | width: 80px; |
| | | height: 405px; |
| | | height: 415px; |
| | | margin-left: 3px; |
| | | color: rgb(255, 255, 255); |
| | | font-size: 16px; |