字典管理ok

src/views/setting/dictionary/list/popupDetailEdit.vue

@@ -0,0 +1,135 @@
+<template>
+    <el-dialog class='cn-operate-dialog' v-model='dialogVisible' :title='title'>
+        <el-scrollbar>
+            <el-form :inline='false' :model='form' label-width='120px' :rules='rules' ref='formRef'>
+                <el-form-item label='名称:' class='top' prop='name'>
+                    <el-input v-model='form.name'></el-input>
+                </el-form-item>
+                <el-form-item label='计算值:' class='top'>
+                    <el-input v-model='form.value'></el-input>
+                </el-form-item>
+                <el-form-item class='top' label='对应算法:' prop='algoDescribe' v-if='form.openDescribe == 1'>
+                    <el-input v-model='form.algoDescribe' placeholder='请输入数字'></el-input>
+                </el-form-item>
+                <el-form-item class='top'
+                              label='编码:'
+                              prop='code'
+                >
+                    <el-input v-model='form.code'></el-input>
+                </el-form-item>
+                <el-form-item label='排序:' prop='sort' class='top'>
+                    <el-input-number v-model='form.sort' :min='0' />
+                </el-form-item>
+                <el-form-item
+                    v-if='form.openLevel === 1'
+                    label='事件等级:'
+                >
+                    <el-select v-model='form.level' placeholder='选择开启等级'>
+                        <el-option
+                            v-for='item in EventOpenLevel'
+                            :key='item.value'
+                            :label='item.label'
+                            :value='item.value'
+                        >
+                        </el-option>
+                    </el-select>
+                </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 TableStore from '@/utils/tableStore'
+import { ElMessage } from 'element-plus'
+import { add, update } from '@/api/user-boot/role'
+import { useAdminInfo } from '@/stores/adminInfo'
+import { dictDataAdd, dictDataUpdate } from '@/api/system-boot/dicData'
+
+defineOptions({
+    name: 'diction/list/detail/popupDetailEdit'
+})
+const adminInfo = useAdminInfo()
+const tableStore = inject('tableStore') as TableStore
+const formRef = ref()
+// do not use same name with ref
+const form = reactive({
+    algoDescribe: '',
+    code: '',
+    level: 0,
+    name: '',
+    value: '',
+    sort: 0,
+    typeId: '',
+    openLevel: 0,
+    openDescribe: 0,
+    typeName: '',
+    id: ''
+})
+const EventOpenLevel = [
+    { value: 0, label: '普通' },
+    { value: 1, label: '中等' },
+    { value: 2, label: '严重' }
+]
+const rules = {
+    algoDescribe: [
+        { required: false, message: '对应算法不能为空', trigger: 'blur' },
+        {
+            pattern: /^\d+$|^\d+[.]?\d+$/,
+            message: '请您数字对应算法',
+            trigger: 'blur'
+        }
+    ],
+    name: [
+        { required: true, message: '名称不能为空', trigger: 'blur' }
+    ],
+    code: [
+        { required: true, message: '编码不能为空', trigger: 'blur' }
+    ],
+    sort: [
+        { required: true, message: '排序不能为空', trigger: 'blur' }
+    ]
+}
+const dialogVisible = ref(false)
+const title = ref('新增')
+const open = (text: string, data: anyObj) => {
+    dialogVisible.value = true
+    if (text === '编辑') {
+        for (let key in form) {
+            form[key] = data[key] === '/' ? '' : data[key]
+        }
+    } else if (text === '新增') {
+        for (let key in form) {
+            form[key] = ''
+        }
+        form.level = 0
+        form.sort = 0
+        form.typeId = data.typeId
+        form.openLevel = data.openLevel
+        form.typeName = data.typeName
+        form.openDescribe = data.openDescribe
+    }
+    title.value = form.typeName + text
+}
+const submit = async () => {
+    await formRef.value.validate()
+    if (form.id) {
+        await dictDataUpdate(form)
+    } else {
+        await dictDataAdd(form)
+    }
+    ElMessage.success('保存成功')
+    tableStore.index()
+    dialogVisible.value = false
+}
+
+defineExpose({ open })
+</script>