WZC2/fe/PDA/pages/task/inventoryMoveJobDetail.vue

<template>
	<page-meta root-font-size="18px"></page-meta>
	<view class="">
		<view class="top_card">
			<com-job-scan-detail :jobContent="datacontent" :allCount="allCount" :scanCount="scanCount">
			</com-job-scan-detail>
		</view>

		<scroll-view scroll-y="true" @scrolltoupper="upper" @scrolltolower="lower" @scroll="scroll"
			class="scroll-detail">
			<view class="" v-for="(item, index) in details" :key="index">
				<view class="detail-list margin_top">
					<!-- 单选卡片 -->
					<view class="detail-content">
						<view class="choose_main">
							<view class="ljh_box">
								<view class="tit_ljh">{{ item.itemCode }}</view>
								<view class="ljh_left">
									<view class="font_xs text_lightblue">{{ item.itemName }}</view>
									<view class="font_xs text_lightblue">{{ item.itemDesc1 }}</view>
								</view>
							</view>

							<view class="list_form hold_form">
								<view class="uni-container">
									<uni-table style="">
										<uni-tr>
											<uni-th width="100" align="center">推荐 </uni-th>
											<uni-th width="120" align="center">来源</uni-th>
											<uni-th width="120" align="center">目标</uni-th>
										</uni-tr>

										<uni-tr>
											<uni-td width="100" align="center">箱码</uni-td>
											<uni-td width="120" align="center">
												{{item.recommendFromPackingCode}}</uni-td>
											<uni-td width="120" align="center"> {{item.recommendToPackingCode}}</uni-td>
										</uni-tr>
										<uni-tr>
											<uni-td width="100" align="center">批次</uni-td>
											<uni-td width="120" align="center">{{item.recommendFromLot}}</uni-td>
											<uni-td width="120" align="center">{{item.recommendToLot}}</uni-td>
										</uni-tr>
										<uni-tr>
											<uni-td width="100" align="center">库位</uni-td>
											<uni-td width="120" align="center">
												{{item.recommendFromLocationCode}}</uni-td>
											<uni-td width="120" align="center">
												{{item.recommendToLocationCode}}</uni-td>
										</uni-tr>
										<uni-tr>
											<uni-td width="100" align="center">数量({{item.uom}})</uni-td>
											<uni-td width="120" align="center">{{item.recommendFromQty}}</uni-td>
											<uni-td width="120" align="center">{{item.recommendToQty}}</uni-td>
										</uni-tr>

									</uni-table>
								</view>
							</view>

							<view class="list_form hold_form">
								<view class="uni-container">
									<uni-table style="">
										<uni-tr>
											<uni-th width="100" align="center">实际</uni-th>
											<uni-th width="120" align="center">来源</uni-th>
											<uni-th width="120" align="center">目标</uni-th>
										</uni-tr>

										<uni-tr>
											<uni-td width="100" align="center">箱码</uni-td>
											<uni-td width="120" align="center"> {{item.handledFromPackingCode}}</uni-td>
											<uni-td width="120" align="center"> {{item.handledToPackingCode}}</uni-td>
										</uni-tr>
										<uni-tr>
											<uni-td width="100" align="center">批次</uni-td>
											<uni-td width="120" align="center">{{item.handledFromLot}}</uni-td>
											<uni-td width="120" align="center">{{item.handledToLot}}</uni-td>
										</uni-tr>
										<uni-tr>
											<uni-td width="100" align="center">库位</uni-td>
											<uni-td width="120" align="center">
												{{item.handledFromLocationCode}}</uni-td>
											<uni-td width="120" align="center"> {{item.handledToLocationCode}}</uni-td>
										</uni-tr>
										<uni-tr>
											<uni-td width="100" align="center">数量({{item.uom}})</uni-td>
											<uni-td width="120" align="center">{{item.handledFromQty}}</uni-td>
											<uni-td width="120" align="center">{{item.handledToQty}}</uni-td>
										</uni-tr>

									</uni-table>
								</view>
							</view>

						</view>
						<view class="choose_marked" v-if="item.scaned">
							<image src="@/static/image_marked.svg"></image>
						</view>
					</view>
				</view>
			</view>
			<!-- <view class="">
				<view class="" style="padding-left: 50rpx; padding-right: 50rpx;">
					<button type="default" @click="openFromLocation"> 来源库位</button>
				</view>
				<view class="" style="padding-left: 50rpx; padding-right: 50rpx;margin-top: 20rpx;">
					<button type="default"> 箱码</button>
				</view>
				<view class="" style="padding-left: 50rpx; padding-right: 50rpx; margin-top: 20rpx;">
					<button type="default" @click="openToLocation"> 目标库位</button>
				</view>

			</view> -->

		</scroll-view>


		<div class="new_bot_box">
			<!-- <win-collapse-location scanTitle='扫描目标库位' ref='comCollapseLocation' @getLocationCode='getDefaultToLocation'
				@clear='clearDefaultLocation'>
			</win-collapse-location> -->
			<view class="new_btn_bot bot_pos uni-flex">
				<button class="new_clear_btn btn_double" @click="cancel()">清空</button>
				<button class="new_save_btn btn_double" @click="submit()">提交</button>
			</view>
		</div>
		<!-- <win-scan-button @goScan='openScanPopup'></win-scan-button> -->
		<uni-fab ref="fab" class="fab" :pattern="pattern" :content="content" :horizontal="horizontal"
			:vertical="vertical" :direction="direction" @trigger="trigger"></uni-fab>
		<win-scan-by-pack ref="scanPopup" @getScanResult='getScanResult'></win-scan-by-pack>
		<winScanLocationCode ref="locationFrom" title="来源库位" @getLocation="getFromLocation"></winScanLocationCode>
		<winScanLocationCode ref="locationTo" title="目标库位" @getLocation="getToLocation"></winScanLocationCode>
		<comMessage ref="comMessage" @afterCloseCommitMessage='closeCommitMessage()'></comMessage>
	</view>
</template>

<script>
	import {
		getInventoryMoveDetail,
		takeInventoryMoveJob,
		cancelTakeInventoryMoveJob,
		finshInventoryMoveJob,
		locations,
		getBalancesByFilterAsync
	} from '@/api/index.js';
	import {
		showConfirmMsg,
		goHome,
		navigateBack
	} from '@/common/basic.js';
	import winScanButton from '@/mycomponents/wincom/winScanButton.vue'
	import winMulitScan from '@/mycomponents/wincom/winMulitScan.vue'
	import winScanByPack from '@/mycomponents/wincom/winScanByPack.vue'
	import comMessage from '@/mycomponents/common/comMessage.vue'
	import comJobScanDetail from '@/mycomponents/comjob/comJobScanDetail.vue'
	import winCollapseLocation from '@/mycomponents/wincom/winCollapseLocation.vue'
	import winScanByProductCode from '@/mycomponents/wincom/winScanByProductCode.vue'
	import comNumberBox from '@/mycomponents/common/comNumberBox.vue';
	import comProductCode from '@/mycomponents/coms/task/comProductCode.vue';
	import winScanLocationCode from '@/mycomponents/wincom/winScanLocationCode.vue';


	export default {
		components: {
			winScanButton,
			winMulitScan,
			winScanByPack,
			comMessage,
			comJobScanDetail,
			winCollapseLocation,
			winScanByProductCode,
			comNumberBox,
			comProductCode,
			winScanLocationCode
		},
		data() {
			return {
				type: '',
				id: "",
				datacontent: {},
				details: [],
				toLocation: '',
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				balancesItem: {},
				titleArray: ['箱标签', '目标库位'],
				allCount: 0,
				scanCount: 0,
				jobStatus: "",
				toLocationInfo: null,
				fromLocationInfo: null,
				pattern: {
					color: '#7A7E83',
					backgroundColor: '#fff',
					selectedColor: '#007AFF',
					buttonColor: '#5A7CF3',
					iconColor: '#fff'
				},
				directionStr: '垂直',
				horizontal: 'right',
				vertical: 'bottom',
				direction: 'horizontal',
				content: [{
						iconPath: '/static/icons_ui/icons_common_sjadd.svg',
						selectedIconPath: '/static/icons_ui/icons_common_sjadd.svg',
						text: '来源库位',
						active: false
					},

					{
						iconPath: '/static/icons_ui/icon_num.svg',
						selectedIconPath: '/static/icons_ui/icon_num.svg',
						text: '箱码',
						active: false
					},
					{
						iconPath: '/static/icons_ui/icon_erp.svg',
						selectedIconPath: '/static/icons_ui/icon_erp.svg',
						text: '目标库位',
						active: false
					},
				]

			}
		},
		onLoad(param) {
			this.id = param.id;
			if (param.jobStatus == 1) {
				this.receive((callback => {
					this.getDetail();
				}));
			} else {
				this.getDetail();
			}
		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			} else if (e.index === 1) {
				window.location.reload();
			}
		},
		//拦截返回按钮事件
		onBackPress(e) {
			//已经接收但是没提交任务
			if (e.from == 'backbutton') {
				if (this.jobStatus == 2) {
					//取消承接任务	
					cancelTakeInventoryMoveJob(this.id).then(res => {
						uni.navigateBack();
					}).catch(error => {
						uni.navigateBack();
					})
				} else {
					uni.navigateBack();
				}
				return true;
			}
		},
		mounted() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: "#5A7CF3 !important"
			})
		},
		methods: {
			//扫描默认目标库位
			getDefaultToLocation(locationCode) {
				uni.showLoading({
					title: "扫描中",
					mask: true
				});
				locations(locationCode).then(res => {
					uni.hideLoading();
					if (res) {
						this.toLocationInfo = res
					} else {
						this.showMessage('目标库位【' + locationCode + '】不存在');
					}

				}).catch(err => {
					uni.hideLoading();
					this.toLocationInfo = null
					this.showMessage(err.message);

				})
			},

			clearDefaultLocation() {
				this.toLocationInfo = null
			},
			remove(item, index) {
				showConfirmMsg("是否移除当前【" + item.itemCode + "】扫描信息", res => {
					if (res) {
						item.scaned = false;
						item.handledQty = null;
						this.getScanCount()
					}
				})
			},
			qtyChanged(value, item, index) {
				if (value <= 0) {
					this.showMessage('收货货数量必须大于0')
					item.qty = item.handledQty
					this.$refs['comNumberBox_' + index][0].setValue(item.qty);
				}
			},
			openScanPopup() {
				this.$refs.scanPopup.openScanPopup();
			},
			//加载零件信息
			getDetail() {
				let that = this;
				let params = {
					id: that.id,
				};

				getInventoryMoveDetail(params)
					.then(item => {
						console.log('item', item);

						that.datacontent = item;
						that.jobStatus = item.jobStatus
						that.details = item.details;
						that.toLocationInfo = null
						that.fromLocationInfo = null
					})
					.catch(err => {
						this.showMessage('未查找到详细信息')
					});
			},
			//扫描箱标签
			async getScanResult(result) {
				var packingCode = result.data.code;
				var itemFrom = this.details[0];

				uni.showLoading({
					title: '加载中',
					mask: true
				})
				var params = {
					pageIndex: 1,
					pageSize: 100,
					packingCode: packingCode
				};
				let balanceRes = await getBalancesByFilterAsync(params);
				uni.hideLoading();
				if (balanceRes.totalCount === 0) {
					this.showMessage('箱码【' + packingCode + '】未查询到库存余额')
					return;
				}
				var balanceData = balanceRes.items[0];
				var itemCode = balanceData.itemCode;
				var lot = balanceData.lot;
				var locationCode = balanceData.locationCode;
				var status = balanceData.status;
				var qty = balanceData.qty;

				//箱码校验
				if (itemFrom.isPackingCodeFrom || itemFrom.isPackingCodeTo) {
					if (packingCode != itemFrom.isPackingCodeFrom) {
						this.showMessage("任务中不允许修改来源箱码, 扫描箱码[" + packingCode + "]与推荐箱码[" + itemFrom.packingCode +
							"]不一致,请重新扫描")
						return;
					}
				}
				//零件号校验
				if (itemFrom.isItemCodeFrom || itemFrom.isItemCodeTo) {
					if (itemCode != itemFrom.itemCode) {
						this.showMessage("任务中不允许修改来源零件, 扫描箱码[" + packingCode + "]的零件[" + itemCode + "]与推荐零件[" +
							itemFrom.itemCode + "]不一致,请重新扫描")
						return;
					}
				}
				//批次校验
				if (itemFrom.isLotFrom || itemFrom.isLotTo) {
					if (lot != itemFrom.recommendFromLot) {
						this.showMessage("任务中不允许修改来源批次, 扫描箱码[" + packingCode + "]的批次是[" + lot + "]与推荐批次[" + itemFrom
							.lot + "]不一致,请重新扫描")
						return;
					}
				}
				//库位校验
				if (itemFrom.isLocationCodeFrom) {
					if (locationCode != itemFrom.recommendFromLocationCode) {
						this.showMessage("任务中不允许修改来源库位, 扫描箱码[" + packingCode + "]的库位是[" + locationCode + "]与推荐库位[" +
							itemFrom.recommendFromLocationCode + "]不一致,请重新扫描")
						return;
					}
				}

				//状态校验
				if (itemFrom.isStatusFrom || itemFrom.isStatusTo) {
					if (status != itemFrom.status) {
						this.showMessage("任务中不允许修改来源状态, 扫描箱码[" + packingCode + "]的状态是[" + status + "]与推荐状态[" + itemFrom
							.status + "]不一致,请重新扫描")
						return;
					}
				}

				if (itemFrom.isQtyFrom || itemFrom.isQtyTo) {
					if (qty != itemFrom.recommendFromQty) {
						this.showMessage("任务中不允许修改来源数量, 扫描箱码[" + packingCode + "]的数量是[" + qty + "]与推荐数量[" + itemFrom
							.recommendFromQty + "]不一致,请重新扫描")
						return;
					}
				}

				itemFrom.handledFromPackingCode = packingCode;
				itemFrom.handledFromLot = lot;
				// itemFrom.handledFromLocationCode = locationCode;
				// itemFrom.handledFromLocationArea = balanceData.locationArea;
				// itemFrom.handledFromLocationGroup = balanceData.locationGroup;
				// itemFrom.handledFromLocationErpCode = balanceData.locationErpCode;
				itemFrom.handledFromContainerCode = balanceData.containerCode;
				itemFrom.handledFromSupplierBatch = balanceData.supplierBatch;
				itemFrom.handledFromArriveDate = balanceData.arriveDate;
				itemFrom.handledFromProduceDate = balanceData.produceDate;
				itemFrom.handledFromExpireDate = balanceData.expireDate;
				itemFrom.handledFromWarehouseCode = balanceData.warehouseCode;
				itemFrom.handledFromQty = balanceData.qty;
				
				
				itemFrom.handledToContainerCode = itemFrom.handledFromContainerCode;
				itemFrom.handledToPackingCode = itemFrom.handledFromPackingCode;
				itemFrom.handledToSupplierBatch = itemFrom.handledFromSupplierBatch;
				itemFrom.handledToArriveDate = itemFrom.handledFromArriveDate;
				itemFrom.handledToProduceDate = itemFrom.handledFromProduceDate;
				itemFrom.handledToExpireDate = itemFrom.handledFromExpireDate;
				itemFrom.handledToWarehouseCode = itemFrom.handledFromWarehouseCode;
				itemFrom.handledToLot = itemFrom.handledFromLot;
				itemFrom.handledToQty = itemFrom.handledFromQty;

			},


			getScanCount() {
				this.scanCount = this.datacontent.details.filter(r => r.scaned).length;
			},

			closeScanPopup() {
				if (this.allCount == this.scanCount) {
					this.$refs.scanPopup.closeScanPopup();
				}
			},

			cancel() {
				showConfirmMsg("是否清除已经扫描的数据?", res => {
					if (res) {
						this.getDetail();
					}
				})

			},


			//接收
			receive(callback) {
				let params = {
					id: this.id
				};
				takeInventoryMoveJob(params)
					.then(res => {
						callback(true);
					})
					.catch(err => {
						this.showMessage(err.message);
						callback(false);
					});
			},

			submit() {

				if (this.fromLocationInfo == null) {
					this.showMessage('请扫描来源库位');
					return;
				}
				if (this.toLocationInfo == null) {
					this.showMessage('请扫描目标库位');
					return;
				}

				if (!this.details[0].handledFromPackingCode) {
					this.showMessage('请扫描箱码');
					return;
				}
				this.finsh();
			},

			finsh() {
				uni.showLoading({
					title: "提交中..."
				});
				this.setParams();
				let params = JSON.stringify(this.datacontent);
				console.log("提交", params);
				finshInventoryMoveJob(this.id, params)
					.then(res => {
						uni.hideLoading();
						if (res != null) {
							this.showCommitSuccessMessage();
						}
					})
					.catch(err => {
						this.showMessage(err.message);
						uni.hideLoading();
					});
			},
			setParams() {
				this.details.forEach(res => {
					
					res.handledFromLocationCode = this.fromLocationInfo.code;
					res.handledFromLocationArea =this.fromLocationInfo.areaCode;
					res.handledFromLocationGroup =this.fromLocationInfo.locationGroup;
					res.handledFromLocationErpCode = this.fromLocationInfo.locationErpCode;
					
					res.handledToLocationCode = this.toLocationInfo.code;
					res.handledToLocationArea =this.toLocationInfo.areaCode;
					res.handledToLocationGroup = this.toLocationInfo.locationGroup;
					res.handledToLocationErpCode = this.toLocationInfo.locationErpCode;
					
					

				})

			},

			showCommitSuccessMessage() {
				this.$refs.comMessage.showCommitSuccess();
			},

			closeCommitMessage() {
				navigateBack(1); //点关闭直接返回列表
				uni.hideLoading();
			},


			clearScanLocation() {
				// this.$refs.scanLocation.getfocus();
				// this.$refs.scanLocation.clear();
			},
			showMessage(message) {
				this.$refs.comMessage.showMessage(message);
			},

			scroll: function(e) {
				this.old.scrollTop = e.detail.scrollTop;
			},
			openFromLocation() {
				this.$refs.locationFrom.openScanPopup()
			},
			openToLocation() {
				this.$refs.locationTo.openScanPopup()
			},
			getFromLocation(locationInfo) {
				if (this.details[0].isLocationCodeFrom) {
					if (locationInfo.code != this.details[0].recommendFromLocationCode) {
						this.showMessage("任务中不允许修改来源库位, 扫描来源库位[" + locationInfo.code + "]与推荐库位[" + this.details[0]
							.recommendFromLocationCode + "]不一致,请重新扫描")
						return;
					}
				}
				this.fromLocationInfo = locationInfo
				this.details[0].handledFromLocationCode=locationInfo.code
			},
			getToLocation(locationInfo) {
				if (this.details[0].isLocationCodeTo) {
					if (locationInfo.code != this.details[0].recommendToLocationCode) {
						this.showMessage("任务中不允许修改目标库位, 扫描目标库位[" + locationInfo.code + "]与推荐库位[" + this.details[0]
							.recommendToLocationCode + "]不一致,请重新扫描")
						return;
					}
				}
				this.toLocationInfo = locationInfo
				this.details[0].handledToLocationCode=locationInfo.code
			},
			trigger(e) {
				if (e.item.text == "来源库位") {
					this.openFromLocation()
				} else if (e.item.text == "目标库位") {
					this.openToLocation();

				} else if (e.item.text == "箱码") {
					this.openScanPopup()
				}
				// this.$refs.fab.close();
			}
		}
	}
</script>

<style lang="less">
	.fab {
		::v-deep.uni-icons.uniui-plusempty.fab-circle-icon {
			font-size: 0 !important;
		}

		::v-deep.uniui-plusempty:before {
			content: "扫描" !important;
			font-size: 30rpx;
		}
	}
</style>