guest-security-check-system/snowy-admin-web/src/views/yqyc/zero/two/out-nuclear-release/detail.vue

<template>
    <a-card :bordered="false">
		<a-page-header
            :title="formData.id ? '二线出区核放单' : '新增二线出区核放单'"
			@back="onClose"
		>
			<template #extra>
				<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
				<a-popconfirm title="请确认是否保存？" @confirm="onTemp" v-if="!isView">
					<a-button style="margin-right: 8px" :loading="submitLoading">保存</a-button>
				</a-popconfirm>
				<a-popconfirm title="请确认是否申报？" @confirm="onSubmit" v-if="!isView">
					<a-button type="primary" :loading="submitLoading">申报</a-button>
				</a-popconfirm>
			</template>
		</a-page-header>
		<a-collapse v-model:activeKey="activeKey" expand-icon-position="end">
			<a-collapse-panel key="1" header="基本信息">
				<a-form ref="formRef" :model="formData" :rules="formRules">
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="核放单预录入号：" name="hfdrCode">
								<a-input v-model:value="formData.hfdrCode" :disabled="true" placeholder="请输入核放单预录入号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="核放单号：" name="hfdCode">
								<a-input v-model:value="formData.hfdCode" :disabled="true" placeholder="请输入核放单号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="核放单类型：" name="hfdLx">
								<a-select v-model:value="formData.hfdLx" :disabled="isView" placeholder="请选择核放单类型" :options="hfdLxOptions" show-search allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="绑定类型：" name="bdlx">
								<a-select v-model:value="formData.bdlx" :disabled="isView" placeholder="请选择绑定类型" :options="bdlxOptions" show-search allow-clear option-filter-prop="label" @change="onChangeBdlx"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="关联核注清单编号：" name="glhzqdbh">
								<a-select v-model:value="formData.glhzqdbh" :disabled="isView || !formData.bdlx || formData.bdlx == 2" placeholder="请选择关联核注清单编号" :options="hzqdOptions" show-search allow-clear option-filter-prop="label" @change="onChangHzqd"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="台账编号：" name="ledgerCode">
								<a-input v-model:value="formData.ledgerCode" :disabled="true" placeholder="请选择关联核注清单编号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="进出标志：" name="jcbz">
								<a-select v-model:value="formData.jcbz" :disabled="isView" placeholder="请选择进出标志" :options="jcbzOptions" show-search allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报类型：" name="sblx">
								<a-select v-model:value="formData.sblx" :disabled="true" placeholder="请选择申报类型" :options="sblxOptions" show-search allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="报关单号：" name="hfdBgCode">
								<a-select v-model:value="formData.hfdBgCode" :disabled="isView" placeholder="请选择报关单号" :options="bgdhOptions" show-search allow-clear option-filter-prop="label" @change="onChangBgdh"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="承运车车牌号：" name="cyccph">
								<a-input v-model:value="formData.cyccph" :disabled="true" placeholder="请选择报关单号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="IC卡号(电子车牌)：" name="ickh">
								<a-input v-model:value="formData.ickh" :disabled="true" placeholder="请选择报关单号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="车架号：" name="cjh">
								<a-input v-model:value="formData.cjh" :disabled="true" placeholder="请选择报关单号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="车架重(kg)：" name="cjz">
								<a-input v-model:value="formData.cjz" :disabled="true" placeholder="请选择报关单号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="车自重(kg)：" name="czz">
								<a-input v-model:value="formData.czz" :disabled="true" placeholder="请选择报关单号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="集装箱号：" name="jzxh">
								<a-select v-model:value="formData.jzxh" :disabled="isView || !formData.hfdBgCode" placeholder="请选择报关单号" :options="jzxhOptions" show-search allow-clear option-filter-prop="label" @change="onChangJzxh"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="集装箱类型：" name="jzxlx">
								<a-input v-model:value="formData.jzxlx" :disabled="true" placeholder="请选择集装箱号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="总重量(kg)：" name="zzl">
								<a-input v-model:value="formData.zzl" :disabled="true" placeholder="请选择集装箱号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="货物毛重量(kg)：" name="hwmzl">
								<a-input v-model:value="formData.hwmzl" :disabled="true" placeholder="请选择集装箱号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="货物总净重(kg)：" name="hwjzl">
								<a-input v-model:value="formData.hwjzl" :disabled="true" placeholder="请选择集装箱号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报企业名称：" name="sbqymc">
								<a-input v-model:value="formData.sbqymc" :disabled="true" placeholder="请输入申报企业名称" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报企业编号：" name="sbqybh">
								<a-input v-model:value="formData.sbqybh" :disabled="true" placeholder="请输入申报企业编号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报企业社会信用代码：" name="sbqyshxydm">
								<a-input v-model:value="formData.sbqyshxydm" :disabled="true" placeholder="请输入申报企业社会信用代码" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="录入单位代码：" name="lrdwdm">
								<a-input v-model:value="formData.lrdwdm" :disabled="isView" placeholder="请输入录入单位代码" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="录入单位社会信用代码：" name="lrdwshxydm">
								<a-input v-model:value="formData.lrdwshxydm" :disabled="isView" placeholder="请输入录入单位社会信用代码" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="录入单位名称：" name="lrdwmc">
								<a-input v-model:value="formData.lrdwmc" :disabled="isView" placeholder="请输入录入单位名称" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="企业单位内部编号：" name="qydwnbbh">
								<a-input v-model:value="formData.qydwnbbh" :disabled="isView" placeholder="请输入企业单位内部编号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="过卡1时间：" name="gkonesj">
								<a-date-picker v-model:value="formData.gkonesj" :disabled="isView" value-format="YYYY-MM-DD HH:mm:ss" show-time placeholder="请选择过卡1时间" style="width: 100%" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="过卡2时间：" name="gktwosj">
								<a-date-picker v-model:value="formData.gktwosj" :disabled="isView" value-format="YYYY-MM-DD HH:mm:ss" show-time placeholder="请选择过卡2时间" style="width: 100%" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申请人：" name="sqr">
								<a-input v-model:value="formData.sqr" :disabled="isView" placeholder="请输入申请人" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申请人联系方式：" name="sqrlxfs">
								<a-input v-model:value="formData.sqrlxfs" :disabled="isView" placeholder="请输入申请人联系方式" allow-clear />
							</a-form-item>
						</a-col>
					</a-row>
				</a-form>
			</a-collapse-panel>
			<a-collapse-panel key="2" header="核放单表体" v-if="showHfdbt">
<!--				<a-button type="primary" @click="onBodyReset" v-if="!isView" style="margin-bottom: 20px;">重置</a-button>-->
				<a-form ref="bodyFormRef" :model="bodyData" style="margin-bottom: 20px;">
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="关联商品序号：" name="productOrderCode">
								<a-input v-model:value="bodyData.productOrderCode" :disabled="true" placeholder="请输入关联商品序号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="商品编号：" name="productCode">
								<a-input v-model:value="bodyData.productCode" :disabled="true" placeholder="请输入商品编号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="商品名称：" name="productName">
								<a-input v-model:value="bodyData.productName" :disabled="true" placeholder="请输入商品名称" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报计量单位：" name="declareUnit">
								<a-input v-model:value="bodyData.declareUnit" :disabled="true" placeholder="请输入申报计量单位" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报数量：" name="sbNum">
								<a-input v-model:value="bodyData.sbNum" :disabled="true" placeholder="请输入申报数量" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="货物毛重：" name="grossWeight">
								<a-input v-model:value="bodyData.grossWeight" :disabled="true" placeholder="请输入货物毛重" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="货物净重：" name="netWeight">
								<a-input v-model:value="bodyData.netWeight" :disabled="true" placeholder="请输入货物净重" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="备注：" name="remark">
								<a-input v-model:value="bodyData.remark" :disabled="true" placeholder="请输入备注" allow-clear />
							</a-form-item>
						</a-col>
					</a-row>
				</a-form>
<!--				<template v-if="!isView">-->
<!--					<a-button type="primary" style="margin-right: 8px;" v-if="!(bodyData.id || bodyData.__index)" @click="onBodyAdd">插入</a-button>-->
<!--					<a-button type="primary" style="margin-right: 8px;" v-else @click="onBodyEdit">保存</a-button>-->
<!--					<xn-batch-delete-->
<!--						:selectedRowKeys="bodySelectedRowKeys"-->
<!--						@batchDelete="deleteBatchBody"-->
<!--					/>-->
<!--				</template>-->
				<a-table
					style="margin-top: 10px"
					bordered
					:dataSource="bodyList"
					:columns="bodyColumns"
					:pagination="false"
					:scroll="{ x: 2000 }"
					:row-selection="bodyOptions.rowSelection"
				>
					<template #bodyCell="{ column, record, index }">
						<template v-if="column.dataIndex === 'action'">
							<a-button type="link" primary size="small" @click="onBodyReset(), bodyData = cloneDeep(record)">查看</a-button>
<!--							<template v-if="isView">-->
<!--								<a-button type="link" primary size="small" @click="onBodyReset(), bodyData = cloneDeep(record)">查看</a-button>-->
<!--							</template>-->
<!--							<template v-else>-->
<!--								<a-button type="link" primary size="small" @click="onBodyReset(), bodyData = cloneDeep(record)">编辑</a-button>-->
<!--								<a-button type="link" danger size="small" @click="onBodyDel(index)">删除</a-button>-->
<!--							</template>-->
						</template>
					</template>
				</a-table>
			</a-collapse-panel>
			<a-collapse-panel key="4" header="关联单证" v-if="showGldz">
				<a-button type="primary" @click="onRelationReset" v-if="!isView" style="margin-bottom: 20px;">重置</a-button>
				<a-form ref="relationFormRef" :model="relationData" :rules="relationRules" style="margin-bottom: 20px;">
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="核放清单编号：" name="hfdCode">
								<a-input v-model:value="relationData.hfdCode" :disabled="true" placeholder="请输入核放清单编号" allow-clear />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="关联单证类型：" name="dzType">
								<a-select v-model:value="relationData.dzType" :disabled="isView" placeholder="请选择关联单证类型" :options="dzTypeOptions" show-search allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="关联单证编号：" name="dzCode">
								<a-input v-model:value="relationData.dzCode" :disabled="isView" placeholder="请输入关联单证编号" allow-clear />
							</a-form-item>
						</a-col>
					</a-row>
				</a-form>
				<template v-if="!isView">
					<a-button type="primary" style="margin-right: 8px;" v-if="!(relationData.id || relationData.__index)" @click="onRelationAdd">插入</a-button>
					<a-button type="primary" style="margin-right: 8px;" v-else @click="onRelationEdit">保存</a-button>
					<xn-batch-delete
						:selectedRowKeys="relationSelectedRowKeys"
						@batchDelete="deleteBatchRelation"
					/>
				</template>
				<a-table
					style="margin-top: 10px"
					bordered
					:dataSource="relationList"
					:columns="relationColumns"
					:pagination="false"
					:scroll="{ x: 2000 }"
					:row-selection="relationOptions.rowSelection"
				>
					<template #bodyCell="{ column, record, index }">
						<template v-if="column.dataIndex === 'dzType'">
							{{ $TOOL.dictTypeData('gldzlx', record.dzType) }}
						</template>
						<template v-if="column.dataIndex === 'action'">
							<template v-if="isView">
								<a-button type="link" primary size="small" @click="onRelationReset(), relationData = cloneDeep(record)">查看</a-button>
							</template>
							<template v-else>
								<a-button type="link" primary size="small" @click="onRelationReset(), relationData = cloneDeep(record)">编辑</a-button>
								<a-button type="link" danger size="small" @click="onRelationDel(index)">删除</a-button>
							</template>
						</template>
					</template>
				</a-table>
			</a-collapse-panel>
			<a-collapse-panel key="3" header="附件信息">
				<template v-if="!isView">
					<div class="file-tips">
						<InfoCircleFilled style="margin-right: 4px;"/>友情提示<br/>
						1、附件大小要求不超过4M，如果文件过大，建议拆分多个上传；<br/>
						2、附件格式要求：PDF文件；<br/>
						3、同一附件类型可以上传多个附件；<br/>
						4、附件传输过程中会出现传输失败的情况，请随时关注附件传输状态；<br/>
						5、要求上传复印件的可上传原件的扫描件。
					</div>
					<xn-upload ref="ref_upload" v-model:value="fileData.fileUrl" @onChange="fileChange" accept=".pdf" v-if="showFileUpload"/>
					<div style="margin-top: 10px;">
						<xn-batch-delete
							:selectedRowKeys="fileSelectedRowKeys"
							@batchDelete="deleteBatchFile"
						/>
					</div>
				</template>
				<a-table
					style="margin-top: 10px"
					bordered
					:dataSource="fileList"
					:columns="fileColumns"
					:pagination="false"
					:row-selection="fileOptions.rowSelection"
				>
					<template #bodyCell="{ column, record, index, text }">
						<template v-if="['attachmentName', 'attachmentFormat', 'attachmentContent'].includes(column.dataIndex)">
							<div>
								<a-input
									v-if="!isView"
									v-model:value="record[column.dataIndex]"
									style="margin: -5px 0"
								/>
								<template v-else>
									{{ text }}
								</template>
							</div>
						</template>
						<template v-if="column.dataIndex === 'action'">
							<template v-if="isView">
							</template>
							<template v-else>
								<a-button type="link" danger size="small" @click="onFileDel(index)" v-if="!isView">删除</a-button>
							</template>
						</template>
					</template>
				</a-table>
			</a-collapse-panel>
		</a-collapse>
	</a-card>
</template>

<script setup name="qySecondlineHfdDetail">
	import tool from '@/utils/tool'
	import { cloneDeep } from 'lodash-es'
	import { required } from '@/utils/formRules'
	import qySecondlineHfdApi from '@/api/yqyc/qySecondlineHfdApi'
	import {message, Modal} from "ant-design-vue";
	import {createVNode} from "vue";
	import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
	import qySecondlineHzdTzApi from "@/api/yqyc/qySecondLineHzdTzApi";
	const { proxy } = getCurrentInstance()

	// 抽屉状态
	const emit = defineEmits({ successful: null, onClose: null })
	const formRef = ref()
	const bodyFormRef = ref()
	const relationFormRef = ref()
	const ref_upload = ref()
	const activeKey = ref('1')
	// 表单数据
	const formData = ref({})
	const bodyData = ref({})
	const fileData = ref({})
	const relationData = ref({})
	const submitLoading = ref(false)
	const isView = ref(false)
	const hfdLxOptions = ref([])
	const jcbzOptions = ref([])
	const sblxOptions = ref([])
	const bdlxOptions = ref([])
	const dzTypeOptions = ref([])
	const hzqdOptions = ref([])
	const bgdhOptions = ref([])
	const jzxhOptions = ref([])
	const statusOptions = ref([])
	const userInfo = tool.data.get('USER_INFO')
	const showFileUpload = ref(true)
	const showGldz = ref(false)
	const showHfdbt = ref(false)

	const bodySelectedRowKeys = ref([])
	const bodyList = ref([])
	// 列表选择配置
	const bodyOptions = {
		rowSelection: {
			onChange: (selectedRowKey, selectedRows) => {
				bodySelectedRowKeys.value = selectedRows
			}
		}
	}
	const relationSelectedRowKeys = ref([])
	const relationList = ref([])
	// 列表选择配置
	const relationOptions = {
		rowSelection: {
			onChange: (selectedRowKey, selectedRows) => {
				relationSelectedRowKeys.value = selectedRows
			}
		}
	}
	const fileSelectedRowKeys = ref([])
	const fileList = ref([])
	// 列表选择配置
	const fileOptions = {
		rowSelection: {
			onChange: (selectedRowKey, selectedRows) => {
				fileSelectedRowKeys.value = selectedRows
			}
		}
	}

	const bodyColumns = [
		{
			title: '关联商品序号',
			dataIndex: 'productOrderCode',
		},
		{
			title: '商品编号',
			dataIndex: 'productCode',
		},
		{
			title: '商品名称',
			dataIndex: 'productName',
		},
		{
			title: '申报计量单位',
			dataIndex: 'declareUnit',
		},
		{
			title: '申报数量',
			dataIndex: 'sbNum',
		},
		{
			title: '货物毛重',
			dataIndex: 'grossWeight',
		},
		{
			title: '货物净重',
			dataIndex: 'netWeight',
		},
		{
			title: '备注',
			dataIndex: 'remark',
		},
		{
			title: '操作',
			dataIndex: 'action',
			width: 200,
			fixed: 'right'
		},
	]
	const relationColumns = [
		{
			title: '核放清单编号',
			dataIndex: 'hfdCode',
		},
		{
			title: '关联单证编号',
			dataIndex: 'dzCode',
		},
		{
			title: '关联单证类型',
			dataIndex: 'dzType',
		},
		{
			title: '操作',
			dataIndex: 'action',
		},
	]
	const fileColumns = [
		{
			title: '附件名称',
			dataIndex: 'attachmentName',
		},
		{
			title: '附件格式',
			dataIndex: 'attachmentFormat',
		},
		{
			title: '附件内容',
			dataIndex: 'attachmentContent',
		},
		{
			title: '上传时间',
			dataIndex: 'uploadTime',
		},
		{
			title: '操作',
			dataIndex: 'action',
		},
	]
	// 打开抽屉
	const onOpen = (record, view = false, type, copy) => {
	    isView.value = view
		showGldz.value = false
		showHfdbt.value = false
		if (record) {
			qySecondlineHfdApi.qySecondlineHfdDetail({id: record.id}).then(res => {
				formData.value = res.baseInfo
				bodyList.value = res.productList
				relationList.value = res.dzList
				fileList.value = res.attachmentList
				if (formData.value.bdlx == 1 || formData.value.bdlx == 3) {
					showGldz.value = false
					showHfdbt.value = true
				} else if (formData.value.bdlx == 2) {
					showGldz.value = true
					showHfdbt.value = false
				}
				if (type) {
					formData.value.sblx = type
				}
				if (formData.value.hfdBgCode) {
					qySecondlineHfdApi.qysecondlinehfdlistGetHfdBgInfoByBgCode({hfdBgCode: formData.value.hfdBgCode}).then(res => {
						jzxhOptions.value = res.jzxList.map(v => {
							v.value = v.jzxh
							v.label = v.jzxh
							return v
						})
					})
				}
				if (copy) {
					delete formData.value.id
				}
			})
		} else {
			formData.value.sbqymc = userInfo.companyName
			formData.value.sbqybh = userInfo.companyNumber
			formData.value.sbqyshxydm = userInfo.companyNumber
			formData.value.sblx = type
		}
		qySecondlineHfdApi.qySecondlineHfdGetHzListByCondition().then(res => {
			hzqdOptions.value = res.map(v => Object.assign(v, {label: v.hgHzdCode, value: v.hgHzdCode}))
		})
		qySecondlineHfdApi.qysecondlinehfdlistGetBgCodeList().then(res => {
			bgdhOptions.value = res.map(v => ({label: v, value: v}))
		})
		hfdLxOptions.value = tool.dictList('hfdlx')
		jcbzOptions.value = tool.dictList('jcbz')
		sblxOptions.value = tool.dictList('lgs_sblx')
		bdlxOptions.value = tool.dictList('bdlx')
		statusOptions.value = tool.dictList('djzt')
		dzTypeOptions.value = tool.dictList('gldzlx')
	}
	// 关闭抽屉
	const onClose = () => {
		formRef.value?.resetFields()
		formData.value = {}
		isView.value = true
		emit('onClose')
	}
	// 默认要校验的
	const formRules = ref({
		hfdLx: [required('请选择核放单类型')],
		jcbz: [required('请选择进出口标志')],
		bdlx: [required('请选择绑定类型')],
		sblx: [required('请选择申报类型')],
		cyccph: [required('请输入承运车车牌号')],
		ickh: [required('请输入IC卡号(电子车牌)')],
		cjh: [required('请输入车架号')],
		cjz: [required('请输入车架重')],
		czz: [required('请输入车自重')],
		zzl: [required('请输入总重量(kg)')],
		hwmzl: [required('请输入货物毛净重(kg)')],
		hwjzl: [required('请输入货物总净重(kg)')],
		hfdBgCode: [required('请选择报关单号')],
		jzxh: [required('请选择集装箱号')],
	})
	watch(() => formData.value.bdlx, (n) => {
		if (n == 2) {
			delete formRules.value.glhzqdbh
			formRef.value.clearValidate('glhzqdbh')
		} else {
			formRules.value.glhzqdbh = [required('请输入关联核注单编号')]
		}
	})
	// 默认要校验的
	const bodyRules = {
		productOrderCode: [required('请输入关联商品序号')],
		productCode: [required('请输入商品编号')],
		productName: [required('请输入商品名称')],
		declareUnit: [required('请输入申报计量单位')],
		sbNum: [required('请输入申报数量')],
		grossWeight: [required('请输入货物毛重')],
		netWeight: [required('请输入货物净重')],
	}
	// 默认要校验的
	const relationRules = {
		dzType: [required('请输入关联单证类型')],
		dzCode: [required('请输入关联单证编号')],
	}
	// 验证并提交数据
	const onSubmit = () => {
		formRef.value
			.validate()
			.then(() => {
				submitLoading.value = true
				const params = {
					baseInfo: Object.assign(formData.value, {status: '3'}),
					productList: bodyList.value,
					dzList: relationList.value,
					attachmentList: fileList.value,
				}
				qySecondlineHfdApi
					.qySecondlineHfdSubmitForm(params, formData.value.id)
					.then(() => {
						onClose()
						emit('successful')
					})
					.finally(() => {
						submitLoading.value = false
					})
			})
			.catch(() => {})
	}
	const onTemp = () => {
		formRef.value
		.validate()
		.then(() => {
			submitLoading.value = true
			const params = {
				baseInfo: Object.assign(formData.value, {status: '1'}),
				productList: bodyList.value,
				dzList: relationList.value,
				attachmentList: fileList.value,
			}
			qySecondlineHfdApi
			.qySecondlineHfdSubmitForm(params, formData.value.id)
			.then(() => {
				onClose()
				emit('successful')
			})
			.finally(() => {
				submitLoading.value = false
			})
		})
		.catch(() => {
		})
	}
	const onBodyReset = () => {
		bodyFormRef.value?.resetFields()
		bodyData.value = {}
	}
	const onBodyAdd = () => {
		bodyFormRef.value
		.validate()
		.then(() => {
			bodyList.value.push(Object.assign({__index: new Date().getTime()}, bodyData.value))
			onBodyReset()
			message.success('插入表体信息成功！')
		})
		.catch(() => {
		})
	}
	const onBodyEdit = () => {
		bodyFormRef.value
		.validate()
		.then(() => {
			let k = ''
			if (bodyData.value.id) {
				k = 'id'
			} else if (bodyData.value.__index) {
				k = '__index'
			}
			if (k) {
				bodyList.value.forEach(v => {
					if (v[k] === bodyData.value[k]) {
						Object.assign(v, bodyData.value)
					}
				})
			}
			onBodyReset()
			message.success('编辑表体信息成功！')
		})
		.catch(() => {
		})
	}
	const onBodyDel = (recode, index) => {
		Modal.confirm({
			title: '提示',
			icon: createVNode(ExclamationCircleOutlined),
			content: createVNode('div', { style: 'color:red;' }, `是否要删除${record.productName}?`),
			centered: true,
			onOk() {
				bodyList.value.splice(index, 1)
			},
			onCancel() {
			},
		});
	}
	const deleteBatchBody = () => {
		bodyList.value = bodyList.value.filter(v => {
			let flag = true
			bodySelectedRowKeys.value.forEach(s => {
				if ((v.id && (v.id === s.id)) || (v.__index && (v.__index === s.__index))) {
					flag = false
				}
			})
			return flag
		})
	}
	const onRelationReset = () => {
		relationFormRef.value?.resetFields()
		relationData.value = {}
	}
	const onRelationAdd = () => {
		relationFormRef.value
		.validate()
		.then(() => {
			relationList.value.push(Object.assign({__index: new Date().getTime()}, relationData.value))
			onRelationReset()
			message.success('插入表体信息成功！')
		})
		.catch(() => {
		})
	}
	const onRelationEdit = () => {
		relationFormRef.value
		.validate()
		.then(() => {
			let k = ''
			if (relationData.value.id) {
				k = 'id'
			} else if (relationData.value.__index) {
				k = '__index'
			}
			if (k) {
				relationList.value.forEach(v => {
					if (v[k] === relationData.value[k]) {
						Object.assign(v, relationData.value)
					}
				})
			}
			onRelationReset()
			message.success('编辑表体信息成功！')
		})
		.catch(() => {
		})
	}
	const onRelationDel = (recode, index) => {
		Modal.confirm({
			title: '提示',
			icon: createVNode(ExclamationCircleOutlined),
			content: createVNode('div', { style: 'color:red;' }, `是否要删除${record.productName}?`),
			centered: true,
			onOk() {
				relationList.value.splice(index, 1)
			},
			onCancel() {
			},
		});
	}
	const deleteBatchRelation = () => {
		relationList.value = relationList.value.filter(v => {
			let flag = true
			relationSelectedRowKeys.value.forEach(s => {
				if ((v.id && (v.id === s.id)) || (v.__index && (v.__index === s.__index))) {
					flag = false
				}
			})
			return flag
		})
	}
	const getFileExtension = (filename) => {
		// 使用lastIndexOf查找最后一个"."的位置
		var dotIndex = filename.lastIndexOf(".");

		// 如果找到了"."，则提取从"."之后的子串作为后缀名
		if (dotIndex !== -1 && dotIndex < filename.length - 1) { // 确保"."不是字符串的最后一个字符
			return filename.slice(dotIndex + 1); // slice从dotIndex+1开始到字符串结束
		} else {
			// 如果没有找到"."，返回空字符串表示没有后缀
			return "";
		}
	}
	const fileChange = (file) => {
		if (file) {
			const f = ref_upload.value.uploadFileList()[0]
			fileList.value.push({
				__index: new Date().getTime(),
				attachmentUrl: f.url,
				attachmentName: f.name,
				attachmentFormat: getFileExtension(f.name),
				attachmentContent: '',
				uploadTime: proxy.$util.YMDHms(new Date()),
			})
			fileData.value.fileUrl = ''
			showFileUpload.value = false
			setTimeout(() => {
				showFileUpload.value = true
			}, 0)
		}
	}
	const onFileDel = (recode, index) => {
		Modal.confirm({
			title: '提示',
			icon: createVNode(ExclamationCircleOutlined),
			content: createVNode('div', { style: 'color:red;' }, `是否要删除?`),
			centered: true,
			onOk() {
				fileList.value.splice(index, 1)
			},
			onCancel() {
			},
		});
	}
	const deleteBatchFile = () => {
		fileList.value = fileList.value.filter(v => {
			let flag = true
			fileSelectedRowKeys.value.forEach(s => {
				if ((v.id && (v.id === s.id)) || (v.__index && (v.__index === s.__index))) {
					flag = false
				}
			})
			return flag
		})
	}
	const onChangHzqd = (val, obj) => {
		if (val) {
			formData.value.ledgerCode = obj.tzCode
			qySecondlineHzdTzApi.qySecondlineHzdTzGetProductByHgHzdCode({hgHzCode: val}).then(res => {
				bodyList.value = res
				onBodyReset()
			})
		} else {
			formData.value.ledgerCode = ''
			bodyList.value = []
			onBodyReset()
		}
	}
	const onChangeBdlx = (val) => {
		bodyList.value = []
		onBodyReset()
		relationList.value = []
		onRelationReset()
		if (val == 1 || val == 3) {
			showGldz.value = false
			showHfdbt.value = true
		} else if (val == 2) {
			showGldz.value = true
			showHfdbt.value = false
			formData.value.glhzqdbh = ''
			formData.value.ledgerCode = ''
		} else {
			showGldz.value = false
			showHfdbt.value = false
		}
	}
	const onChangBgdh = (val) => {
		if (val) {
			qySecondlineHfdApi.qysecondlinehfdlistGetHfdBgInfoByBgCode({hfdBgCode: val}).then(res => {
				formData.value.czz = res.cyc.czz
				formData.value.cjz = res.cyc.cjz
				formData.value.cjh = res.cyc.cjh
				formData.value.ickh = res.cyc.ickh
				formData.value.cyccph = res.cyc.cyccph
				jzxhOptions.value = res.jzxList.map(v => {
					v.value = v.jzxh
					v.label = v.jzxh
					return v
				})
			})
		} else {
			formData.value.hwjzl = ''
			formData.value.hwmzl = ''
			formData.value.zzl = ''
			formData.value.jzxlx = ''
			formData.value.jzxh = ''
			formData.value.czz = ''
			formData.value.cjz = ''
			formData.value.cjh = ''
			formData.value.ickh = ''
			formData.value.cyccph = ''
			jzxhOptions.value = []
		}
	}
	const onChangJzxh = (val) => {
		if (val) {
			const obj = jzxhOptions.value.filter(v => v.value === val)[0]
			formData.value.hwjzl = obj.hwjzl
			formData.value.hwmzl = obj.hwmzl
			formData.value.zzl = obj.zzl
			formData.value.jzxlx = obj.jzxlx
		} else {
			formData.value.hwjzl = ''
			formData.value.hwmzl = ''
			formData.value.zzl = ''
			formData.value.jzxlx = ''
		}
	}
	// 抛出函数
	defineExpose({
		onOpen
	})
</script>

<style lang="less" scoped>
.file-tips {
	background-color: rgb(235, 245, 255);
	border: 1px solid rgb(214, 235, 255);
	border-radius: 5px;
	color: rgb(153, 153, 153);
	padding: 10px 20px;
	margin-bottom: 10px;
}
</style>