<template>
	<view class="content">
		<view class="topbar" v-show="isIphone">
		</view>
		<view class="status_bar">
			<view class="left" @click="goBack"><u-icon name="arrow-left"></u-icon>返回</view>
			<span style="font-size: 36rpx;">批次详情</span>
			<view class="right"></view>
		</view>
		<view class="mainCont">
			<view class="pcTop" v-show="tableList.length">
				{{ batchName }}({{ tableList.length - notHandlePackIds.length }}/{{ tableList.length }})
				<span style="float: right" v-show="checkWeight">{{ checkWeight }}kg</span>
			</view>
			<view class="card" @click="goInfo(item.id)" v-for="(item, index) in tableList" :key="index">
				<view class="top">
					<view class="left">{{ item.packCode }}</view>
					<view class="right" :style="{color: item.finishState == 1 ? '#00CC00' : '#FF0000'}"
						v-show="item.abnormalType == 1">{{ item.finishState == 1 ? '已完成' : '待处理' }}</view>
				</view>
				<view class="bottom">
					<view>科&emsp;&emsp;室：{{ item.positionName }}<span
							style="float: right">{{ item.packWeight }}kg</span></view>
					<view>医废分类：{{ item.categoryName }}
						<span style="float: right"
							v-show="item.finishState == 1 && item.abnormalType == 1 && item.abnormalCategory == 1">标签破损--记重</span>
						<span style="float: right"
							v-show="item.finishState == 1 && item.abnormalType == 1 && item.abnormalCategory == 2">丢失--不记重</span>
						<span style="float: right"
							v-show="item.finishState == 1 && item.abnormalType == 1 && item.abnormalCategory == 3">无需处理</span>
					</view>
					<view>打&ensp;包&ensp;人：{{ item.createName }}<span style="float: right">{{ item.createTime }}</span>
					</view>
					<view class="bButton" v-show="item.packState == 3 && item.finishState == null">
						<span v-show="item.finishState != '0'" @click.stop="doCollect(item.batchId, item.id)">验收</span>
						<span @click.stop="doUnusual(item.id)" v-show="item.abnormalType != 1"
							style="margin-right: 10px;background: #fff;color: #5976ba">异常处理</span>
					</view>
				</view>
			</view>
			<view style="margin-top: 100px;text-align: center;" v-show="!tableList.length">暂无数据</view>
		</view>
		<view class="bottomButtons" v-show="batchState == '2'">
			<view style="background-color: #fff;color: rgba(89, 118, 186, 1)">扫码</view>
			<view @click="confirmCheck" :style="{backgroundColor: notHandlePackIds.length ? '#cccccc' : '#5976ba'}"
				style="color: #fff;">确认验收
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	const NET = require('@/utils/request')
	const API = require('@/config/api')
	export default {
		data() {
			return {
				id: "",
				tableList: [],
				batchName: "",
				notHandlePackIds: [],
				checkWeight: "",
				realWeight: "",
				createName: "",
				batchState: "",
				isIphone: false,
			}
		},
		onLoad(options) {
			uni.getSystemInfo({
				success: (res) => {
					console.log(res)
					if (res.model == 'iPhone') {
						this.isIphone = true;
					}
				},
				fail: (err) => {
					console.log(err)
				}
			})
			this.id = options.id
			this.getInfo()
		},
		onReady() {
			if (this.isIphone) {
				document.getElementsByClassName('mainCont')[0].style.height = document.getElementsByClassName('mainCont')[
					0].clientHeight - 25 + 'px'
			}
		},
		onShow() {
			this.getInfo()
		},
		methods: {
			goBack() {
				uni.navigateBack({
					delta: 1
				});
			},
			getInfo() {
				NET.request(API.queryBatchDetail + '/' + this.id, {}).then(res => {
					// this.text = res.data.
					this.realWeight = res.data.realWeight
					this.createName = res.data.createName
					this.checkWeight = res.data.checkWeight
					this.tableList = res.data.packageList
					this.batchName = res.data.batchName
					this.notHandlePackIds = res.data.notHandlePackIds
					this.batchState = res.data.batchState
				}).catch(error => {
					this.$refs.uToast.show({
						title: error.msg,
						type: 'warning',
					})
				})
			},
			doCollect(batchId, id) {
				let postData = {
					batchId: batchId,
					id: id
				}
				NET.request(API.receivePackage4Batch, postData).then(res => {
					this.$refs.uToast.show({
						title: res.msg,
						type: 'success',
					})
					this.getInfo()
				}).catch(error => {
					this.$refs.uToast.show({
						title: error.msg,
						type: 'warning',
					})
				})
			},
			doUnusual(id) {
				uni.navigateTo({
					url: `/wasteCheck/unusualDeal?id=${id}`
				});
			},
			confirmCheck() {
				if (this.notHandlePackIds.length) {
					return false
				} else {
					uni.navigateTo({
						url: `/wasteCheck/confirmCheck?id=${this.id}&name=${this.createName}&batchName=${this.batchName}&num=${this.tableList.length}&weight=${this.realWeight}`
					});
				}
			},
			goInfo(id) {
				uni.navigateTo({
					url: `/wasteCheck/infor?id=${id}`
				});
			}
		}
	}
</script>

<style lang="scss">
	.mainCont {
		height: calc(100% - 80rpx);
		padding-bottom: 60px;
		overflow-y: scroll;
	}

	.pcTop {
		width: calc(100% - 20px);
		padding: 0 10px;
		height: 20px;
		line-height: 20px;
		margin: 0 auto;
		margin-top: 10px;
		margin-bottom: 10px;
		position: relative;

		&:after {
			content: '';
			position: absolute;
			height: 20px;
			top: 0;
			left: 0;
			width: 2px;
			background-color: #6aa0f7;
		}
	}

	.bottomButtons {
		box-shadow: 0px -5px 5px #d0cece;
		position: fixed;
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: 40px;
		line-height: 40px;
		bottom: 0;
		left: 0;

		view {
			width: 50%;
			height: 40px;
			line-height: 40px;
			text-align: center;
		}
	}
</style>
