205 lines
8.4 KiB
Vue
205 lines
8.4 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<uni-collapse>
|
|||
|
|
<uni-forms ref="form" :modelValue="formData" :rules="rules">
|
|||
|
|
<!-- <uni-collapse-item title="库存查询" :open="true"> -->
|
|||
|
|
<uni-forms-item label="物料编码" :labelWidth='90' name="materialCode">
|
|||
|
|
<uni-easyinput suffixIcon="scan" @iconClick="scanBar" v-model="formData.materialCode"
|
|||
|
|
@confirm="scanBarMaterialCode" type="text" />
|
|||
|
|
</uni-forms-item>
|
|||
|
|
<uni-forms-item label="物料名称" :labelWidth='90' name="materialName">
|
|||
|
|
<uni-easyinput v-model="formData.materialName"></uni-easyinput>
|
|||
|
|
</uni-forms-item>
|
|||
|
|
<uni-forms-item label="批号" :labelWidth='90' name="batchNo">
|
|||
|
|
<uni-easyinput v-model="formData.batchNo" type="text" />
|
|||
|
|
</uni-forms-item>
|
|||
|
|
<uni-forms-item label="库位条码" :labelWidth='90' name="storageLocationBarcode">
|
|||
|
|
<uni-easyinput suffixIcon="scan" @iconClick="scanBarstorageLocationBarcode"
|
|||
|
|
@confirm="splitStlBarcode" type="text" v-model="formData.storageLocationBarcode" />
|
|||
|
|
</uni-forms-item>
|
|||
|
|
<button @click="queryStockInfo" form-type="submit" type="primary"
|
|||
|
|
style="text-align: center;font-size: 18px;width: 50%;">查询</button>
|
|||
|
|
<!-- </uni-collapse-item> -->
|
|||
|
|
</uni-forms>
|
|||
|
|
<uni-collapse-item title="库位库存明细" :open="true">
|
|||
|
|
<view v-for="(item, index) in wmsMaterialDetailList" :key="index" :disabled="item.disabled"
|
|||
|
|
class="item">
|
|||
|
|
<text>物料编码：{{ item.materialCode }}</text>
|
|||
|
|
<text>批号：{{ item.batchNo }}</text>
|
|||
|
|
<text>箱号：{{ item.lotNo }}</text>
|
|||
|
|
<text>物料名称：{{ item.materialName }}</text>
|
|||
|
|
<text>拼接库位：{{ item.connectBin }}</text>
|
|||
|
|
<text>入库时间：{{ item.storageInTime }}</text>
|
|||
|
|
<text>库存总数：{{ item.number }}</text>
|
|||
|
|
<text>锁定数量：{{ item.lockNumber }}</text>
|
|||
|
|
<text>可用数量：{{ item.MaterialAvailableNumber }}</text>
|
|||
|
|
</view>
|
|||
|
|
</uni-collapse-item>
|
|||
|
|
</uni-collapse>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
listStock,
|
|||
|
|
listStockLike
|
|||
|
|
} from "@/api/wms/stock";
|
|||
|
|
import {
|
|||
|
|
listMaterial
|
|||
|
|
} from "@/api/mes/material.js";
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
formData: {
|
|||
|
|
storageLocationBarcode: null,
|
|||
|
|
materialCode: null,
|
|||
|
|
materialName: null,
|
|||
|
|
batchNo: null,
|
|||
|
|
},
|
|||
|
|
wmsMaterialDetailList: [],
|
|||
|
|
// rules: {
|
|||
|
|
// materialCode: {
|
|||
|
|
// rules: [{
|
|||
|
|
// required: true,
|
|||
|
|
// errorMessage: '请输入物料编码!'
|
|||
|
|
// }]
|
|||
|
|
// },
|
|||
|
|
// materialName: {
|
|||
|
|
// rules: [{
|
|||
|
|
// required: true,
|
|||
|
|
// errorMessage: '请输入物料名称!'
|
|||
|
|
// }]
|
|||
|
|
// },
|
|||
|
|
// }
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
// 【物料编码】的扫描按钮点击操作
|
|||
|
|
scanBar() {
|
|||
|
|
const _this = this;
|
|||
|
|
uni.scanCode({
|
|||
|
|
scanType: ['barCode', 'qrCode'],
|
|||
|
|
success: function(res) {
|
|||
|
|
_this.$set(_this.formData, "materialCode", res.result);
|
|||
|
|
_this.scanBarMaterialCode(res.result);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 输入物料编码确认后的操作
|
|||
|
|
scanBarMaterialCode(code) {
|
|||
|
|
// 查出物料编码关联的物料名称
|
|||
|
|
listMaterial({
|
|||
|
|
materialCode: code
|
|||
|
|
}).then(res => {
|
|||
|
|
if (res.total > 0) {
|
|||
|
|
this.formData.materialName = res.rows[0].materialName;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 【库位条码】的扫描按钮点击操作
|
|||
|
|
scanBarstorageLocationBarcode() {
|
|||
|
|
const _this = this;
|
|||
|
|
uni.scanCode({
|
|||
|
|
scanType: ['barCode', 'qrCode'],
|
|||
|
|
success: function(res) {
|
|||
|
|
_this.$set(_this.formData, "storageLocationBarcode", res.result);
|
|||
|
|
_this.splitStlBarcode(res.result);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 分割库位条码
|
|||
|
|
splitStlBarcode(e) {
|
|||
|
|
this.formData.whCode = null;
|
|||
|
|
this.formData.areaCode = null;
|
|||
|
|
this.formData.shelvesCode = null;
|
|||
|
|
this.formData.storageLocationCode = null;
|
|||
|
|
let array = e.split('-');
|
|||
|
|
switch (array.length) {
|
|||
|
|
case 1:
|
|||
|
|
this.formData.whCode = array[0];
|
|||
|
|
this.queryStockInfo();
|
|||
|
|
break;
|
|||
|
|
case 2:
|
|||
|
|
this.formData.whCode = array[0];
|
|||
|
|
this.formData.areaCode = array[1];
|
|||
|
|
this.queryStockInfo();
|
|||
|
|
break;
|
|||
|
|
case 3:
|
|||
|
|
this.formData.whCode = array[0];
|
|||
|
|
this.formData.areaCode = array[1];
|
|||
|
|
this.formData.shelvesCode = array[2];
|
|||
|
|
this.queryStockInfo();
|
|||
|
|
break;
|
|||
|
|
case 4:
|
|||
|
|
this.formData.whCode = array[0];
|
|||
|
|
this.formData.areaCode = array[1];
|
|||
|
|
this.formData.shelvesCode = array[2];
|
|||
|
|
this.formData.storageLocationCode = array[3];
|
|||
|
|
this.queryStockInfo();
|
|||
|
|
break;
|
|||
|
|
case 5:
|
|||
|
|
this.formData.whCode = array[0];
|
|||
|
|
this.formData.areaCode = array[1];
|
|||
|
|
this.formData.shelvesCode = array[2];
|
|||
|
|
this.formData.storageLocationCode = array[3] + '-' + array[4];
|
|||
|
|
this.queryStockInfo();
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
queryStockInfo() {
|
|||
|
|
// 获取库位库存明细数据
|
|||
|
|
listStockLike(this.formData).then(res => {
|
|||
|
|
for (let obj of res.rows) {
|
|||
|
|
obj.MaterialAvailableNumber = obj.number - obj.lockNumber;
|
|||
|
|
}
|
|||
|
|
this.wmsMaterialDetailList = res.rows;
|
|||
|
|
}).catch(err => {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '请输入必填字段',
|
|||
|
|
icon: 'none',
|
|||
|
|
})
|
|||
|
|
console.error('获取库存明细失败:', err);
|
|||
|
|
});
|
|||
|
|
// // 先验证表单，不知道为什么，uniapp里的验证功能没用，查不出来，自己写吧
|
|||
|
|
// this.$refs.form.validate((res) => {
|
|||
|
|
// // 自己写个验证逻辑
|
|||
|
|
// let required = ['materialCode', 'materialName'];
|
|||
|
|
// for (let field of required) {
|
|||
|
|
// if (!this.formData[field]) {
|
|||
|
|
// uni.showToast({
|
|||
|
|
// title: '请输入必填字段',
|
|||
|
|
// icon: 'none',
|
|||
|
|
// })
|
|||
|
|
// return;
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
|
|||
|
|
// console.log('表单数据信息：', res);
|
|||
|
|
// }).catch((error) => {
|
|||
|
|
// console.error('表单验证失败:', error);
|
|||
|
|
// });
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
onReady() {
|
|||
|
|
this.$refs.form.setRules(this.rules);
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.item {
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
padding: 10px;
|
|||
|
|
border: 1px solid #ccc;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
background-color: #f7f7f7;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item text {
|
|||
|
|
display: block;
|
|||
|
|
margin: 5px 0;
|
|||
|
|
}
|
|||
|
|
</style>
|