113 lines
2.8 KiB
Vue
113 lines
2.8 KiB
Vue
<!--模型分类的新增编辑弹出框-->
|
|
<template>
|
|
<el-dialog
|
|
draggable
|
|
class='cn-operate-dialog'
|
|
v-model='machineVisible'
|
|
:title='title'
|
|
style='width: 415px; height: 350px'
|
|
top='30vh'
|
|
>
|
|
<el-scrollbar>
|
|
<el-form :inline='false' :model='form' label-width='120px' :rules='rules' ref='formRef'>
|
|
<el-form-item label='标识名称' prop='name'>
|
|
<el-input v-model='form.name' placeholder='请输入标识名' clearable />
|
|
</el-form-item>
|
|
<el-form-item label='分类key' prop='signKey'>
|
|
<el-input v-model='form.signKey' placeholder='请输入标识key' clearable />
|
|
</el-form-item>
|
|
<el-form-item label='查看表单路径' prop='viewPath'>
|
|
<el-input v-model='form.viewPath' placeholder='请输入查看表单路径' clearable>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-scrollbar>
|
|
<template #footer>
|
|
<span class='dialog-footer'>
|
|
<el-button @click='machineVisible = false'>取消</el-button>
|
|
<el-button type='primary' @click='submit'>确认</el-button>
|
|
</span>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
<script lang='ts' setup>
|
|
import { ref, reactive, inject } from 'vue'
|
|
import { ElMessage } from 'element-plus'
|
|
import TableStore from '@/utils/tableStore'
|
|
import { addSign, updateSign } from '@/api/bpm-boot/sign'
|
|
|
|
const tableStore = inject('tableStore') as TableStore
|
|
const machineVisible = ref(false)
|
|
const title = ref('')
|
|
const formRef = ref()
|
|
|
|
// 注意不要和表单ref的命名冲突
|
|
const form = reactive({
|
|
id: '',
|
|
name: '',
|
|
signKey: '',
|
|
viewPath: ''
|
|
})
|
|
|
|
//form表单校验规则
|
|
const rules = {
|
|
name: [{ required: true, message: '标识名不能为空', trigger: 'blur' }],
|
|
signKey: [{ required: true, message: '标识key不能为空', trigger: 'blur' }],
|
|
viewPath: [{ required: true, message: '查看表单路径不能为空', trigger: 'blur' }],
|
|
}
|
|
|
|
const open = (text: string, data?: any) => {
|
|
title.value = text
|
|
if (data) {
|
|
// 表单赋值
|
|
for (let key in form) {
|
|
form[key] = data[key]
|
|
}
|
|
} else {
|
|
resetForm()
|
|
// 在此处恢复默认表单
|
|
for (let key in form) {
|
|
form[key] = ''
|
|
}
|
|
}
|
|
machineVisible.value = true
|
|
}
|
|
|
|
//重置表单内容
|
|
const resetForm = () => {
|
|
if (formRef.value) {
|
|
formRef.value.resetFields()
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 提交用户表单数据
|
|
*/
|
|
const submit = () => {
|
|
formRef.value.validate(async (valid: any) => {
|
|
if (valid) {
|
|
if (form.id) {
|
|
await updateSign(form)
|
|
} else {
|
|
await addSign(form)
|
|
}
|
|
ElMessage.success('保存成功')
|
|
tableStore.index()
|
|
machineVisible.value = false
|
|
}
|
|
})
|
|
}
|
|
|
|
defineExpose({ open })
|
|
</script>
|
|
|
|
<style scoped>
|
|
.el-upload-list__item {
|
|
transition: none !important;
|
|
}
|
|
|
|
.el-select {
|
|
min-width: 180px;
|
|
}
|
|
</style>
|