From 93caadaadb5472f4c368528f7f777d973bc55719 Mon Sep 17 00:00:00 2001
From: RuoYi <yzz_ivy@163.com>
Date: 星期日, 06 三月 2022 09:00:47 +0800
Subject: [PATCH] 开启TopNav没有子菜单情况隐藏侧边栏
---
src/assets/styles/sidebar.scss | 4 ++
src/layout/index.vue | 4 +-
src/components/TopNav/index.vue | 39 +++++++++----------
src/store/modules/permission.js | 7 ---
src/views/monitor/job/log.vue | 2
src/store/modules/app.js | 9 ++++
src/layout/components/Settings/index.vue | 1
7 files changed, 35 insertions(+), 31 deletions(-)
diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss
index bced48f..96578a3 100644
--- a/src/assets/styles/sidebar.scss
+++ b/src/assets/styles/sidebar.scss
@@ -7,6 +7,10 @@
position: relative;
}
+ .sidebarHide {
+ margin-left: 0!important;
+ }
+
.sidebar-container {
-webkit-transition: width .28s;
transition: width 0.28s;
diff --git a/src/components/TopNav/index.vue b/src/components/TopNav/index.vue
index aa139d4..344f658 100644
--- a/src/components/TopNav/index.vue
+++ b/src/components/TopNav/index.vue
@@ -40,6 +40,7 @@
const store = useStore();
const route = useRoute();
+const router = useRouter();
// 涓婚棰滆壊
const theme = computed(() => store.state.settings.theme);
@@ -69,7 +70,7 @@
for (let item in router.children) {
if (router.children[item].parentPath === undefined) {
if(router.path === "/") {
- router.children[item].path = "/redirect/" + router.children[item].path;
+ router.children[item].path = "/" + router.children[item].path;
} else {
if(!isHttp(router.children[item].path)) {
router.children[item].path = router.path + "/" + router.children[item].path;
@@ -86,52 +87,48 @@
// 榛樿婵�娲荤殑鑿滃崟
const activeMenu = computed(() => {
const path = route.path;
- let activePath = defaultRouter.value;
+ let activePath = path;
if (path !== undefined && path.lastIndexOf("/") > 0) {
const tmpPath = path.substring(1, path.length);
activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/"));
+ store.dispatch('app/toggleSideBarHide', false);
} else if ("/index" == path || "" == path) {
if (!isFrist.value) {
isFrist.value = true;
} else {
activePath = "index";
}
+ store.dispatch('app/toggleSideBarHide', true);
+ } else if(!route.children) {
+ activePath = path;
+ store.dispatch('app/toggleSideBarHide', true);
}
- let routes = activeRoutes(activePath);
- if (routes.length === 0) {
- activePath = currentIndex.value || defaultRouter.value
- activeRoutes(activePath);
- }
+ activeRoutes(activePath);
return activePath;
})
-// 榛樿婵�娲荤殑璺敱
-const defaultRouter = computed(() => {
- let router;
- Object.keys(routers.value).some((key) => {
- if (!routers.value[key].hidden) {
- router = routers.value[key].path;
- return true;
- }
- });
- return router;
-})
+
function setVisibleNumber() {
const width = document.body.getBoundingClientRect().width / 3;
visibleNumber.value = parseInt(width / 85);
}
+
function handleSelect(key, keyPath) {
currentIndex.value = key;
+ const route = routers.value.find(item => item.path === key);
if (isHttp(key)) {
// http(s):// 璺緞鏂扮獥鍙ｆ墦寮�
window.open(key, "_blank");
- } else if (key.indexOf("/redirect") !== -1) {
- // /redirect 璺緞鍐呴儴鎵撳紑
- router.push({ path: key.replace("/redirect", "") });
+ } else if (!route || !route.children) {
+ // 娌℃湁瀛愯矾鐢辫矾寰勫唴閮ㄦ墦寮�
+ router.push({ path: key });
+ store.dispatch('app/toggleSideBarHide', true);
} else {
// 鏄剧ず宸︿晶鑱斿姩鑿滃崟
activeRoutes(key);
+ store.dispatch('app/toggleSideBarHide', false);
}
}
+
function activeRoutes(key) {
let routes = [];
if (childrenMenus.value && childrenMenus.value.length > 0) {
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index a8c5132..d74045a 100644
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -102,6 +102,7 @@
value: val
})
if (!val) {
+ store.dispatch('app/toggleSideBarHide', false);
store.commit("SET_SIDEBAR_ROUTERS", store.state.permission.defaultRoutes);
}
}
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 50fda30..c44e3fb 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,8 +1,8 @@
<template>
<div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }">
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
- <sidebar class="sidebar-container" />
- <div :class="{ hasTagsView: needTagsView }" class="main-container">
+ <sidebar v-if="!sidebar.hide" class="sidebar-container" />
+ <div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
<div :class="{ 'fixed-header': fixedHeader }">
<navbar @setLayout="setLayout" />
<tags-view v-if="needTagsView" />
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
index 38218c1..4bed8ba 100644
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -3,7 +3,8 @@
const state = {
sidebar: {
opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
- withoutAnimation: false
+ withoutAnimation: false,
+ hide: false
},
device: 'desktop',
size: Cookies.get('size') || 'default'
@@ -30,6 +31,9 @@
SET_SIZE: (state, size) => {
state.size = size
Cookies.set('size', size)
+ },
+ SET_SIDEBAR_HIDE: (state, status) => {
+ state.sidebar.hide = status
}
}
@@ -45,6 +49,9 @@
},
setSize({ commit }, size) {
commit('SET_SIZE', size)
+ },
+ toggleSideBarHide({ commit }, status) {
+ commit('SET_SIDEBAR_HIDE', status)
}
}
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index ce2314a..1b58c6f 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -24,12 +24,7 @@
state.defaultRoutes = constantRoutes.concat(routes)
},
SET_TOPBAR_ROUTES: (state, routes) => {
- // 椤堕儴瀵艰埅鑿滃崟榛樿娣诲姞缁熻鎶ヨ〃鏍忔寚鍚戦椤�
- const index = [{
- path: 'index',
- meta: { title: '缁熻鎶ヨ〃', icon: 'dashboard' }
- }]
- state.topbarRouters = routes.concat(index);
+ state.topbarRouters = routes
},
SET_SIDEBAR_ROUTERS: (state, routes) => {
state.sidebarRouters = routes
diff --git a/src/views/monitor/job/log.vue b/src/views/monitor/job/log.vue
index d057f1f..f59153b 100644
--- a/src/views/monitor/job/log.vue
+++ b/src/views/monitor/job/log.vue
@@ -13,7 +13,7 @@
<el-form-item label="浠诲姟缁勫悕" prop="jobGroup">
<el-select
v-model="queryParams.jobGroup"
- placeholder="璇蜂换鍔＄粍鍚�"
+ placeholder="璇烽�夋嫨浠诲姟缁勫悕"
clearable
style="width: 240px"
>
--
Gitblit v1.9.3