forked from BaoKaiWms/202501-Wms-Kate-Wuxi
381 lines
16 KiB
Vue
381 lines
16 KiB
Vue
|
<template>
|
||
|
|
<el-config-provider :locale="zhCn">
|
||
|
|
<el-container class="content">
|
||
|
|
<div class="work-area">
|
||
|
|
<fieldset class="search-area">
|
||
|
|
<el-form ref="outTaskRef" :model="outTaskEntity" :label-position="labelPosition" label-width="158px"
|
||
|
|
style="max-width: 100%" :rules="requestRules" status-icon>
|
||
|
|
<div style="display: flex; justify-content: space-between;">
|
||
|
|
<el-row>
|
||
|
|
<el-form-item label="出库类型" prop="outType">
|
||
|
|
<el-select-v2 v-model="outTaskEntity.outType" placeholder="请选择入库类型"
|
||
|
|
:options="outTypeOptions"></el-select-v2>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="料号" prop="goodsId">
|
||
|
|
<el-input v-model="outTaskEntity.goodsId" ref="goodsId" clearable />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="箱号" prop="vehicleId" v-if="outTaskEntity.outType != 9">
|
||
|
|
<el-input v-model="outTaskEntity.vehicleId" ref="vehicleId" clearable />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="数量" prop="needNum">
|
||
|
|
<el-input-number v-model.number="outTaskEntity.needNum" ref="needNum"
|
||
|
|
controls-position="right" :min="1" clearable />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="原因" prop="reason" v-if="outTaskEntity.outType == 9">
|
||
|
|
<el-select-v2 v-model="outTaskEntity.reason" placeholder="请选择紧急出库原因"
|
||
|
|
:options="resonOptions"></el-select-v2>
|
||
|
|
</el-form-item>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-button type="primary"
|
||
|
|
style="height: 50px; width: 100px; margin: auto 5px auto 5px; font-size: large; color: black;"
|
||
|
|
@click="confirmOut()">确认出库</el-button>
|
||
|
|
<el-button type="warning"
|
||
|
|
style="height: 50px; width: 100px; margin: auto 5px auto 5px; font-size: large; color: black;"
|
||
|
|
@click="clearInput()">清除输入</el-button>
|
||
|
|
</el-row>
|
||
|
|
</div>
|
||
|
|
</el-form>
|
||
|
|
</fieldset>
|
||
|
|
<fieldset class="confirm-area">
|
||
|
|
<el-form ref="confirmRef" :model="confirmEntity" :label-position="labelPosition" label-width="158px"
|
||
|
|
style="max-width: 100%" :rules="confirmRules" status-icon>
|
||
|
|
<div style="display: flex; justify-content: space-between;">
|
||
|
|
<el-row>
|
||
|
|
<el-row style="border-bottom: dashed 1px black;">
|
||
|
|
<el-form-item label="出库类型" prop="outType">
|
||
|
|
<el-select-v2 v-model="confirmEntity.outType" placeholder=" "
|
||
|
|
:options="outTypeOptions" disabled></el-select-v2>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="物料号" prop="goodsId">
|
||
|
|
<el-input v-model="confirmEntity.goodsId" disabled />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="总需求" prop="totalNeed">
|
||
|
|
<el-input v-model="confirmEntity.totalNeed" disabled />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="剩余需求" prop="remainNeed">
|
||
|
|
<el-input v-model="confirmEntity.remainNeed" disabled />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="本次计划拣选" prop="planPickQty">
|
||
|
|
<el-input v-model="confirmEntity.planPickQty" disabled />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="本次实际拣选" prop="realPickQty">
|
||
|
|
<el-input-number v-model.number="confirmEntity.realPickQty"
|
||
|
|
controls-position="right" :min="0" clearable @change="changePlanQty()" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-form-item label="箱号" prop="vehicleId">
|
||
|
|
<el-input v-model="confirmEntity.vehicleId" disabled />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="计划剩余数量" prop="planRemainQty">
|
||
|
|
<el-input v-model="confirmEntity.planRemainQty" disabled />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="实际剩余数量" prop="realRemainQty">
|
||
|
|
<el-input-number v-model.number="confirmEntity.realRemainQty"
|
||
|
|
controls-position="right" :min="0" clearable />
|
||
|
|
</el-form-item>
|
||
|
|
</el-row>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-button type="success"
|
||
|
|
style="height: 50px; width: 100px; margin: auto 5px auto 5px; font-size: large; color: black;"
|
||
|
|
@click="confirmOrRelease()">确认/放行</el-button>
|
||
|
|
</el-row>
|
||
|
|
</div>
|
||
|
|
</el-form>
|
||
|
|
</fieldset>
|
||
|
|
</div>
|
||
|
|
</el-container>
|
||
|
|
</el-config-provider>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import store from '@/store'
|
||
|
|
import { requireStockOut, getCurrentTask, confirmCurrentTask } from '@/api/task.js'
|
||
|
|
import { errorBox, warningBox } from '@/utils/myMessageBox.js'
|
||
|
|
import { ElMessage } from 'element-plus'
|
||
|
|
import { reactive, ref } from 'vue'
|
||
|
|
import { loading } from '@/utils/loading'
|
||
|
|
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'goodsOut',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
standId: store.getters.getStandId,
|
||
|
|
userName: store.getters.getUserName,
|
||
|
|
timer: '',
|
||
|
|
labelPosition: 'top',
|
||
|
|
outTaskRef: ref(),
|
||
|
|
outTaskEntity: reactive({
|
||
|
|
outType: 9,
|
||
|
|
goodsId: '',
|
||
|
|
vehicleId: '',
|
||
|
|
reason: '',
|
||
|
|
needNum: null
|
||
|
|
}),
|
||
|
|
requestRules: reactive({
|
||
|
|
outType: [
|
||
|
|
{ required: true, message: '请选择入库类型' }
|
||
|
|
],
|
||
|
|
needNum: [
|
||
|
|
{ required: true, message: '请输入数量' },
|
||
|
|
{ type: 'number', message: '请输入数字值' }
|
||
|
|
],
|
||
|
|
}),
|
||
|
|
outTypeOptions: [
|
||
|
|
{
|
||
|
|
label: '空箱出库',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '紧急出库',
|
||
|
|
value: 9
|
||
|
|
}
|
||
|
|
],
|
||
|
|
resonOptions: [
|
||
|
|
{
|
||
|
|
label: '补料',
|
||
|
|
value: '补料'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '少K',
|
||
|
|
value: '少K'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '缺料',
|
||
|
|
value: '缺料'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '返工工单',
|
||
|
|
value: '返工工单'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
confirmRef: ref(),
|
||
|
|
confirmEntity: reactive({}),
|
||
|
|
confirmRules: reactive({}),
|
||
|
|
pauseGetPickFlag: false,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.timer = setInterval(() => {
|
||
|
|
this.getTask()
|
||
|
|
}, 1000)
|
||
|
|
})
|
||
|
|
},
|
||
|
|
beforeUnmount() {
|
||
|
|
clearInterval(this.timer)
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
// 清除输入
|
||
|
|
clearInput() {
|
||
|
|
this.outTaskEntity = reactive({
|
||
|
|
outType: 9,
|
||
|
|
goodsId: '',
|
||
|
|
vehicleId: '',
|
||
|
|
needNum: null
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 确认出库
|
||
|
|
confirmOut() {
|
||
|
|
if (this.outTaskEntity.needNum == null) {
|
||
|
|
errorBox('请输入正确的数量。')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
if (this.outTaskEntity.outType != 1) {
|
||
|
|
if (this.outTaskEntity.goodsId == '') {
|
||
|
|
errorBox('非空箱出库时，请输入料号。')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (this.outTaskEntity.outType == 9) {
|
||
|
|
if (this.outTaskEntity.reason == '') {
|
||
|
|
errorBox('紧急出库请选择原因。')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
}
|
||
|
|
const request = {
|
||
|
|
outType: this.outTaskEntity.outType,
|
||
|
|
goodsId: this.outTaskEntity.goodsId.toUpperCase(),
|
||
|
|
vehicleId: this.outTaskEntity.vehicleId,
|
||
|
|
needNum: this.outTaskEntity.needNum,
|
||
|
|
reason: this.outTaskEntity.reason,
|
||
|
|
destination: this.standId,
|
||
|
|
userName: this.userName,
|
||
|
|
standId: this.standId
|
||
|
|
}
|
||
|
|
loading.open('请求中，请稍等...')
|
||
|
|
requireStockOut(request).then(res => {
|
||
|
|
const response = res.data
|
||
|
|
if (response.code == 0) {
|
||
|
|
// 成功
|
||
|
|
ElMessage.success(response.message)
|
||
|
|
this.clearInput()
|
||
|
|
} else {
|
||
|
|
errorBox(response.message)
|
||
|
|
}
|
||
|
|
}).catch(err => {
|
||
|
|
console.log(err)
|
||
|
|
errorBox('请求错误。')
|
||
|
|
}).finally(() => {
|
||
|
|
loading.close()
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 获取拣选信息
|
||
|
|
getTask() {
|
||
|
|
if (this.pauseGetPickFlag) {
|
||
|
|
return
|
||
|
|
}
|
||
|
|
const request = {
|
||
|
|
standId: this.standId,
|
||
|
|
userName: this.userName
|
||
|
|
}
|
||
|
|
// 获取当前拣选信息
|
||
|
|
getCurrentTask(request).then(res => {
|
||
|
|
const response = res.data
|
||
|
|
if (response.code == 0) {
|
||
|
|
const confirmVo = response.data
|
||
|
|
// 设置form
|
||
|
|
this.confirmEntity = {
|
||
|
|
taskId: confirmVo.taskConfirm.taskId,
|
||
|
|
outType: confirmVo.taskConfirm.outType,
|
||
|
|
goodsId: confirmVo.taskConfirm.goodsId,
|
||
|
|
totalNeed: confirmVo.taskConfirm.totalNeed,
|
||
|
|
remainNeed: confirmVo.taskConfirm.remainNeed,
|
||
|
|
planPickQty: confirmVo.taskConfirm.planPickQty,
|
||
|
|
realPickQty: confirmVo.taskConfirm.realPickQty,
|
||
|
|
stockId: confirmVo.stockConfirm.stockId,
|
||
|
|
vehicleId: confirmVo.stockConfirm.vehicleId,
|
||
|
|
planRemainQty: confirmVo.stockConfirm.planRemainQty,
|
||
|
|
realRemainQty: confirmVo.stockConfirm.realRemainQty,
|
||
|
|
isOut: confirmVo.stockConfirm.isOut,
|
||
|
|
putArea: confirmVo.stockConfirm.putArea,
|
||
|
|
warningQty: confirmVo.stockConfirm.warningQty
|
||
|
|
}
|
||
|
|
this.pauseGetPickFlag = true
|
||
|
|
// 如果剩余数量低于预警值，弹框报警
|
||
|
|
if (this.confirmEntity.isOut == 0 && this.confirmEntity.planRemainQty <= this.confirmEntity.warningQty) {
|
||
|
|
warningBox('剩余数量低于预警值，请清点库存数量。')
|
||
|
|
}
|
||
|
|
} else if (response.code == 400) {
|
||
|
|
// 警告，弹框
|
||
|
|
this.pauseGetPickFlag = true
|
||
|
|
warningBox(response.message)
|
||
|
|
}
|
||
|
|
}).catch(err => {
|
||
|
|
console.log(err)
|
||
|
|
this.pauseGetPickFlag = true
|
||
|
|
errorBox('请求错误，请检查完原因后刷新界面。')
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 确认/放行
|
||
|
|
confirmOrRelease() {
|
||
|
|
// 确认放行---与配料工作区分开来
|
||
|
|
const request = {
|
||
|
|
taskConfirm: {
|
||
|
|
taskId: this.confirmEntity.taskId,
|
||
|
|
outType: this.confirmEntity.outType,
|
||
|
|
goodsId: this.confirmEntity.goodsId,
|
||
|
|
totalNeed: this.confirmEntity.totalNeed,
|
||
|
|
remainNeed: this.confirmEntity.remainNeed,
|
||
|
|
planPickQty: this.confirmEntity.planPickQty,
|
||
|
|
realPickQty: this.confirmEntity.realPickQty,
|
||
|
|
},
|
||
|
|
stockConfirm: {
|
||
|
|
stockId: this.confirmEntity.stockId,
|
||
|
|
vehicleId: this.confirmEntity.vehicleId,
|
||
|
|
goodsId: this.confirmEntity.goodsId,
|
||
|
|
planRemainQty: this.confirmEntity.planRemainQty,
|
||
|
|
realRemainQty: this.confirmEntity.realRemainQty,
|
||
|
|
isOut: this.confirmEntity.isOut,
|
||
|
|
putArea: this.confirmEntity.putArea,
|
||
|
|
},
|
||
|
|
standId: this.standId,
|
||
|
|
userName: this.userName
|
||
|
|
}
|
||
|
|
confirmCurrentTask(request).then(res => {
|
||
|
|
const response = res.data
|
||
|
|
if (response.code == 0) {
|
||
|
|
// 设置form
|
||
|
|
this.confirmEntity = reactive({})
|
||
|
|
this.pauseGetPickFlag = false
|
||
|
|
ElMessage.success(response.message)
|
||
|
|
} else if (response.code == 400) {
|
||
|
|
this.pauseGetPickFlag = false
|
||
|
|
warningBox(response.message)
|
||
|
|
} else {
|
||
|
|
// 错误，弹框
|
||
|
|
errorBox(response.message)
|
||
|
|
}
|
||
|
|
}).catch(err => {
|
||
|
|
console.log(err)
|
||
|
|
errorBox('请求错误，请检查完原因后刷新界面。')
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 当拣选数量修改时，要对应的修改
|
||
|
|
changePlanQty() {
|
||
|
|
if (this.confirmEntity.isOut == 0 && this.confirmEntity.realPickQty != this.confirmEntity.planPickQty) {
|
||
|
|
// 修正量
|
||
|
|
const changeQty = this.confirmEntity.realPickQty - this.confirmEntity.planPickQty
|
||
|
|
// 修正实际剩余数量
|
||
|
|
this.confirmEntity.realRemainQty = this.confirmEntity.planRemainQty - changeQty
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.content {
|
||
|
|
display: flex;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.work-area {
|
||
|
|
width: 100%;
|
||
|
|
/* padding: 5px; */
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-area {
|
||
|
|
margin: auto;
|
||
|
|
min-height: fit-content;
|
||
|
|
max-height: 90%;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
min-width: inherit;
|
||
|
|
border: solid 1px;
|
||
|
|
border-radius: 10px;
|
||
|
|
box-shadow: 0px 15px 10px -15px #000;
|
||
|
|
overflow: auto;
|
||
|
|
padding: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.confirm-area {
|
||
|
|
margin: auto;
|
||
|
|
min-height: fit-content;
|
||
|
|
max-height: 90%;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
min-width: inherit;
|
||
|
|
border: solid 1px;
|
||
|
|
border-radius: 10px;
|
||
|
|
box-shadow: 0px 15px 10px -15px #000;
|
||
|
|
overflow: auto;
|
||
|
|
padding: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.el-form-item {
|
||
|
|
margin: 10px 5px 10px 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.el-form-item .el-input {
|
||
|
|
width: 196px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.table-class {
|
||
|
|
margin: 5px 5px 5px 5px;
|
||
|
|
width: inherit;
|
||
|
|
}
|
||
|
|
</style>
|