diff --git a/web/src/view/superAdmin/menu/menu.vue b/web/src/view/superAdmin/menu/menu.vue index d1a05b3d7d4407a70ace752ddd58ca0d96dee5f9..f102c576850acf02ecacfbfa4adc110dd41e8910 100644 --- a/web/src/view/superAdmin/menu/menu.vue +++ b/web/src/view/superAdmin/menu/menu.vue @@ -36,41 +36,48 @@ - - + + - + - - - + + - + - + - + - + - + @@ -95,191 +102,198 @@ import { addBaseMenu, deleteBaseMenu, getBaseMenuById -} from '@/api/menu' -import infoList from '@/components/mixins/infoList' +} from "@/api/menu"; +import infoList from "@/components/mixins/infoList"; export default { - name: 'Menus', + name: "Menus", mixins: [infoList], data() { return { listApi: getMenuList, dialogFormVisible: false, - dialogTitle:"新增菜单", - menuOption:[ + dialogTitle: "新增菜单", + menuOption: [ { - ID:"0", - title:"根菜单" + ID: "0", + title: "根菜单" } ], form: { ID: 0, - path: '', - name: '', - hidden: '', - parentId: '', - component: '', + path: "", + name: "", + hidden: "", + parentId: "", + component: "", meta: { - title: '', - icon: '', - defaultMenu:false, - keepAlive:false + title: "", + icon: "", + defaultMenu: false, + keepAlive: false } }, rules: { - path: [{ required: true, message: '请输入菜单name', trigger: 'blur' }], + path: [{ required: true, message: "请输入菜单name", trigger: "blur" }], component: [ - { required: true, message: '请输入文件路径', trigger: 'blur' } + { required: true, message: "请输入文件路径", trigger: "blur" } ], - 'meta.title': [ - { required: true, message: '请输入菜单展示名称', trigger: 'blur' } + "meta.title": [ + { required: true, message: "请输入菜单展示名称", trigger: "blur" } ] }, isEdit: false - } + }; }, methods: { - setOptions(){ - this.menuOption = [{ - ID:"0", - title:"根目录" - }] - this.setMenuOptions(this.tableData,this.menuOption,false) - }, - setMenuOptions(menuData,optionsData,disabled){ - menuData&&menuData.map(item=>{ - if(item.children.length){ - const option = { - title:item.meta.title, - ID:String(item.ID), - disabled:disabled||item.ID == this.form.ID, - children:[] + setOptions() { + this.menuOption = [ + { + ID: "0", + title: "根目录" } - this.setMenuOptions(item.children,option.children,disabled||item.ID == this.form.ID) - optionsData.push(option) - }else{ - const option = { - title:item.meta.title, - ID:String(item.ID), - disabled:disabled||item.ID == this.form.ID, + ]; + this.setMenuOptions(this.tableData, this.menuOption, false); + }, + setMenuOptions(menuData, optionsData, disabled) { + menuData && + menuData.map(item => { + if (item.children.length) { + const option = { + title: item.meta.title, + ID: String(item.ID), + disabled: disabled || item.ID == this.form.ID, + children: [] + }; + this.setMenuOptions( + item.children, + option.children, + disabled || item.ID == this.form.ID + ); + optionsData.push(option); + } else { + const option = { + title: item.meta.title, + ID: String(item.ID), + disabled: disabled || item.ID == this.form.ID + }; + optionsData.push(option); } - optionsData.push(option) - } - }) + }); }, handleClose(done) { - this.initForm() - done() + this.initForm(); + done(); }, // 懒加载子菜单 load(tree, treeNode, resolve) { resolve([ { id: 31, - date: '2016-05-01', - name: '王小虎', - address: '上海市普陀区金沙江路 1519 弄' + date: "2016-05-01", + name: "王小虎", + address: "上海市普陀区金沙江路 1519 弄" }, { id: 32, - date: '2016-05-01', - name: '王小虎', - address: '上海市普陀区金沙江路 1519 弄' + date: "2016-05-01", + name: "王小虎", + address: "上海市普陀区金沙江路 1519 弄" } - ]) + ]); }, // 删除菜单 deleteMenu(ID) { - this.$confirm('此操作将永久删除所有角色下该菜单, 是否继续?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' + this.$confirm("此操作将永久删除所有角色下该菜单, 是否继续?", "提示", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning" }) .then(async () => { - const res = await deleteBaseMenu({ ID }) + const res = await deleteBaseMenu({ ID }); if (res.code == 0) { this.$message({ - type: 'success', - message: '删除成功!' - }) - this.getTableData() + type: "success", + message: "删除成功!" + }); + this.getTableData(); } }) .catch(() => { this.$message({ - type: 'info', - message: '已取消删除' - }) - }) + type: "info", + message: "已取消删除" + }); + }); }, // 初始化弹窗内表格方法 initForm() { - this.$refs.menuForm.resetFields() + this.$refs.menuForm.resetFields(); this.form = { ID: 0, - path: '', - name: '', - hidden: '', - parentId: '', - component: '', + path: "", + name: "", + hidden: "", + parentId: "", + component: "", meta: { - title: '', - icon: '', - defaultMenu:false, - keepAlive:"" + title: "", + icon: "", + defaultMenu: false, + keepAlive: "" } - } + }; }, // 关闭弹窗 closeDialog() { - this.initForm() - this.dialogFormVisible = false + this.initForm(); + this.dialogFormVisible = false; }, // 添加menu async enterDialog() { this.$refs.menuForm.validate(async valid => { if (valid) { - let res - this.form.name = this.form.path + let res; + this.form.name = this.form.path; if (this.isEdit) { - res = await updateBaseMenu(this.form) + res = await updateBaseMenu(this.form); } else { - res = await addBaseMenu(this.form) + res = await addBaseMenu(this.form); } if (res.code == 0) { this.$message({ - type: 'success', - message: this.isEdit?'编辑成功':'添加成功!' - }) - this.getTableData() + type: "success", + message: this.isEdit ? "编辑成功" : "添加成功!" + }); + this.getTableData(); } - this.initForm() - this.dialogFormVisible = false + this.initForm(); + this.dialogFormVisible = false; } - }) + }); }, // 添加菜单方法，id为 0则为添加根菜单 addMenu(id) { - this.dialogTitle = "新增菜单" - this.form.parentId = String(id) - this.isEdit = false - this.setOptions() - this.dialogFormVisible = true + this.dialogTitle = "新增菜单"; + this.form.parentId = String(id); + this.isEdit = false; + this.setOptions(); + this.dialogFormVisible = true; }, // 修改菜单方法 async editMenu(id) { - this.dialogTitle = "编辑菜单" - const res = await getBaseMenuById({ id }) - this.form = res.data.menu - this.isEdit = true - this.setOptions() - this.dialogFormVisible = true - }, + this.dialogTitle = "编辑菜单"; + const res = await getBaseMenuById({ id }); + this.form = res.data.menu; + this.isEdit = true; + this.setOptions(); + this.dialogFormVisible = true; + } }, - async created() { - this.pageSize = 999 - await this.getTableData() + async created() { + this.pageSize = 999; + await this.getTableData(); } -} +};