<template>
	<view class="center Regular">
		<view class="transaction">
			<view class="c-row b-b">
				<view class="title">卖方</view>
				<view class="con-list Medium">
					<view v-if='goods.customerTypeFlag==2' class="title" @click="liang">
						{{purchaseOrder.compName?purchaseOrder.compName:goods.compName}}
						<u-icon name="arrow-right" color="#AFB3BF" :custom-style="{'marginLeft':'10px','marginRight':'0px'}" ></u-icon>
					</view>
					<view v-else class="title" @click="liang">
						{{purchaseOrder.customer?purchaseOrder.customer:goods.customerName}}>
					</view>
				</view>
			</view>
			<view class="c-row">
				<view class="title">买方</view>
				<view class="con-list">
					<view class="title Medium">{{purchaseOrder.buyer}}</view>
				</view>
			</view>
		</view>
		<view class="transaction">
			<view class="c-row b-b margin-top">
				<view class="title">收货地区</view>
				<view class="con-list">
					<view class="title Medium">
						{{purchaseOrder.receivePrivate}}{{purchaseOrder.receiveCity}}{{purchaseOrder.receiveArea}}
					</view>
				</view>
			</view>
			<view class="c-row b-b ">
				<view class="title">收货库</view>
				<view class="con-list">
					<view class="title Medium">{{purchaseOrder.receiveWarehouse}}</view>
				</view>
			</view>
			<view v-if='companyId!=2' class="c-row b-b">
				<view class="title">货名</view>
				<view class="con-list">
					<text class="Medium">{{purchaseOrder.goodsName}}</text>
				</view>
			</view>
			<view class="c-row b-b">
				<view class="title">最小成交量（吨）</view>
				<view class="con-list">
					<text class="NumberMedium">{{purchaseOrder.minimumVolume}}</text>
				</view>
			</view>
			<view v-if="purchaseOrder.procurementPlanType=='期货'" class="c-row">
				<view class="title">今日基差（元/吨）</view>
				<view class="con-list">
					<view class="picker">
						<text class="NumberMedium">{{purchaseOrder.basis}}</text>
					</view>
				</view>
			</view>

			<view v-else class="c-row ">
				<view class="title">采购单价（元/吨）</view>
				<view class="con-list">
					<view class="picker">
						<text class="NumberMedium">{{purchaseOrder.procurementPrice}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="transaction">
			<view class="c-row b-b margin-top">
				<view class="title">发票类型</view>
				<view class="con-list Medium">
					<picker @change="invoiceChange" :value="invoiceIndex" :range="invoiceType">
						<view class="picker">
							{{invoiceIndex>-1?invoiceType[invoiceIndex]:'请选择'}}
						</view>
					</picker>
				</view>
				<u-icon name="arrow-right" color="#AFB3BF" :custom-style="{'marginLeft':'10px','marginRight':'0px'}" ></u-icon>
			</view>
			<view class="c-row b-b">
				<view class="title">出售数量（吨）</view>
				<view class="con-list NumberMedium">
					<input v-model='purchaseOrder.transactionsNumber' type="number" placeholder="请填写出售数量"
						placeholder-style="font-size: 12px;" name="input"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<view class="title">包装方式</view>
				<view class="con-list Medium">
					<picker @change="packingChange" :value="packingIndex" :range="packingType">
						<view class="picker">
							{{packingIndex>-1?packingType[packingIndex]:'请选择'}}
						</view>
					</picker>
				</view>
				<u-icon name="arrow-right" color="#AFB3BF" :custom-style="{'marginLeft':'10px','marginRight':'0px'}" ></u-icon>
			</view>
			<view v-if='packingIndex!=0' class=" beizhu align-start">
				<view class="title">袋装备注</view>
				<view>
					<textarea maxlength="-1" v-model='purchaseOrder.baggingNotes'
						placeholder="请填写包装规格、质量、包装物要求。例:50kg袋装、大粒、彩包" placeholder-style="font-size: 12px;"
						class="textareas Medium"></textarea>
				</view>
			</view>
			<view v-if="purchaseOrder.procurementPlanType=='期货'" class="c-row b-b align-start">
				<view class="title">点价（元/吨）</view>
				<view class="con-list NumberMedium">
					<input placeholder="请填写点价" name="input" type="number" placeholder-style="font-size: 12px;"
						@input='someprice' v-model="purchaseOrder.pointPrice"></input>
				</view>
			</view>
			<view v-if="purchaseOrder.procurementPlanType=='期货'" class="c-row b-b align-start">
				<view class="title">发票费用（元/吨）</view>
				<view class="con-list NumberMedium">
					<input disabled placeholder="请填写发票费用" name="input" @input='someprice'
						v-model="purchaseOrder.invoiceFee"></input>
				</view>
			</view>
			<view v-if="purchaseOrder.procurementPlanType=='期货'" class="c-row b-b align-start">
				<view class="title">包装费（元/吨）</view>
				<view class="con-list NumberMedium">
					<input placeholder="请填写包装费" name="input" placeholder-style="font-size: 12px;" @input='someprice' v-model="packingFee"></input>
					
				</view>
			</view>
			<view v-if="purchaseOrder.procurementPlanType=='期货'" class=" align-start ">
				<view class="titles">结算价格</view>
				<text class="textA">结算价格=点价+基差+发票费用+包装费</text>
				<text style="color:#FD714F;margin-left: 25px;">
					<text  style="font-size:26rpx;">￥</text>
					<text style="font-size:42rpx;" class="NumberMedium">{{purchaseOrder.settlementPrice}}</text>
				</text>
				
				<!-- <input placeholder="请填写 例:袋装XX斤/散装" name="input" @input='packingInput' v-model="purchaseOrder.settlementPrice"></input> -->
			</view>
		</view>
		<button class="btn" @click="commit()">提交</button>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				tradeInfo: {
					salebuyId: 0,
					packing: '',
					memo: '',
					buyer: '',
					buyerPhone: '',
					procurementPrice: 0,
					address: '',
					count: 0,
					province: '',
					area: '',
					priceType: '',
					invoiceType: '',
					acceptType: '',
					seller: '',
					sellerPhone: '',
					packingMoney: 0,
					type: 0,
					modalName: "",
				},
				purchaseOrder: {
					invoiceFee: 0,
					packingFee: null,
					packingType: "散装",
					packingTypeKey: 1,
					type: '不开发票',
					typeKey: 1
				},
				invoiceTypeIndex: 0,
				invoiceTypeIndex1: 0,
				acceptTypeIndex: 0,
				priceTypeIndex: 0,
				bankNameIndex: 0,
				packingIndex: 0,
				invoiceIndex: 0,
				packingType: ['散粮', '大袋', '小袋'],
				// invoiceType: ['不开发票', '普通发票', '增值税发票'],
				invoiceType: ['不开发票', '增值税发票'],
				acceptType: ['第三方检验（国家检验资质）', '交收地库或港出具的检验', '现场看货', '其他'],
				priceType: ['库内价', '到库价', '到港价'],
				priceTypeIndex1: '库内价',
				region: [],
				salebuyId: 0,
				memo: '',
				buyer: '',
				buyerPhone: '',
				procurementPrice: 0,
				address: '',
				count: 0,
				id: 0,
				price: '库内价',
				invoice: '不开发票',
				accept: '',
				seller: '',
				sellerPhone: '',
				minSale: '',
				province: '',
				city: '',
				area: '',
				storeName: '',
				exsitCount: 0,
				isFutures: '',
				bankNameList: '',
				Company: [],
				goods: {},
				companyId: '',
				tradeCompanyId: '',
				basis: 0,
				basisBig: 0,
				basisSmall: 0,
				invoiceMoney: 0,
				unloadingFee: 0,
				packingMoney: 0,
				packing: '散装',
				packingFee: null,
				invoiceFeeCompany:0,
				invoiceFeePerson:0
				// choice : false,
			};
		},
		onLoad(options) {
			this.id = options.id
			this.purchaseOrder.planId = options.id
			this.purchaseOrder.seller = options.seller
			this.purchaseOrder.goodsName = options.goodsName
			this.purchaseOrder.receivePrivate = options.receivePrivate
			this.purchaseOrder.receiveCity = options.receiveCity
			this.purchaseOrder.receiveArea = options.receiveArea
			this.purchaseOrder.minimumVolume = options.minimumVolume
			this.purchaseOrder.buyer = options.buyer
			this.purchaseOrder.customer = options.customerName
			this.purchaseOrder.basis = options.basisPrice
			this.purchaseOrder.procurementPrice = options.procurementPrice
			this.purchaseOrder.receiveWarehouse = options.receiveWarehouse
			this.purchaseOrder.settlementPrice = options.basisPrice
			this.purchaseOrder.procurementPlanType = options.procurementPlanType
			this.purchaseOrder.procurementPlan = options.procurementPlan
			this.purchaseOrder.compId = options.compId
			this.invoiceFeeCompany = options.invoiceFeeCompany
			this.invoiceFeePerson = options.invoiceFeePerson
		},
		computed: {
			...mapState(['hasLogin', 'userInfo']),
			
		},
		onShow() {
			if( this.$store.state.choice != "" && this.goods.customerTypeFlag){
				if(this.goods.customerTypeFlag==1){
					this.goods.customerName = this.$store.state.choice
				}else if(this.goods.customerTypeFlag==2){
					this.goods.compName = this.$store.state.choice
				}
			}else{
				this.$api.doRequest('get', '/identityAuthenticationInfo/getInfo', {
					commonId: this.userInfo.id
				}).then(res => {
					if (res.data.code == 200) {
						this.goods = res.data.data
						if (this.goods.customerTypeFlag == 1) {
							this.purchaseOrder.invoiceFee = this.invoiceFeePerson
							this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this
								.purchaseOrder.invoiceFee)
						} else {
							this.purchaseOrder.invoiceFee = this.invoiceFeeCompany
							this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this
								.purchaseOrder.invoiceFee)
						}
					}
					uni.hideLoading()
				})
			}	
		},
		methods: {
			liang() {
				uni.navigateTo({
					url: `/pageA/product/Identity_switching?goodsName=${this.purchaseOrder.goodsName}
						&receivePrivate=${this.purchaseOrder.receivePrivate}&receiveCity=${this.purchaseOrder.receiveCity}
						&receiveArea=${this.purchaseOrder.receiveArea}&minimumVolume=${this.purchaseOrder.minimumVolume}
						&buyer=${this.purchaseOrder.buyer}&basisPrice=${this.purchaseOrder.basis}&procurementPrice=${this.purchaseOrder.procurementPrice}
						&receiveWarehouse=${this.purchaseOrder.receiveWarehouse}&procurementPlanType=${this.purchaseOrder.procurementPlanType}
						&procurementPlanNo=${this.purchaseOrder.procurementPlan}`
				})
			},
			commit() {
				if (!this.purchaseOrder.transactionsNumber) {
					this.$api.msg('出售数量不能为空')
					return
				}
				if (this.purchaseOrder.transactionsNumber > 10000 || this.purchaseOrder.transactionsNumber < 1) {
					this.$api.msg('出售数量输入错误')
					return
				}
				if (this.purchaseOrder.procurementPlanType == '期货' && !this.purchaseOrder.pointPrice) {
					this.$api.msg('点价不能为空')
					return
				}
				if (this.purchaseOrder.procurementPlanType == '期货' && this.purchaseOrder.pointPrice > 10000) {
					this.$api.msg('点价输入错误')
					return
				}
				if (this.purchaseOrder.procurementPlanType == '期货' && this.purchaseOrder.pointPrice.indexOf('.') != -1) {
					if (this.purchaseOrder.pointPrice.split(".")[1].length > 2) {
						this.$api.msg('点价输入错误')
						return
					}
				}

				this.purchaseOrder.packingFee = -this.packingFee

				if (this.purchaseOrder.packingFee > 0 || this.purchaseOrder.packingFee < -2000) {
					this.$api.msg('包装费输入错误')
					return
				}
				if (!this.purchaseOrder.customer) {
					if (this.goods.customerTypeFlag == 1) {
						this.purchaseOrder.customer = this.goods.customerName
					} else {
						this.purchaseOrder.customer = this.goods.compName
					}
				}
				if (!this.purchaseOrder.seller) {
					if (this.goods.customerTypeFlag == 1) {
						this.purchaseOrder.seller = this.goods.customerName
						this.purchaseOrder.sellerPhone = this.goods.customerPhone
					} else {
						this.purchaseOrder.seller = this.goods.compName
						this.purchaseOrder.sellerPhone = this.goods.customerPhone
					}
				}
				var that = this
				this.purchaseOrder.commonId = that.userInfo.id
				this.purchaseOrder.pcFlag = 0
				if (this.purchaseOrder.procurementPlanType == "期货") {
					this.purchaseOrder.unitPrice = this.purchaseOrder.settlementPrice
				}
				uni.showModal({
					content: '订单提交后将发送给买方，是否确定提交？',
					success: function(res) {
						if (res.confirm) {
							that.$api.doRequest('post', '/purchaseOrder/api/insertPurchaseOrder', that
								.purchaseOrder).then(res => {
								if (res.data.code == 200) {
									that.$api.doRequest('post',
										'/purchaseOrder/api/submitPurchaseOrder', {
											id: res.data.data
										}).then(res1 => {
										if (res1.data.code == 200) {
											// uni.navigateTo({
											//  url: `/pageA/product/detail`
											// })
											uni.showToast({
												title: '提交成功，等待买方回复',
												icon: 'none',
												duration: 1500,
												success() {
													setTimeout(()=>{
														uni.navigateBack(1)
													},1500)
												}
											})
										} else {
											uni.showToast({
												title: res.data.message,
												icon: 'none',
												duration: 2000
											})
										}
									}).catch(res => {
										uni.showToast({
											title: res.data.message,
											icon: 'none',
											duration: 2000
										})
									})
									// uni.navigateBack();
								} else {
									uni.showToast({
										title: '提交失败：' + res.data.message,
										icon: 'none',
										duration: 2000
									})
								}
							}).catch(res => {
								if (res.errmsg) {
									uni.showToast({
										title: res.errmsg,
										icon: 'none',
										duration: 2000
									})
								} else {
									uni.showToast({
										title: "系统异常，请联系管理员",
										icon: 'none',
										duration: 2000
									})
								}
							})
						}
					}
				})
			},
			someprice(e) {
				if (this.purchaseOrder.pointPrice && this.purchaseOrder.invoiceFee && this.packingFee) {
					this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this.purchaseOrder
						.pointPrice) + Number(this.purchaseOrder.invoiceFee) + Number(-this.packingFee)
				} else if (this.purchaseOrder.pointPrice && this.purchaseOrder.invoiceFee) {
					this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this.purchaseOrder
						.pointPrice) + Number(this.purchaseOrder.invoiceFee)
				} else if (this.purchaseOrder.pointPrice && this.packingFee) {
					this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this.purchaseOrder
						.pointPrice) + Number(-this.packingFee)
				} else if (this.purchaseOrder.pointPrice) {
					this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this.purchaseOrder
						.pointPrice)
				} else if (this.packingFee) {
					this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(-this.packingFee)
				} else if (this.purchaseOrder.invoiceFee) {
					this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis) + Number(this.purchaseOrder
						.invoiceFee)
				} else {
					this.purchaseOrder.settlementPrice = this.purchaseOrder.basis
				}
			},
			bankNameChange(e) {
				this.bankNameIndex = e.detail.value
				this.buyer = this.Company[e.detail.value].companyName
				this.buyerPhone = this.Company[e.detail.value].companyPhone
				this.tradeCompanyId = this.Company[e.detail.value].id
			},
			AcceptTypeChange(e) {
				this.acceptTypeIndex = e.detail.value
				this.accept = this.acceptType[this.acceptTypeIndex];
			},
			packingChange(e) {
				this.packingIndex = e.detail.value
				this.purchaseOrder.packingTypeKey = e.detail.value + 1
				this.purchaseOrder.packingType = this.packingType[this.packingIndex];
			},
			invoiceChange(e) {
				this.invoiceIndex = e.detail.value
				this.purchaseOrder.typeKey = e.detail.value + 1
				this.purchaseOrder.type = this.invoiceType[this.invoiceIndex];
				if (this.invoiceIndex == 0) {
					if (this.goods.customerTypeFlag == 1) {
						this.purchaseOrder.invoiceFee = -20
					} else {
						this.purchaseOrder.invoiceFee = 0
					}
				} else {
					this.purchaseOrder.invoiceFee = 0
				}
			},
			changeZhihang() {
				uni.navigateTo({
					url: '/pageA/pages/newcompany'
				})
			},
			PriceTypeChange(e) {
				this.priceTypeIndex = e.detail.value
				this.price = this.priceType[this.priceTypeIndex]
			},
			RegionChange(e) {
				this.region = e.detail.value
				this.province = this.region[0];
				this.area = this.region[0] + this.region[1] + this.region[2];
			},
			textareaInput(e) {
				this.memo = e.detail.value
			},
			buyerInput(e) {
				this.buyer = e.detail.value
			},
			buyerPhoneInput(e) {
				this.buyerPhone = e.detail.value
			},
			addressInput(e) {
				this.address = e.detail.value
			},
			countInput(e) {
				this.count = e.detail.value
			},
		}
	}
</script>

<style scoped>
	.center {
		padding: 10px 20px;
		background-color: #F5F6FA;
	}

	.cu-form-group input {
		text-align: right;
	}

	.cu-form-group textarea {
		text-align: right;
	}

	.margin-bottom {
		margin-bottom: 30px;
	}

	.c-row {
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		align-items: center;
		padding: 20rpx 30rpx;
		position: relative;
	}

	.con-list {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: column;
		flex-direction: column;
		color: #303133;
		line-height: 40rpx;
		text-align: right;
	}

	.transaction {
		background-color: #FFFFFF;
		margin-top: 10px;
		padding-bottom: 10px;
		border-radius: 20rpx;
	}

	.btn {
		width: 100%;
		background-color: #22C572;
		border-radius: 20px;
		margin-top: 10px;
		color: white;
	}

	.textareas {
		width: 95%;
		background-color: #F9F9FA;
		padding: 10px 20px 0px 20px;
		border-radius: 10px;
	}

	.beizhu {
		margin-left: 15px;
		margin-bottom: 20px;
		/* margin: 10px; */
		margin-top: 10px;
	}

	.titles {
		margin-left: 20px;
		margin-top: 10px;
	}

	.textA {
		margin-left: 20px;
		color: #AFB3BF;
		font-size: 10px;
	}
</style>
