storage-wechat/pages/goOut/goOut.vue

<template>
	<view class="goOut">
		<view class="">
			<view class="form-box"  style="margin:0 30rpx">
				<uni-forms ref="baseForm" :modelValue="formData" label-position="top">
					<uni-forms-item label="出库时间">
						{{date}}
					</uni-forms-item>
				
					<uni-forms-item label="出库类型" required>
						<uni-data-checkbox v-model="formData.stockChangeType" :localdata="stockChangeData" />
					</uni-forms-item>
					<uni-forms-item label="领料人" required>
						<picker @change="bindPickerChange" :range="userList" range-key="nickName">
							<view class="" style="text-align: right;display: flex;justify-content: space-between;">
								<view class="">
									{{formData.operUserName || '请选择'}}
								</view>
								 <uni-icons type="forward" size="30"></uni-icons>
							</view>
						</picker>
					</uni-forms-item>
				
				</uni-forms>
			</view>
			
			<view class="commons-title">
				出库明细
			</view>
			<view class="addQrcode-list" v-for="(i,index) in qrCodeList" :key="i,index">
				<view class="fl" @click="toRouter(index)">
					<view class="code">
						<view class="">
							二维码编号:{{i.qrCode}}
						</view>
						<view class="" style="margin-top: 20rpx;">
							绑定数量:{{i.quantity}}
						</view>
					</view>
				</view>
				<view class="fr">
					<uni-icons type="trash-filled" color="red" size="30" @click="delelte(index)"></uni-icons>
				</view>
			</view>
			<button size="mini" type="default" style="width: 500rpx;margin: 30rpx auto;display: block;margin-bottom:300rpx"
				@click="scanCode(true)">
				+ 扫码添加
			</button>
		</view>
		<view class="submit-box">
			<view class="" style="line-height: 80rpx;text-align: center;">
				合计：{{quantitytol}} | {{qrCodeList.length}}件
			</view>
			<button @click="addOutInfo()" style="background: #0066CC;color:#fff;margin-bottom: 30rpx;">提交</button>
		</view>
	</view>
</template>

<script>
	import {
		getInfo
	} from "@/util/api.js";
	import Vue from 'vue'
	import {dateFormat,getTime} from '../../util/uitl.js'
	export default {
		data() {
			return {
				stockChangeData: [{
					text: '出库',
					value: 20
				},{
					text: '补出库',
					value: 23
				},{
					text: '绑定错误',
					value: 24
				},{
					text: '退货出库',
					value: 26
				},{
					text: '报废出库',
					value: 27
				}],
				listData: [],
				formData: {
					operUserName:"",
					qrCodeList:[],
					stockChangeType:null,
					operUserId:null,
				},
				req: {
					qrCodeList: [],
					stockHouseId: null,
				},
				btnType: 1,
				isScanCode: false,
				userData: {},
				dtlData: null,
				qrCodeList: [],
				index: 0,
				stockHouseData: [],
				date:null,
				userList:[],
				quantitytol:0,
			}
		},
		onLoad(option) {
			const v = this
			v.userData = Vue.prototype.$userInfo
			v.$post('/wx/common/getStockHouse', {}).then(res => {
				v.stockHouseData = res.data
			})
			v.date = getTime().substr(0,11)
			v.$post('/wx/common/getUser',{}).then(res=>{
				v.userList = res.data
			})
		},
		methods: {
			
			addOutInfo(){
				const v = this
				if(v.qrCodeList.length == 0){
					uni.showToast({
						icon: "error",
						title: '请添加物料信息',
						duration: 2000
					});
					return
				}
				if(!v.formData.operUserId){
					uni.showToast({
						icon: "error",
						title: '请选择领料人',
						duration: 2000
					});
					return
				}
				if(!v.formData.stockChangeType){
					uni.showToast({
						icon: "error",
						title: '请选择出库类型',
						duration: 2000
					});
					return
				}
				v.req.qrCodeList = []
				for (var i = 0; i < v.qrCodeList.length; i++) {
					v.formData.qrCodeList.push(v.qrCodeList[i].qrCode)
				}
				console.log(v.formData)
				v.$post('/wx/codeScanOut/addOutInfo',v.formData).then(res=>{
					if(res.code == 200){
						uni.showToast({
							title:'出库成功，跳转中！'
						})
						setTimeout(()=>{
							wx.reLaunch({
								url: '/pages/home'
							})
						},2000)
					}
				})
			},
			delelte(index) {
				const v = this
				uni.showModal({
					title: "提示",
					content: "你确定删除此信息么？",
					success(res) {
						if (res.confirm) {
							v.quantitytol =  v.quantitytol - v.qrCodeList[index].quantity
							v.qrCodeList.splice(index, 1)
						}
					}
				})

			},
			bindPickerChange(e) {
				const v = this
				v.formData.operUserName = v.userList[e.detail.value].nickName
				v.formData.operUserId = v.userList[e.detail.value].userId
			},
			scanCode(_isReload) {
				const v = this
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						uni.showToast({
							icon: "loading",
							title: '加载中',
							duration: 1500
						});
						v.$post('/wx/common/gerMaterialInfoByQrcode', {
							qrCode: res.result
						}).then(res => {
							for (var i = 0; i < v.qrCodeList.length; i++) {
								if(v.qrCodeList[i].qrCode == res.data.qrCode){
									uni.showToast({
										icon: "error",
										title: '此二维码已扫描',
										duration: 2000
									});
									return
								}
							}
							if(!res.data.stockHouseId){
								uni.showToast({
									icon: "error",
									title: '此物料不在库存内！',
									duration: 2000
								});
								return
							}else{
								v.qrCodeList.push(res.data)
								v.quantitytol = res.data.quantity + v.quantitytol
							}
							if (_isReload) {
								v.scanCode(_isReload)
							}
						})
					}
				});
			},


		},
	}
</script>

<style lang="less">
	.goOut{
		.submit-box {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			padding: 0 30rpx;
			background-color: #fff;
		}
		
		.dtl {
			padding: 30rpx;
			border-bottom: 1rpx solid #dcdcdc;
			font-size: 26rpx;
			line-height: 40rpx;
		}
		
		.addQrcode-list {
			height: 80rpx;
			display: flex;
			justify-content: space-between;
			padding: 15rpx;
			border-bottom: 1rpx solid #dcdcdc;
			font-size: 24rpx;
			
			.fl {
				display: flex;
		
				.code {
					margin-right: 20rpx;
				}
			}
		
			.fr {
				line-height: 80rpx;
			}
		}
	}
	.popup-input-warp {
		padding: 30rpx 40rpx;
	}

	
</style>