feat(mes): 优化到货通知单表单交互

- 参考 IQC 表单模式,支持详情查看和新增后自动进入编辑
- 移除用户不应填写的字段(合格数量由 IQC 回调设置)
- 使用 MdVendorSelect 组件替换内联选择器
- 添加必填验证(通知单名称、是否检验、到货数量 > 0)
- 修复导航:点击编号查看详情,新增入库单按钮查看相关入库单
pull/871/MERGE
YunaiV 2026-02-25 21:37:09 +08:00
parent 2fc5362a7e
commit b460a0e47d
3 changed files with 39 additions and 62 deletions

View File

@ -6,6 +6,7 @@
:rules="formRules"
label-width="110px"
v-loading="formLoading"
:disabled="isDetail"
>
<el-row>
<el-col :span="8">
@ -33,19 +34,7 @@
<el-row>
<el-col :span="8">
<el-form-item label="供应商" prop="vendorId">
<el-select
v-model="formData.vendorId"
placeholder="请选择供应商"
clearable
class="!w-1/1"
>
<el-option
v-for="vendor in vendorList"
:key="vendor.id"
:label="vendor.name"
:value="vendor.id"
/>
</el-select>
<MdVendorSelect v-model="formData.vendorId" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
@ -81,12 +70,14 @@
</el-row>
</el-form>
<!-- 编辑时展示物料信息 -->
<template v-if="formData.id">
<template v-if="formType === 'update' && formData.id">
<el-divider content-position="center">物料信息</el-divider>
<ArrivalNoticeLineList :notice-id="formData.id" />
</template>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading"> </el-button>
<el-button @click="submitForm" type="primary" :disabled="formLoading" v-if="!isDetail">
</el-button>
<el-button @click="dialogVisible = false"> </el-button>
</template>
</Dialog>
@ -95,8 +86,8 @@
<script setup lang="ts">
import { generateRandomStr } from '@/utils'
import { WmArrivalNoticeApi, WmArrivalNoticeVO } from '@/api/mes/wm/arrivalnotice'
import { MdVendorApi } from '@/api/mes/md/vendor'
import ArrivalNoticeLineList from './ArrivalNoticeLineList.vue'
import MdVendorSelect from '@/views/mes/md/vendor/components/MdVendorSelect.vue'
defineOptions({ name: 'ArrivalNoticeForm' })
@ -104,10 +95,17 @@ const { t } = useI18n() // 国际化
const message = useMessage() //
const dialogVisible = ref(false) //
const dialogTitle = ref('') //
const formLoading = ref(false) //
const formType = ref('') // create - update -
const vendorList = ref<any[]>([]) //
const formType = ref('') // create - update - detail -
const isDetail = computed(() => formType.value === 'detail') //
const dialogTitle = computed(() => {
const titles = {
create: '新增到货通知单',
update: '修改到货通知单',
detail: '查看到货通知单'
}
return titles[formType.value] || t('action.' + formType.value)
})
const formData = ref({
id: undefined,
code: undefined,
@ -121,6 +119,7 @@ const formData = ref({
})
const formRules = reactive({
code: [{ required: true, message: '通知单编号不能为空', trigger: 'blur' }],
name: [{ required: true, message: '通知单名称不能为空', trigger: 'blur' }],
vendorId: [{ required: true, message: '请选择供应商', trigger: 'change' }],
arrivalDate: [{ required: true, message: '请选择到货日期', trigger: 'change' }]
})
@ -134,10 +133,9 @@ const generateCode = () => {
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
vendorList.value = await MdVendorApi.getVendorSimpleList()
// DONE @AI MdVendorSelect
if (id) {
formLoading.value = true
try {
@ -157,14 +155,17 @@ const submitForm = async () => {
try {
const data = formData.value as unknown as WmArrivalNoticeVO
if (formType.value === 'create') {
await WmArrivalNoticeApi.createArrivalNotice(data)
const res = await WmArrivalNoticeApi.createArrivalNotice(data)
message.success(t('common.createSuccess'))
// id
formData.value.id = res
formType.value = 'update'
} else {
await WmArrivalNoticeApi.updateArrivalNotice(data)
message.success(t('common.updateSuccess'))
dialogVisible.value = false
emit('success')
}
dialogVisible.value = false
emit('success')
} finally {
formLoading.value = false
}

View File

@ -16,7 +16,6 @@
</template>
</el-table-column>
<el-table-column label="合格数量" align="center" prop="qualifiedQuantity" width="100" />
<!-- TODO @芋艿不要删除后续需要怎么弄 -->
<el-table-column label="检验单号" align="center" prop="iqcCode" min-width="140" />
<el-table-column label="备注" align="center" prop="remark" min-width="120" />
<el-table-column label="操作" align="center" width="120">
@ -67,25 +66,15 @@
<el-input-number
v-model="formData.arrivalQuantity"
:precision="2"
:min="0"
:min="0.01"
controls-position="right"
class="!w-1/1"
/>
</el-form-item>
</el-col>
</el-row>
<!-- DONE @AI已移除合格数量字段该字段由 IQC 回调自动设置 -->
<el-row>
<el-col :span="12">
<el-form-item label="合格数量" prop="qualifiedQuantity">
<el-input-number
v-model="formData.qualifiedQuantity"
:precision="2"
:min="0"
controls-position="right"
class="!w-1/1"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否检验" prop="iqcCheckFlag">
<el-switch v-model="formData.iqcCheckFlag" />
@ -165,13 +154,16 @@ const formData = ref({
noticeId: undefined as number | undefined,
itemId: undefined,
arrivalQuantity: undefined,
qualifiedQuantity: undefined,
iqcCheckFlag: false,
remark: undefined
})
const formRules = reactive({
itemId: [{ required: true, message: '物料不能为空', trigger: 'change' }],
arrivalQuantity: [{ required: true, message: '到货数量不能为空', trigger: 'blur' }]
arrivalQuantity: [
{ required: true, message: '到货数量不能为空', trigger: 'blur' },
{ type: 'number', min: 0.01, message: '到货数量必须大于0', trigger: 'blur' }
],
iqcCheckFlag: [{ required: true, message: '是否检验不能为空', trigger: 'change' }]
})
const formRef = ref() // Ref
@ -219,7 +211,6 @@ const resetForm = () => {
noticeId: undefined,
itemId: undefined,
arrivalQuantity: undefined,
qualifiedQuantity: undefined,
iqcCheckFlag: false,
remark: undefined
}

View File

@ -25,6 +25,7 @@
class="!w-240px"
/>
</el-form-item>
<!-- TODO @芋艿待确认先忽略这里的字段映射 -->
<el-form-item label="采购订单编号" prop="purchaseOrderCode">
<el-input
v-model="queryParams.purchaseOrderCode"
@ -103,9 +104,9 @@
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="通知单编号" align="center" prop="code" min-width="160">
<template #default="scope">
<el-button link type="primary" @click="openLine(scope.row.id)">
<el-link type="primary" @click="openForm('detail', scope.row.id)">
{{ scope.row.code }}
</el-button>
</el-link>
</template>
</el-table-column>
<el-table-column label="通知单名称" align="center" prop="name" min-width="150" />
@ -116,6 +117,8 @@
min-width="140"
/>
<el-table-column label="供应商名称" align="center" prop="vendorName" min-width="120" />
<el-table-column label="联系人" align="center" prop="contactName" min-width="100" />
<el-table-column label="联系方式" align="center" prop="contactTelephone" min-width="120" />
<el-table-column
label="到货日期"
align="center"
@ -123,20 +126,11 @@
:formatter="dateFormatter2"
width="180px"
/>
<el-table-column label="联系人" align="center" prop="contactName" min-width="100" />
<el-table-column label="联系方式" align="center" prop="contactTelephone" min-width="120" />
<el-table-column label="单据状态" align="center" prop="status" min-width="100">
<template #default="scope">
<dict-tag :type="DICT_TYPE.MES_WM_ARRIVAL_NOTICE_STATUS" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column
label="创建时间"
align="center"
prop="createTime"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="操作" align="center" width="220" fixed="right">
<template #default="scope">
<el-button
@ -181,7 +175,7 @@
</template>
<script setup lang="ts">
import { dateFormatter, dateFormatter2 } from '@/utils/formatTime'
import { dateFormatter2 } from '@/utils/formatTime'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import download from '@/utils/download'
import { WmArrivalNoticeApi, WmArrivalNoticeVO } from '@/api/mes/wm/arrivalnotice'
@ -193,7 +187,6 @@ defineOptions({ name: 'MesWmArrivalNotice' })
const message = useMessage() //
const { t } = useI18n() //
const router = useRouter() //
const loading = ref(true) //
const list = ref<WmArrivalNoticeVO[]>([]) //
@ -236,20 +229,12 @@ const resetQuery = () => {
handleQuery()
}
/** 新增/修改 */
/** 新增/修改/详情 */
const formRef = ref() //
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
}
/** 打开明细行 */
const openLine = (noticeId: number) => {
router.push({
name: 'MesWmArrivalNoticeLine',
query: { noticeId: String(noticeId) }
})
}
/** 提交 */
const handleSubmit = async (id: number) => {
try {