<template>
	<a-drawer
		:title="formData.id ? '编辑客户信息：' + formData.depotGrainName: '添加客户信息'"
		:width="800"
		:visible="visible"
		:destroy-on-close="true"
		:footer-style="{ textAlign: 'right' }"
		@close="onClose"
	>
		<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical">
			<a-row :gutter="24">
				<a-col :span="12">
					<a-form-item v-if="formData.id" label="企业客户：" name="depotGrainName">
						<a-input v-model:value="formData.depotGrainName" disabled/>
					</a-form-item>
					<a-form-item v-else label="企业客户：" name="depotId">
						<a-select v-model:value="formData.depotId" placeholder="请选择客户" :options="depotIdOptions"/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="贷款合同号：" name="contractCode">
						<a-input v-model:value="formData.contractCode" placeholder="请输入贷款合同号" allow-clear/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="位置（市）：" name="addressCity">
						<a-select v-model:value="formData.addressCity" placeholder="请输入位置（市）" :options="addressCityOptions" @change="addressCityAuto"
								  allow-clear/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="位置（区、县）：" name="addressCounty">
						<a-select v-model:value="formData.addressCounty" placeholder="请输入位置（县/区）" :options="addressCountyOptions" allow-clear/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="库容（万吨）：" name="depotSize">
						<a-input-number v-model:value="formData.depotSize" placeholder="请输入库容（万吨）" :min="0" style="width:100%" allow-clear/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="日烘干能力（吨）：" name="dayDrySize">
						<a-input-number v-model:value="formData.dayDrySize" placeholder="请输入日烘干能力（吨）" :min="0" style="width:100%" allow-clear/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="当前库存数量（万吨）：" name="depotCount">
						<a-input-number v-model:value="formData.depotCount" placeholder="请输入当前库存数量（万吨）" :min="0" style="width:100%" disabled/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="已质押库存数（万吨）：" name="mortgageCount">
						<a-input-number v-model:value="formData.mortgageCount" placeholder="请输入已质押库存数（万吨）" :min="0" style="width:100%" disabled/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="贷款额度(元)：" name="loanLimit">
						<a-input-number v-model:value="formData.loanLimit" placeholder="请输入贷款额度" :min="0" style="width:100%" allow-clear/>
					</a-form-item>
				</a-col>
				<a-col :span="12">
					<a-form-item label="贷款到期日：" name="loanEndDate">
						<a-date-picker v-model:value="formData.loanEndDate" placeholder="请输入贷款到期日" value-format="YYYY-MM-DD" style="width:100%"/>
					</a-form-item>
				</a-col>
			</a-row>

			<a-form-item label="粮食种类价格信息" name="priceChildren">
				<a-button type="primary" class="childAddButton" @click="addDomains()">
					<PlusOutlined/>
					增加粮食种类价格
				</a-button>
				<a-row :gutter="24" class="form-row">
					<a-col :span="4" class="form-row-con">
						<a-form-item>粮食种类</a-form-item>
					</a-col>
					<a-col :span="4" class="form-row-con">
						<a-form-item>干粮价格(元/吨)</a-form-item>
					</a-col>
					<a-col :span="4" class="form-row-con">
						<a-form-item>质押价格(元/吨)</a-form-item>
					</a-col>
					<a-col :span="3" class="form-row-con">
						<a-form-item>质押率(%)</a-form-item>
					</a-col>
					<a-col :span="3" class="form-row-con">
						<a-form-item>潮干比</a-form-item>
					</a-col>
					<a-col :span="4" class="form-row-con">
						<a-form-item>干粮水份(%)</a-form-item>
					</a-col>
					<a-col :span="2" class="form-row-con">
						<a-form-item>操作</a-form-item>
					</a-col>
				</a-row>
				<div v-for="(positionInfo, index) in formData.priceChildren" class="form-div">
					<a-row :gutter="24">
						<a-col :span="4">
							<a-form-item :rules="{ required: true, message: '请选择' }" :name="['priceChildren', index, 'grainGroup']">
								<a-select v-if="positionInfo.id" v-model:value="positionInfo.grainGroup" :options="grainGroupOptions" disabled/>
								<a-select v-else v-model:value="positionInfo.grainGroup" :options="grainGroupOptions"/>
							</a-form-item>
						</a-col>
						<a-col :span="4">
							<a-form-item :rules="{ required: true, message: '请输入' }" :name="['priceChildren', index, 'dryPrice']">
								<a-input-number v-model:value="positionInfo.dryPrice" :min="0.01" style="width:100%" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="4">
							<a-form-item :rules="{ required: true, message: '请输入' }" :name="['priceChildren', index, 'loanPrice']">
								<a-input-number v-model:value="positionInfo.loanPrice" :min="0.01" style="width:100%" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="3">
							<a-form-item :rules="{ required: true, message: '请输入' }" :name="['priceChildren', index, 'loanRatio']">
								<a-input-number v-model:value="positionInfo.loanRatio" :min="0.01" style="width:100%" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="3">
							<a-form-item :rules="{ required: true, message: '请选择' }" :name="['priceChildren', index, 'dampRatio']">
								<a-select v-model:value="positionInfo.dampRatio" :options="dampRatioOptions"/>
							</a-form-item>
						</a-col>
						<a-col :span="4">
							<a-form-item :rules="{ required: true, message: '请选择' }" :name="['priceChildren', index, 'canonRatio']">
								<a-select v-model:value="positionInfo.canonRatio" :options="canonRatioOptions"/>
							</a-form-item>
						</a-col>
						<a-col :span="2" style="margin-top: 4px">
							<a-button v-if="positionInfo.id" size="small" type="primary" danger ghost disabled>移除</a-button>
							<a-button v-else size="small" type="primary" danger ghost @click="delDomains(index)">移除</a-button>
						</a-col>
					</a-row>
				</div>
			</a-form-item>
		</a-form>
		<template #footer>
			<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
			<a-button type="primary" @click="onSubmit" :loading="submitLoading">保存</a-button>
		</template>
	</a-drawer>
</template>

<script setup name="depotGrainInfoForm">
import tool from '@/utils/tool'
import {cloneDeep} from 'lodash-es'
import {required, rules} from '@/utils/formRules'
import depotGrainInfoApi from '@/api/biz/depotGrainInfoApi'
import dictOptionsApi from "@/api/biz/dictOptionsApi";
import {message} from "ant-design-vue";
// 抽屉状态
const visible = ref(false)
const emit = defineEmits({successful: null})
const formRef = ref()
// 定义地区元素
const treeData = ref([])
// 表单数据
const formData = ref({})
const submitLoading = ref(false)
const depotIdOptions = ref([])
const addressCountyOptions = ref([])

// 打开抽屉
const onOpen = (record) => {
	visible.value = true
	if (record) {
		let recordData = cloneDeep(record)
		formData.value = Object.assign({}, recordData)
		if (!formData.value.depotCount)
			formData.value.depotCount = 0
		if (!formData.value.mortgageCount)
			formData.value.mortgageCount = 0
		if (!formData.value.loanLimit)
			formData.value.loanLimit = 0
		if (formData.value.addressCity)
			addressCountyOptions.value = tool.dictList(formData.value.addressCity)
	} else {
		formData.value.depotCount = 0
		formData.value.mortgageCount = 0
		dictOptionsApi.options(Object.assign('', {'dictValue': '粮库'})).then((data) => {
			depotIdOptions.value = data
		})
		addDomains()
	}
}
// 关闭抽屉
const onClose = () => {
	formData.value = {}
	//formRef.value.resetFields()
	addressCountyOptions.value = []
	visible.value = false
}
// 城市选择
const addressCityAuto = () => {
	formData.value.addressCounty = ''
	if (formData.value.addressCity)
		addressCountyOptions.value = tool.dictList(formData.value.addressCity)
}
// 增行
const addDomains = () => {
	if (!formData.value.priceChildren) {
		formData.value.priceChildren = []
	}
	formData.value.priceChildren.push({
		grainGroup: undefined,
		dryPrice: undefined,
		loanPrice: undefined,
		loanRatio: undefined,
		dampRatio: undefined,
		canonRatio: undefined
	})
}
// 减行
const delDomains = (index) => {
	formData.value.priceChildren.splice(index, 1)
}
// 默认要校验的
const formRules = {
	contractCode: [required('请输入')],
	addressCity: [required('请输入')],
	addressCounty: [required('请输入')],
	depotSize: [required('请输入')],
	dayDrySize: [required('请输入')],
	loanLimit: [required('请输入')],
	loanEndDate: [required('请输入')],
}
// 验证并提交数据
const onSubmit = () => {
	if (!formData.value.priceChildren || formData.value.priceChildren.length < 1) {
		message.warning('请添加粮食种类信息。')
		addDomains()
		return false
	}
	formRef.value
		.validate()
		.then(() => {
			let warnings = []
			formData.value.priceChildren.forEach((m) => {
				if (m.loanRatio < 1 || m.loanRatio > 100) {
					warnings.push(m.grainGroup + ' 请输入质押率(%)范围 1~100 的值。')
				}
			})
			if (warnings.length > 0) {
				warnings.forEach((m) => {
					message.warning(m)
				})
				return false
			}
			submitLoading.value = true
			const formDataParam = cloneDeep(formData.value)
			depotGrainInfoApi
				.depotGrainInfoSubmitForm(formDataParam, !formDataParam.id)
				.then(() => {
					onClose()
					emit('successful')
				})
				.finally(() => {
					submitLoading.value = false
				})
		})
}
const addressCityOptions = tool.dictList('黑龙江省')
const grainGroupOptions = tool.dictList('粮食种类')
const dampRatioOptions = tool.dictList('干粮折比')
const canonRatioOptions = tool.dictList('干粮水份')
// 抛出函数
defineExpose({
	onOpen
})
</script>
