<template>
	<page-meta root-font-size="16px"></page-meta>
	<view class="">
		<view class="top_card">
			<view class="device-detail">
				<view class="cell_box uni-flex uni-row margin_top">
					<view class="cell_info result_card">
						<view class="text_lightblue">应收数量</view>
						<view class="text_black text_bold">{{ allCount }}</view>
					</view>
					<view class="cell_info result_card">
						<view class="text_lightblue">实收数量</view>
						<view class="text_black text_bold">{{ receiptCount }}</view>
					</view>
					<view class="cell_info result_card">
						<view class="text_lightblue">不合格数量</view>
						<view class="text_black text_bold red">{{ unPassCount }}</view>
					</view>
					<view class="cell_info result_card">
						<view class="text_lightblue">未收数量</view>
						<view class="text_black text_bold">{{ unReceiptCount }}</view>
					</view>
				</view>
			</view>
		</view>
		<scroll-view v-if="itemList.length>0" :scroll-top="scrollTop" scroll-y="true" class="scroll-detail"
			@scrolltoupper="upper" @scrolltolower="lower" @scroll="scroll">
			<view class="detail-list" v-for="(item, index) in itemList" :key="item.id">
				<view class="detail-content common_card">
					<view class="choose_main">
						<view class="ljh_box">
							<view class="ljh_info">
								<view class="tit_ljh">{{ item.itemCode }}</view>
								<view class="label_xm font_sm fr">{{ item.recommendPackingCode }}</view>
							</view>
							<view class="desc_card uni-flex space-between">
								<view class="ljh_left desc_ljh">
									<view class="font_xs text_lightblue">{{ item.itemName }}</view>
									<view class="font_xs text_lightblue">{{ item.itemDesc1 }}</view>
								</view>
							</view>
						</view>
						<view class="cen_card margin_xs_bottom">
							<view class="label_box uni-flex uni-row space-between">
								<view class="label_info">
									<text>不合格数量:{{ item.recommendQty}}({{ item.uom}})</text>
								</view>
								<view v-if="item.purchaseReceiptInspectStatus==3?true:false" @click="seePhoto(item)">
									<!-- <label class="">
										<image class="icon_normal" src="@/static/icons_ui/icon_take_photo.svg"></image>
									</label> -->
									<text class="text_blue">查看</text>
								</view>
							</view>
						</view>
					</view>
					<view v-if="item.check" class="choose_marked">
						<image src="@/static/image_marked.svg"></image>
					</view>
				</view>
			</view>
		</scroll-view>

		<view class="result_nodata" v-else>
			<image class="default_nodata" src="@/static/icons_ui/default_notpassed.png"></image>
			<text>暂无不合格零件</text>
		</view>

		<view class="new_btn_bot">
			<button class="new_save_btn" @click="save">提交</button>
		</view>

		<comMessage ref="comMessage" @afterCloseCommitMessage='closeCommitMessage()'></comMessage>
		<receipt-check ref="receiptCheck" :dataContent='selectedItem' :disabled='true'
			@getReceiptResult='afterTakePhoto'>
		</receipt-check>
	</view>
</template>

<script>
	import {
		showConfirmMsg,
		goHome,
	} from '@/common/basic.js';

	import {
		purchaseReceipts,
		finishReceiptJob,
		saveReceiptResult,
	} from '@/api/index.js';

	import comMessage from '@/mycomponents/common/comMessage.vue'
	import receiptCheck from '@/pages/task/receipt_check.vue'
	export default {
		components: {
			comMessage,
			receiptCheck
		},
		name: 'receipt_result',
		data() {
			return {
				id: '',
				receiptJob: {},
				itemList: [],
				allCount: 0,
				receiptCount: 0,
				unPassCount: 0,
				unReceiptCount: 0,
				selectedItem: {},
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
			}
		},
		props: {
			dataContent: {
				type: Object,
				value: null
			},
		},

		filters: {},

		mounted: function() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: "#5A7CF3 !important"
			})
		},

		created() {

		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			}else if(e.index === 1){
				window.location.reload();
			}
		},
		onLoad: function(e) {
			let that = this;
			that.id = e.id;
			this.getJoDetail(res => {
				that.receiptJob = res;
				that.itemList = that.receiptJob.details.filter(r => {
					return r.purchaseReceiptInspectStatus == 3
				})
				that.receiptJob.details.forEach(r => {
					that.allCount += r.recommendQty;
					switch (r.purchaseReceiptInspectStatus) {
						case 1: //待检,不收货
							that.unReceiptCount += r.recommendQty
							break;
						case 2: //合格
							that.receiptCount += r.recommendQty
							break;
						case 3: //不合格
							that.unPassCount += r.recommendQty
							break;
					}
				})
			});
		},

		methods: {
			getJoDetail(callBack) {
				let that = this;
				purchaseReceipts(that.id)
					.then(res => {
						if (res != null) {
							callBack(res);
						}
					})
					.catch(err => {
						this.showMessage(err.message);
					});
			},

			//保存
			save() {
				let uncheckitems = this.receiptJob.details.filter(r => {
					return (r.purchaseReceiptInspectStatus <= 1)
				});
				if (uncheckitems.length > 0) {
					showConfirmMsg('未扫描的零件将生成缺料记录,是否继续提交?', confirm => {
						if (confirm) {
							this.submit();
						}
					})
				} else {
					this.submit();
				}
			},

			submit() {
				let that = this;
				uni.showLoading({
					'title': '提交中...',
					mask: true
				})
				//赋值
				that.receiptJob.details.forEach(r => {
					r.handledToLocationCode = r.recommendToLocationCode;
					r.worker = localStorage.userName
					if (r.purchaseReceiptInspectStatus == 1) {
						r.handledArriveDate = new Date(); //
						r.purchaseReceiptInspectStatus = 4; //未收货
						r.handledQty = 0;
						// r.handledUom = r.recommendUom;
						r.handledContainerCode = r.recommendContainerCode;
						r.handledPackingCode = r.recommendPackingCode;
						r.handledSupplierBatch = r.recommendSupplierBatch;
						r.handledProduceDate = r.recommendProduceDate;
						r.handledExpireDate = r.recommendExpireDate;
						r.handledLot = r.recommendLot;
						r.handledToLocationCode = r.recommendToLocationCode;
						r.handledToLocationArea = r.recommendToLocationArea;
						r.handledToLocationGroup = r.recommendToLocationGroup;
						r.handledToLocationErpCode = r.recommendToLocationErpCode;
					}
				});

				let param = JSON.stringify(that.receiptJob);
				console.log(param);
				finishReceiptJob(that.id, param).then(res => {
					uni.hideLoading();
					if (res != null) {
						that.showCommitSuccessMessage();
						that.backJobList(1000);
					}
				}).catch(err => {
					uni.hideLoading();
					that.showMessage(err.message);
				});
			},

			//返回任务列表页
			backJobList(delay) {
				setTimeout(() => {
					uni.navigateTo({
						url: './receipt'
					})
				}, delay)
			},

			seePhoto(item) {
				this.selectedItem = item;
				this.$refs.receiptCheck.openReceiptCheckPopup(item.inspectPhotoJson);
			},

			afterTakePhoto(files) {
				let pass = files.length == 0 ? 'pass' : 'unPass';
				this.selectedItem.files = files;
				this.scanItem(this.selectedItem, pass);
				this.$forceUpdate();
			},

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

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

			closeCommitMessage() {
				this.backJobList(0); //点关闭直接返回列表
				uni.hideLoading();
			},
			scroll: function(e) {
				// console.log(e)
				this.old.scrollTop = e.receiptJob.scrollTop;
			},
		}
	}
</script>

<style scoped lang="scss">

</style>
