<template>
|
<a-drawer
|
title="工位详情详情"
|
wrapClassName="weiben-private-drawer"
|
:width="400"
|
:closable="false"
|
:maskClosable="true"
|
:visible="visible"
|
:after-visible-change="afterVisibleChange"
|
@close="onClose"
|
>
|
<a-spin :spinning="loading">
|
<div class="station-view-detail-div">
|
<div class="btns-row">
|
<a-button type="primary" :disabled="stationObj.status!==0" @click.stop="onUpdateLock">停用</a-button>
|
<a-button type="primary" :disabled="stationObj.status!==1" @click.stop="onUpdateLock">启用</a-button>
|
<a-button type="primary" :disabled="!(stationObj.status===0&&stationObj.stataionStatus!==1)" @click.stop="onUpdateEmpty">置空</a-button>
|
</div>
|
<div class="location-detail-box">
|
<div class="base-info info-box">
|
<p>工位编号：{{stationObj.code}}</p>
|
<p>工位名称：{{stationObj.name}}</p>
|
<p>托盘码：{{stationObj.containerCode}}</p>
|
</div>
|
<!-- 物料列表 start -->
|
<div class="location-materials">
|
|
<div class="location-material-item" v-for="(item,index) in materialList" :key="'material-item-'+index">
|
<a-card>
|
<div class="info-box">
|
<p>物料编号：{{item.materialNo}}</p>
|
<p>物料名称：{{item.materialName}}</p>
|
<p>尺寸：{{item.materialSpec}}</p>
|
<p>船号：{{item.shipNo}}</p>
|
<p>图号：{{item.drawingNo}}</p>
|
</div>
|
</a-card>
|
</div>
|
|
</div>
|
<!-- 物料列表 end -->
|
</div>
|
</div>
|
</a-spin>
|
</a-drawer>
|
</template>
|
|
<script>
|
import { GetStationDetail,UpdateLock,UpdateEmpty } from '@/api/modular/main/StationViewManage'
|
export default {
|
name:'stationViewDetailDrawer',
|
emits:['update:visible','callback'],
|
props:{
|
visible:{
|
type:Boolean,
|
default:false
|
},
|
row:{
|
type:Object,
|
default:function(){
|
return {}
|
}
|
}
|
},
|
data(){
|
return {
|
loading:false,
|
stationObj:{
|
placestatus:null,
|
islock:null
|
},
|
containercode:'',
|
materialList:[],
|
actionFlag:false
|
}
|
},
|
methods:{
|
onClose(){
|
this.close()
|
},
|
close(){
|
this.$emit('update:visible',false)
|
},
|
afterVisibleChange(visible){
|
if (visible) {
|
this.initShow()
|
} else {
|
this.afterClsoe()
|
}
|
},
|
initShow(){
|
this.loading = true;
|
this.getLocationDetail(()=>{
|
this.loading = false;
|
})
|
},
|
getLocationDetail(callback){
|
let params = {ID:this.row.id}
|
GetStationDetail(params).then((d)=>{
|
this.stationObj = d.data.lesStation || {}
|
this.materialList = d.data.assembleMaterialContainer || []
|
callback && callback(true)
|
}).catch(()=>{
|
callback && callback(false)
|
})
|
},
|
afterClsoe(){
|
this.locationObj = {
|
status:null,
|
stataionStatus:null
|
}
|
this.materialList = []
|
if (this.actionFlag) {
|
this.$emit('callback')
|
}
|
this.actionFlag = false
|
},
|
onUpdateLock(){
|
this.loading = true;
|
let params = {ID:this.row.id}
|
UpdateLock(params).then(()=>{
|
this.actionFlag = true;
|
this.getLocationDetail(()=>{
|
this.loading = false;
|
this.$message.success('操作成功！');
|
})
|
}).catch(()=>{
|
this.loading = false;
|
})
|
},
|
onUpdateEmpty(){
|
this.loading = true;
|
let params = {ID:this.row.id}
|
UpdateEmpty(params).then(()=>{
|
this.actionFlag = true;
|
this.getLocationDetail(()=>{
|
this.loading = false;
|
this.$message.success('操作成功！');
|
})
|
}).catch(()=>{
|
this.loading = false;
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.station-view-detail-div{
|
height:100%;
|
display: flex;
|
flex-direction: column;
|
&>.btns-row{
|
flex-shrink: 0;
|
padding:12px 16px;
|
.ant-btn + .ant-btn {
|
margin-left: 10px;
|
}
|
}
|
.location-detail-box{
|
flex-grow: 1;
|
overflow: auto;
|
}
|
.info-box{
|
line-height: 1.5;
|
p{
|
margin-bottom: 0;
|
}
|
}
|
.base-info,.location-materials{
|
padding:0 16px;
|
margin-bottom: 16px;
|
}
|
.location-materials{
|
.location-material-item{
|
margin-bottom: 12px;
|
&:last-child {
|
margin-bottom: 0;
|
}
|
}
|
}
|
}
|
</style>
|
