<template>
	<div class="planReleaseDetail pageContent">
		<div
			style="cursor: pointer; color: rgb(15, 123, 224)"
			@click="
				() => {
					router.back()
				}
			"
		>
			<left-outlined />返回
		</div>
		<br />
		<h3 class="detail_title">轮换计划下发</h3>

		<a-row>
			<a-col :span="8">
				<a-form-item class="form-item" label="轮换计划文号" name="name" :label-col="{ span: 7 }">
					<a-input placeholder="请输入轮换计划文号" :disabled="code" v-model:value="formState.planNumber" />
				</a-form-item>
			</a-col>
			<a-col :span="8">
				<a-form-item class="form-item" label="轮换计划名称" name="gender" :label-col="{ span: 7 }">
					<a-input placeholder="请输入轮换计划名称" :disabled="code" v-model:value="formState.planName" />
				</a-form-item>
			</a-col>
			<a-col :span="8">
				<a-form-item class="form-item" label="计划年度" name="age" :label-col="{ span: 7 }">
					<a-date-picker
						placeholder="请输入计划年度"
						:disabled="code"
						valueFormat="YYYY"
						picker="year"
						style="width: 100%"
						v-model:value="formState.rotationYear"
					/>
				</a-form-item>
			</a-col>
			<a-col :span="8">
				<a-form-item class="form-item" label="开始执行日期" name="position" :label-col="{ span: 7 }">
					<a-date-picker
						valueFormat="YYYY-MM-DD HH:mm:ss"
						placeholder="请输入开始执行日期"
						:disabled="code"
						style="width: 100%"
						v-model:value="formState.startDate"
					/>
				</a-form-item>
			</a-col>
			<a-col :span="8">
				<a-form-item class="form-item" label="截止执行日期" name="contact" :label-col="{ span: 7 }">
					<a-date-picker
						valueFormat="YYYY-MM-DD HH:mm:ss"
						placeholder="请输入截止执行日期"
						:disabled="code"
						style="width: 100%"
						v-model:value="formState.endDate"
					/>
				</a-form-item>
			</a-col>
			<a-col :span="8">
				<a-form-item class="form-item" label="轮换数量" name="email" :rules="[]" :label-col="{ span: 7 }">
					<a-input disabled placeholder="请输入轮换数量" v-model:value="formState.planQuantity" />
				</a-form-item>
			</a-col>
		</a-row>
		<a-row :span="24">
			<a-col :span="24">
				<a-form-item class="form-item" label="上传附件" :label-col="{ span: 2 }">
					<DIYUPLoad
						multiple
						:disabled="code"
						:change="changeUpload"
						listType="picture-card"
						v-model:urls="formState.attachment"
					></DIYUPLoad>
				</a-form-item>
			</a-col>
		</a-row>
		<div v-if="route.query.code">
			<div class="table_list" v-for="(item, index) in tableDataDel" :key="index">
				<h4 class="table_title">{{ item.orgName }}</h4>
				<a-table :dataSource="item.businessRpOutboundList" :columns="columnOUT">
					<template #bodyCell="{ column, record, index }">
						<template v-if="column.key === 'INDEX'">{{ index + 1 }}</template>
						<template v-if="column.key === 'COUNT'">
							<a-input-number :disabled="code" v-model:value="record[column.prop]" @change="changedel(record)" />
						</template>
						<template v-else-if="column.key === 'CZ'">
							<a-button class="view" @click="onViewRow(record)">查看</a-button>
						</template>
					</template>
				</a-table>
			</div>
		</div>

		<div v-else>
			<!-- 新增 -->
			<div class="table_list" v-for="(item, index) in tableDataDel" :key="index">
				<h4 class="table_title">{{ item.orgName }}</h4>
				<a-table :dataSource="item.businessRpOutboundList" :columns="columnOUTcoc">
					<template #bodyCell="{ column, record, index }">
						<template v-if="column.key === 'INDEX'">{{ index + 1 }}</template>
						<template v-if="column.key === 'COUNT'">
							<a-input-number :disabled="code" v-model:value="record[column.prop]" @change="changedel(record)" />
						</template>
						<template v-else-if="column.key === 'CZ'">
							<a-button class="view" @click="onViewRow(record)">查看</a-button>
						</template>
					</template>
				</a-table>
			</div>
		</div>
		<div class="detail_footer">
			<a-button type="primary" :disabled="codeOnPub" style="width: 200px; height: 40px" @click="onPub">下发</a-button>
		</div>
	</div>
</template>
<script setup name="planReleaseDetail">
	import global from '@/api/basic.info/global'
	import { listPaginationBAQDE } from '@/hook/listlistPagination.js'
	import business from '@/api/basic.info/rotationprogramApi.js'
	import { useRouter, useRoute } from 'vue-router'
	import { message } from 'ant-design-vue'
	const router = useRouter()
	const route = useRoute()
	const formState = ref({
		attachment: [],
		startDate: '',
		endDate: '',
		rotationYear: '',
		planName: '',
		planNumber: '',
		planQuantity: '',
		rpReportId: '',
		planYear: '', //年度新增字段
		businessRpOutboundList: []
	})
	const del = ref([])
	function changeUpload(fd) {
		return global.uploadFile(fd).then((reg) => {
			return reg
		})
	}

	// 新增
	const columnOUT = ref([
		{ title: '序号', width: 100, align: 'center', key: 'INDEX' },
		{ title: '粮库名称', align: 'center', dataIndex: 'orgName' },
		{ title: '仓房名称', align: 'center', dataIndex: 'basicStorehouseName' },
		{ title: '货位名称', align: 'center', dataIndex: 'warehouseName' },
		{ title: '品种', align: 'center', dataIndex: 'grainVarietyName' },
		{ title: '性质', align: 'center', dataIndex: 'grainNatureName' },
		{ title: '等级', align: 'center', dataIndex: 'grainGradeName' },
		{ title: '数量', align: 'center', key: 'COUNT', prop: 'sealingQuantity' },
		{ title: '入库核定价334', align: 'center', dataIndex: 'purchasePrice' }
	])

	const columnOUTcoc = ref([
		{ title: '序号', width: 100, align: 'center', key: 'INDEX' },
		{ title: '粮库名称', align: 'center', dataIndex: 'orgName' },
		{ title: '仓房名称', align: 'center', dataIndex: 'basicStorehouseName' },
		{ title: '货位名称', align: 'center', dataIndex: 'warehouseName' },
		{ title: '品种', align: 'center', dataIndex: 'grainVarietyName' },
		{ title: '性质', align: 'center', dataIndex: 'grainNatureName' },
		{ title: '等级', align: 'center', dataIndex: 'grainGradeName' },
		{ title: '数量', align: 'center', key: 'COUNT', prop: 'planQuantity' },
		{ title: '入库核定价', align: 'center', dataIndex: 'purchasePrice' }
	])
	const tableDataDel = ref([])
	onMounted(() => {})
	const code = ref(false)
	const codeOnPub = ref(false)

	const totalScore = ref(0)
	const onSearch = async (T) => {
		formState.value = {
			attachment: [],
			startDate: '',
			endDate: '',
			rotationYear: '',
			planName: '',
			planNumber: '',
			planQuantity: '',
			rpReportId: '',
			planYear: '', //年度新增字段
			businessRpOutboundList: []
		}

		const res = await business.XFdetail({ ...T })
		tableDataDel.value = []
		tableDataDel.value = res.complexDataList
		totalScore.value = 0
		console.log(res)
		if (Boolean(route.query.code) == true) {
			formState.value.startDate = res.startDate
			formState.value.endDate = res.endDate
			formState.value.rotationYear = res.rotationYear
			formState.value.planName = res.planName
			formState.value.planNumber = res.planNumber
			formState.value.attachment = (res.attachment || '').split(',').filter((v) => v)
		}
		if (res.issuanceDate) {
			formState.value.startDate = res.startDate
			formState.value.endDate = res.endDate
			formState.value.rotationYear = res.rotationYear
			formState.value.planName = res.planName
			formState.value.planNumber = res.planNumber
			formState.value.attachment = (res.attachment || '').split(',').filter((v) => v)
			code.value = true
			codeOnPub.value = true
		}
		formState.value.rpReportId = res.rpReportId
		formState.value.planQuantity = res.planQuantity
	}
	const { onReset, handlePageChange, pagination, Search, SearchFormDel } = listPaginationBAQDE(onSearch, {})

	const changedel = (v) => {
		// console.log(v)
		// 查找数组中是否存在 id 相同的对象
		const index = del.value.findIndex((item) => item.id === v.id)
		if (index !== -1) {
			// 如果存在,则替换掉旧对象
			del.value.splice(index, 1, v)
		} else {
			// 如果不存在,则 push 新对象
			del.value.push(v)
		}
		console.log('ee', del.value)
	}
	const lists = ['']
	const onPub = async () => {
		totalScore.value = 0
		if (route.query.add == '1') {
			tableDataDel.value.forEach((item) => {
				item.businessRpOutboundList.forEach((v) => {
					if (typeof v.planQuantity === 'number' && v.planQuantity !== null && v.planQuantity !== '') {
						totalScore.value += v.planQuantity
					}
				})
			})
		}
		console.log(totalScore.value)
		if (totalScore.value > formState.value.planQuantity) {
			console.log('过大了', totalScore.value, formState.value.planQuantity)
			message.info('列表数量大于轮换数量')
		} else {
			if (Array.isArray(formState.value.attachment)) {
				formState.value.attachment = (formState.value.attachment || '').join(',')
			}
			console.log(formState.value)
			formState.value.businessRpOutboundList = []
			formState.value.businessRpOutboundList = del.value
			formState.value.planYear = +formState.value.rotationYear
			delete formState.value.planQuantity
			const res = await business.XFadd(formState.value)
		}
	}

	watch(
		() => route.query.code,
		(newVal) => {
			formState.value.businessRpOutboundList = []
			del.value = []
			if (Boolean(route.query.code) == true) {
				code.value = true
				codeOnPub.value = true
				if (route.query.rpReportId) {
					onSearch({ rpReportId: route.query.rpReportId })
				}
			} else {
				code.value = false
				codeOnPub.value = false
				if (route.query.rotationYear) {
					onSearch({ rotationYear: +route.query.rotationYear })
				}
			}
		},
		{ immediate: true, deep: true }
	)
</script>
<style lang="less" scoped>
	.pageContent {
		background: #fff;
		padding: 10px 20px;
		.detail_title {
			font-weight: bold;
			font-size: 20px;
			margin: 10px 0;
		}
		.table_title {
			font-size: 16px;
			font-weight: bold;
			margin: 10px 0;
		}
		.detail_footer {
			margin: 20px;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
</style>
