heli-mes/mes-ui/mes-ui-admin-vue3/src/views/heli/partpurchasecheck/Form.vue

83 lines
2.3 KiB
Vue
Raw Normal View History

2025-09-12 20:36:40 +08:00
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible" @close="cancel">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<el-form-item label="驳回原因" prop="reason">
<el-input type="textarea" :rows="5" v-model="formData.reason" placeholder="请输入驳回原因" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading"> </el-button>
<el-button @click="dialogVisible = false"> </el-button>
</template>
</Dialog>
</template>
<script setup lang="ts">
import * as PartPurchaseOrderApi from "@/api/heli/partpurchaseorder";
import {updatePurchaseOrderMakeNo} from "@/api/heli/partpurchaseorder";
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中1修改时的数据加载2提交的按钮禁用
const formType = ref('') // 表单的类型create - 新增update - 修改
const formData = ref({
id: undefined,
2025-09-15 08:15:22 +08:00
status:3,
2025-09-12 20:36:40 +08:00
reason: undefined,
})
const formRules = reactive({
reason: [{ required: true, message: '驳回原因不能为空', trigger: 'blur' }],
})
const formRef = ref() // 表单 Ref
/** 打开弹窗 */
const open = async (id?: number) => {
dialogVisible.value = true
resetForm()
formData.value.id=id
}
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
const cancel = async () => {
dialogVisible.value = false
emit('success')
}
const submitForm = async () => {
// 校验表单
await formRef.value.validate()
// 提交请求
formLoading.value = true
try {
dialogVisible.value = false
2025-09-27 17:16:12 +08:00
formData.value.status=3
2025-09-12 20:36:40 +08:00
await PartPurchaseOrderApi.updatePurchaseOrderMakeNo(formData.value)
// 发送操作成功的事件
message.success("驳回成功");
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
reason:undefined,
}
formRef.value?.resetFields()
}
</script>