| | |
| | | </el-table-column> |
| | | <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | <el-button size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['system:menu:edit']" |
| | | >修改</el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-plus" |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-plus" |
| | | @click="handleAdd(scope.row)" |
| | | v-hasPermi="['system:menu:add']" |
| | | >新增</el-button> |
| | |
| | | <treeselect |
| | | v-model="form.parentId" |
| | | :options="menuOptions" |
| | | :normalizer="normalizer" |
| | | :show-count="true" |
| | | placeholder="选择上级菜单" |
| | | /> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { listMenu, getMenu, treeselect, delMenu, addMenu, updateMenu } from "@/api/system/menu"; |
| | | import { listMenu, getMenu, delMenu, addMenu, updateMenu } from "@/api/system/menu"; |
| | | import Treeselect from "@riophae/vue-treeselect"; |
| | | import "@riophae/vue-treeselect/dist/vue-treeselect.css"; |
| | | import IconSelect from "@/components/IconSelect"; |
| | |
| | | getList() { |
| | | this.loading = true; |
| | | listMenu(this.queryParams).then(response => { |
| | | this.menuList = response.data; |
| | | this.menuList = this.handleTree(response.data, "menuId"); |
| | | this.loading = false; |
| | | }); |
| | | }, |
| | | /** 转换菜单数据结构 */ |
| | | normalizer(node) { |
| | | if (node.children && !node.children.length) { |
| | | delete node.children; |
| | | } |
| | | return { |
| | | id: node.menuId, |
| | | label: node.menuName, |
| | | children: node.children |
| | | }; |
| | | }, |
| | | /** 查询菜单下拉树结构 */ |
| | | getTreeselect() { |
| | | treeselect().then(response => { |
| | | listMenu().then(response => { |
| | | this.menuOptions = []; |
| | | const menu = { id: 0, label: '主类目', children: [] }; |
| | | menu.children = response.data; |
| | | const menu = { menuId: 0, menuName: '主类目', children: [] }; |
| | | menu.children = this.handleTree(response.data, "menuId"); |
| | | this.menuOptions.push(menu); |
| | | }); |
| | | }, |
| | |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | </script> |