guest-security-check-system/snowy-admin-web/src/views/yqyc/zero/two/out-nuclear-annotation/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="tzCode">
								<a-select v-model:value="formData.tzCode" :disabled="isView"
										  placeholder="请选择台账编号" :options="tzOptions" show-search allow-clear
										  option-filter-prop="label" @change="onChangTz"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="台账性质：" name="tzNature">
								<a-select v-model:value="formData.tzNature" :disabled="true"
										  placeholder="请选择台账性质" :options="tzTypeOptions" show-search allow-clear
										  option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="使用单位：" name="useDept">
								<a-input v-model:value="formData.useDept" :disabled="true" placeholder="请输入使用单位"
										 allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="统一社会信用代码：" name="companyCode">
								<a-input v-model:value="formData.companyCode" :disabled="true"
										 placeholder="请输入统一社会信用代码" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="海关备案编号：" name="companyMainHgCode">
								<a-input v-model:value="formData.companyMainHgCode" :disabled="true"
										 placeholder="请输入海关备案编号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管方式：" name="regulaMethod">
								<a-select v-model:value="formData.regulaMethod" :disabled="isView"
										  placeholder="请输入监管方式" :options="jgfsOptions" show-search allow-clear
										  option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="运输方式：" name="ysfs">
								<a-select v-model:value="formData.ysfs" :disabled="isView" placeholder="请输入运输方式"
										  :options="ysfsOptions" show-search allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="关联清单编号：" name="glqdCode">
								<a-select v-model:value="formData.glqdCode" :disabled="isView"
										  placeholder="请输入关联清单编号" :options="glqdbhOptions" show-search allow-clear
										  option-filter-prop="label" @change="onChangGlqdbh"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="对应报关申报编号：" name="dybgCode">
								<a-input v-model:value="formData.dybgCode" :disabled="true"
										 placeholder="请选择关联清单编号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="对应报关单申报单位名称：" name="dybgDept">
								<a-input v-model:value="formData.dybgDept" :disabled="true"
										 placeholder="请选择关联清单编号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="核注单预录入号：" name="hzdrCode">
								<a-input v-model:value="formData.hzdrCode" :disabled="true"
										 placeholder="请输入核注单预录入号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="核注单编号：" name="hgHzdCode">
								<a-input v-model:value="formData.hgHzdCode" :disabled="true" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="24">
							<a-form-item label="备注：" name="remark">
								<a-textarea v-model:value="formData.remark" :disabled="isView" placeholder="请输入备注"
											:rows="4"/>
							</a-form-item>
						</a-col>
<!--						<a-col :span="8">-->
<!--							<a-form-item label="台账类型：" name="tzType">-->
<!--								<a-input v-model:value="formData.tzType" :disabled="true" allow-clear/>-->
<!--							</a-form-item>-->
<!--						</a-col>-->
					</a-row>
				</a-form>
			</a-collapse-panel>
			<a-collapse-panel key="2" header="表体信息">
				<a-button type="primary" @click="onBodyReset" v-if="!isView" style="margin-bottom: 20px;">重置
				</a-button>
				<a-form ref="bodyFormRef" :model="bodyData" :rules="bodyRules" style="margin-bottom: 20px;">
					<a-row :gutter="16">
						<a-col :span="8">
							<a-form-item label="商品序号：" name="productOrderCode">
								<a-select v-model:value="bodyData.productOrderCode" :disabled="isView"
										  placeholder="请输入商品序号" :options="bodyListOptions" show-search allow-clear
										  option-filter-prop="label" @change="onChangProductOrderCode"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="报关单商品序号：" name="bgdProductOrderCode">
								<a-input v-model:value="bodyData.bgdProductOrderCode" :disabled="true"
										 placeholder="请选择商品序号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="备案序号：" name="recordCode">
								<a-input v-model:value="bodyData.recordCode" :disabled="true"
										 placeholder="请选择台账编号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="通知书序号：" name="noticeCode">
								<a-input v-model:value="bodyData.noticeCode" :disabled="isView"
										 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="specModel">
								<a-input v-model:value="bodyData.specModel" :disabled="true"
										 placeholder="请选择台账编号" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报数量：" name="sbNum">
								<a-input-number v-model:value="bodyData.sbNum" :disabled="isView" placeholder="请输入申报数量" :min="0" style="width: 100%;" @change="onChangeSbNum"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="申报计量单位：" name="declareUnit">
								<a-select v-model:value="bodyData.declareUnit" :disabled="isView"
										  placeholder="请选择申报计量单位" :options="declareUnitOptions" show-search
										  allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="企业申报单价：" name="companySbPrice">
								<a-input-number v-model:value="bodyData.companySbPrice" :disabled="isView" placeholder="请输入企业申报单价" :min="0" style="width: 100%;"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="企业申报总价：" name="companySbCount">
								<a-input-number v-model:value="bodyData.companySbCount" :disabled="isView" placeholder="请输入企业申报总价" :min="0" style="width: 100%;"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="备案单价：" name="recordPrice">
								<a-input-number v-model:value="bodyData.recordPrice" :disabled="isView" placeholder="请输入备案单价" :min="0" style="width: 100%;"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="备案总价：" name="recordTotalPrice">
								<a-input-number v-model:value="bodyData.recordTotalPrice" :disabled="isView" placeholder="请输入备案总价" :min="0" style="width: 100%;"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="币制：" name="currency">
								<a-select v-model:value="bodyData.currency" :disabled="isView" placeholder="请选择币制" :options="currencyOptions" show-search allow-clear option-filter-prop="label" />
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="原产国(地区)：" name="originCountry">
								<a-select v-model:value="bodyData.originCountry" :disabled="isView"
										  placeholder="请选择原产国(地区)" :options="originCountryOptions" show-search
										  allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="法定数量：" name="legalQuantity">
								<a-input-number v-model:value="bodyData.legalQuantity" :disabled="isView" placeholder="请输入法定数量" :min="0" style="width: 100%" @change="onChangeLegalQuantity"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="法定计量单位：" name="legalUnit">
								<a-select v-model:value="bodyData.legalUnit" :disabled="isView"
										  placeholder="请选择法定计量单位" :options="legalUnitOptions" show-search
										  allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="第二法定数量：" name="secondLegalQuantity">
								<a-input-number v-model:value="bodyData.secondLegalQuantity" :disabled="isView" placeholder="请输入第二法定数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="法定第二计量：" name="legalSecondUnit">
								<a-select v-model:value="bodyData.legalSecondUnit" :disabled="isView"
										  placeholder="请选择法定第二计量" :options="legalSecondUnitOptions" show-search
										  allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="美元统计总金额：" name="myCount">
								<a-input-number v-model:value="bodyData.myCount" :disabled="isView" placeholder="请输入美元统计总金额" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="重量比例因子：" name="weightRatioFactor">
								<a-input v-model:value="bodyData.weightRatioFactor" :disabled="true"
										 placeholder="申报数量 / 法定数量" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="第一比例因子：" name="firstRatioFactor">
								<a-input v-model:value="bodyData.firstRatioFactor" :disabled="true"
										 placeholder="重量比例因子" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="第二比例因子：" name="secondRatioFactor">
								<a-input v-model:value="bodyData.secondRatioFactor" :disabled="true"
										 placeholder="请输入第二比例因子" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="毛重：" name="grossWeight">
								<a-input-number v-model:value="bodyData.grossWeight" :disabled="isView" placeholder="请输入毛重" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="净重：" name="netWeight">
								<a-input-number v-model:value="bodyData.netWeight" :disabled="isView" placeholder="请输入净重" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="征免性质：" name="zmMethod">
								<a-select v-model:value="bodyData.zmMethod" :disabled="isView"
										  placeholder="请选择征免性质" :options="zmMethodOptions" show-search
										  allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="最终目的国(地区)：" name="zzmdg">
								<a-select v-model:value="bodyData.zzmdg" :disabled="isView"
										  placeholder="请选择最终目的国(地区)" :options="zzmdgOptions" show-search
										  allow-clear option-filter-prop="label"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管年限起始日：" name="jgnxQsr">
								<a-date-picker v-model:value="bodyData.jgnxQsr" :disabled="isView"
											   value-format="YYYY-MM-DD HH:mm:ss" show-time
											   placeholder="请选择监管年限起始日" style="width: 100%" allow-clear
											   @change="onChangeJgnxQsr"
								/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管年限到期日：" name="jgnxDqr">
								<a-date-picker v-model:value="bodyData.jgnxDqr" :disabled="true"
											   value-format="YYYY-MM-DD HH:mm:ss" show-time
											   placeholder="请选择监管年限到期日" style="width: 100%" allow-clear/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="进账库存数量：" name="jzkcNum">
								<a-input-number v-model:value="bodyData.jzkcNum" :disabled="isView" placeholder="请输入进账库存数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管年限自用数量：" name="jgnxZysl">
								<a-input-number v-model:value="bodyData.jgnxZysl" :disabled="isView" placeholder="请输入监管年限自用数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="解除监管数量(已解除监管/总数)：" name="jcjgslYjc">
								<a-input-number v-model:value="bodyData.jcjgslYjc" :disabled="isView" placeholder="请输入解除年限数量(已解除监管/总数)" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="到期解除监管数量：" name="dqjcjgsl">
								<a-input-number v-model:value="bodyData.dqjcjgsl" :disabled="isView" placeholder="请输入到期解除监管数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="解除监管数量(二线出区)：" name="jcjgslSecondline">
								<a-input-number v-model:value="bodyData.jcjgslSecondline" :disabled="isView" placeholder="请输入解除年限数量(二线出区)" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="解除监管数量(补税)：" name="jcjgslBs">
								<a-input-number v-model:value="bodyData.jcjgslBs" :disabled="isView" placeholder="请输入解除监管数量(补税)" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="解除监管数量(区内转让)：" name="jcjgslQnzr">
								<a-input-number v-model:value="bodyData.jcjgslQnzr" :disabled="isView" placeholder="请输入解除监管数量(区内转让)" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="解除监管数量(转至区外)：" name="jcjgslZzqw">
								<a-input-number v-model:value="bodyData.jcjgslZzqw" :disabled="isView" placeholder="请输入解除监管数量(转至区外)" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="解除监管数量(基建物资核销)：" name="jcjgslJjwzhx">
								<a-input-number v-model:value="bodyData.jcjgslJjwzhx" :disabled="isView" placeholder="请输入解除监管数量(基建物资核销)" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管年限内区内转移数量：" name="jgnxnQnzysl">
								<a-input-number v-model:value="bodyData.jgnxnQnzysl" :disabled="isView" placeholder="请输入监管年限内区内转移数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管年限内抵押贷款数量：" name="jgnxnDydksl">
								<a-input-number v-model:value="bodyData.jgnxnDydksl" :disabled="isView" placeholder="请输入监管年限内抵押贷款数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="监管年限内临时移作他用数量：" name="jgnxnLszztysl">
								<a-input-number v-model:value="bodyData.jgnxnLszztysl" :disabled="isView" placeholder="请输入监管年限内临时移作他用数量" :min="0" style="width: 100%"/>
							</a-form-item>
						</a-col>
						<a-col :span="8">
							<a-form-item label="修改标志：" name="xgbz">
								<a-input v-model:value="bodyData.xgbz" :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="!(bodyData.id)"
							  @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"
					rowKey="id"
				>
					<template #bodyCell="{ column, record, index }">
						<template v-if="column.dataIndex === 'declareUnit'">
							{{ $TOOL.dictTypeData('measurement unit', record.declareUnit) }}
						</template>
						<template v-if="column.dataIndex === 'originCountry'">
							{{ $TOOL.dictTypeData('address', record.originCountry) }}
						</template>
						<template v-if="column.dataIndex === 'legalUnit'">
							{{ $TOOL.dictTypeData('measurement unit', record.legalUnit) }}
						</template>
						<template v-if="column.dataIndex === 'legalSecondUnit'">
							{{ $TOOL.dictTypeData('measurement unit', record.legalSecondUnit) }}
						</template>
						<template v-if="column.dataIndex === 'zmMethod'">
							{{ $TOOL.dictTypeData('zm_type', record.zmMethod) }}
						</template>
						<template v-if="column.dataIndex === 'zzmdg'">
							{{ $TOOL.dictTypeData('address', record.zzmdg) }}
						</template>
						<template v-if="column.dataIndex === 'action'">
							<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(record, 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"
					rowKey="id"
				>
					<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(record, index)" v-if="!isView">
									删除
								</a-button>
							</template>
						</template>
					</template>
				</a-table>
			</a-collapse-panel>
		</a-collapse>
	</a-card>
</template>

<script setup name="qySecondlineHzdTzDetail">
import tool from '@/utils/tool'
import {cloneDeep} from 'lodash-es'
import {required} from '@/utils/formRules'
import qySecondlineHzdTzApi from '@/api/yqyc/qySecondLineHzdTzApi'
import {message, Modal} from "ant-design-vue";
import {createVNode} from "vue";
import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
import qySecondlineHfdApi from "@/api/yqyc/qySecondlineHfdApi";
// 抽屉状态
const {proxy} = getCurrentInstance()
const emit = defineEmits({successful: null, onClose: null})
const formRef = ref()
// 表单数据
const formData = ref({})
const submitLoading = ref(false)
const isView = ref(false)
const tzTypeOptions = ref([])
const jgfsOptions = ref([])
const statusOptions = ref([])
const glqdbhOptions = ref([])
const ysfsOptions = ref([])
const declareUnitOptions = ref([])
const originCountryOptions = ref([])
const legalUnitOptions = ref([])
const legalSecondUnitOptions = ref([])
const zmMethodOptions = ref([])
const zzmdgOptions = ref([])
const currencyOptions = ref([])
const tzOptions = ref([])
const activeKey = ref('1')
const userInfo = tool.data.get('USER_INFO')
// 打开抽屉
const onOpen = (record, view = false, copy, sblx) => {
	isView.value = view
	if (record) {
		qySecondlineHzdTzApi.qySecondlineHzdTzDetail({id: record.id}).then(res => {
			formData.value = res.baseInfo
			bodyList.value = res.productList
			fileList.value = res.attachmentList
			if (copy) {
				delete formData.value.id
			}
			if (formData.value.tzCode) {
				let timer = setInterval(() => {
					if (tzOptions.value.length > 0) {
						const obj = tzOptions.value.filter(v => v.tzCode === formData.value.tzCode)[0]
						qySecondlineHzdTzApi.qySecondlineHzdTzQyProductById({id: obj.id}).then(res => {
							bodyListOptions.value = res.map(v => Object.assign(v, {label: v.productNumber, value: v.productNumber}))
							onBodyReset()
						})
						clearInterval(timer)
					}
				}, 500)
			}
			if (sblx) {
				formData.value.sblx = sblx
			}
		})
	} else {
		formData.value.tzType = '二线出区'
		formData.value.useDept = userInfo.companyName
	}
	qySecondlineHzdTzApi.qySecondlineHzdTzQyRecordInfo().then(res => {
		tzOptions.value = res.map(v => Object.assign(v, {label: v.tzCode, value: v.tzCode}))
		if (formData.value.tzCode) {
			const obj = tzOptions.value.filter(v => v.tzCode === formData.value.tzCode)[0]
			qySecondlineHzdTzApi.qySecondlineHzdTzQyProductById({id: obj.id}).then(res2 => {
				bodyListOptions.value = res2.map(v => Object.assign(v, {label: v.productNumber, value: v.productNumber}))
			})
		}
	})
	qySecondlineHzdTzApi.qySecondlineHzdTzHzdQdList().then(res => {
		glqdbhOptions.value = res.map(v => Object.assign(v, {label: v.glqdCode, value: v.glqdCode}))
	})
	tzTypeOptions.value = tool.dictList('tzlx')
	statusOptions.value = tool.dictList('djzt')
	ysfsOptions.value = tool.dictList('trans_type')
	declareUnitOptions.value = tool.dictList('measurement unit')
	originCountryOptions.value = tool.dictList('address')
	legalUnitOptions.value = tool.dictList('measurement unit')
	legalSecondUnitOptions.value = tool.dictList('measurement unit')
	zmMethodOptions.value = tool.dictList('zm_type')
	zzmdgOptions.value = tool.dictList('address')
	jgfsOptions.value = tool.dictList('jgfs')
	currencyOptions.value = tool.dictList('hbdm')

}
// 关闭抽屉
const onClose = () => {
	formRef.value?.resetFields()
	formData.value = {}
	isView.value = true
	emit('onClose')
}
// 默认要校验的
const formRules = {
	dybgDept: [required('请输入对应报关单申报单位名称')],
	glqdCode: [required('请输入关联清单编号')],
}
// 验证并提交数据
const onSubmit = () => {
	formRef.value
	.validate()
	.then(() => {
		submitLoading.value = true
		const params = {
			baseInfo: Object.assign(formData.value, {status: '3'}),
			productList: bodyList.value,
			attachmentList: fileList.value,
		}
		qySecondlineHzdTzApi.qySecondlineHzdTzSubmitForm(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,
			attachmentList: fileList.value,
		}
		qySecondlineHzdTzApi.qySecondlineHzdTzSubmitForm(params, formData.value.id).then(() => {
			onClose()
			emit('successful')
		})
		.finally(() => {
			submitLoading.value = false
		})
	})
	.catch(() => {
	})
}
const bodyFormRef = ref()
const bodyData = ref({})
const bodySelectedRowKeys = ref([])
const bodyList = ref([])
const bodyListOptions = ref([])
// 列表选择配置
const bodyOptions = {
	rowSelection: {
		onChange: (selectedRowKey, selectedRows) => {
			bodySelectedRowKeys.value = selectedRows
		}
	}
}
// 默认要校验的
const bodyRules = {
	productOrderCode: [required('请输入商品序号')],
	bgdProductOrderCode: [required('请输入报关单商品序号')],
	recordCode: [required('请输入备案序号')],
	noticeCode: [required('请输入通知书序号')],
	productCode: [required('请输入商品编码')],
	productName: [required('请输入商品名称')],
	specModel: [required('请输入规格型号')],
	sbNum: [required('请输入申报数量')],
	declareUnit: [required('请输入申报计量单位')],
	companySbPrice: [required('请输入企业申报单价')],
	companySbCount: [required('请输入企业申报总价')],
	recordPrice: [required('请输入备案单价')],
	recordTotalPrice: [required('请输入备案总价')],
	currency: [required('请输入币制')],
	originCountry: [required('请输入原产国(地区)')],
	legalQuantity: [required('请输入法定数量')],
	legalUnit: [required('请输入法定计量单位')],
	grossWeight: [required('请输入毛重')],
	netWeight: [required('请输入净重')],
	zmMethod: [required('请输入征免性质')],
	jgnxDqr: [required('请输入监管年限到期日')],
	jgnxQsr: [required('请输入监管年限起始日')],
	jzkcNum: [required('请输入进账库存数量')],
}
const bodyColumns = [
	{
		title: '商品序号',
		dataIndex: 'productOrderCode',
		width: 100
	},
	{
		title: '报关单商品序号',
		dataIndex: 'bgdProductOrderCode',
		width: 160
	},
	{
		title: '备案序号',
		dataIndex: 'recordCode',
		width: 100
	},
	{
		title: '通知书序号',
		dataIndex: 'noticeCode',
		width: 120
	},
	{
		title: '商品编码',
		dataIndex: 'productCode',
		width: 100
	},
	{
		title: '商品名称',
		dataIndex: 'productName',
		width: 100
	},
	{
		title: '规格型号',
		dataIndex: 'specModel',
		width: 100
	},
	{
		title: '申报数量',
		dataIndex: 'sbNum',
		width: 100
	},
	{
		title: '申报计量单位',
		dataIndex: 'declareUnit',
		width: 160
	},
	{
		title: '企业申报单价',
		dataIndex: 'companySbPrice',
		width: 160
	},
	{
		title: '企业申报总价',
		dataIndex: 'companySbCount',
		width: 160
	},
	{
		title: '备案单价',
		dataIndex: 'recordPrice',
		width: 100
	},
	{
		title: '备案总价',
		dataIndex: 'recordTotalPrice',
		width: 100
	},
	{
		title: '币制',
		dataIndex: 'currency',
		width: 100
	},
	{
		title: '原产国(地区)',
		dataIndex: 'originCountry',
		width: 160
	},
	{
		title: '法定数量',
		dataIndex: 'legalQuantity',
		width: 100
	},
	{
		title: '法定计量单位',
		dataIndex: 'legalUnit',
		width: 160
	},
	{
		title: '第二法定数量',
		dataIndex: 'secondLegalQuantity',
		width: 160
	},
	{
		title: '法定第二计量',
		dataIndex: 'legalSecondUnit',
		width: 160
	},
	{
		title: '美元统计总金额',
		dataIndex: 'myCount',
		width: 160
	},
	{
		title: '重量比例因子',
		dataIndex: 'weightRatioFactor',
		width: 160
	},
	{
		title: '第一比例因子',
		dataIndex: 'firstRatioFactor',
		width: 160
	},
	{
		title: '第二比例因子',
		dataIndex: 'secondRatioFactor',
		width: 160
	},
	{
		title: '毛重',
		dataIndex: 'grossWeight',
		width: 100
	},
	{
		title: '净重',
		dataIndex: 'netWeight',
		width: 100
	},
	{
		title: '征免方式',
		dataIndex: 'zmMethod',
		width: 160
	},
	{
		title: '最终目的国(地区)',
		dataIndex: 'zzmdg',
		width: 160
	},
	{
		title: '监管年限到期日',
		dataIndex: 'jgnxDqr',
		width: 160
	},
	{
		title: '监管年限起始日',
		dataIndex: 'jgnxQsr',
		width: 160
	},
	{
		title: '进账库存数量',
		dataIndex: 'jzkcNum',
		width: 160
	},
	{
		title: '监管年限自用数量',
		dataIndex: 'jgnxZysl',
		width: 160
	},
	{
		title: '解除年限数量(已解除监管/总数)',
		dataIndex: 'jcjgslYjc',
		width: 240
	},
	{
		title: '到期解除监管数量',
		dataIndex: 'dqjcjgsl',
		width: 160
	},
	{
		title: '解除年限数量(二线出区)',
		dataIndex: 'jcjgslSecondline',
		width: 200
	},
	{
		title: '解除监管数量(补税)',
		dataIndex: 'jcjgslBs',
		width: 200
	},
	{
		title: '解除监管数量(区内转让)',
		dataIndex: 'jcjgslQnzr',
		width: 200
	},
	{
		title: '解除监管数量(转至区外)',
		dataIndex: 'jcjgslZzqw',
		width: 200
	},
	{
		title: '解除监管数量(基建物资核销)',
		dataIndex: 'jcjgslJjwzhx',
		width: 220
	},
	{
		title: '监管年限内区内转移数量',
		dataIndex: 'jgnxnQnzysl',
		width: 200
	},
	{
		title: '监管年限内抵押贷款数量',
		dataIndex: 'jgnxnDydksl',
		width: 200
	},
	{
		title: '监管年限内临时移作他用数量',
		dataIndex: 'jgnxnLszztysl',
		width: 220
	},
	{
		title: '修改标志',
		dataIndex: 'xgbz',
		width: 100
	},
	{
		title: '操作',
		dataIndex: 'action',
		width: 200,
		fixed: 'right'
	},
]
const onBodyReset = () => {
	bodyFormRef.value?.resetFields()
	bodyData.value = {
		recordCode: formData.value.tzCode,
		specModel: 0
	}
}
const onBodyAdd = () => {
	bodyFormRef.value
	.validate()
	.then(() => {
		bodyList.value.push(Object.assign({id: new Date().getTime()}, bodyData.value))
		onBodyReset()
		message.success('插入表体信息成功！')
	})
	.catch(() => {
	})
}
const onBodyEdit = () => {
	bodyFormRef.value
	.validate()
	.then(() => {
		let k = 'id'
		if (k) {
			bodyList.value.forEach(v => {
				if (v[k] === bodyData.value[k]) {
					Object.assign(v, bodyData.value)
				}
			})
		}
		onBodyReset()
		message.success('编辑表体信息成功！')
	})
	.catch(() => {
	})
}
const onBodyDel = (record, 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))) {
				flag = false
			}
		})
		return flag
	})
}
const ref_upload = ref()
const fileData = ref({})
const showFileUpload = ref(true)
const fileSelectedRowKeys = ref([])
const fileList = ref([])
// 列表选择配置
const fileOptions = {
	rowSelection: {
		onChange: (selectedRowKey, selectedRows) => {
			fileSelectedRowKeys.value = selectedRows
		}
	}
}
const fileColumns = [
	{
		title: '附件名称',
		dataIndex: 'attachmentName',
	},
	{
		title: '附件格式',
		dataIndex: 'attachmentFormat',
	},
	{
		title: '附件内容',
		dataIndex: 'attachmentContent',
	},
	{
		title: '上传时间',
		dataIndex: 'uploadTime',
	},
	{
		title: '操作',
		dataIndex: 'action',
	},
]
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({
			id: 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 = (record, 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))) {
				flag = false
			}
		})
		return flag
	})
}
const onChangTz = (val) => {
	if (val) {
		const obj = tzOptions.value.filter(v => v.tzCode === val)[0]
		formData.value.tzNature = obj.tzType
		formData.value.companyCode = obj.companyCode
		formData.value.companyMainHgCode = obj.companyMainHgCode
		qySecondlineHzdTzApi.qySecondlineHzdTzQyProductById({id: obj.id}).then(res => {
			bodyListOptions.value = res.map(v => Object.assign(v, {label: v.productNumber, value: v.productNumber}))
			bodyList.value = []
			onBodyReset()
		})
	} else {
		formData.value.tzNature = ''
		formData.value.companyCode = ''
		formData.value.companyMainHgCode = ''
		bodyList.value = []
		bodyListOptions.value = []
		onBodyReset()
	}
}
const onChangGlqdbh = (val) => {
	if (val) {
		const obj = glqdbhOptions.value.filter(v => v.value === val)[0]
		formData.value.dybgCode = obj.dybgCode
		formData.value.dybgDept = obj.dybgDept
	} else {
		formData.value.dybgCode = ''
		formData.value.dybgDept = ''
	}
}
const onChangProductOrderCode = (val) => {
	if (val) {
		const obj = bodyListOptions.value.filter(v => v.value === val)[0]
		bodyData.value.bgdProductOrderCode = obj.productNumber
		bodyData.value.productCode = obj.productCode
		bodyData.value.productName = obj.productName
		console.log(obj)
	} else {

	}
}
const onChangeSbNum = () => {
	setTimeout(() => {
		if (proxy.$util.isValue(bodyData.value.sbNum) && proxy.$util.isValue(bodyData.value.legalQuantity) && (Number(bodyData.value.legalQuantity) > 0)) {
			bodyData.value.weightRatioFactor = (Number(bodyData.value.sbNum) / Number(bodyData.value.legalQuantity)).toFixed(2)
		} else {
			bodyData.value.weightRatioFactor = ''
		}
	}, 100)
}
const onChangeLegalQuantity = () => {
	setTimeout(() => {
		if (proxy.$util.isValue(bodyData.value.sbNum) && proxy.$util.isValue(bodyData.value.legalQuantity) && (Number(bodyData.value.legalQuantity) > 0)) {
			bodyData.value.weightRatioFactor = (Number(bodyData.value.sbNum) / Number(bodyData.value.legalQuantity)).toFixed(2)
		} else {
			bodyData.value.weightRatioFactor = ''
		}
		bodyData.value.firstRatioFactor = bodyData.value.weightRatioFactor
	}, 100)
}
const onChangeJgnxQsr = (val) => {
	bodyData.value.jgnxDqr = proxy.$util.YMDHms(new Date(val).getTime() + 1000 * 60 * 60 * 24 * 365 * 3)
}
// 抛出函数
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>