<template>
|
<div class="rk">
|
<div class="rk_info">
|
<span>作业员：{{info.worker}}/{{info.groupName}}</span>
|
<span>机台/工位：<span v-for="(item, i) in info.deviceList" :key="i">{{item.name}} {{i === info.deviceList.length - 1 ? '' : '/'}}</span></span>
|
</div>
|
<div class="rk_statistics">
|
<div class="rk_statistics_item" v-if="info.finishedQualified">
|
<span>{{info.finishedQualified.num}}</span>
|
<span>{{info.finishedQualified.boxNum}}盒</span>
|
<span>已完工合格品</span>
|
</div>
|
<div class="rk_statistics_item" v-if="info.finishedUndesirable">
|
<span class="yellow">{{info.finishedUndesirable.num}}</span>
|
<span>{{info.finishedUndesirable.boxNum}}盒</span>
|
<span>已完工不良品</span>
|
</div>
|
<div class="rk_statistics_item" v-if="info.finishedScrap">
|
<span class="orange">{{info.finishedScrap.num}}</span>
|
<span>{{info.finishedScrap.boxNum}}盒</span>
|
<span>待报废品</span>
|
</div>
|
<div class="rk_statistics_item" v-if="info.qualified">
|
<span>{{info.qualified.num}}</span>
|
<span>{{info.qualified.boxNum}}盒</span>
|
<span><span class="lan">未生产</span>合格品</span>
|
</div>
|
<div class="rk_statistics_item" v-if="info.undesirable">
|
<span class="yellow">{{info.undesirable.num}}</span>
|
<span>{{info.undesirable.boxNum}}盒</span>
|
<span><span class="lan">未生产</span>不良品</span>
|
</div>
|
<div class="rk_statistics_item" v-if="info.surplus">
|
<span class="grey">{{info.surplus.num}}</span>
|
<span>{{info.surplus.boxNum}}盒</span>
|
<span><span class="lan">余留次班生产</span></span>
|
</div>
|
</div>
|
<div class="rk_wl">
|
<div class="rk_wl_header">
|
<div class="rk_wl_header_top">
|
<div class="rk_wl_header_top_x"></div>
|
<span>完工交接物料</span>
|
</div>
|
<!-- <div class="rk_wl_header_bottom">-->
|
<!-- <span>单号：ZK-20220601-0001</span>-->
|
<!-- <span>时间：2022/05/30 18:10:02</span>-->
|
<!-- </div>-->
|
</div>
|
<div class="rk_wl_content" v-if="info.appliancesMaterialBeanList && info.appliancesMaterialBeanList.length > 0">
|
<div class="rk_wl_content_item" v-for="(item, i) in info.appliancesMaterialBeanList" :key="i">
|
<span>{{item.materialName}} | {{item.materialCode}}</span>
|
<span class="rk_wl_content_item_a" v-if="item.finishedQualified && item.finishedQualified.boxNum > 0 && item.finishedQualified.num > 0">已完工 <span class="hg">[合格品]</span>：{{item.finishedQualified.boxNum}}盒｜{{item.finishedQualified.num}}{{item.finishedQualified.unitName}}</span>
|
<span class="rk_wl_content_item_b" v-if="item.finishedUndesirable && item.finishedUndesirable.boxNum > 0 && item.finishedUndesirable.num > 0">已完工 <span class="bl">[不良品]</span>：{{item.finishedUndesirable.boxNum}}盒｜{{item.finishedUndesirable.num}}{{item.finishedUndesirable.unitName}}</span>
|
<span class="rk_wl_content_item_c" v-if="item.finishedScrap && item.finishedScrap.boxNum > 0 && item.finishedScrap.num > 0">已完工 <span class="bf">[待报废]</span>：{{item.finishedScrap.boxNum}}盒｜{{item.finishedScrap.num}}{{item.finishedScrap.unitName}}</span>
|
<span class="rk_wl_content_item_d" v-if="item.qualified && item.qualified.boxNum > 0 && item.qualified.num > 0"><span class="nv">未生产</span> <span class="hg">[合格品]</span>：{{item.qualified.boxNum}}盒｜{{item.qualified.num}}{{item.qualified.unitName}}</span>
|
<span class="rk_wl_content_item_e" v-if="item.undesirable && item.undesirable.boxNum > 0 && item.undesirable.num > 0"><span class="nv">未生产</span> <span class="bl">[不良品]</span>：{{item.undesirable.boxNum}}盒｜{{item.undesirable.num}}{{item.undesirable.unitName}}</span>
|
</div>
|
</div>
|
<div class="rk_sc_kong" v-else>
|
<span>暂无数据</span>
|
</div>
|
</div>
|
<div class="rk_sc">
|
<div class="rk_sc_header">
|
<div class="rk_sc_header_x"></div>
|
<span>本次余留次班生产</span>
|
</div>
|
<div class="rk_sc_content" v-if="info.finishedInBillBeanList && info.finishedInBillBeanList.length > 0">
|
<div class="rk_sc_content_item" v-for="(item, index) in info.finishedInBillBeanList" :key="index">
|
<div class="rk_sc_content_item_a">{{item.code}}</div>
|
<div class="rk_sc_content_item_b">
|
<span>接收人：{{item.userName}}/{{item.departmentName}} </span>
|
<span>时间：{{item.dealDate}}</span>
|
</div>
|
<div class="rk_sc_content_item_hz" v-if="item.appliancesMaterialBeanList">
|
<div class="rk_sc_content_item_hz_item" v-for="(item1, idx) in item.appliancesMaterialBeanList" :key="idx">
|
<div class="rk_sc_content_item_hz_item_top">
|
<span>{{item1.materialName}} | {{item1.materialCode}}</span>
|
</div>
|
<div class="rk_sc_content_item_hz_item_bottom">
|
<span v-if="item1.qualified"><span class="ls">未生产</span> <span class="succ">[合格品]</span>：{{item1.qualified.boxNum}}盒｜{{item1.qualified.num}}{{item1.qualified.unitName}}</span>
|
<span v-if="item1.undesirable"><span class="ls">未生产</span> <span class="err">[不合格]</span>：{{item1.undesirable.boxNum}}盒｜{{item1.undesirable.num}}{{item1.undesirable.unitName}}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="rk_sc_kong">
|
<span>暂无数据</span>
|
</div>
|
</div>
|
<div class="rk_zw"></div>
|
<div class="rk_footer">
|
<div class="rk_footer_s" @click="jump">余留次班</div>
|
<button class="rk_footer_u" @click="submit" v-preventReClick>完工入库</button>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
import { Toast } from 'vant'
|
import { useRouter, useRoute } from "vue-router"
|
import { finishedDetail, finished } from '@/apis/WorkOrderAPI'
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
let info: any = ref([])
|
|
// 完工入库提交
|
const submit = () => {
|
// if (window.sessionStorage.getItem('ids')) {
|
let deviceIds: any = route.query.ids
|
finished({
|
deviceIds: deviceIds ? deviceIds : '',
|
inIds: window.sessionStorage.getItem('ids') ? window.sessionStorage.getItem('ids') : ''
|
}).then(res => {
|
if (res.code === 200) {
|
Toast.success({
|
message: '入库成功',
|
duration: 2000,
|
forbidClick: true
|
})
|
setTimeout(() => {
|
// router.go(-1)
|
router.replace({ path: '/workbench' })
|
}, 2000)
|
}
|
})
|
// } else {
|
// Toast({ message: '请先选择余留次班' })
|
// }
|
|
}
|
|
// 获取详情
|
const finishedDetails = (ids: any) => {
|
finishedDetail({
|
deviceIds: route.query.ids,
|
inIds: ids ? ids : ''
|
}).then(res => {
|
if (res.code === 200) {
|
console.log(res)
|
info.value = res.data
|
}
|
})
|
}
|
|
// 跳转预留班次
|
const jump = () => {
|
// if (window.sessionStorage.getItem('ids')) {
|
// router.push({ name: 'secondShift', query: { id: info.value.produceLocationIds, ids: window.sessionStorage.getItem('ids') } })
|
// } else {
|
router.push({ name: 'secondShift', query: { id: info.value.produceLocationIds } })
|
// }
|
}
|
|
onMounted(() => {
|
|
finishedDetails(window.sessionStorage.getItem('ids'))
|
|
})
|
|
onBeforeUnmount(() => {
|
|
if (window.sessionStorage.getItem('ids')) {
|
window.sessionStorage.removeItem('ids')
|
}
|
|
})
|
</script>
|
|
<style lang="scss" scoped>
|
.rk {
|
width: 100%;
|
height: 100%;
|
position: absolute;
|
background: #F7F7F7;
|
.rk_info {
|
display: flex;
|
flex-direction: column;
|
padding: 30px;
|
box-sizing: border-box;
|
span {
|
font-size: 26px;
|
font-weight: 400;
|
color: #333333;
|
&:first-child {
|
margin-bottom: 24px;
|
}
|
}
|
}
|
.rk_statistics {
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
justify-content: space-between;
|
padding: 0 30px;
|
box-sizing: border-box;
|
.rk_statistics_item {
|
width: 31%;
|
padding: 30px 0;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
background: #FFFFFF;
|
border-radius: 8px;
|
margin-bottom: 20px;
|
.yellow {
|
color: $nav-stateColor5 !important;
|
}
|
.orange {
|
color: #DE5243 !important;
|
}
|
.grey {
|
color: #222222 !important;
|
}
|
span {
|
&:nth-child(1) {
|
font-size: 36px;
|
font-weight: 600;
|
color: $nav-stateColor2;
|
}
|
&:nth-child(2) {
|
font-size: 22px;
|
font-weight: 400;
|
color: #666666;
|
margin: 20px 0;
|
}
|
&:nth-child(3) {
|
font-size: 24px;
|
font-weight: 400;
|
color: #333333;
|
.lan {
|
font-size: 24px;
|
color: $nav-color !important;
|
}
|
}
|
}
|
}
|
}
|
.rk_wl {
|
.rk_wl_header {
|
display: flex;
|
flex-direction: column;
|
padding: 30px;
|
.rk_wl_header_top {
|
display: flex;
|
align-items: center;
|
.rk_wl_header_top_x {
|
width: 8px;
|
height: 30px;
|
background: #4275FC;
|
border-radius: 2px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 32px;
|
font-weight: 500;
|
color: #222222;
|
}
|
}
|
.rk_wl_header_bottom {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
span {
|
font-size: 24px;
|
font-weight: 400;
|
color: #666666;
|
}
|
}
|
}
|
.rk_sc_kong {
|
width: 100%;
|
height: 90px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
background: #ffffff;
|
span {
|
font-size: 25px;
|
color: black;
|
}
|
}
|
.rk_wl_content {
|
padding: 30px 30px 0 30px;
|
background: white;
|
.rk_wl_content_item {
|
display: flex;
|
flex-direction: column;
|
border-bottom: 1px solid #E5E5E5;
|
margin-bottom: 28px;
|
&:last-child {
|
border: none;
|
margin-bottom: 0;
|
}
|
.rk_wl_content_item_a {
|
font-size: 26px;
|
font-weight: 400;
|
color: #333333;
|
margin-bottom: 30px;
|
.hg {
|
color: $nav-stateColor2;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
}
|
.rk_wl_content_item_b {
|
font-size: 26px;
|
font-weight: 400;
|
color: #333333;
|
margin-bottom: 30px;
|
.bl {
|
color: $nav-stateColor5;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
}
|
.rk_wl_content_item_c {
|
font-size: 26px;
|
font-weight: 400;
|
color: #333333;
|
margin-bottom: 30px;
|
.bf {
|
color: $nav-stateColor4;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
}
|
.rk_wl_content_item_d {
|
font-size: 26px;
|
font-weight: 400;
|
color: #333333;
|
margin-bottom: 30px;
|
.nv {
|
color: $nav-color;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
.hg {
|
color: $nav-stateColor2;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
.bf {
|
color: $nav-stateColor4;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
}
|
.rk_wl_content_item_e {
|
font-size: 26px;
|
font-weight: 400;
|
color: #333333;
|
margin-bottom: 30px;
|
.nv {
|
color: $nav-color;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
.hg {
|
color: $nav-stateColor2;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
.bl {
|
color: $nav-stateColor5;
|
font-size: 26px;
|
font-weight: 400;
|
}
|
}
|
span {
|
&:nth-child(1) {
|
font-size: 30px;
|
font-weight: 500;
|
color: #222222;
|
margin-bottom: 32px;
|
}
|
}
|
}
|
}
|
}
|
.rk_sc {
|
.rk_sc_header {
|
padding: 30px;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
.rk_sc_header_x {
|
width: 8px;
|
height: 30px;
|
background: #4275FC;
|
border-radius: 2px;
|
margin-right: 12px;
|
}
|
span {
|
font-size: 32px;
|
font-weight: 500;
|
color: #222222;
|
}
|
}
|
.rk_sc_kong {
|
width: 100%;
|
height: 90px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
background: #ffffff;
|
span {
|
font-size: 25px;
|
color: black;
|
}
|
}
|
.rk_sc_content {
|
padding: 0 30px;
|
background: white;
|
.rk_sc_content_item {
|
padding: 30px 0;
|
border-bottom: 1px solid #E5E5E5;
|
&:last-child {
|
border: none;
|
}
|
.rk_sc_content_item_a {
|
font-size: 30px;
|
font-weight: 500;
|
color: #222222;
|
margin-bottom: 24px;
|
}
|
.rk_sc_content_item_b {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
span {
|
font-size: 24px;
|
font-weight: 400;
|
color: #666666;
|
}
|
}
|
.rk_sc_content_item_hz {
|
padding: 24px 30px;
|
background: #F7F7F7;
|
border-radius: 16px;
|
margin-top: 24px;
|
.rk_sc_content_item_hz_item {
|
border-bottom: 1px solid #E5E5E5;
|
margin-bottom: 22px;
|
&:last-child {
|
border: none;
|
margin: 0;
|
}
|
.rk_sc_content_item_hz_item_top {
|
margin-bottom: 24px;
|
span {
|
font-size: 28px;
|
font-weight: 500;
|
color: #333333;
|
}
|
}
|
.rk_sc_content_item_hz_item_bottom {
|
margin-bottom: 24px;
|
display: flex;
|
flex-direction: column;
|
span {
|
font-size: 24px;
|
font-weight: 400;
|
color: #222222;
|
margin-bottom: 20px;
|
&:last-child {
|
margin-bottom: 0;
|
}
|
.err {
|
color: $nav-stateColor4 !important;
|
}
|
.ls {
|
color: $nav-color !important;
|
}
|
.succ {
|
color: $nav-stateColor2 !important;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
.rk_zw {
|
height: 168px;
|
background: #F7F7F7;
|
}
|
.rk_footer {
|
position: fixed;
|
bottom: 0;
|
left: 30px;
|
width: calc(100% - 60px);
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding-bottom: 68px;
|
.rk_footer_s {
|
width: 334px;
|
height: 88px;
|
background: #FFFFFF;
|
box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08);
|
border-radius: 8px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 30px;
|
font-weight: 500;
|
color: $nav-color;
|
}
|
.rk_footer_u {
|
width: 334px;
|
height: 88px;
|
border: none;
|
background: $nav-color;
|
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
|
border-radius: 8px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 30px;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
}
|
}
|
</style>
|
