382 lines
9.5 KiB
Vue
382 lines
9.5 KiB
Vue
<template>
|
||
<view class="zd_container">
|
||
<nav-bar :title="title"></nav-bar>
|
||
<view class="zd_content">
|
||
<view class="zd_wrapper">
|
||
<view class="zd-row border-bottom">
|
||
<view class="zd-col-7">
|
||
<span class="filter_label">{{pType ? '目标托盘' : '原始托盘'}}</span>
|
||
</view>
|
||
<view class="zd-col-17">
|
||
<search-box
|
||
v-model="val1"
|
||
@handleChange="handleChange"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-show="oPallet" class="table_container bg_blue">
|
||
<view class="font-1">原始托盘：<text>{{oPallet}}</text></view>
|
||
<view class="th_content">
|
||
<table class="table">
|
||
<tr>
|
||
<th width="28%" class="th_c">800号</th>
|
||
<th width="28%">物料编码</th>
|
||
<th width="25%">数量</th>
|
||
<th width="19%">
|
||
<view class="flex-center" @tap="toggleSelectAll">
|
||
<uni-icons class="icon-check" type="checkmarkempty" size="20" :color="isAllSelected ? '#010319' : 'transparent'"></uni-icons>
|
||
</view>
|
||
</th>
|
||
</tr>
|
||
</table>
|
||
</view>
|
||
<view class="table_content">
|
||
<table class="table">
|
||
<tr v-for="(e, i) in oPalletData" :key="'o' + i">
|
||
<td width="28%" class="td_c">{{e.order_code}}</td>
|
||
<td width="28%">{{e.material_code}}</td>
|
||
<td width="25%">{{e.material_qty}}</td>
|
||
<td width="19%">
|
||
<view class="flex-center" @tap="toggleSelect(i)">
|
||
<uni-icons class="icon-check" type="checkmarkempty" size="20" :color="e.selected ? '#3a3a3a' : 'transparent'"></uni-icons>
|
||
</view>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</view>
|
||
</view>
|
||
<view v-show="oPallet && tPallet" class="change-wrap" @tap="interChange">
|
||
<uni-icons type="arrow-down" size="30" color="#3a3a3a"></uni-icons>
|
||
<uni-icons type="arrow-up" size="30" color="#3a3a3a"></uni-icons>
|
||
</view>
|
||
<view v-show="tPallet" class="table_container bg_red">
|
||
<view class="font-1">目标托盘：<text>{{tPallet}}</text></view>
|
||
<view class="th_content">
|
||
<table class="table">
|
||
<tr>
|
||
<th width="35%" class="th_c">800号</th>
|
||
<th width="35%">物料编码</th>
|
||
<th width="30%">数量</th>
|
||
</tr>
|
||
</table>
|
||
</view>
|
||
<view class="table_content">
|
||
<table class="table">
|
||
<tr v-for="(e, i) in tPalletData" :key="'t' + i">
|
||
<td width="35%" class="td_c">{{e.order_code}}</td>
|
||
<td width="35%">{{e.material_code}}</td>
|
||
<td width="30%">{{e.material_qty}}</td>
|
||
</tr>
|
||
</table>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="zd-row submit-bar">
|
||
<button class="zd-col-7 button-default" @tap="clearUp">清空</button>
|
||
<button class="zd-col-15 button-primary" :class="{'button-info': !oPallet || !tPallet}" :disabled="disabled" @tap="toSure">合托</button>
|
||
</view>
|
||
<view class="msg_wrapper" :class="show ? 'popshow' : 'pophide'">
|
||
<view class="pop_content">
|
||
<view class="zd_wrapper">
|
||
<view class="zd-row border-bottom">
|
||
<view class="zd-col-7">
|
||
<span class="filter_label">入库托盘码</span>
|
||
</view>
|
||
<view class="zd-col-17">
|
||
<search-box
|
||
v-model="val2"
|
||
/>
|
||
</view>
|
||
</view>
|
||
<view class="zd-row border-bottom">
|
||
<view class="zd-col-7">
|
||
<span class="filter_label">入库点位</span>
|
||
</view>
|
||
<view class="zd-col-17">
|
||
<search-box
|
||
v-model="val3"
|
||
/>
|
||
</view>
|
||
</view>
|
||
<view class="mgt20 font-size-1">{{message}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="zd-row submit-bar">
|
||
<button class="zd-col-22 button-primary" :class="{'button-info': !val2 || !val3}" :disabled="disabled" @tap="_generateStoreInTask">入库</button>
|
||
</view>
|
||
</view>
|
||
<view v-show="show" class="msg_mask"></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import NavBar from '@/components/NavBar.vue'
|
||
import SearchBox from '@/components/SearchBox.vue'
|
||
import {checkTrayInfo, combineMaterials, generateStoreInTask} from '@/utils/getData2.js'
|
||
export default {
|
||
components: {
|
||
NavBar,
|
||
SearchBox
|
||
},
|
||
data() {
|
||
return {
|
||
title: '',
|
||
val1: '',
|
||
disabled: false,
|
||
pType: 0, // 0是原始托盘，1是目标托盘
|
||
oPallet: null,
|
||
tPallet: null,
|
||
oPalletData: [],
|
||
tPalletData: [],
|
||
show: false,
|
||
val2: '',
|
||
val3: '',
|
||
times: 0,
|
||
message: null
|
||
};
|
||
},
|
||
computed: {
|
||
isAllSelected() {
|
||
if (this.oPalletData.length === 0) return false
|
||
return this.oPalletData.every(item => item.selected)
|
||
},
|
||
selectedItems() {
|
||
return this.oPalletData.filter(item => item.selected)
|
||
}
|
||
},
|
||
onLoad (options) {
|
||
this.title = options.title
|
||
},
|
||
methods: {
|
||
handleChange (e) {
|
||
if (e) {
|
||
this._checkTrayInfo(e)
|
||
}
|
||
},
|
||
async _checkTrayInfo (e) {
|
||
try {
|
||
let res = await checkTrayInfo(e)
|
||
if (this.pType === 0) {
|
||
this.oPallet = res.vehicle_code
|
||
this.oPalletData = res.materials.map(item => ({
|
||
...item,
|
||
selected: false
|
||
}))
|
||
this.pType = 1
|
||
} else {
|
||
this.tPallet = res.vehicle_code
|
||
this.tPalletData = [...res.materials]
|
||
this.pType = 0
|
||
}
|
||
} catch (e) {
|
||
if (this.pType === 0) {
|
||
this.oPallet = null
|
||
this.oPalletData = []
|
||
} else {
|
||
this.tPallet = null
|
||
this.tPalletData = []
|
||
}
|
||
}
|
||
},
|
||
toggleSelect(index) {
|
||
this.$set(this.oPalletData, index, {
|
||
...this.oPalletData[index],
|
||
selected: !this.oPalletData[index].selected
|
||
})
|
||
},
|
||
toggleSelectAll() {
|
||
const allSelected = this.isAllSelected
|
||
this.oPalletData = this.oPalletData.map(item => ({
|
||
...item,
|
||
selected: !allSelected
|
||
}))
|
||
},
|
||
interChange () {
|
||
const tempPallet = this.oPallet
|
||
const tempPalletData = [...this.oPalletData]
|
||
|
||
this.oPallet = this.tPallet
|
||
this.oPalletData = [...this.tPalletData]
|
||
|
||
this.tPallet = tempPallet
|
||
this.tPalletData = tempPalletData
|
||
|
||
this.resetSelection()
|
||
},
|
||
resetSelection() {
|
||
this.oPalletData = this.oPalletData.map(item => ({
|
||
...item,
|
||
selected: false
|
||
}))
|
||
},
|
||
clearUp () {
|
||
this.val1 = ''
|
||
this.disabled = false
|
||
this.pType = 0
|
||
this.oPallet = null
|
||
this.tPallet = null
|
||
this.oPalletData = []
|
||
this.tPalletData = []
|
||
this.times = 0
|
||
this.message = null
|
||
this.val2 = ''
|
||
this.val3 = ''
|
||
this.show = false
|
||
},
|
||
toSure () {
|
||
this.disabled = true
|
||
if (!this.oPallet || !this.tPallet) {
|
||
this.disabled = false
|
||
return
|
||
}
|
||
if (this.selectedItems.length < this.oPalletData.length) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '本次合托未全部转移，是否确定？',
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this._combineMaterials()
|
||
} else if (res.cancel) {
|
||
this.disabled = false
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
this._combineMaterials()
|
||
}
|
||
},
|
||
async _combineMaterials () {
|
||
try {
|
||
let res = await combineMaterials(this.oPallet, this.tPallet, this.selectedItems)
|
||
if (!res.need_store_in) {
|
||
this.clearUp()
|
||
uni.showToast({
|
||
title: res.message,
|
||
icon: 'none'
|
||
})
|
||
} else if (res.need_store_in) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '请将托盘放置在SD01/SD02点位，扫描托盘码进行入库。',
|
||
showCancel: false,
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.show = true
|
||
}
|
||
}
|
||
})
|
||
}
|
||
this.disabled = false
|
||
} catch (e) {
|
||
this.disabled = false
|
||
}
|
||
},
|
||
async _generateStoreInTask () {
|
||
this.disabled = true
|
||
if (!this.val2 || !this.val3) {
|
||
this.disabled = false
|
||
return
|
||
}
|
||
try {
|
||
let res = await generateStoreInTask(this.val2, this.val3, this.oPallet, this.tPallet)
|
||
if (this.times === 0) {
|
||
uni.showToast({
|
||
title: res.message,
|
||
icon: 'none'
|
||
})
|
||
if (res.is_second_store_in) {
|
||
this.val2 = ''
|
||
this.val3 = ''
|
||
this.times = 1
|
||
this.message = '请等待AGV取走第一个托盘后再将另一个托盘放置在SD01点位，扫描托盘码进行入库。'
|
||
}
|
||
} else {
|
||
if (res.is_second_store_in) {
|
||
uni.showToast({
|
||
title: res.message,
|
||
icon: 'none'
|
||
})
|
||
this.clearUp()
|
||
} else {
|
||
this.message = '第一个托盘还未取走，请等待取走后再提交。'
|
||
}
|
||
}
|
||
this.disabled = false
|
||
} catch (e) {
|
||
this.disabled = false
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="stylus" scoped>
|
||
@import '../../common/style/mixin.styl';
|
||
.table_container
|
||
width 100%
|
||
border-radius 24rpx
|
||
padding 22rpx 11rpx
|
||
margin-bottom 20rpx
|
||
box-shadow inset 0px 0px 3px 1px rgba(255, 255, 255, 50%)
|
||
.bg_blue
|
||
background-color #98c1ff
|
||
.bg_red
|
||
background-color #fdbaa0
|
||
.table
|
||
th
|
||
&.th_c
|
||
color #e2483c
|
||
td
|
||
&.td_c
|
||
color #c74e44
|
||
.font-1
|
||
_font(32rpx, 36rpx, #000620,,)
|
||
padding 0 22rpx
|
||
margin-bottom 20rpx
|
||
text
|
||
_font(36rpx, 36rpx, #000620,700,)
|
||
.th_content
|
||
width calc(100% - 22rpx)
|
||
margin 0 auto
|
||
.table_content
|
||
width calc(100% - 22rpx)
|
||
margin 0 auto
|
||
background-color #fff
|
||
border-radius 24rpx
|
||
.table
|
||
width 100%
|
||
color #fff
|
||
border-spacing 0
|
||
padding 0 11rpx
|
||
th
|
||
_font(32rpx, 32rpx, #010319,700,center)
|
||
padding 20rpx 10rpx
|
||
.icon-check
|
||
border-color #010319
|
||
&.th_c
|
||
color #165ad1
|
||
td
|
||
_font(32rpx, 32rpx, #3a3a3a,,center)
|
||
padding 20rpx 10rpx
|
||
white-space pre-wrap
|
||
word-break break-all
|
||
border-bottom 1px dashed #343434
|
||
&.td_c
|
||
color #0083ff
|
||
tr
|
||
&:last-child
|
||
td
|
||
border-bottom 0
|
||
.icon-check
|
||
width 28px
|
||
height 28px
|
||
line-height: 26px
|
||
border 1px solid #3a3a3a
|
||
.change-wrap
|
||
width 60px
|
||
margin 0 auto
|
||
border 1px solid #3a3a3a
|
||
margin-bottom 20rpx
|
||
</style>
|