121 lines
3.3 KiB
Vue
121 lines
3.3 KiB
Vue
|
<template>
|
||
|
|
<el-dialog
|
||
|
|
v-model="visible"
|
||
|
|
:title="type === 'edit' ? '修改' : '新增'"
|
||
|
|
:before-close="fnClose"
|
||
|
|
>
|
||
|
|
<el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
|
||
|
|
<el-form-item label="上级菜单">
|
||
|
|
<el-tag>{{ parentName }}</el-tag>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="名称" prop="name">
|
||
|
|
<el-input v-model="form.name" placeholder="请输入名称" />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="编码" prop="bianma">
|
||
|
|
<el-input
|
||
|
|
v-model="form.bianma"
|
||
|
|
:disabled="type === 'edit'"
|
||
|
|
placeholder="请输入编码"
|
||
|
|
/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="排序" prop="orderBy">
|
||
|
|
<el-input v-model.number="form.orderBy" placeholder="请输入排序" />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="备注" prop="descr">
|
||
|
|
<el-input
|
||
|
|
v-model="form.descr"
|
||
|
|
:autosize="{ minRows: 1 }"
|
||
|
|
type="textarea"
|
||
|
|
placeholder="请输入备注"
|
||
|
|
/>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
<template #footer>
|
||
|
|
<el-button @click="fnClose">取 消</el-button>
|
||
|
|
<el-button type="primary" @click="fnSubmit">确 定</el-button>
|
||
|
|
</template>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import {
|
||
|
|
getDataDictionaryRepeat,
|
||
|
|
setDataDictionaryAdd,
|
||
|
|
setDataDictionaryEdit,
|
||
|
|
} from "@/request/system_management.js";
|
||
|
|
import { debounce } from "throttle-debounce";
|
||
|
|
import useFormValidate from "@/assets/js/useFormValidate.js";
|
||
|
|
import { ElMessage } from "element-plus";
|
||
|
|
|
||
|
|
const props = defineProps({
|
||
|
|
type: {
|
||
|
|
type: String,
|
||
|
|
required: true,
|
||
|
|
},
|
||
|
|
parentName: {
|
||
|
|
type: String,
|
||
|
|
required: true,
|
||
|
|
},
|
||
|
|
parentId: {
|
||
|
|
type: String,
|
||
|
|
required: true,
|
||
|
|
},
|
||
|
|
});
|
||
|
|
const emits = defineEmits(["getData"]);
|
||
|
|
const visible = defineModel("visible", { type: Boolean, required: true });
|
||
|
|
const form = defineModel("form", { type: Object, required: true });
|
||
|
|
const { formRef, validate } = useFormValidate();
|
||
|
|
const rules = {
|
||
|
|
name: [
|
||
|
|
{ required: true, message: "字典名称不能为空", trigger: "change" },
|
||
|
|
{ min: 2, max: 30, message: "长度在2到30个字符", trigger: "blur" },
|
||
|
|
],
|
||
|
|
bianma: [
|
||
|
|
{ required: true, message: "字典编码名称不能为空", trigger: "change" },
|
||
|
|
{ min: 2, max: 30, message: "长度在2到30个字符", trigger: "blur" },
|
||
|
|
],
|
||
|
|
orderBy: [
|
||
|
|
{ required: true, message: "排序不能为空", trigger: ["change", "blur"] },
|
||
|
|
{
|
||
|
|
type: "number",
|
||
|
|
message: "排序必须为数字",
|
||
|
|
trigger: ["change", "blur"],
|
||
|
|
},
|
||
|
|
],
|
||
|
|
};
|
||
|
|
const fnClose = () => {
|
||
|
|
formRef.value.resetFields();
|
||
|
|
visible.value = false;
|
||
|
|
};
|
||
|
|
const fnSubmit = debounce(
|
||
|
|
1000,
|
||
|
|
async () => {
|
||
|
|
await validate();
|
||
|
|
if (props.type === "add") {
|
||
|
|
const { dictionaries } = await getDataDictionaryRepeat({
|
||
|
|
bianma: form.value.bianma,
|
||
|
|
});
|
||
|
|
if (dictionaries) {
|
||
|
|
ElMessage.error("添加失败，编码重复");
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
await setDataDictionaryAdd({
|
||
|
|
...form.value,
|
||
|
|
parentId: props.parentId,
|
||
|
|
dictionariesId: undefined,
|
||
|
|
});
|
||
|
|
}
|
||
|
|
if (props.type === "edit")
|
||
|
|
await setDataDictionaryEdit({
|
||
|
|
...form.value,
|
||
|
|
});
|
||
|
|
ElMessage.success("操作成功");
|
||
|
|
fnClose();
|
||
|
|
emits("getData");
|
||
|
|
},
|
||
|
|
{ atBegin: true }
|
||
|
|
);
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped></style>
|