<template>
	<xn-form-container :title="'承储资格库'" :width="800" :visible="visible" :destroy-on-close="true" @close="onClose">
		<a-form ref="formRef" :model="formData" layout="vertical">
			<div class="box1">
				<div class="box-left">
					<div class="common">
						<div class="title">企业全称</div>
						<a-input class="inputs" v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">法定代表人</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">占地面积</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">油罐数量</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">持证检验员</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
				</div>
				<!--  -->
				<div class="box-right">
					<div class="common">
						<div class="title">企业代码</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">是否独立法人</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">总仓容</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">正式职工人数</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
					<div class="common">
						<div class="title">承储资格年限</div>
						<a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear />
					</div>
				</div>
			</div>
			<!-- 仓房设施设备情况 -->
			<div>仓房设施设备情况</div>
			<div class="input"><a-input v-model:value="formData.name" :disabled="true" placeholder="" allow-clear /></div>
		</a-form>
		<template #footer>
			<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
		</template>
	</xn-form-container>
</template>
<script lang="js">
	import { ref } from 'vue'
	import { cloneDeep } from 'lodash-es'
	import { required } from '@/utils/formRules'
	export default {
		name: 'FromName',
		components: {},
		setup(props, { emit }) {
			const formRef = ref()
			const formData = ref({
				name: ''
			})
			// 抽屉状态
			const visible = ref(false)
			// 打开抽屉
			const onOpen = (record, flag) => {
				visible.value = flag
			}
			const onClose = () => {
				// formRef.value.resetFields()
				// formData.value = {}
				visible.value = false
			}
			return { onOpen, visible, formRef, onClose, formData }
		}
	}
</script>
<style lang="less" scoped>
	.box1 {
		display: flex;
		justify-content: space-between;
		.box-left {
			width: 350px;
			align-items: center;
		}
		.box-right {
			width: 350px;
			margin-right: 10px;
			align-items: center;
		}
	}
	.common {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 30px;
		.title {
			width: 130px;
			text-align: right;
			margin-right: 5px;
		}
	}
	.input {
		margin-right: 10px;
		margin-left: 40px;
		margin-top: 20px;
		.ant-input-affix-wrapper {
			height: 100px;
		}
	}
</style>
