指标字典
This commit is contained in:
@@ -0,0 +1,240 @@
|
||||
<template>
|
||||
<el-dialog v-model='dialogVisible' :title='dialogTitle' v-bind='dialogMiddle' @close="close">
|
||||
<div>
|
||||
<el-form :model='formContent' ref='dialogFormRef' :rules='rules' class='form-two'>
|
||||
<el-form-item label='数据模型' :label-width='100' prop='dataType'>
|
||||
<el-select v-model="formContent.dataType" placeholder="请选择资源类型">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('dataType')"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='指标名称' :label-width='100' prop='name'>
|
||||
<el-input v-model='formContent.name' placeholder='请输入' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='别名' :label-width='100' prop='otherName'>
|
||||
<el-input v-model='formContent.otherName' placeholder='请输入' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='显示名称' :label-width='100' prop='showName'>
|
||||
<el-input v-model='formContent.showName' placeholder='请输入' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='相别' :label-width='100' prop='phase'>
|
||||
<el-select v-model="formContent.phase" placeholder="请选择相别">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('dataType')"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='单位' :label-width='100' prop='unit'>
|
||||
<el-input v-model='formContent.unit' placeholder='请输入单位' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='指标数据类型' :label-width='100' prop='type'>
|
||||
<el-input v-model='formContent.type' placeholder='请输入指标数据类型' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='开始结束' :label-width='100' prop='type'>
|
||||
<el-input v-model='formContent.type' placeholder='请输入开始结束' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='数据统计类型' :label-width='100' prop='statMethod'>
|
||||
<el-select v-model="formContent.statMethod" placeholder="请选择数据统计类型">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('statMethod')"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='报表数据来源' :label-width='100' prop='resourcesId'>
|
||||
<el-select v-model="formContent.resourcesId" placeholder="请选择报表数据来源">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('statMethod')"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='数据表表名' :label-width='100' prop='statMethod'>
|
||||
<el-select v-model="formContent.statMethod" placeholder="请选择数据表表名">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('statMethod')"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='排序' :label-width='100'>
|
||||
<el-input-number v-model='formContent.sort' />
|
||||
</el-form-item>
|
||||
<el-form-item label='限值字段名称' :label-width='100' prop='limitName'>
|
||||
<el-input v-model='formContent.limitName' placeholder='请输入限值字段名称' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='限值表名' :label-width='100' prop='limitTable'>
|
||||
<el-input v-model='formContent.limitTable' placeholder='请输入限值表名' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='超标判断方式' :label-width='100' prop='formula'>
|
||||
<el-select v-model="formContent.formula" placeholder="请选择超标判断方式">
|
||||
<el-option
|
||||
v-for="item in dictStore.getDictData('formula')"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label='参数缺省值' :label-width='100' prop='defaultValue'>
|
||||
<el-input v-model='formContent.defaultValue' placeholder='请输入参数缺省值' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='事件类别' :label-width='100' prop='eventType'>
|
||||
<el-input v-model='formContent.eventType' placeholder='请输入事件类别' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='设置最大值' :label-width='100' prop='maxNum'>
|
||||
<el-input v-model='formContent.maxNum' placeholder='请输入最大值' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='设置最小值' :label-width='100' prop='minNum'>
|
||||
<el-input v-model='formContent.minNum' placeholder='请输入最小值' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='枚举序列' :label-width='100' prop='setValue'>
|
||||
<el-input v-model='formContent.setValue' placeholder='请输入枚举序列' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='字符串长度上限' :label-width='100' prop='strlen'>
|
||||
<el-input v-model='formContent.strlen' placeholder='请输入字符串长度上限' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label='上送规则' :label-width='100' prop='tranRule'>
|
||||
<el-input v-model='formContent.tranRule' placeholder='请输入上送规则' autocomplete='off' />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否可远程控制" :label-width="100">
|
||||
<el-radio-group v-model="formContent.ctlSts" >
|
||||
<el-radio-button label="是" :value="1"></el-radio-button>
|
||||
<el-radio-button label="否" :value="0"></el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否存储" :label-width="100">
|
||||
<el-radio-group v-model="formContent.storeFlag" >
|
||||
<el-radio-button label="是" :value="1"></el-radio-button>
|
||||
<el-radio-button label="否" :value="0"></el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="数据是否上送" :label-width="100">
|
||||
<el-radio-group v-model="formContent.tranFlag" >
|
||||
<el-radio-button label="是" :value="1"></el-radio-button>
|
||||
<el-radio-button label="否" :value="0"></el-radio-button>
|
||||
</el-radio-group>
|
||||
</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 setup lang='ts'>
|
||||
import { dialogMiddle } from '@/utils/elementBind'
|
||||
import { type Dict } from '@/api/system/dictionary/interface'
|
||||
import { ElMessage, type FormItemRule } from 'element-plus'
|
||||
import { addDictPq, updateDictPq } from '@/api/system/dictionary/dictPq'
|
||||
import { computed, type Ref, ref } from 'vue';
|
||||
import { useDictStore } from '@/stores/modules/dict'
|
||||
const dictStore = useDictStore()
|
||||
// 定义弹出组件元信息
|
||||
const dialogFormRef = ref()
|
||||
|
||||
function useMetaInfo() {
|
||||
const dialogVisible = ref(false)
|
||||
const titleType = ref('add')
|
||||
const formContent = ref<Dict.ResDictPq>({
|
||||
id: '',
|
||||
name: '',
|
||||
phase: '',
|
||||
sort: 100,
|
||||
dataType: '',
|
||||
state: 1,
|
||||
})
|
||||
return { dialogVisible, titleType, formContent }
|
||||
}
|
||||
|
||||
const { dialogVisible, titleType, formContent } = useMetaInfo()
|
||||
|
||||
// 清空formContent
|
||||
const resetFormContent = () => {
|
||||
formContent.value = {
|
||||
id: '',
|
||||
name: '',
|
||||
phase: '',
|
||||
sort: 100,
|
||||
dataType: '',
|
||||
state: 1,
|
||||
}
|
||||
}
|
||||
|
||||
let dialogTitle = computed(() => {
|
||||
return titleType.value === 'add' ? '新增字典类型' : '编辑字典类型'
|
||||
})
|
||||
|
||||
// 定义表单校验规则
|
||||
const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
|
||||
name: [{ required: true, message: '类型名称必填!', trigger: 'blur' }],
|
||||
code: [{ required: true, message: '类型编码必填!', 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 updateDictPq(formContent.value)
|
||||
} else {
|
||||
await addDictPq(formContent.value)
|
||||
}
|
||||
ElMessage.success({ message: `${dialogTitle.value}成功!` })
|
||||
close()
|
||||
// 刷新表格
|
||||
await props.refreshTable!()
|
||||
}
|
||||
})
|
||||
} catch (err) {
|
||||
console.error('验证过程中出现错误', err)
|
||||
}
|
||||
}
|
||||
|
||||
// 打开弹窗,可能是新增,也可能是编辑
|
||||
const open = (sign: string, data: Dict.ResDictType) => {
|
||||
titleType.value = sign
|
||||
dialogVisible.value = true
|
||||
if (data.id) {
|
||||
formContent.value = { ...data }
|
||||
} else {
|
||||
resetFormContent()
|
||||
}
|
||||
}
|
||||
|
||||
// 对外映射
|
||||
defineExpose({ open })
|
||||
const props = defineProps<{
|
||||
refreshTable: (() => Promise<void>) | undefined;
|
||||
}>()
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user