diff --git a/src/views/mes/wm/packages/PackageForm.vue b/src/views/mes/wm/packages/PackageForm.vue
index 99fe16407..f641a1fa6 100644
--- a/src/views/mes/wm/packages/PackageForm.vue
+++ b/src/views/mes/wm/packages/PackageForm.vue
@@ -11,9 +11,13 @@
-
+
- 生成
+ 生成
@@ -26,36 +30,45 @@
value-format="x"
placeholder="请选择装箱日期"
class="!w-1/1"
+ :disabled="isHeaderReadonly"
/>
-
+
-
+
-
+
-
+
-
+
@@ -95,7 +108,7 @@
-
+
@@ -124,13 +137,18 @@
-
+
-
-
+
+
@@ -141,10 +159,21 @@
-
- 确 定
+
+ 保 存
- 取 消
+
+ 完 成
+
+
+ 完 成
+
+ 关 闭
@@ -157,29 +186,33 @@ import MdUnitMeasureSelect from '@/views/mes/md/unitmeasure/components/MdUnitMea
import UserSelect from '@/views/system/user/components/UserSelect.vue'
import SubPackageList from './SubPackageList.vue'
import PackageLineList from './PackageLineList.vue'
-import { MesAutoCodeRuleCode } from '@/views/mes/utils/constants'
+import { MesAutoCodeRuleCode, MesWmPackageStatusEnum } from '@/views/mes/utils/constants'
defineOptions({ name: 'PackageForm' })
+const emit = defineEmits(['success'])
-const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
-
const dialogVisible = ref(false) // 弹窗的是否展示
const formLoading = ref(false) // 表单的加载中
-const formType = ref('') // 表单的类型：create - 新增；update - 修改；detail - 详情
-const isDetail = computed(() => formType.value === 'detail')
+const formType = ref('create') // 表单的类型：create / update / finish / detail
+const isEditable = computed(() => ['create', 'update'].includes(formType.value)) // 是否为编辑模式
+const isFinish = computed(() => formType.value === 'finish') // 是否为完成模式
+const isDetail = computed(() => ['detail', 'finish'].includes(formType.value)) // 是否为详情模式
+const isHeaderReadonly = computed(() => ['finish', 'detail'].includes(formType.value)) // 是否只读
const dialogTitle = computed(() => {
const titles: Record = {
create: '新增装箱单',
update: '修改装箱单',
+ finish: '完成装箱单',
detail: '查看装箱单'
}
- return titles[formType.value] || t('action.' + formType.value)
+ return titles[formType.value] || formType.value
})
const activeTab = ref('subPackage')
const formData = ref({
id: undefined as number | undefined,
code: undefined as string | undefined,
+ status: undefined as number | undefined,
packageDate: undefined as number | undefined,
salesOrderCode: undefined as string | undefined,
invoiceCode: undefined as string | undefined,
@@ -198,7 +231,8 @@ const formRules = reactive({
code: [{ required: true, message: '装箱单编号不能为空', trigger: 'blur' }],
packageDate: [{ required: true, message: '请选择装箱日期', trigger: 'change' }]
})
-const formRef = ref()
+const formRef = ref() // 表单 Ref
+const originalFormData = ref('') // 原始表单数据快照，用于脏检查
/** 生成装箱单编号 */
const generateCode = async () => {
@@ -213,6 +247,7 @@ const open = async (type: string, id?: number) => {
formType.value = type
activeTab.value = 'subPackage'
resetForm()
+ // 修改/完成/详情时，加载数据
if (id) {
formLoading.value = true
try {
@@ -221,11 +256,11 @@ const open = async (type: string, id?: number) => {
formLoading.value = false
}
}
+ // 保存原始数据快照
+ originalFormData.value = JSON.stringify(formData.value)
}
-defineExpose({ open })
-/** 提交表单 */
-const emit = defineEmits(['success'])
+/** 提交表单（create/update 模式） */
const submitForm = async () => {
await formRef.value.validate()
formLoading.value = true
@@ -233,26 +268,50 @@ const submitForm = async () => {
const data = formData.value as unknown as WmPackageVO
if (formType.value === 'create') {
const res = await WmPackageApi.createPackage(data)
- message.success(t('common.createSuccess'))
- // 新增成功后，切换到修改模式，设置 id
+ message.success('新增成功')
+ // 创建成功后，更新表单数据和状态为编辑模式
formData.value.id = res
+ formData.value.status = MesWmPackageStatusEnum.PREPARE
formType.value = 'update'
} else {
await WmPackageApi.updatePackage(data)
- message.success(t('common.updateSuccess'))
- dialogVisible.value = false
+ message.success('修改成功')
}
+ // 更新快照
+ originalFormData.value = JSON.stringify(formData.value)
emit('success')
} finally {
formLoading.value = false
}
}
+/** 完成操作：编辑模式下表单修改过则先保存，再完成 */
+const handleFinish = async () => {
+ try {
+ await message.confirm('确认完成该装箱单？完成后将不可编辑。')
+ formLoading.value = true
+ // 编辑模式下，表单有修改时先保存
+ if (isEditable.value && JSON.stringify(formData.value) !== originalFormData.value) {
+ await formRef.value.validate()
+ const data = formData.value as unknown as WmPackageVO
+ await WmPackageApi.updatePackage(data)
+ }
+ await WmPackageApi.finishPackage(formData.value.id!)
+ message.success('完成成功')
+ dialogVisible.value = false
+ emit('success')
+ } catch {
+ } finally {
+ formLoading.value = false
+ }
+}
+
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
code: undefined,
+ status: undefined,
packageDate: undefined,
salesOrderCode: undefined,
invoiceCode: undefined,
@@ -269,4 +328,6 @@ const resetForm = () => {
}
formRef.value?.resetFields()
}
+
+defineExpose({ open })
diff --git a/src/views/mes/wm/packages/index.vue b/src/views/mes/wm/packages/index.vue
index 309e1ff1f..64619ad42 100644
--- a/src/views/mes/wm/packages/index.vue
+++ b/src/views/mes/wm/packages/index.vue
@@ -89,6 +89,7 @@
+
@@ -157,6 +158,7 @@ const queryParams = reactive({
inspectorUserId: undefined
})
const queryFormRef = ref() // 搜索的表单
+const formRef = ref() // 表单弹窗
/** 查询列表 */
const getList = async () => {
@@ -170,52 +172,35 @@ const getList = async () => {
}
}
-/** 搜索 */
+/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
-/** 重置 */
+/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
handleQuery()
}
-/** 新增/修改/详情 */
-const formRef = ref()
+/** 添加/修改操作 */
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
}
-/** 完成 */
-const handleFinish = async (id: number) => {
- try {
- // 完成的二次确认
- await message.confirm('确认完成该装箱单？完成后将不可编辑。')
- // 发起完成
- await WmPackageApi.finishPackage(id)
- message.success('完成成功')
- // 刷新列表
- await getList()
- } catch {}
-}
-
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
try {
- // 删除的二次确认
await message.delConfirm()
- // 发起删除
await WmPackageApi.deletePackage(id)
message.success(t('common.delSuccess'))
- // 刷新列表
await getList()
} catch {}
}
/** 初始化 */
-onMounted(async () => {
- await getList()
+onMounted(() => {
+ getList()
})