<style lang="scss">
	.container{
		min-height: 100%;
		background:#F6F6F6;
		padding:30rpx 0;
		.card{
			margin-top:0;
			&>.title{
				display:flex;
				align-items: center;
				justify-content: space-between;
				text:nth-child(2){
					color:#777;
				}
			}
			.d-form /deep/{
				&>.u-form-item{
					position:relative;
					.u-form-item__body__right__message{
						position:absolute;
						bottom:-10rpx;
					}
				}
			}
		}
		&>.fertilizer{
			&>.name{
				display:flex;
				align-items: center;
				margin-bottom:14rpx;
				text{
					&.goods{
						font-size:20rpx;
						color:#fff;
						background:#10C176;
						border-radius: 7rpx;
						min-width:80rpx;
						padding:0 6rpx;
						text-align: center;
						height:40rpx;
						line-height: 40rpx;
						margin-right:16rpx;
						box-sizing: border-box;
					}
					&.name{
						margin-right:20rpx;
					}
					&.spec{
						flex-shrink: 0;
						margin-left:auto;
						color:#777;
					}
				}
			}
			&>.company{
				display:flex;
				align-items: center;
				text{
					&.type{
						flex-shrink: 0;
						font-size:20rpx;
						color:#FBA83C;
					}
					&.name{
						margin-left:20rpx;
						font-size:20rpx;
						color:#707070;
					}
					&.specs{
						margin-left:auto;
						color:#FBA83C;
						font-size:24rpx;
					}
				}
			}
		}
		&>.specs{
			.select{
				flex-grow: 1;
				height:80rpx;
				line-height: 80rpx;
				background:#F7F7F7;
				border-radius: 24rpx;
				padding:0 28rpx;
				display:flex;
				text{
					color:#999;
					&:first-child{
						flex-grow: 1;
					}
					&:nth-child(2){
						flex-shrink: 0;
						transform: rotate(90deg);
					}
				}
			}
			.plant-xinjian{
				color:#10C176;
				border-radius: 24rpx;
				margin-left:24rpx;
				background:#E7FCF3;
				height:80rpx;
				line-height: 80rpx;
				width:120rpx;
				text-align: center;
				box-shadow: 6rpx 6rpx 8rpx rgba(16,193,118,0.1);
			}
			.tip{
				color:#FBA83C;
				font-size:24rpx;
				margin-top:12rpx;
			}
		}
		&>.purchase{
			.input{
				display:flex;
				background:#F7F7F7;
				border-radius: 24rpx;
				padding:20rpx;
				input{
					flex-grow: 1;
				}
				text{
					color:#999;
					line-height: 40rpx;
					margin-left:20rpx;
				}
			}
		}
		.outBatch{
			display: flex;
			flex-direction: column;
			justify-content: space-evenly;
			&>view{
				display: flex;
				align-items: center;
				justify-content: space-between;
				font-size:22rpx;
				&.name{
					
				}
				&.data{
					text{
						&:first-child{
							color:#999;
						}
						&:nth-child(2){
							color:#FBA83C;
						}
					}
				}
			}
		}
	}
</style>
<template>
	<view class="container">
		<view class="card fertilizer">
			<view class="name">
				<text class="goods">{{detail.agriculturalGoods}}</text>
				<text class="name over">{{detail.substanceName}}</text>
				<text class="spec">{{detail.specDescribe}}</text>
			</view>
			<view class="company">
				<text class="type">{{detail.detailType}}</text>
				<text class="name over">{{detail.supplierName}}</text>
				<text class="specs">库存：{{Math.round(detail.equivalentInventory*detail.unitNum*100)/100}} {{detail.unit}}</text>
			</view>
		</view>

		<!-- <view class="card specs" v-if="formData.substanceType==1">
			<view class="title">
				<text>规格</text> <text>{{detail.specDescribe}}</text>
			</view>
			<view class="tip">库存：{{detail.equivalentInventory}}{{detail.packgeUnit}}({{Math.round(detail.equivalentInventory*detail.unitNum*100)/100}}{{detail.unit}})</view>
		</view> -->

		<view class="card">
			<u-form class="inline" :model="formData" ref="form" :rules="rules" labelWidth="auto">
				<d-form label="出库批次号" field="outBatchNo" required :value="[formData.outBatchNo]" @select="selectOutBatch" type="select" custom :columns="[inBatchList]">
					<template slot-scope="{row}">
						<view class="outBatch">
							<view class="name">
								<text>{{row.substanceName}}</text> <text>入库日期：{{row.operateTime}}</text>
							</view>
							<view class="data">
								<text>入库批次：{{row.inOutBatchNo}}</text> <text>剩余：{{row.equivalentAmount}}{{row.unit}}</text>
							</view>
						</view>
					</template>
				</d-form>
				<d-form label="出库类型" field="outType" required type="select" :columns="outType.list" :value="outType.value" @select="outType.value=$event.map(v=>v.value);formData.outType=outType.value.slice(-1)[0]"/>
				<!-- 出库类型为领用出库 -->
				<d-form label="领用人" type="select" v-if="formData.outType=='out01'" :columns="[reciveuser]" :value="[formData.reciveUserId]" @select="formData.reciveUserId=$event[0].value;formData.reciveUser=$event[0].label" required field="reciveUserId"/>
				<!-- 农资出库、出库类型为损坏出库 -->
				<block v-if="formData.outType=='out02'"> 
					<d-form label="金额" type="digit" required field="price" v-model="formData.price"/>
					<d-form label="处理方式" type="select" :columns="[processMode]" :value="[formData.processMode]" @select="formData.processMode=$event[0].value" required field="processMode"/>
				</block>
				<d-form label="出库数量" field="equivalentAmount" required :suffix="detail.unit" :value="formData.equivalentAmount" @input="formData.equivalentAmount=$event" type="digit" @blur="outNum"/>
				<d-form label="操作日期" field="operationTime" required type="calendar" v-model="formData.operateTime"/>
				<d-form label="出库凭证`" type="upImg" :num="3" :value="formData.pic" @imgs="pic=$event"/>
			</u-form>
		</view>

		<button class="cu-btn round bg-green shadow submit" @click="submit">确定</button>

	</view>
</template>
<script>
import request from '@/common/request'
export default{
	data(){
		return{
			detail:{},

			recoveryBatch:{list:[],value:[],number:0,surplus:0},
			outType:{list:[],value:[]},
			pic:"",
			processMode:[],//处理方式
			reciveuser:[],//领用人
			inBatchList:[],//入库列表
			formData:{
				equivalentAmount:'',//出库数量
				inOutId:"",
				inventoryId:"",
				operateTime:"",
				outBatchNo:"",//农资出库批次号
				outType:"",
				reciveUser:"",
				reciveUserId:"",
				surplus:"",
				pic:[],
				remark:"",
				price:"",
				processMode:"",
				substanceType:1,
			},
			rules:{
				outType:{required:true,validator:(rule,val,call)=>{
					if(!val)call(new Error(`出库类型必填！`));
					else call()
				},trigger:['blur','change']},
				outBatchNo:{required:true,validator:(rule,val,call)=>{
					if(!val)call(new Error(`出库批次号必填！`));
					else call()
				},trigger:['blur','change']},
				operateTime:{required:true,message:"请选择操作日期！",trigger:['blur','change']},
				equivalentAmount:{required:true,validator:(rule,val,call)=>{
					if(!(val>0))call(new Error(`请输入出库数量！`));
					else call()
				},type:"number",trigger:['blur','change']},
				
				reciveUserId:{required:true,message:"请选择领用人！",trigger:['blur','change']},

				price:{required:true, type:"number", message:"请输入金额！",tigger:['blur','change']},
				processMode:{required:true, message:"请输入处理方式！",tigger:['blur','change']},
			},
			eventChannel:null,
		}
	},
	onLoad(options){
		
		this.eventChannel=this.getOpenerEventChannel()
		this.eventChannel.on("detail", e=>{
			this.detail=e
			this.formData.inventoryId=e.inventoryId
		})
		this.init()
	},
	methods:{
		async init(){
			//出库类型
			var res=await request("/common/api/dict/queryDictItemByDictCode",{
				method:"post",
				//农产品前面加上product_
				params: {dictCode: "out_type"}
			})
			if(res.statu){
				this.outType.list=[res.data]
			}else{
				uni.showModal({
					title:"提示",
					content:res.msg||"获取出库类型选项失败！",
					showCancel:false,
				})
			}

			//处理方式
			var res = await request("/common/api/dict/queryDictItemByDictCode",{
				method:"post",
				params:{dictCode:"process_mode"}
			})
			if(res.statu){
				this.processMode=res.data
			}else{
				uni.showModal({
					title:"提示",
					content:res.msg||"获取买方类型选项失败！",
					showCancel:false,
				})
			}
			//领用人
			var res=await request("/api/plantPlot/queryBaseUserByBaseId",{
				params:{baseId: this.$store.state.baseInfo.id}
			})
			if(res.statu){
				this.reciveuser=res.data
			}else{
				uni.showModal({
					title:"提示",
					content:res.msg||"获取领用人选项失败！",
					showCancel:false,
				})
			}
			//出库批次选项
			var res=await request("/suyuan/Inventory/agriculturalInSurplus",{
				params:{inventoryId: this.detail.inventoryId}
			})
			if(res.statu){
				this.inBatchList=res.data.map(v=>({...v, label:v.substanceName, value:v.inOutBatchNo}))
			}else{
				uni.showModal({
					title:"提示",
					content:res.msg||"获取出库批次号选项失败！",
					showCancel:false,
				})
			}
		},
		submit(){
			this.$refs.form.validate().then(async valid=>{
				if(valid){
					var res=await request("/suyuan/Inventory/agriculturalOutOperate",{
						method:"post",
						body:{
							...this.formData,
							pic:this.pic,
						}
					})
					if(res.statu){
						uni.navigateBack()
						this.eventChannel.emit("update")
					}else{
						uni.showModal({
							title:"提示",
							content:res.msg||"保存失败！",
							showCancel:false,
						})
					}
				}
			})
		},
		searchBuy(){
			uni.navigateTo({
				url:`/pages/massif/search?data=${this.formData.buyerName||''}`,
				events:{update:e=>{
					this.formData.buyerName=e.buyerName
					this.formData.buyerAddress=e.address
					this.formData.buyerType=e.buyerType[1]
					this.buyerType.value=e.buyerType
				}}
			})
		},
		selectOutBatch([e]){
			this.formData.outBatchNo=e.inOutBatchNo
			this.formData.inOutId=e.id
			this.formData.surplus=e.equivalentAmount
		},
		outNum(){
			if(/\d/.test(this.formData.equivalentAmount)){
				this.formData.equivalentAmount=Math.min(this.formData.equivalentAmount, this.formData.surplus)
			}
		},
	},
}
</script>