<template>
|
<FormDialog
|
v-model="dialogVisible"
|
:title="computedTitle"
|
:operation-type="operationType"
|
width="520px"
|
@close="emit('close')"
|
@cancel="handleCancel"
|
@confirm="handleConfirm"
|
>
|
<el-form
|
ref="formRef"
|
:model="form"
|
:rules="rules"
|
label-width="100px"
|
>
|
<el-form-item label="参数项" prop="parameterItem">
|
<el-input v-model="form.parameterItem" placeholder="请输入参数项" />
|
</el-form-item>
|
<el-form-item label="单位" prop="unit">
|
<el-input v-model="form.unit" placeholder="请输入单位" />
|
</el-form-item>
|
<el-form-item label="标准值" prop="standardValue">
|
<el-input v-model="form.standardValue" placeholder="请输入标准值" />
|
</el-form-item>
|
<el-form-item label="内控值" prop="controlValue">
|
<el-input v-model="form.controlValue" placeholder="请输入内控值" />
|
</el-form-item>
|
<el-form-item label="默认值" prop="defaultValue">
|
<el-input v-model="form.defaultValue" placeholder="请输入默认值" />
|
</el-form-item>
|
</el-form>
|
</FormDialog>
|
</template>
|
|
<script setup>
|
import { computed, ref } from 'vue'
|
import FormDialog from '@/components/Dialog/FormDialog.vue'
|
|
const props = defineProps({
|
modelValue: { type: Boolean, default: false },
|
operationType: { type: String, default: 'add' }, // add | edit
|
form: { type: Object, required: true }
|
})
|
|
const emit = defineEmits(['update:modelValue', 'close', 'cancel', 'confirm'])
|
|
const dialogVisible = computed({
|
get: () => props.modelValue,
|
set: (val) => emit('update:modelValue', val)
|
})
|
|
const formRef = ref(null)
|
|
const rules = {
|
parameterItem: [{ required: true, message: '请输入参数项', trigger: 'blur' }],
|
unit: [{ required: true, message: '请输入单位', trigger: 'blur' }]
|
}
|
|
const computedTitle = computed(() => (props.operationType === 'edit' ? '编辑标准参数' : '新增标准参数'))
|
|
const handleConfirm = () => {
|
formRef.value?.validate?.((valid) => {
|
if (valid) emit('confirm')
|
})
|
}
|
|
const handleCancel = () => {
|
emit('cancel')
|
dialogVisible.value = false
|
}
|
|
const resetFields = () => {
|
formRef.value?.resetFields?.()
|
}
|
|
defineExpose({ resetFields })
|
</script>
|
