storage-wechat/pages/Inventory/InventorySubmit.vue

<template>
	<view class="InventorySubmit">
		<uni-search-bar @confirm="getData" v-model="req.keyword" @cancel="reload">
		</uni-search-bar>
		<view class="dtl" style="font-size: 24rpx;">
			<view class="">
				物料编码：{{option.materialCode}}
			</view>
			<view class="">
				物料名称：{{option.materialName}}
			</view>
			<view class="">
				库存件数：{{option.materialCount}} <span style="margin-left:30rpx;">库存数量：{{option.materialSum}}</span>
			</view>
			<view class="" style="color:#0066CC">
				已盘件数：{{option.handleMaterialCount}} <span
					style="margin-left:30rpx;">已盘数量：{{option.handleMaterialSum}}</span>
			</view>
		</view>
		<view class="commons-title">
			盘点明细
		</view>
		<view class="addQrcode-list" v-for="(i,index) in listData" :key="i.qrCode" @click="operation(i)">
			<view class="fl">
				<view class="" style="color: #aaaaaa;">
					二维码编号：{{i.qrCode}}
				</view>
				<view class="">
					绑定数量：{{i.quantity}}
				</view>
			</view>
			<view class="fr" style="width:200rpx;text-align: right;">
				<uni-icons v-if="i.checkTagState == 0" type="checkbox-filled" color="#0066CC" size="30"></uni-icons>
				<uni-icons v-if="i.checkTagState == 1" type="checkbox-filled" color="red" size="30"></uni-icons>
				<uni-icons v-if="i.checkTagState == 2" type="checkbox-filled" color="#dcdcdc" size="30"></uni-icons>
				<span style="position: relative;top:-10rpx">
					{{i.checkTagState == 0 ? '正常' : i.checkTagState == 1 ? ' 不在库存' : ' 未扫描'}}
				</span>
			</view>
		</view>
		<view class="submit-box" style="margin-top:30rpx">
			<button @click="scanCode">继续盘点</button>
		</view>
		<view class="submit-box" style="margin-top:30rpx">
			<button @click="recordSubmit" style="background: #0066CC;color:#fff;">提 交</button>
		</view>
		<uni-popup ref="popup" type="center" background-color="#fff">
			<view class="popup-content" >
				<h3>异常处置</h3>
				<view class="">
					物料编码：{{qrCodeData.materialCode}}
				</view>
				<view class="">
					物料名称：{{qrCodeData.materialName}}
				</view>
				<view class="">
					二维码编号：{{qrCodeData.qrCode}}
				</view>
				<view class="" style="display: flex;justify-content: space-between;">
					<view class="" >
						绑定数量：{{qrCodeData.quantity}}
					</view>
					<view style="display: flex;justify-content: space-between;">
						<uni-icons v-if="qrCodeData.checkTagState == 0" type="checkbox-filled" color="#0066CC" size="30"></uni-icons>
						<uni-icons v-if="qrCodeData.checkTagState == 1" type="checkbox-filled" color="red" size="30"></uni-icons>
						<uni-icons v-if="qrCodeData.checkTagState == 2" type="checkbox-filled" color="#dcdcdc" size="30"></uni-icons>
						<span>
							{{qrCodeData.checkTagState == 0 ? '正常' : qrCodeData.checkTagState == 1 ? ' 不在库存' : ' 未扫描'}}
						</span>
					</view>
				</view>
				<view class="">
					<view class="commons-title" style="font-size: 24rpx;">
						<span style="color: red;">*</span>请选择处置类型：
					</view>
					<picker @change="bindPickerChange" :range="tagDealTypeData" range-key="title">
						<view class="" style="text-align: right;display: flex;justify-content: space-between;">
							<view class="">
								{{formData.tagDealTypeName || '请选择处置类型'}}
							</view>
							 <uni-icons type="forward" size="20"></uni-icons>
						</view>
					</picker>
					<picker @change="bindPickerChange2" :range="userList" v-if="formData.tagDealType === 21" 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="20"></uni-icons>
						</view>
					</picker>
				</view>
				<view class="">
					<p>备注：</p>
					<input v-model="formData.remark" type="text" value="" />
				</view>
			</view>
			<view style="text-align: center;">
				<button @click="$refs.popup.close()" size="mini" type="default" style="margin-right: 20rpx;width: 140rpx;">取消</button>
				<button @click="addOrEditTag" size="mini" type="default" style="width: 140rpx;background: #0066CC;color: #fff;">确定</button>
			</view>
		</uni-popup>
		<uni-popup ref="popup2" type="center" background-color="#fff">
			<view class="popup-content" >
				<h3>盘点结果</h3>
				<view class="">
					物料类型：{{qrCodeData.categoryName}}
				</view>
				<view class="">
					物料编码：{{qrCodeData.materialCode}}
				</view>
				<view class="">
					物料名称：{{qrCodeData.materialName}}
				</view>
				<view class="">
					所在仓库：{{qrCodeData.stockHouseName}}
				</view>
				
				<view class="" style="display: flex;justify-content: space-between;">
					<view class="">
						库存件数：{{option.materialCount}}
					</view>
					<view >
						扫描件数：{{option.handleMaterialCount}}
					</view>
					
				</view>
				<view style="color:red">
					异常件数：{{option.materialCount - option.handleMaterialCount + errorNum}}  
				</view>
				<view class="">
					<p><span style="color: red;">*</span>实物件数：</p>
					<input v-model="req.handTagCount" type="number" value="" />
				</view>
			</view>
			<view style="text-align: center;">
				<button @click="$refs.popup2.close()" size="mini" type="default" style="margin-right: 20rpx;width: 140rpx;">取消</button>
				<button @click="addOrEditTag2" size="mini" type="default" style="width: 140rpx;background: #0066CC;color: #fff;">确定</button>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		getInfo
	} from "@/util/api.js";
	import {
		dateFormat,
		getTime
	} from '../../util/uitl.js'
	export default {
		data() {
			return {
				listData: [],
				listDataDtl:{},
				req: {
					keyword: null,
					handTagCount:0,
				},
				option: {
					handleMaterialCount: 0,
					handleMaterialSum: 0,
				},
				formData:{
					tagDealType:null,
					operUserName:null,
				},
				qrCodeData: {
					stockHouseName:null,
				},
				userList:[],
				tagDealTypeData:[],
				errorNum:0,
			}
		},
		onLoad(option) {

			const v = this
			v.option = JSON.parse(decodeURIComponent(option.data))
			v.option.handleMaterialCount = 0
			v.option.handleMaterialSum = 0
			console.log(v.option)
			v.req.recordDetailsId = v.option.recordDetailsId
			v.$post('/wx/common/getUser',{}).then(res=>{
				v.userList = res.data
			})
			v.getData()
		},
		methods: {
			addOrEditTag2(){
				const v = this
				v.$post('/wx/record/submit',v.req).then(res=>{
					if(res.code == 200){
						uni.showToast({
							title: '提交成功'
						})
						setTimeout(()=>{
							wx.reLaunch({
								url: '/pages/home'
							})
						},2000)
					}
				})
			},
			recordSubmit(){
				const v = this
				v.$refs.popup2.open()
				
			},
			addOrEditTag(){
				const v = this
				v.formData.tagDealType = 0
				v.formData.checkTagState = 0 
				v.formData.recordId = v.option.recordDetailsId
				v.formData.recordDetailsId = v.option.recordDetailsId
				v.formData = Object.assign(v.formData,v.qrCodeData)
				delete v.formData.createTime
				uni.showToast({
					icon: "loading",
					title: '加载中',
					duration: 1500
				});
				v.$post('/wx/record/addOrEditTag',v.formData).then(res=>{
					if(res.code == 200){
						uni.showToast({
							title: '提交成功'
						})
						v.$refs.popup.close()
						v.formData = {
							tagDealType:null,
							operUserName:null,
						}
					}
				})
				console.log(v.formData)
			},
			
			bindPickerChange2(e){
				const v = this
				console.log(v.userList[e.detail.value])
				v.formData.operUserName = v.userList[e.detail.value].nickName
				v.formData.checkUser = v.userList[e.detail.value].userId
			},
			bindPickerChange(e) {
				const v = this
				v.formData.tagDealType = v.tagDealTypeData[e.detail.value].type
				v.formData.tagDealTypeName = v.tagDealTypeData[e.detail.value].title
				
			},
			operation(i,_type) {
				const v = this
				v.$post('/wx/common/gerMaterialInfoByQrcode', {
					qrCode: i.qrCode
				}).then(res => {
					v.qrCodeData = Object.assign(res.data,i)
					if(_type) return
					if(i.checkTagState == 1){
						v.tagDealTypeData = [{title:"盘盈",type:11},{title:"补入库",type:13}]
						
						v.$refs.popup.open()
					}
					if(i.checkTagState == 2){
						v.tagDealTypeData = [{title:"盘亏",type:21},{title:"补出库",type:23},{title:"绑定错误",type:24}]
						v.$refs.popup.open()
					}
					
				})
			},
			scanCode(_isReload) {
				const v = this
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res1) {
						uni.showToast({
							icon: "loading",
							title: '加载中',
							duration: 1500
						});
						v.$post('/wx/common/gerMaterialInfoByQrcode', {
							qrCode: res1.result
						}).then(res => {
							v.qrCodeData = res.data
							var isExistence = false
							for (var i = 0; i < v.listData.length; i++) {
								if (v.listData[i].qrCode == res1.result) {
									if(v.listData[i].checkTagState == 0) return
									v.listData[i].checkTagState = 0
									v.option.handleMaterialCount++
									v.option.handleMaterialSum += res.data.quantity
									isExistence = true
									v.formData.tagDealType = 0
									v.formData.checkTagState = 0 
									v.formData.recordId = v.option.recordDetailsId
									v.formData.recordDetailsId = v.option.recordDetailsId
									v.formData = Object.assign(v.formData,v.qrCodeData,v.listData[i])
									delete v.formData.createTime
									v.$post('/wx/record/addOrEditTag',v.formData).then(res=>{
										
									})
								}
							}
							if(!isExistence){
								const msg = res.data
								msg.checkTagState = 1
								v.errorNum ++
								v.listData.push(msg)
							}
						})
					}
				});
			},
			reload() {
				this.req.keyword = null
				this.getData()
			},
			getData() {
				const v = this
				v.$post('/wx/record/getTagList', v.req).then(res => {
					v.listData = res.data
					if(v.listData.length > 0){
						v.operation(v.listData[0],true)
					}
					for (var i = 0; i < res.data.length; i++) {
						if (res.data[i].checkTagState == 0) {
							v.option.handleMaterialCount ++
							v.option.handleMaterialSum += res.data[i].quantity
						}
					}
				})
			},
		},
	}
</script>

<style lang="less">
	.InventorySubmit {
		padding: 0 30rpx;
		.popup-content{
			width: 500rpx;
			font-size: 24rpx;
			border-radius: 10rpx;
			padding: 0 40rpx 40rpx;
			line-height: 60rpx;
			h3{
				text-align: center;
				height: 80rpx;
				line-height: 80rpx;
				font-size: 34rpx;
			}
			input{
				border:1px solid #dcdcdc;
			}
		}
		.addQrcode-list {
			height: 80rpx;
			display: flex;
			justify-content: space-between;
			padding: 15rpx;
			border-bottom: 1rpx solid #dcdcdc;
			font-size: 24rpx;

			.fr {
				line-height: 80rpx;
				color: #0066CC;
			}
		}
	}
</style>