菜单调整

This commit is contained in:
Mrtangl 2022-05-31 16:06:08 +08:00
parent f0f4454a05
commit e4e040eb23
6 changed files with 73 additions and 25 deletions

View File

@ -0,0 +1,9 @@
<template>
<div>部门管理edit</div>
</template>
<script>
export default {}
</script>
<style></style>

View File

@ -0,0 +1,9 @@
<template>
<div>部门管理</div>
</template>
<script>
export default {}
</script>
<style></style>

View File

@ -0,0 +1,9 @@
<template>
<div>岗位管理edit</div>
</template>
<script>
export default {}
</script>
<style></style>

View File

@ -0,0 +1,9 @@
<template>
<div>岗位管理</div>
</template>
<script>
export default {}
</script>
<style></style>

View File

@ -52,24 +52,8 @@
</el-form-item>
<div v-if="(formData.menuType == menuDataType.BUTTON) == ''">
<!-- <el-form-item label="请选择图标">
<el-input
v-model="formData.menuIcon"
show-word-limit
placeholder="请输入图标"
></el-input>
</el-form-item> -->
<el-form-item label="请选择图标">
<div class="flex">
<!-- <el-input readonly>
<template #prefix>
<el-icon class="el-input__icon">
<search class="f-s-20" />
</el-icon>
</template>
</el-input> -->
<select-icon v-model:icon="formData.menuIcon"></select-icon>
</div>
</el-form-item>
@ -184,7 +168,7 @@ import { useAdmin } from '@/core/hooks/app'
import { onMounted, reactive, ref } from 'vue'
import FooterBtns from '@/components/footer-btns/index.vue'
import type { ElForm, ElMessage } from 'element-plus'
import { apiConfigGetMenu, apiMenuDetail, apiMenuAdd, apiMenuEdit, apiMenuDelete } from '@/api/auth'
import { apiConfigGetMenu, apiMenuDetail, apiMenuAdd, apiMenuEdit } from '@/api/auth'
import SelectIcon from './select-icon/index.vue'
const menuDataType = {

View File

@ -1,19 +1,24 @@
<template>
<div class="menu">
<el-card shadow="never">
<router-link to="/permission/menu/edit">
<el-button v-perm="['system:menu:add']" type="primary" size="small"
>添加菜单</el-button
>
<router-link to="/permission/menu/edit" class="m-r-15">
<el-button v-perm="['system:menu:add']" type="primary" size="small">
添加菜单
</el-button>
</router-link>
<el-button size="small" @click="toggleRowExpansion(openFlag.openFlagValue)">
全部展开/折叠
</el-button>
<el-table
:data="menuTableData"
class="m-t-24"
row-key="id"
default-expand-all
:tree-props="{ children: 'children' }"
:default-expand-all="openFlag.openFlagValue"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
size="mini"
ref="dataTreeList"
>
<el-table-column prop="menuName" label="名称" width="180"> </el-table-column>
<el-table-column prop="menuType" label="菜单类型">
@ -71,7 +76,8 @@
import Popup from '@/components/popup/index.vue'
import { usePages } from '@/core/hooks/pages'
import { onMounted, reactive, ref } from 'vue'
import { apiConfigGetMenu, apiMenuDetail, apiMenuAdd, apiMenuEdit, apiMenuDelete } from '@/api/auth'
import { apiConfigGetMenu, apiMenuDelete } from '@/api/auth'
import type { ElForm } from 'element-plus'
const menuDataType = {
CATALOG: 'M', //
@ -79,7 +85,7 @@ const menuDataType = {
BUTTON: 'A' //
}
const menuTableData = ref([])
const menuTableData = ref<any>([])
//
const getMenuTableData = () => {
@ -94,6 +100,28 @@ const handleDelete = async (id: number) => {
getMenuTableData()
}
const dataTreeList = ref<any>()
//
const openFlag = {
openFlagValue: true
}
//
const toggleRowExpansion = (isExpansion: any) => {
openFlag.openFlagValue = !isExpansion
toggleRowExpansion_forAll(menuTableData.value, openFlag.openFlagValue)
}
const toggleRowExpansion_forAll = (data: any, isExpansion: any) => {
data.forEach((item: any) => {
dataTreeList.value.toggleRowExpansion(item, isExpansion)
if (item.children != undefined && item.children != null) {
toggleRowExpansion_forAll(item.children, isExpansion)
}
})
}
onMounted(() => {
getMenuTableData()
})