<style lang="scss">
	.container{
		min-height:100%;
		background:#f6f6f6;
		padding:30rpx 0;

	}
</style>
<template>
	<view class="container">
		<u-form class="card inline" errorType="toast" :model="formData" :rules="rules" ref="form" labelWidth="auto">
			<d-form
				v-for="(v,k) in fields" :key="k"
				:field="k"
				v-bind="v"
				:required="!!rules[k]"
				:value="/^select$|^checkBox$|^navigate$/.test(v.type)?fields[k].value:formData[k]"
				@input="formData[k]=$event"
				@checkBox="fields[k].value=$event;formData[k]=$event.join(',')"
				@select="formData[k]=$event[0].value;fields[k].value=[formData[k]]"
				@imgs="fields[k].value=$event"/>
		</u-form>
		<button class="cu-btn round bg-green shadow submit" @click="sumbit">保存</button>
	</view>
</template>
<script>
import request from '@/common/request'
export default {
	data(){
		return{
			fields:{
				pestSite:{label:"病虫害部位",type:"checkBox",value:[],columns:[{label:"根",value:"根"},{label:"茎",value:"茎"},{label:"叶",value:"叶"}]},
				growthProcess:{label:"作物生长过程",type:"select-tab",dictCode:"growth_process"},
				symptom:{label:"显著症状",type:"select-tab",dictCode:"symptom"},
				pestType:{label:"病虫害类型",type:"radio",columns:[{label:"病害",value:"病害"},{label:"虫害",value:"虫害"}],value:['虫害']},
				pestName:{label:()=>`${this.formData.pestType}名称`,type:"navigate",value:"",btnFun:()=>uni.navigateTo({
					url:`/pages/massif/pestType?type=${({"病害":"disease","虫害":"pestis"})[this.formData.pestType]}`,
					events:{type:e=>{
						this.formData.pestName=e
						this.fields.pestName.value=e.map(v=>v.name).join(",")
					}},
					success:res=>{
						res.eventChannel.emit("ids",this.formData.pestName)
					}
				})},
				medicationArea:{label:"农资作用面积",type:"digit",suffix:"亩"},
				pic:{label:"凭证",type:"upImg",value:""},
				description:{label:"病虫害描述",type:"textarea"},
			},
			formData:{
				growthProcess:'',
				pestSite:'',
				symptom:"",
				pestType:"虫害",
				pestName:[],
				medicationArea:"",
				pic:[],
				description:"",
			},
			rules:{
				growthProcess:{required:true,message:"请选择作物生长过程!",trigger:['blur','change']},
				pestSite:{required:true,message:"请选择病虫害部位!",trigger:['blur','change']},
				symptom:{required:true,message:"请选择显著症状!",trigger:['blur','change']},
				pestType:{required:true,message:"请选择病虫害类型!",trigger:['blur','change']},
				pestName:{required:true,message:"请选择害虫!",type:"array",trigger:['blur','change']},
				medicationArea:{required:true,message:"请输入农资作用面积!",type:"number",trigger:['blur','change']},
				pic:{required:true,validator:(rule,val,call)=>{
					if(!this.fields.pic.value)call(new Error("请选择凭证!"));
					else call()
				},trigger:['blur','change']},
			},
			eventChannel:null,
		}
	},
	watch:{
		"formData.pestType"(){
			this.formData.pestName=[]
		},
	},
	onLoad(){
		this.eventChannel=this.getOpenerEventChannel()
		this.eventChannel.on("detail",e=>{
			this.fields.pic.value=e.pic||''
			this.fields.pestSite.value=e?.pestSite?.split?.(",")?.filter?.(v=>v)||[]
			// this.fields.growthProcess.value=e?.growthProcessLabel||""
			// this.fields.symptom.value=e?.symptomLabel||""
			this.fields.pestName.value=e?.pestName?.map(v=>v.name).join(',')
			this.formData=Object.assign(this.formData,{
				...e,
				pic:e?.pic?.split?.(",")?.filter?.(v=>v)||[]
			})
		})
	},
	methods:{
		sumbit(){
			this.$refs.form.validate().then(async valid=>{
				if(valid){
					this.eventChannel.emit("addPest",{
						...this.formData,
						pic:this.fields.pic.value,
						// growthProcessLabel:this.fields.growthProcess.value,
						// symptomLabel:this.fields.symptom.value,
					})
					uni.navigateBack()
				}
			})
		},
	},
}
</script>