角色权限的完善

This commit is contained in:
夕阳微笑1 2024-12-26 19:12:44 +08:00
parent b5bdf3b548
commit 4b04a694e3
5 changed files with 111 additions and 21 deletions

View File

@ -1,3 +1,4 @@
import { baseUrlHost } from '../baseUrlHost';
import request from '/@/utils/request'; import request from '/@/utils/request';
/** /**
@ -12,11 +13,11 @@ import request from '/@/utils/request';
*/ */
export function useMenuApi() { export function useMenuApi() {
return { return {
getAdminMenu: (params?: object) => { getAdminMenu: (id: number) => {
return request({ return request({
url: '/gitee/lyt-top/vue-next-admin-images/raw/master/menu/adminMenu.json', // url: '/gitee/lyt-top/vue-next-admin-images/raw/master/menu/adminMenu.json',
url:baseUrlHost + `/acGrouptype/findByUserMenu/${id}`,
method: 'get', method: 'get',
params,
}); });
}, },
getTestMenu: (params?: object) => { getTestMenu: (params?: object) => {

View File

@ -3,19 +3,23 @@
<el-aside class="layout-aside" :class="setCollapseStyle"> <el-aside class="layout-aside" :class="setCollapseStyle">
<Logo v-if="setShowLogo" /> <Logo v-if="setShowLogo" />
<el-scrollbar class="flex-auto" ref="layoutAsideScrollbarRef" @mouseenter="onAsideEnterLeave(true)" @mouseleave="onAsideEnterLeave(false)"> <el-scrollbar class="flex-auto" ref="layoutAsideScrollbarRef" @mouseenter="onAsideEnterLeave(true)" @mouseleave="onAsideEnterLeave(false)">
<Vertical :menuList="state.menuList" /> <div v-if="isDataReady">
<Vertical :menuList="Menulist" />
</div>
</el-scrollbar> </el-scrollbar>
</el-aside> </el-aside>
</div> </div>
</template> </template>
<script setup lang="ts" name="layoutAside"> <script setup lang="ts" name="layoutAside">
import { defineAsyncComponent, reactive, computed, watch, onBeforeMount, ref } from 'vue'; import { defineAsyncComponent, reactive, computed, watch, onBeforeMount, ref, onMounted } from 'vue';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useRoutesList } from '/@/stores/routesList'; import { useRoutesList } from '/@/stores/routesList';
import { useThemeConfig } from '/@/stores/themeConfig'; import { useThemeConfig } from '/@/stores/themeConfig';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes'; import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
import mittBus from '/@/utils/mitt'; import mittBus from '/@/utils/mitt';
import {useMenuApi} from '/@/api/menu'
// //
const Logo = defineAsyncComponent(() => import('/@/layout/logo/index.vue')); const Logo = defineAsyncComponent(() => import('/@/layout/logo/index.vue'));
@ -34,6 +38,10 @@ const state = reactive<AsideState>({
clientWidth: 0, clientWidth: 0,
}); });
const useMenuapi = useMenuApi();
const isDataReady = ref(false)
// / // /
const setCollapseStyle = computed(() => { const setCollapseStyle = computed(() => {
const { layout, isCollapse, menuBar } = themeConfig.value; const { layout, isCollapse, menuBar } = themeConfig.value;
@ -87,6 +95,23 @@ const setFilterRoutes = () => {
if (themeConfig.value.layout === 'columns') return false; if (themeConfig.value.layout === 'columns') return false;
state.menuList = filterRoutesFun(routesList.value); state.menuList = filterRoutesFun(routesList.value);
}; };
let Menulist = ref([]);
// const defaultOpeneds =reactive([])
const getmenulist = async() =>{
try{
const res = await useMenuapi.getAdminMenu(1);
// console.log('',res);
Menulist.value = res.data;
isDataReady.value = true
// for(let i = 0; i < Menulist.value.length; i++){
// defaultOpeneds.push(i + '')
// }
}catch(error){
console.error(error)
}
};
// //
const filterRoutesFun = <T extends RouteItem>(arr: T[]): T[] => { const filterRoutesFun = <T extends RouteItem>(arr: T[]): T[] => {
return arr return arr
@ -97,6 +122,7 @@ const filterRoutesFun = <T extends RouteItem>(arr: T[]): T[] => {
return item; return item;
}); });
}; };
// //
const initMenuFixed = (clientWidth: number) => { const initMenuFixed = (clientWidth: number) => {
state.clientWidth = clientWidth; state.clientWidth = clientWidth;
@ -113,6 +139,7 @@ const onAsideEnterLeave = (bool: Boolean) => {
onBeforeMount(() => { onBeforeMount(() => {
initMenuFixed(document.body.clientWidth); initMenuFixed(document.body.clientWidth);
setFilterRoutes(); setFilterRoutes();
// await getmenulist();
// (mittBus.off('setSendColumnsChildren)) // (mittBus.off('setSendColumnsChildren))
// 使 // 使
mittBus.on('setSendColumnsChildren', (res: MittMenu) => { mittBus.on('setSendColumnsChildren', (res: MittMenu) => {
@ -138,6 +165,11 @@ onBeforeMount(() => {
closeLayoutAsideMobileMode(); closeLayoutAsideMobileMode();
}); });
}); });
onMounted(async() =>{
await getmenulist();
})
// themeConfig el-scrollbar // themeConfig el-scrollbar
watch( watch(
() => [themeConfig.value.isShowLogoChange, themeConfig.value.isShowLogo, themeConfig.value.layout, themeConfig.value.isClassicSplitMenu], () => [themeConfig.value.isShowLogoChange, themeConfig.value.isShowLogo, themeConfig.value.layout, themeConfig.value.isClassicSplitMenu],

View File

@ -6,8 +6,9 @@
:collapse="state.isCollapse" :collapse="state.isCollapse"
:unique-opened="getThemeConfig.isUniqueOpened" :unique-opened="getThemeConfig.isUniqueOpened"
:collapse-transition="false" :collapse-transition="false"
:default-openeds="defaultOpeneds"
> >
<template v-for="val in menuLists"> <!-- <template v-for="val in menuLists">
<el-sub-menu :index="val.path" v-if="val.children && val.children.length > 0" :key="val.path"> <el-sub-menu :index="val.path" v-if="val.children && val.children.length > 0" :key="val.path">
<template #title> <template #title>
<SvgIcon :name="val.meta.icon" /> <SvgIcon :name="val.meta.icon" />
@ -26,16 +27,31 @@
</template> </template>
</el-menu-item> </el-menu-item>
</template> </template>
</template> </template> -->
<el-sub-menu :index="index.toString()" v-for="(item,index) in menuLists" :key="index" >
<template #title>
<span>{{ item.modulename }}</span>
</template>
<el-menu-item-group>
<font-awesome-icon :icon="['fas',item.actions[0].icon]" size="lg" class="edtIcon" />
<el-menu-item :index="item1.link" v-for="(item1, index1) in item.actions" :key="index1">
<SvgIcon :name="item1.icon" />
{{ item1.actionname }}
</el-menu-item>
</el-menu-item-group>
</el-sub-menu>
</el-menu> </el-menu>
</template> </template>
<script setup lang="ts" name="navMenuVertical"> <script setup lang="ts" name="navMenuVertical">
import { defineAsyncComponent, reactive, computed, onMounted, watch } from 'vue'; import { defineAsyncComponent, reactive, computed, onMounted, watch,ref ,onBeforeMount} from 'vue';
import { useRoute, onBeforeRouteUpdate, RouteRecordRaw } from 'vue-router'; import { useRoute, onBeforeRouteUpdate, RouteRecordRaw } from 'vue-router';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig'; import { useThemeConfig } from '/@/stores/themeConfig';
import other from '/@/utils/other'; import other from '/@/utils/other';
import {useMenuApi} from '/@/api/menu'
// //
const SubItem = defineAsyncComponent(() => import('/@/layout/navMenu/subItem.vue')); const SubItem = defineAsyncComponent(() => import('/@/layout/navMenu/subItem.vue'));
@ -61,12 +77,25 @@ const state = reactive({
// //
const menuLists = computed(() => { const menuLists = computed(() => {
return <RouteItems>props.menuList; return props.menuList || [];
}); });
// //
const getThemeConfig = computed(() => { const getThemeConfig = computed(() => {
return themeConfig.value; return themeConfig.value;
}); });
//
// const defaultOpeneds = computed(() => {
// if (menuLists.value.length === 0) {
// console.log(111111111111);
// return []; //
// }
// console.log(22222222222);
// return menuLists.value.map((_, index) => index.toString());
// });
const defaultOpeneds = ref<string[]>([]);
// //
const setParentHighlight = (currentRoute: RouteToFrom) => { const setParentHighlight = (currentRoute: RouteToFrom) => {
const { path, meta } = currentRoute; const { path, meta } = currentRoute;
@ -78,9 +107,18 @@ const setParentHighlight = (currentRoute: RouteToFrom) => {
const onALinkClick = (val: RouteItem) => { const onALinkClick = (val: RouteItem) => {
other.handleOpenLink(val); other.handleOpenLink(val);
}; };
// //
onMounted(() => { onMounted(() => {
state.defaultActive = setParentHighlight(route); state.defaultActive = setParentHighlight(route);
//
// const storedOpeneds = localStorage.getItem('defaultOpeneds');
// if (storedOpeneds) {
// console.log('Loaded from localStorage:', JSON.parse(storedOpeneds));
// } else {
// //
// localStorage.setItem('defaultOpeneds', JSON.stringify(defaultOpeneds.value));
// }
}); });
// //
onBeforeRouteUpdate((to) => { onBeforeRouteUpdate((to) => {
@ -99,4 +137,21 @@ watch(
immediate: true, immediate: true,
} }
); );
// // localStorage
// // localStorage
// watch(defaultOpeneds, (newVal) => {
// localStorage.setItem('defaultOpeneds', JSON.stringify(newVal));
// });
// props defaultOpeneds
watch(
() => props.menuList,
(newMenuList) => {
defaultOpeneds.value = newMenuList.map((_, index) => index.toString());
},
{
immediate: true,
deep: true,
}
);
</script> </script>

View File

@ -106,7 +106,8 @@ const onSignIn = async () => {
// token // token
Session.set('token', res.data.token); Session.set('token', res.data.token);
// usertype // usertype
Cookies.set('userName', res.data.user.usertype === 1 ? 'admin' : 'user'); // Cookies.set('userName', res.data.user.usertype === 1 ? 'admin' : 'user');
Cookies.set('userName', 'admin');
if (!themeConfig.value.isRequestRoutes) { if (!themeConfig.value.isRequestRoutes) {
// 2 // 2
const isNoPower = await initFrontEndControlRoutes(); const isNoPower = await initFrontEndControlRoutes();
@ -116,7 +117,13 @@ const onSignIn = async () => {
// router No match found for location with path "/" // router No match found for location with path "/"
const isNoPower = await initBackEndControlRoutes(); const isNoPower = await initBackEndControlRoutes();
// initBackEndControlRoutes signInSuccess // initBackEndControlRoutes signInSuccess
signInSuccess(isNoPower); // signInSuccess(isNoPower);
if (isNoPower) {
//
signInSuccess(false); // signInSuccess
} else {
throw new Error('权限不足或路由加载失败');
}
} }
}else{ }else{
ElMessage.error(res.errorMsg||res.message); ElMessage.error(res.errorMsg||res.message);

View File

@ -197,10 +197,6 @@ const onSubmit = async() => {
if(valid){ if(valid){
state.ruleForm.show = state.ruleForm.show ? 1 : 0; state.ruleForm.show = state.ruleForm.show ? 1 : 0;
state.ruleForm.grouptypeid = 1; state.ruleForm.grouptypeid = 1;
let body = {
actions:tree.value.getCheckedKeys(true, false),
groupid:state.ruleForm.id
}
if (state.dialog.type === 'add') { if (state.dialog.type === 'add') {
try{ try{
const param = { const param = {
@ -209,12 +205,7 @@ const onSubmit = async() => {
} }
const res = await roleapi.addRole(param); const res = await roleapi.addRole(param);
if (res?.success) { if (res?.success) {
try{
const data = await roleactionapi.setUprolePermission(body)
console.log(5555555,data);
}catch(error){
console.error(error)
}
emit('reset'); emit('reset');
closeDialog(); closeDialog();
ElMessage.success('角色新建成功!'); ElMessage.success('角色新建成功!');
@ -234,6 +225,10 @@ const onSubmit = async() => {
ElMessage.error('角色新建失败!') ElMessage.error('角色新建失败!')
} }
} else { } else {
let body = {
actions:tree.value.getCheckedKeys(true, false),
groupid:state.ruleForm.id
}
try{ try{
const res = await roleapi.updateRole(state.ruleForm); const res = await roleapi.updateRole(state.ruleForm);
if(res?.success){ if(res?.success){