<template>
	<div>
		<a-modal v-model:visible="visible" width="80%" :closable="false" :maskClosable="false" :title="titleText"
			:footer="null">
			<a-form ref="formRef" :model="formState" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
				<a-row>
					<a-col :span="8"><a-form-item label="企业全称">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.dwmc" />
						</a-form-item></a-col>
					<a-col :span="8">
						<a-form-item label="企业代码">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.dwdm" />
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item label="企业地址">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.zcdz" />
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="8"><a-form-item label="法定代表人">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.fddbr" />
						</a-form-item></a-col>
					<!-- <a-col :span="8"><a-form-item label="是否独立法人">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.contactInfo" />
						</a-form-item></a-col> -->
					<a-col :span="8"><a-form-item label="企业性质">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.dwlx" />
						</a-form-item></a-col>
					<a-col :span="8"><a-form-item label="仓房数量">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.cfs" />
						</a-form-item></a-col>
				</a-row>
				<!-- <a-row>
					<a-col :span="8"><a-form-item label="占地面积">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.reporter" />
						</a-form-item></a-col>
					<a-col :span="8"><a-form-item label="总仓容">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.contactInfo" />
						</a-form-item></a-col>
					
				</a-row> -->
				<a-row>
					<a-col :span="8"><a-form-item label="油罐数量">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.ygs" />
						</a-form-item></a-col>
					<a-col :span="8"><a-form-item label="正式职工人数">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.fullTimeStaffCount" />
						</a-form-item></a-col>
					<a-col :span="8"><a-form-item label="持证保管员">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.certifiedStorekeeperCount" />
						</a-form-item></a-col>
				</a-row>
				<a-row>
					<a-col :span="8"><a-form-item label="持证检验员">
							<a-input autocomplete="off" :disabled="true" v-model:value="formState.certifiedInspectorCount" />
						</a-form-item></a-col>
					<a-col :span="8"><a-form-item label="承储资格年限">
							<a-date-picker :disabled="true" v-model:value="formState['storageExpireTime']"
								value-format="YYYY-MM-DD 00:00:00" />
						</a-form-item></a-col>
				</a-row>
				<a-row>
					<a-col :span="24">
						<a-form-item label="仓房设施设备情况">
							<a-textarea :disabled="true" class="text-box" v-model:value="formState.warehouseFacilitySituation" :rows="8"
								placeholder="请输入" />
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<a-form-item label="附件">
							<DIYUPLoad :disabled="true" listType="picture-card" multiple v-model:urls="formState.attachment"
								:change="changeUpload" />
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="24">
						<a-form-item label="审批意见" name="auditAdvice">
							<a-textarea :disabled="showLock" class="text-box" v-model:value="formState.auditAdvice" :rows="8"
								placeholder="请输入" />
						</a-form-item>
					</a-col>
				</a-row>
			</a-form>
			<div class="btn-box">
				<a-button v-if="dataObj.isType !== '3'" style="margin-right: 16px" class="btn-type" @click="submit">通过</a-button>
				<a-button v-if="dataObj.isType !== '3'" style="margin-right: 16px" type="primary" @click="handleOk">驳回</a-button>
				<a-button @click="handleCancel">关闭</a-button>
			</div>
		</a-modal>
	</div>
</template>
<script setup>
import { message } from 'ant-design-vue'
import storageEnterpriseApi from '@/api/policy.info/storageEnterpriseApi' //接口
import global from '@/api/basic.info/global'
const props = defineProps({
	dataObj: {
		type: Object,
		default: () => { }
	}
})
const formState = ref({
	auditAdvice: ''
})
const rules = ref({
	auditAdvice: [{ required: true, message: '请输入审批意见', trigger: 'blur' }]
})
const isTypeData = ref('')
const showLock = ref(false)
const visible = ref(false)
const titleText = ref('')
const formRef = ref(null)
const emit = defineEmits(['isVisible'])
// 取消按钮
const handleCancel = () => {
	visible.value = false
	emit('isVisible', false)
	formRef.value.resetFields() //resetFields()函数是组件库提供的
	formState.value = {}
}

// 驳回按钮
const handleOk = () => {
	formRef.value
		.validate()
		.then(() => {
			let idData = JSON.parse(localStorage.getItem('USER_INFO'))
			const objList = ref({})
			objList.value = {
				auditAdvice: formState.value.auditAdvice,
				auditStatus: 2,
				auditUserId: idData.id,
				requestId: props.dataObj.id
			}
			storageEnterpriseApi.informationAudit(objList.value).then((res) => {
				visible.value = false
				message.success('操作成功')
				emit('isVisible', false)
				formRef.value.resetFields() //resetFields()函数是组件库提供的
				formState.value = {}
			})
		})
		.catch((error) => {
			message.warning('请填写完善')
			console.log('error', error)
		})
}

// 文件预览方式
function changeUpload(ev) {
	return global.uploadFile(ev).then((reg) => {
		return reg
	})
}
// 通过事件
const submit = () => {
	formRef.value
		.validate()
		.then(() => {
			let idData = JSON.parse(localStorage.getItem('USER_INFO'))
			const obj = ref({})
			obj.value = {
				auditAdvice: formState.value.auditAdvice,
				auditStatus: 1,
				auditUserId: idData.id,
				requestId: props.dataObj.id
			}
			storageEnterpriseApi.informationAudit(obj.value).then((res) => {
				visible.value = false
				message.success('操作成功')
				emit('isVisible', false)
				formRef.value.resetFields() //resetFields()函数是组件库提供的
				formState.value = {}
			})
		})
		.catch((error) => {
			message.warning('请填写完善')
			console.log('error', error)
		})
}
// 用于查看调用
const detailData = (id) => {
	storageEnterpriseApi.informationDetail({ requestId: id }).then((res) => {
		formState.value = {}
		if (res.sqrEnterpriseApply.attachment) {
			formState.value.attachment = []
			formState.value.attachment = res.sqrEnterpriseApply.attachment.split(',') || ''
		} else {
			formState.value.attachment = ''
		}
		formState.value = {
			dwmc: res.unitInfo.dwmc,
			dwdm: res.unitInfo.dwdm,
			zcdz: res.unitInfo.zcdz,
			fddbr: res.unitInfo.fddbr,
			dwlx: res.unitInfo.dwlx,
			cfs: res.unitInfo.cfs,
			ygs: res.unitInfo.ygs,
			fullTimeStaffCount: res.sqrEnterpriseApply.fullTimeStaffCount,
			certifiedStorekeeperCount: res.sqrEnterpriseApply.certifiedStorekeeperCount,
			certifiedInspectorCount: res.sqrEnterpriseApply.certifiedInspectorCount,
			storageExpireTime: res.sqrEnterpriseApply.storageExpireTime,
			warehouseFacilitySituation: res.sqrEnterpriseApply.warehouseFacilitySituation,
			auditAdvice: res.auditRequest.auditAdvice
		}
	})
}
// 监听点击事件更新数据
watch(
	() => props.dataObj,
	async (newValue, oldvalue) => {
		await nextTick()
		titleText.value = newValue.titleText
		visible.value = newValue.visible
		showLock.value = newValue.showLock
		isTypeData.value = newValue.isType
		// isType字段用于查看接口
		if (newValue.isType == '2' || newValue.isType == '3') {
			formState.value.id = newValue.id
			detailData(newValue.id)
		} else {
			// 用于新增时清空表格数据
			formState.value = {}
		}
	},
	{ deep: true, immediate: true }
)
onMounted(() => {
})
</script>
<style lang="less" scoped>
.ant-input {
	width: 80%;
}

/* 针对 a-form-item 的 label 应用样式 */
::v-deep .ant-form-item-label {
	width: 190px;
	text-align: right;
}

::v-deep .ant-form-item-control-input {
	width: 100%;
}

.title-box {
	width: 91.7%;
}

.ant-picker {
	width: 80%;
}

.ant-select {
	width: 80% !important;
}

.from-input {
	width: 101.4%;
}

::v-deep.ant-modal-footer {
	display: none !important;
}

.text-box {
	width: 94.6%;
}

.btn-box {
	text-align: center;
}

.btn-type {
	background-color: #22ce8d;
	color: #fff;
}
</style>
