<template>
	<view class="container">
		<uni-card :title="(purchase.supplierName == null ?'暂无':purchase.supplierName)" thumbnail="/static/images/dingdan/dd0.png">
			<!-- <view class="uni-body" v-if="supplier.province">{{supplier.province + supplier.area + supplier.city + supplier.address}} </view> -->
		</uni-card>
		<view class="tui-order-item boxbg">
			<view class="shop-box" style="border-top:5px solid #eee;" v-for="(item,index) in purchaseDetails" :key="index">
				<view class="shop-name">
					<img class="img-radius" :src="item.productPicture" alt="" style="width: 140rpx;height: 140rpx;margin: 30rpx 0 0 30rpx;" v-if="item.productPicture">
					<view class="noPic" v-else>暂无图片</view>		
					<view class="shop-productName">
						<view style="color:#FF5809;">{{item.productName == null ?'暂无':item.productName}}</view>
						<view>货号：{{item.productSn == null ?'暂无':item.productSn}}</view>
						<view><text v-if="type==0">单价:{{item.purchasePrice == null ?'暂无':item.purchasePrice}} </text><text style="padding: 0 5rpx;">数量:{{item.productCount == null ?'暂无':item.productCount}} </text><text v-if="type==0">总价:{{item.price == null ?'暂无':item.price}}</text></view>
					</view>
				</view>
				<view class="shop-type">
					<view class="shop-collapse" v-for="(items,index) in item.stockLogList1" :key='index'>
						<text>{{items.attributeList | sliceMsg}}</text>
						<!-- <text style="color: red;">单价：￥{{item.price}}</text> -->
						<text>数量：{{items.productCount == null ?'暂无':items.productCount}}</text>
					</view>
				</view>
			</view>
			<view class="tui-goods-info" style="width: 95%;margin: 0 auto;">
				<view class="tui-price-flex tui-size32" v-if="userType == 0&& zhiqianqiankuan >= 0" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">之前欠款</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{zhiqianqiankuan == null ?'暂无':Math.abs(zhiqianqiankuan) }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="userType == 0&&zhiqianqiankuan < 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">客户余额</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{zhiqianqiankuan == null ?'暂无':Math.abs(zhiqianqiankuan) }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">应付金额</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{ purchase.shouldPay == null ?'暂无':purchase.shouldPay }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">已付金额</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{ purchase.alreadyPay == null ?'暂无':purchase.alreadyPay }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="userType == 0 && aiinventory == 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">退货金额</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{ purchase.alreadyPay == null ?'暂无':purchase.alreadyPay }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="yuedikou != 0 && userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">余额抵扣</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{yuedikou == null ?'暂无':yuedikou }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="leijiqiankuan > 0 && userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">累计欠款</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{leijiqiankuan == null ?'暂无':leijiqiankuan }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="leijiqiankuan < 0 && userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">累计余额</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{leijiqiankuan == null ?'暂无':Math.abs(leijiqiankuan) }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="purchase.noPay >= 0 && userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">本次欠款</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{purchase.noPay == null ?'暂无':purchase.noPay }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" v-if="purchase.noPay < 0 && userType == 0 && aiinventory != 2" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">本次余额</view>
					<view class="tui-goods-price">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{purchase.noPay == null ?'暂无':purchase.noPay }}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32" style="height: 80rpx;line-height: 80rpx;">
					<view class="tui-flex-shrink">其他费用</view>
					<view class="tui-goods-price tui-primary-color">
						<view class="tui-size-24">￥</view>
						<view class="tui-price-large">{{ purchase.otherPay == null ?'暂无':purchase.otherPay}}</view>
					</view>
				</view>
				<view class="tui-price-flex tui-size32">
					<view class="tui-flex-shrink">备注</view>
					<view class="tui-goods-price">
						<uni-tooltip :content="purchase.remark == null ?'暂无':purchase.remark">
							<view style="font-size: 13px;width: 200px;height: 40rpx;overflow: hidden;text-align: right;">{{ purchase.remark == null ?'':purchase.remark}}</view>
							<text style="color: blue;">查看更多</text>
						</uni-tooltip>
					</view>
				</view>
			</view>
		</view>
		<view class="tui-tabbar">
			<view class="tui-btn-mr" @click="batchPrint" v-if="aiinventory !=1">批量打印</view>
			<view class="tui-btn-mr" @click="inventorySubmit">确认提交</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				purchase:{},
				purchaseDetails:'',
				aiinventory:1,  //1是AI入库  0是普通入库 2采购退货
				userType:1,
				claerSubmitBtn:0,
				leijiqiankuan:0,
				zhiqianqiankuan:0,
				khid:'',
				yuedikou:0,
				khName: [],
				data:{}
			}
		},
		filters: {
			sliceMsg(val) {
				var name = ''
				if (typeof(val) == 'string') {
					let newObj = JSON.parse(val)
					for (let as in newObj) {
						name += newObj[as] + '/'
					}
				}
				return name;
			}
		},
		onLoad(option) {
			this.aiinventory = option.aiinventory
			if(option.aiinventory == 2){
				uni.setNavigationBarTitle({
					title:'采购退货确认'
				});
			}
			this.purchaseDetails = JSON.parse(option.purchaseDetails)
			if(this.purchaseDetails != '' && uni.getStorageSync('type') == 0){
				for(let i=0;i<this.purchaseDetails.length;i++){
					if(this.purchaseDetails[i].purchasePrice == '' || this.purchaseDetails[i].purchasePrice == null){
						this.purchaseDetails[i].purchasePrice = 0
					}
					if(this.purchaseDetails[i].wholesalePrice == '' || this.purchaseDetails[i].wholesalePrice == null){
						this.purchaseDetails[i].wholesalePrice = 0
					}
					for(let m=0;m<this.purchaseDetails[i].stockLogList1.length;m++){
						if(this.purchaseDetails[i].stockLogList1[m].productCount == '' || this.purchaseDetails[i].stockLogList1[m].productCount == null){
							this.purchaseDetails[i].stockLogList1[m].productCount = 0
						}
					}
				}
			}
			this.purchase = JSON.parse(option.purchase)
			
			this.userType = uni.getStorageSync('type')
			
			this.yuedikou = option.yuedikou
			this.zhiqianqiankuan = option.zhiqianqiankuan
			this.leijiqiankuan = option.leijiqiankuan
		},
		methods: {
			inventorySubmit() {
				var that = this;
				this.claerSubmitBtn += 1
				if(this.claerSubmitBtn == 1){
					let url;
					uni.showLoading({
						title: '加载中...'
					})
					if(this.aiinventory == 1){
						url = '/app/stock/putInPriceOfAi'
						for(let i=0;i<this.purchaseDetails.length;i++){
							delete this.purchaseDetails[i].id;
						}
					}else if(this.aiinventory == 0){
						url = '/app/stock/putInOfProduct'
					}else{
						url = '/app/stock/putOutPrice'
						for(let i=0;i<this.purchaseDetails.length;i++){
							delete this.purchaseDetails[i].id;
						}
					}
					if(uni.getStorageSync('storeFlag') == '1'){
						this.purchase.storeFlag = 1
					}
					this.$nextTick(()=>{
						this.purchase.balanceDeductionAmount = this.yuedikou
						this.tui.request(url, "post", {
							purchase: this.purchase,
							purchaseDetails: this.purchaseDetails
						}, false, false).then((res) => {
							if (res.code == 200) {
								uni.showToast({
									title: "成功",
									icon: 'none',
									duration:500
								})
								uni.hideLoading();
								// let pages = getCurrentPages();
								// let prevPage = pages[pages.length - 4];
								// prevPage.$vm.getSaleInfo()
								if(this.aiinventory == 1 && uni.getStorageSync('shopId') != '1903264206136938496' && uni.getStorageSync('shopId') != '1810179818189361152'){
									setTimeout(function() {
										uni.showModal({
											title: "提示",
											content: "是否向所有客户推送上新消息？",
											success: function(res1) {
												if (res1.confirm) {
													uni.reLaunch({
														url: "/package1/inventory/inventoryUpNew?id=" + res.result
														// url: "/package1/inventory/inventoryUpNew?id=1879820286384279553"
													})
												}else{
													uni.navigateTo({
														url: '/pages/index/home'
													})
												}
											}
										})
									}, 500);
								}else{
									uni.hideLoading();
									setTimeout(function() {
										uni.navigateTo({
											url: '/pages/index/home'
										})
									}, 500);
								}
							} else {
								uni.hideLoading();
								uni.showToast({
									title: res.message,
									icon: 'none'
								})
							}
						}).catch((res) => {
							uni.hideLoading();
						})
					})
				}else{
					this.tui.toast("请勿重复提交！")
				}
			},
			batchPrint(){
				uni.navigateTo({
					url: "/package1/inventory/batchPrint?purchase=" + JSON.stringify(this.purchase) + '&purchaseDetails=' + JSON.stringify(this.purchaseDetails)
				})
			},
		},
	}
</script>

<style lang="scss">
	.container {
		padding-bottom: 118rpx;
		.boxbg {
			background-color: #fff;
			margin: 30upx;
			padding: 20upx;
			border-radius: 10upx;
			box-shadow: 0px 1px 10px 2px #e2e2e2;
		}

		.tui-order-item {
			.u-collapse-content {
				display: flex;
				justify-content: space-between;
				line-height: 30px;
			}


			.tui-goods-info {
				width: 100%;
				box-sizing: border-box;
				background: #fff;
				line-height: 26px;
				border-top: 10px solid #eee;

				.tui-price-flex {
					display: flex;
					align-items: center;
					justify-content: space-between;
				}

				.tui-size32 {
					font-size: 32rpx;
					font-weight: 500;
				}

				.tui-size-24 {
					font-size: 24rpx;
				}

				.tui-price-large {
					font-size: 32rpx;
				}

				.tui-flex-shrink {
					flex-shrink: 0;
				}

				.tui-goods-price {
					width: 100%;
					display: flex;
					align-items: flex-end;
					justify-content: flex-end;
					font-size: 24rpx;
				}

				.tui-primary-color {
					color: #EB0909;
				}

			}
		}
	}

	.tui-tabbar {
		width: 100%;
		height: 98rpx;
		background: #fff;
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		font-size: 26rpx;
		box-shadow: 0 0 1px rgba(0, 0, 0, .3);
		padding-bottom: env(safe-area-inset-bottom);
		z-index: 996;
	}

	.tui-btn-mr {
		width:130rpx;
		height: 60rpx;
		background: #088FEB;
		color: #fff;
		border-radius: 10px;
		line-height: 60rpx;
		text-align: center;
		margin-right: 30rpx;
	}
	.shop-box {
		width: 95%;
		margin: 0 auto;
		position: relative;
	}
	.shop-name {
		width: 100%;
		height: 200rpx;
		line-height: 80rpx;
		border-top: 1px solid #eee;
		border-bottom: 1px solid #eee;
		font-size: 28rpx;
		font-weight: bold;
		display: flex;
		.uni-icons {
			color: #088FEB !important;
		}
	}
	.price-box{
		width: 95%;
		margin: 10px auto;
		background: #eee;
		height: 80rpx;
		display: flex;
		line-height: 80rpx;
		text-align: center;
		overflow: hidden;
		border-radius: 10px;
		background: #FDF5E6;
		color: #EEB422;
		background: linear-gradient(180deg, #fff, #FDF5E6);
		border: 1px solid #FAEBD7;
	}
	.shop-productName {
		flex: 1;
		display: flex;
		flex-direction: column;
		padding-left: 20rpx;
	}
	
	.shop-productName view {
		height: 55rpx;
	}
	
	.shop-collapse {
		display: flex;
		height: 80rpx;
		font-size: 26rpx;
		line-height: 80rpx;
	}
	
	.shop-collapse text {
		flex: 1;
		text-align: center;
		padding-right: 40rpx;
		border-right: 1px solid #eee;
	}
	.noPic{
		border-radius: 10px;
		width: 140rpx;
		height: 140rpx;
		text-align: center;
		line-height: 140rpx;
		color: #777;
		background: #eee;
		margin: 15px 0 0 15px;
	}
	.uni-tooltip {
		display: flex !important;
	}
	.popup-pay-content {
		align-items: center;
		justify-content: center;
		padding: 15px;
		width: 500rpx;
		height: 800rpx;
		overflow: scroll;
		background-color: #fff;
	}
	
	.popup-pay-title {
		margin-top: 20rpx;
		font-size: 36rpx;
		font-weight: bold;
		text-align: center;
		position: relative;
	}
	
	.popup-pay-container {
		margin-top: 20rpx;
		height: 100rpx;
		border-radius: 10px;
		background: #088FEB;
		line-height: 100rpx;
		text-align: center;
		border-bottom: 1px solid #eee;
		border-top: 1px solid #eee;
		color: #fff;
	}
	.content-list {
		width: 100%;
		display: flex;
		height: 80rpx;
		border-bottom: 1px solid #eee;
	}
	
	.list-name {
		width: 100rpx;
		text-align: left;
		line-height: 80rpx;
		height: 80rpx;
		font-size: 36rpx;
	}
	
	.list-val {
		width: 345rpx;
		height: 80rpx;
		line-height: 80rpx;
		display: flex;
	}
</style>