127 lines
3.5 KiB
Vue
127 lines
3.5 KiB
Vue
|
<template>
|
|||
|
|
<!-- 基础信息弹出框 -->
|
|||
|
|
<el-dialog :model-value="dialogVisible" :title="dialogTitle" v-bind="dialogSmall" @close="close" >
|
|||
|
|
<div>
|
|||
|
|
<el-form :model="formContent" ref='dialogFormRef' :rules='rules'>
|
|||
|
|
<el-form-item label="名称" prop="name" >
|
|||
|
|
<el-input v-model='formContent.name' placeholder="请输入icd名称"/>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="存储地址" prop="path" >
|
|||
|
|
<el-input v-model='formContent.path' placeholder="请输入icd存储地址"/>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</div>
|
|||
|
|
<template #footer>
|
|||
|
|
<div class="dialog-footer">
|
|||
|
|
<el-button @click="close()">取消</el-button>
|
|||
|
|
<el-button type="primary" @click="save()" >
|
|||
|
|
保存
|
|||
|
|
</el-button>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-dialog>
|
|||
|
|
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script lang="ts" setup>
|
|||
|
|
import{ ElMessage, type FormInstance,type FormItemRule } from 'element-plus'
|
|||
|
|
import type { ProTableInstance } from '@/components/ProTable/interface'
|
|||
|
|
import { ref,computed, Ref} from 'vue'
|
|||
|
|
import { type ICD } from '@/api/device/interface/icd'
|
|||
|
|
import {dialogSmall} from '@/utils/elementBind'
|
|||
|
|
import { useDictStore } from '@/stores/modules/dict'
|
|||
|
|
import {addICD,updateICD} from '@/api/device/icd'
|
|||
|
|
const dictStore = useDictStore()
|
|||
|
|
// 定义弹出组件元信息
|
|||
|
|
const dialogFormRef = ref()
|
|||
|
|
function useMetaInfo() {
|
|||
|
|
const dialogVisible = ref(false)
|
|||
|
|
const titleType = ref('add')
|
|||
|
|
const formContent = ref<ICD.ResICD>({
|
|||
|
|
id: '',
|
|||
|
|
name: '',
|
|||
|
|
path: '',
|
|||
|
|
state: 1,
|
|||
|
|
})
|
|||
|
|
return { dialogVisible, titleType, formContent }
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const { dialogVisible, titleType, formContent } = useMetaInfo()
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 清空formContent
|
|||
|
|
const resetFormContent = () => {
|
|||
|
|
formContent.value = {
|
|||
|
|
id: '',
|
|||
|
|
name: '',
|
|||
|
|
path: '',
|
|||
|
|
state: 1,
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let dialogTitle = computed(() => {
|
|||
|
|
return titleType.value === 'add' ? '新增ICD' : '编辑ICD'
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
//定义规则
|
|||
|
|
const formRuleRef = ref<FormInstance>()
|
|||
|
|
//定义校验规则
|
|||
|
|
const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
|
|||
|
|
name: [{ required: true, message: 'icd名称必填！', trigger: 'blur' }],
|
|||
|
|
path: [{ required: true, message: 'icd存储地址必填！', trigger: 'blur' }],
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 关闭弹窗
|
|||
|
|
const close = () => {
|
|||
|
|
dialogVisible.value = false
|
|||
|
|
// 清空dialogForm中的值
|
|||
|
|
resetFormContent()
|
|||
|
|
// 重置表单
|
|||
|
|
dialogFormRef.value?.resetFields()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 保存数据
|
|||
|
|
const save = () => {
|
|||
|
|
try {
|
|||
|
|
dialogFormRef.value?.validate(async (valid: boolean) => {
|
|||
|
|
if (valid) {
|
|||
|
|
if (formContent.value.id) {
|
|||
|
|
await updateICD(formContent.value);
|
|||
|
|
} else {
|
|||
|
|
await addICD(formContent.value);
|
|||
|
|
}
|
|||
|
|
ElMessage.success({ message: `${dialogTitle.value}成功！` })
|
|||
|
|
close()
|
|||
|
|
// 刷新表格
|
|||
|
|
await props.refreshTable!()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
} catch (err) {
|
|||
|
|
//error('验证过程中出现错误', err)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 打开弹窗，可能是新增，也可能是编辑
|
|||
|
|
const open = async (sign: string, data: ICD.ResICD) => {
|
|||
|
|
// 重置表单
|
|||
|
|
dialogFormRef.value?.resetFields()
|
|||
|
|
titleType.value = sign
|
|||
|
|
dialogVisible.value = true
|
|||
|
|
|
|||
|
|
if (data.id) {
|
|||
|
|
formContent.value = { ...data }
|
|||
|
|
} else {
|
|||
|
|
resetFormContent()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 对外映射
|
|||
|
|
defineExpose({ open })
|
|||
|
|
const props = defineProps<{
|
|||
|
|
refreshTable: (() => Promise<void>) | undefined;
|
|||
|
|
}>()
|
|||
|
|
|
|||
|
|
</script>
|