sfms3.0-uniapp/src/pages/count/job/countLightDetail.vue

<template>
	<view class="page-wraper">
		<view class="header">
			<view class="">
				<job-top :dataContent="jobContent"></job-top>
			</view>
			<view class="cen_card" style="padding-top: 10rpx;padding-bottom: 10rpx;">
				<view class="cell_box uni-flex uni-row" style=" font-weight: bold;">
					<view class="cell_info" style="color: #000">
						<view class="text_lightblue" style="color: #000">阶段</view>
						<view style="color: #000">{{getCountStageName(jobContent.stage)}}</view>
					</view>
					<view class="cell_info">
						<view class="text_lightblue" style="color: #000">策略</view>
						<view style="color: #000">{{ isOpenCount(jobContent.isOpenCount) }}</view>
					</view>
					<view class="cell_info">
						<view class="text_lightblue" style="color: #000">库位</view>
						<view style="color: #000">{{fromLocationCode}}</view>
					</view>
					<view class="cell_info">
						<view class="text_lightblue" style="color: #000">总数</view>
						<view style="color: #000"> {{allCount}}</view>
					</view>
					<view class="cell_info">
						<view class="text_lightblue" style="color: #000">已扫描</view>
						<view style="color: #000">{{scanCount}}</view>
					</view>
				</view>
			</view>
		</view>
		<u-line color="#D8D8D8" style="margin-bottom: 10rpx"></u-line>
		<view style="margin-top: 160rpx; padding-bottom: 130rpx;">
			<u-line color="#D8D8D8" style="margin-bottom: 15rpx"></u-line>
			<scroll-view scroll-y="true" class="" style="margin-bottom: 0px;">
				<view class="detail-list" v-for="(item, index) in showList" :key="item.id">
					<uni-swipe-action ref="swipeAction">
						<uni-swipe-action-item @click="swipeClick($event,item)"
						:right-options="item.scaned?scanOptions:detailOptions">
							<view class="uni-flex uni-row " style="align-items: center;"
								:class="item.scaned?'scan_view':'item'">
								<view class="" style="font-size: 30rpx; font-weight: bold;">
									{{index+1}}.
								</view>
								<comCountDetailcards :ref="'countDetail_'+index" :dataContent="item" :index="index"
									@editItem="editItem" :settingParam="jobContent" @remove="updateData"
									@updateData="updateData">
								</comCountDetailcards>
							</view>
							<view class='split_line'></view>
						</uni-swipe-action-item>
					</uni-swipe-action>
				</view>
			</scroll-view>
			<uni-load-more :status="loadingType" v-if="showList.length>0" />

		</view>

		<view class="page-footer">
			<view class="uni-flex u-col-center space-between padding_10"
				style="background-color:ghostwhite; width: 100%; ">
				<view class="">
				</view>
				<view class=" uni-flex uni-row">
					<button class="btn_single_commit" hover-class="btn_commit_after" @click="commit">提交</button>
				</view>
			</view>
		</view>

		<win-scan-button @goScan='openScanPopup'></win-scan-button>
		<win-scan-pack-and-location
		 :allowModifyLocation="false"
		 ref="scanPopup" :noShowBalanceMessage="true" @getCountScanResult='getScanResult'>
		</win-scan-pack-and-location>
		<count-qty-edit ref="countQtyEdit" @confirm="editConfirm" @close="editClose" :isShowStatus="true"
			:allowEditStatus="editInventoryStatus" :isShowBalance="jobContent.isOpenCount=='TRUE'">
		</count-qty-edit>
		<detail-info-popup ref="detailInfoPopup"></detail-info-popup>
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>

<script>
	import {
		getCountJobDetail,
		takeCountJob,
		cancleTakeCountJob,
		countJobSubmit
	} from '@/api/request2.js';
	import {
		calc
	} from '@/common/calc.js';

	import {
		Decimal
	} from 'decimal.js'; //引入

	import {
		goHome,
		navigateBack,
		getPackingNumberAndBatch,
		compare
	} from '@/common/basic.js';
	import {
		getCountStageName
	} from '@/common/directory.js';

	import {
		getDetailOption,
		getDetailEditRemoveOption,
		getClearOption
	} from '@/common/array.js';


	import winScanButton from '@/mycomponents/scan/winScanButton.vue'
	import winScanPack from '@/mycomponents/scan/winScanPack.vue'
	import comCountDetailcards from '@/pages/count/coms/comCountDetailcards.vue'
	import winScanPackAndLocation from "@/mycomponents/scan/winScanPackAndLocation.vue"
	import countQtyEdit from '@/mycomponents/qty/countQtyEdit.vue'
	import jobTop from '@/mycomponents/job/jobTop.vue'
	import detailInfoPopup from '@/pages/count/coms/detailInfoPopup.vue'

	export default {
		name: 'receipt_detail',
		components: {
			winScanButton,
			winScanPack,
			comCountDetailcards,
			winScanPackAndLocation,
			countQtyEdit,
			jobTop,
			detailInfoPopup
		},
		data() {
			return {
				id: '',
				receiptJob: {},
				fromLocationCode: '',
				isShowPackingCode: true,
				jobContent: {}, //任务内容
				subList: [], //接口返回的任务subList
				detailSource: [], //绑定在页面上的数据源
				balance: {}, //库存余额
				editInventoryStatus: false,
				package: {}, //包装
				label: {}, //标签
				currentEditItem: {},
				jobStatus: "",
				allCount: 0,
				scanCount: 0,
				index: 0,
				pageSize: 20,
				showList: [],
				loadingType: "",
				allDetails: [],
				scanOptions: [],
				detailOptions: [],
			};
		},
		onLoad(option) {
			uni.setNavigationBarTitle({
			  title: option.title+'详情'
			})
			this.id = option.id;
			if (this.id != undefined) {
				//新建的任务自动接收
				if (option.status == "1") {
					this.receive((callback => {
						this.getDetail();
					}));
				} else {
					this.getDetail();
				}
			}
			this.detailOptions = getDetailOption();
			this.scanOptions = getDetailEditRemoveOption();
		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			}
		},
		//拦截返回按钮事件
		onBackPress(e) {
			//已经接收但是没提交任务
			if (e.from === 'backbutton') {
				if (this.jobStatus == "2") {
					//取消承接任务	
					cancleTakeCountJob(this.id).then(res => {
						uni.navigateBack();
					}).catch(error => {
						uni.navigateBack();
					})
				} else {
					uni.navigateBack();
				}
				return true;
			}
		},

		onPullDownRefresh() {
			this.initList();
			uni.stopPullDownRefresh();
		},

		mounted() {

		},
		onReachBottom() {
			console.log("onReachBottom")
			//避免多次触发
			if (this.loadingType == 'nomore') {
				return;
			}
			this.index++;
			var list = this.getDataPage(this.index, this.pageSize)
			if (list.length > 0) {
				// this.showList=list
				this.showList = this.showList.concat(list)
			} else {
				//没有更多了
				this.loadingType = "nomore";
			}

		},
		methods: {
			//接收
			receive(callback) {
				if (this.id != null) {
					takeCountJob(this.id).then(res => {
						callback();
					}).catch(error => {
						this.showErrorMessage(error)
					})
				}
			},

			getDetail() {
				var that = this;
				uni.showLoading({
					title: "加载中....",
					mask: true
				});
				getCountJobDetail(that.id).then(res => {
					uni.hideLoading();
					if (res.data == null) {
						that.showMessage('未获取到详情');
					} else {
						that.jobContent = res.data;
						that.jobStatus = res.data.status;
						that.fromLocationCode = that.jobContent.countSplitCode;
						res.data.subList.forEach(item => {
							item.recommendQty = item.qty
							item.handleQty = 0
							item.countTime = new Date()
							item.fromLocationCode =that.fromLocationCode;
						})
						that.allDetails = res.data.subList;
						that.allCount = res.data.subList.length;
						that.initList()
					}

				}).catch(error => {
					uni.hideLoading()
					this.showErrorMessage(error)
				})
			},

			initList() {
				this.index = 1;
				this.showList = []
				this.loadingType = "";
				this.showList = this.getDataPage(this.index, this.pageSize)
			},

			getDataPage(pageNo, pageSize) {
				//计算总页数
				var totalPages = Math.ceil(this.allCount / pageSize);
				//当前页起始索引
				const start = (pageNo - 1) * pageSize;
				const end = start + pageSize; //当前页结束索引
				return this.allDetails.slice(start, end)

			},

			swipeClick(e, item) {
				if (e.content.text == "详情") {
					this.detail(item)
				} else if (e.content.text == "编辑") {
					this.editItem(item)
				} else if (e.content.text == "移除") {
					this.remove(item)
				}
			},
			detail(item) {
				this.showItem = item;
				this.$refs.detailInfoPopup.openPopup(item);
			},

			remove(item, index) {
				this.$refs.comMessage.showQuestionMessage("确定移除扫描信息?",
					res => {
						if (res) {
							item.scaned = false;
							item.handleQty = 0;
							this.showList.splice(index,1)
							this.$emit('removePack')
						}
					});
			},


			updateData() {},

			openScanPopup() {
				var fromlocationList = [];
				fromlocationList.push(this.fromLocationCode)
				this.$refs.scanPopup.openScanPopupForJob(this.fromLocationCode, fromlocationList, this.jobContent);
			},

			closeScanPopup() {
				if (this.$refs.scanPopup != undefined) {
					this.$refs.scanPopup.closeScanPopup();
				}
			},

			scanPopupGetFocus() {
				if (this.$refs.scanPopup != undefined) {
					this.$refs.scanPopup.packGetFocus();
				}
			},

			scanPopupLoseFocus() {
				if (this.$refs.scanPopup != undefined) {
					this.$refs.scanPopup.packLoseFocus();
				}
			},

			//明盘
			getScanResult(result) {
				var itemCode = result.label.itemCode
				var packingNumber = result.label.packingNumber
				var pack = result.package
				var batch = result.label.batch
				var inventoryStatus = result.balance ? result.balance.inventoryStatus : "OK"
				var qty = result.balance ? result.balance.qty : 0;

				//按物料、箱码、批次、状态匹配
				let items = this.allDetails.filter(r =>
					r.itemCode === itemCode &&
					r.packingNumber === packingNumber &&
					r.batch === batch &&
					r.inventoryStatus === inventoryStatus)
				//不在任务列表中,是否添加库存
				if (items.length == 0) {
					this.$refs.comMessage.showQuestionMessage("包装【" + result.label.packingNumber +
						"】不在任务列表中,是否要添加到列表中?",
						res => {
							//创建盘点信息，标记为已经扫描
							if (res) {
								var detail = this.createAddDetailInfo(pack,qty)
								detail.countTime = new Date();
								this.allDetails.push(detail)
								this.updateList();
								this.$refs.countQtyEdit.openEditPopupShowSeconds(detail,
									null);
							} else {
								this.scanPopupGetFocus();
							}
						})
				} else {
					var selectItem = items[0]
					//已经扫描
					if (selectItem.scaned) {
						this.$refs.comMessage.showQuestionMessage("包装【" + result.label.packingNumber +
							"】已经完成盘点,是否要编辑盘点结果?",
							res => {
								if (res) {
									this.currentEditItem = selectItem;
									this.$refs.countQtyEdit.openEditPopup(selectItem,
										null);
								} else {
									this.scanPopupGetFocus();
								}
							})

					} else {
						//未扫描，赋值
						selectItem.scaned = true;
						selectItem.balanceQty= Number(qty)
						selectItem.handleQty = Number(qty)
						selectItem.packQty = pack.packQty
						selectItem.packUnit = pack.packUnit
						selectItem.locationCode =this.fromLocationCode
						selectItem.fromLocationCode =this.fromLocationCode

						this.$refs.countQtyEdit.openEditPopupShowSeconds(selectItem,
							null);
						selectItem.countTime = new Date();
						this.updateList();
					}
				}
			},


			editConfirm(qty, inventoryStatus, mode) {
				let that = this;
				//编辑
				if (mode == 'edit') {
					this.currentEditItem.handleQty = qty;
					this.currentEditItem.inventoryStatus = inventoryStatus;
				}
				//重新排序
				this.currentEditItem.countTime = new Date();
				this.updateList();
				this.scanPopupGetFocus();

			},

			updateList() {
				this.allDetails.sort(compare('countTime')); //按扫描信息排序
				this.initList()
				this.scanPopupLoseFocus()
				this.calcAllCount()
				this.calcScanCount()
			},

			calcAllCount() {
				this.allCount = this.allDetails.length;
			},

			calcScanCount() {
				this.scanCount = this.allDetails.filter(r => r.scaned === true).length;
			},

			editClose() {
				this.scanPopupGetFocus();
			},


			//创建盘盈的明细
			createAddDetailInfo(pack,qty) {
				var detail = {
					masterId: this.jobContent.id, //新增的明细
					scaned: true,
					countDetailNumber: "",
					ownerCode: "",
					packingNumber: pack.number,
					containerNumber: "",
					batch: pack.batch,
					inventoryStatus: "OK",
					itemCode: pack.itemCode,
					itemName: pack.itemName,
					itemDesc1: pack.itemDesc1,
					itemDesc2: pack.itemDesc2,
					packQty: pack.packQty,
					packUnit: pack.packUnit,
					projectCode: "",
					recommendQty:Number(qty),
					qty: Number(qty),
					handleQty: Number(qty),
					uom: pack.uom,
					number: pack.number,
					remark: "",
					countQty: 0,
					balanceQty: Number(qty),
					fromLocationCode: this.fromLocationCode,
					locationCode:this.fromLocationCode,
					creator: this.$store.state.user.id,
					countTime: new Date()
				}
				return detail;
			},



			commit() {
				this.calcAllCount()
				this.calcScanCount()
				// if(!this.scanCount){
				// 	this.$refs.comMessage.showErrorMessage('请先进行扫描,再进行提交');
				// 	return
				// }
				if (this.scanCount == this.allCount) {
					this.submitJob();
				} else if (this.scanCount < this.allCount) {
					//扫描数量小于任务数量，判断是否允许部分提交
					if (this.jobContent.allowPartialComplete == "TRUE") {
						//提交
						this.$refs.comMessage.showQuestionMessage("已经扫描[" + this.scanCount +
							"]总共[" +
							this.allCount + "],是否把未扫描的盘点数量设置为0?",
							res => {
								if (res) {
									this.allDetails.forEach(item => {
										if (!item.scaned) {
											item.scaned = true;
											item.handleQty = 0
											item.locationCode =this.fromLocationCode
											item.fromLocationCode =this.fromLocationCode
										}
									})
									this.submitJob();
								}
							});

					} else {
						//不允许部分提交，提示
						this.$refs.comMessage.showErrorMessage('请完成扫描后,再进行提交\n' + "已经扫描[" + this.scanCount +
							"]总共[" + this
							.getTotalCount() + "]", res => {
								if (res) {
									this.openScanPopup();
								}
							});
					}
				}

			},

			submitJob() {
				uni.showLoading({
					title: "提交中....",
					mask: true
				});
				var params = this.setParams()
				console.log("提交参数", JSON.stringify(params));
				countJobSubmit(params).then(res => {
					uni.hideLoading()
					if (res.data) {
						this.showCommitSuccessMessage("提交成功\n生成盘点记录\n" + res.data)
					} else {
						this.showErrorMessage("提交失败[" + res.msg + "]")
					}
				}).catch(error => {
					uni.hideLoading()
					this.showErrorMessage(error)
				})

			},

			setParams() {
				var subList = []
				var creator = this.$store.state.user.id

				this.allDetails.forEach(item => {
					if (item.scaned) {
						item.countQty = item.handleQty;
					}
					subList.push(item)
				})

				this.jobContent.subList = subList
				this.jobContent.creator = creator;
				return this.jobContent;
			},


			showMessage(message) {
				this.$refs.comMessage.showMessage(message, res => {
					if (res) {
						this.afterCloseMessage()
					}
				});
			},
			showErrorMessage(message) {
				this.$refs.comMessage.showErrorMessage(message, res => {
					if (res) {
						this.afterCloseMessage()
					}
				});
			},

			showScanMessage(message) {
				this.$refs.comMessage.showScanMessage(message);
			},

			afterCloseMessage() {
				this.scanPopupGetFocus();
			},

			closeScanMessage() {
				this.scanPopupGetFocus();
			},

			editItem(item) {
				this.currentEditItem = item;
				this.$refs.countQtyEdit.openEditPopup(this.currentEditItem,
					null);
			},

			showCommitSuccessMessage(hint) {
				this.$refs.comMessage.showSuccessMessage(hint, res => {
					navigateBack(1);
				})
			},
			getCountStageName(value) {
				return getCountStageName(value)
			},
			isOpenCount(value) {
				return value == "TRUE" ? "明盘" : "盲盘"
			}

		}

	}
</script>

<style scoped lang="scss">
	page {
		width: 100%;
		height: 100%;
		background-color: #fff;
	}

	.page-wraper {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 100%;
	}

	.header {
		position: fixed;
		/* #ifdef H5 */
		top: 88rpx;
		/* #endif */
		left: 0;
		width: 100%;
		background-color: #fff;
		z-index: 10;
		padding: 10rpx;
		/* 确保头部在内容之上 */
	}

	.page-footer {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}


	.page-main {
		flex: 1;
		position: relative;
	}

	.page-main-scroll {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
	}

	.page-main-list {
		/*  height: 80rpx;
	    line-height: 80rpx; */
		text-align: center;
		background: #e0e0e0;

	}

	.item {
		background-color: #fff;
	}

	.item_scaned {
		background-color: antiquewhite;
	}
</style>