Files
admin-sjzx/src/views/pqs/database/algorithm/components/form.vue
GGJ 28d9af0cb4 联调算法库
修改冀北台账问题
2024-09-11 20:37:40 +08:00

99 lines
3.6 KiB
Vue

<template>
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title" width="700px">
<el-scrollbar>
<el-form :inline="false" :model="form" label-width="auto" :rules="rules" ref="formRef">
<el-form-item label="算法名称" prop="name">
<el-input v-model="form.name" placeholder="请输入算法名称" />
</el-form-item>
<el-form-item label="计算周期" prop="period">
<el-select v-model="form.period" placeholder="请选择计算周期" clearable>
<el-option v-for="item in cycle" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="数据来源" prop="source">
<el-input v-model="form.source" placeholder="请输入数据来源" />
</el-form-item>
<el-form-item label="定义" prop="definition">
<el-input v-model="form.definition" :rows="2" type="textarea" placeholder="请输入定义" />
</el-form-item>
</el-form>
</el-scrollbar>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref, inject } from 'vue'
import { reactive } from 'vue'
import { ElMessage } from 'element-plus'
import { addAlgorithm, updateAlgorithmLibrary } from '@/api/supervision-boot/database/index'
const emit = defineEmits(['getTree'])
const dialogVisible = ref(false)
const title = ref('')
const formRef = ref()
const List = ref({})
// 注意不要和表单ref的命名冲突
const form = reactive<anyObj>({
name: '',
period: '',
definition: '',
source: ''
})
const rules = {
name: [{ required: true, message: '请输入算法名称', trigger: 'blur' }],
period: [{ required: true, message: '请选择计算周期', trigger: 'change' }],
definition: [{ required: true, message: '请输入定义', trigger: 'blur' }],
source: [{ required: true, message: '请输入数据来源', trigger: 'blur' }]
}
const cycle = [
{ value: '0', label: '日' },
{ value: '1', label: '月' },
{ value: '2', label: '季' },
{ value: '3', label: '年' }
]
const open = (row: any) => {
title.value = row.title
dialogVisible.value = true
List.value = row.row
if (row.title == '新增算法') {
// 在此处恢复默认表单
for (let key in form) {
form[key] = ''
}
} else {
// 表单赋值
for (let key in form) {
form[key] = row.row[key]
}
form.id = row.row.id
}
}
const submit = () => {
formRef.value.validate(async (valid: boolean) => {
if (valid) {
if (title.value == '新增算法') {
// await update(form)
addAlgorithm({ ...form, pid: List.value?.id }).then(res => {
ElMessage.success('新增成功')
dialogVisible.value = false
emit('getTree')
})
} else {
updateAlgorithmLibrary(form).then(res => {
ElMessage.success('修改成功')
dialogVisible.value = false
emit('getTree')
})
}
}
})
}
defineExpose({ open })
</script>