yiliangyiyun-app/pageA/product/business_buy.vue

<template>
	<view class="center">
		<view class="transaction">
			
		
		<view  class="c-row b-b">
			<view class="title">卖方</view>
			<view class="con-list">
				<view v-if='goods.customerTypeFlag==2' class="title" @click="liang">{{purchaseOrder.compName?purchaseOrder.compName:goods.compName}}></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">{{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">{{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">{{purchaseOrder.receivePrivate}}{{purchaseOrder.receiveCity}}{{purchaseOrder.receiveArea}}{{purchaseOrder.receiveWarehouse}}</view>
			</view>
		</view>
		<view v-if='companyId!=2' class="c-row b-b">
			<view class="title">货名</view>
			<view class="con-list">
			<text>{{purchaseOrder.goodsName}}</text>
			</view>
		</view>
		<view class="c-row b-b">
			<view class="title">最小成交量（吨）</view>
			<view class="con-list">
			<text>{{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>{{purchaseOrder.basis}}</text>
				</view>
				</view>
		</view>
	
		<view v-else class="c-row ">
			<view   class="title">采购单价（元/吨）</view>
			<view class="con-list">
				<view class="picker">
					<text>{{purchaseOrder.unitPrice}}</text>
				</view>
				</view>
		</view>
			</view >
				<view class="transaction">
		<view class="c-row b-b margin-top">
			<view class="title">发票类型</view>
			<view class="con-list">
			<picker @change="invoiceChange" :value="invoiceIndex" :range="invoiceType">
				<view class="picker">
					{{packingIndex>-1?invoiceType[packingIndex]:'请选择'}}
				</view>
			</picker>
			</view>
		</view>
		<view  class="c-row b-b">
			<view class="title">出售数量（吨）</view>
			<view class="con-list">
			<input v-model='purchaseOrder.transactionsNumber' 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">
			<picker @change="packingChange" :value="packingIndex" :range="packingType">
				<view class="picker">
					{{packingIndex>-1?packingType[packingIndex]:'请选择'}}
				</view>
			</picker>
			</view>
		</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"></textarea>
			</view>
		</view>
		<view  v-if="purchaseOrder.procurementPlanType=='期货'" class="c-row b-b align-start">
			<view class="title">点价（元/吨）</view>
			<view class="con-list">
			<input placeholder="请填写点价" name="input" @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">
			<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">
		<input placeholder="请填写包装费" name="input" @input='someprice' v-model="purchaseOrder.packingFee"></input>
		</view>
		</view>
		<view  v-if="purchaseOrder.procurementPlanType=='期货'" class=" align-start ">
			<view class="titles">结算价格</view>
			<text class="textA">结算价格=点价+基差+发票费用+包装费</text>
			<view class="con-list">
			<text >{{purchaseOrder.settlementPrice}}</text>
			</view>
			<!-- <input placeholder="请填写 例:袋装XX斤/散装" name="input" @input='packingInput' v-model="purchaseOrder.settlementPrice"></input> -->
		</view>
		<!-- <view style='background:#fff;'>
			结算价格=点价+基差+发票费用+包装费
		</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:'',
						unitPrice:0,
						address:'',
						count:0,
						province:'',
						area:'',
						priceType:'',
						invoiceType:'',
						acceptType:'',
						seller:'',
						sellerPhone:'',
						packingMoney:0,
						type:0,
						modalName:"",
					},
					purchaseOrder: {
						invoiceFee:0,
						packingFee:0,
						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:'',
					unitPrice: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:'散装'
				};
			},
			onLoad(options) {
				console.log(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.unitPrice = options.unitPrice
				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
			},
			computed: {
				...mapState(['hasLogin','userInfo']),
			},
			onShow() {
				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=-20
							this.purchaseOrder.settlementPrice = Number(this.purchaseOrder.basis)+Number(this.purchaseOrder.invoiceFee)
						}else{
							this.purchaseOrder.invoiceFee=0
							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}&unitPrice=${this.purchaseOrder.unitPrice}
						&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
						}
					}
					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
					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){
										uni.showToast({
											title: '提交成功，等待买方回复',
											icon: 'none',
											duration: 2000
										})
										// uni.navigateBack();
									}else{
										uni.showToast({
											title: '提交失败：'+res.data.message,
											icon: 'none',
											duration: 2000
										})
									}
								}).catch(res => {
									uni.showToast({
										title: res.data.message,
										icon: 'none',
										duration: 2000
									})
								})
							}
						}
					})
				},
				someprice(e){
					if(this.purchaseOrder.pointPrice&&this.purchaseOrder.invoiceFee&&this.purchaseOrder.packingFee){
						this.purchaseOrder.settlementPrice=Number(this.purchaseOrder.basis)+Number(this.purchaseOrder.pointPrice)+Number(this.purchaseOrder.invoiceFee)+Number(-this.purchaseOrder.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.purchaseOrder.packingFee){
						this.purchaseOrder.settlementPrice=Number(this.purchaseOrder.basis)+Number(this.purchaseOrder.pointPrice)+Number(-this.purchaseOrder.packingFee)
					}else if(this.purchaseOrder.pointPrice){
						this.purchaseOrder.settlementPrice=Number(this.purchaseOrder.basis)+Number(this.purchaseOrder.pointPrice)
					}else if(this.purchaseOrder.packingFee){
						this.purchaseOrder.settlementPrice=Number(this.purchaseOrder.basis)+Number(-this.purchaseOrder.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
						}
					}
				},
				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
				},
				unitPriceInput(e){
					this.unitPrice = 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;
	    padding-right: 20rpx;
	}
	.transaction{
		background-color: #FFFFFF;
		margin-top: 10px;
		padding-bottom: 10px;
		border-radius: 20px;
	}
	.btn{
		width: 100%;
		background-color: #22C572;
		border-radius: 20px;
		margin-top: 10px;
	}
	.textareas{
		width: 95%;
		background-color: #F9F9FA;
		padding: 10px 20px 0px 20px;
		border-radius: 10px;
	}
	.beizhu{
		margin-left: 20px;
		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>