mirror of
https://github.com/crmeb/CRMEB.git
synced 2026-10-31 23:10:45 +00:00
improve: 后台菜单
This commit is contained in:
parent
edaf7526d7
commit
6daab83907
@ -30,7 +30,7 @@
|
||||
:key="`drop-${child.path}`"
|
||||
></collapsed-menu>
|
||||
<DropdownItem v-else :key="`drop-${child.path}`" :name="child.path"
|
||||
><common-icon :type="child.icon" /><span class="menu-title">{{ child.title }}1</span></DropdownItem
|
||||
><common-icon :type="child.icon" /><span class="menu-title">{{ child.title }}</span></DropdownItem
|
||||
>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
@ -36,7 +36,7 @@
|
||||
}
|
||||
}
|
||||
.ivu-select-dropdown{
|
||||
left: 95px !important;
|
||||
// left: 95px !important;
|
||||
}
|
||||
.menu-title {
|
||||
// padding-left: 6px;
|
||||
|
||||
@ -146,29 +146,108 @@ export default {
|
||||
catName: '',
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState('menus', ['openMenus']),
|
||||
textColor() {
|
||||
return this.theme === 'dark' ? '#fff' : '#495060';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
activeName(name) {
|
||||
if (this.accordion) this.openedNames = this.getOpenedNamesByActiveName();
|
||||
else this.openedNames = getUnion(this.openedNames, this.getOpenedNamesByActiveName());
|
||||
// this.handleSelect(this.activeName);
|
||||
},
|
||||
openNames(newNames) {
|
||||
this.openedNames = newNames;
|
||||
},
|
||||
openedNames() {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.menu.updateOpened();
|
||||
});
|
||||
},
|
||||
$route(newRoute) {},
|
||||
$route: {
|
||||
handler(newRoute) {
|
||||
console.log(newRoute, 'newRoutenewRoute');
|
||||
this.activePath = newRoute.path;
|
||||
// this.activeMenuPath = newRoute.matched[0].path;
|
||||
this.handleUpdateMenuState();
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.menuList);
|
||||
this.openedNames = getUnion(this.openedNames, this.getOpenedNamesByActiveName());
|
||||
if (sessionStorage.getItem('menuActive')) {
|
||||
this.activeMenuPath = sessionStorage.getItem('menuActive');
|
||||
this.catName = sessionStorage.getItem('menuActiveTitle');
|
||||
this.getChildrenList(sessionStorage.getItem('menuActive'));
|
||||
} else {
|
||||
console.log(this.openedNames);
|
||||
this.handleSelect(this.openedNames[0]);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getChildrenList(path) {
|
||||
this.menuList.map((e) => {
|
||||
if (e.path === path) {
|
||||
console.log(e, 'eeee');
|
||||
this.childList = e.children || [];
|
||||
}
|
||||
});
|
||||
},
|
||||
handleSelect(name, type) {
|
||||
if (!type) {
|
||||
this.$emit('on-select', name);
|
||||
}
|
||||
this.childOptions = [];
|
||||
this.menuList.map((e) => {
|
||||
if (e.path === name) {
|
||||
console.log(e, 'eeee');
|
||||
if (e.children) {
|
||||
if (e.children && e.children.length) {
|
||||
console.log(e.children, 'e.children');
|
||||
this.jump(e.children);
|
||||
this.catName = e.title;
|
||||
this.activeMenuPath = e.path;
|
||||
console.log('1');
|
||||
// this.activeMenuPath = e.path;
|
||||
this.childList = e.children || [];
|
||||
this.activeChildName = e.children[0].path;
|
||||
this.childOptions = [e.children[0].path];
|
||||
sessionStorage.setItem('menuActive', e.path);
|
||||
sessionStorage.setItem('menuActiveTitle', e.title);
|
||||
this.activeMenuPath = e.path;
|
||||
// this.activeChildName = e.children[0].path;
|
||||
// this.childOptions = [e.children[0].path];
|
||||
this.$store.commit('menus/childMenuList', this.childList);
|
||||
// if (!type) {
|
||||
// this.$emit('on-select', e.children[0].path);
|
||||
// }
|
||||
} else {
|
||||
console.log('2');
|
||||
|
||||
if (!type) {
|
||||
this.$emit('on-select', name);
|
||||
}
|
||||
this.activeMenuPath = e.path;
|
||||
|
||||
this.childList = [];
|
||||
this.$store.commit('menus/childMenuList', []);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
jump(data) {
|
||||
if (data[0].children && data[0].children.length) {
|
||||
console.log('3');
|
||||
this.jump(data[0].children);
|
||||
} else {
|
||||
console.log('4');
|
||||
|
||||
this.catName = data[0].title;
|
||||
// this.activeMenuPath = data[0].path;
|
||||
this.activeChildName = data[0].path;
|
||||
this.childOptions = [data[0].path];
|
||||
this.$store.commit('menus/childMenuList', this.childList);
|
||||
this.$emit('on-select', data[0].path);
|
||||
}
|
||||
},
|
||||
handleChildSelect(name) {
|
||||
this.turnToPage(name);
|
||||
},
|
||||
@ -212,43 +291,6 @@ export default {
|
||||
});
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState('menus', ['openMenus']),
|
||||
textColor() {
|
||||
return this.theme === 'dark' ? '#fff' : '#495060';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
activeName(name) {
|
||||
if (this.accordion) this.openedNames = this.getOpenedNamesByActiveName();
|
||||
else this.openedNames = getUnion(this.openedNames, this.getOpenedNamesByActiveName());
|
||||
// this.handleSelect(this.activeName);
|
||||
},
|
||||
openNames(newNames) {
|
||||
this.openedNames = newNames;
|
||||
},
|
||||
openedNames() {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.menu.updateOpened();
|
||||
});
|
||||
},
|
||||
$route(newRoute) {},
|
||||
$route: {
|
||||
handler(newRoute) {
|
||||
console.log(newRoute, 'newRoutenewRoute');
|
||||
this.activePath = newRoute.path;
|
||||
this.activeMenuPath = newRoute.matched[0].path;
|
||||
this.handleUpdateMenuState();
|
||||
console.log(activeMenuPath, 'activeMenuPath');
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.openedNames = getUnion(this.openedNames, this.getOpenedNamesByActiveName());
|
||||
this.handleSelect(this.openedNames[0], 'one');
|
||||
this.activeMenuPath = this.openedNames[0];
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="less">
|
||||
@ -345,6 +387,7 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.title {
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
}
|
||||
}
|
||||
@ -355,11 +398,12 @@ export default {
|
||||
.child-menu {
|
||||
z-index: 88;
|
||||
.ivu-menu-vertical .ivu-menu-item {
|
||||
padding: 12px 10px;
|
||||
padding: 13px 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.title {
|
||||
line-height: 14px;
|
||||
font-size: 13px;
|
||||
line-height: 13px;
|
||||
}
|
||||
}
|
||||
.ivu-menu-submenu {
|
||||
@ -373,11 +417,12 @@ export default {
|
||||
}
|
||||
}
|
||||
.ivu-menu-vertical .ivu-menu-submenu-title {
|
||||
font-size: 13px;
|
||||
padding: 12px 10px;
|
||||
line-height: 16px;
|
||||
}
|
||||
.cat-name {
|
||||
font-size: 16px;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
|
||||
@ -62,11 +62,12 @@ export default {
|
||||
AccountLogout()
|
||||
.then((res) => {
|
||||
that.$Message.success('您已成功退出');
|
||||
that.$router.replace({name:'login'});
|
||||
that.$router.replace({ name: 'login' });
|
||||
localStorage.clear();
|
||||
removeCookies('token');
|
||||
removeCookies('expires_time');
|
||||
removeCookies('uuid');
|
||||
sessionStorage.clear();
|
||||
// window.location.reload()
|
||||
})
|
||||
.catch((res) => {});
|
||||
@ -74,10 +75,10 @@ export default {
|
||||
});
|
||||
},
|
||||
userCenter() {
|
||||
this.$router.push({name:'systemUser'});
|
||||
this.$router.push({ name: 'systemUser' });
|
||||
},
|
||||
fileEdit() {
|
||||
this.$router.push({name:'systemFiles'});
|
||||
this.$router.push({ name: 'systemFiles' });
|
||||
},
|
||||
message() {
|
||||
this.$router.push({
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
background: #f0f0f0;
|
||||
}
|
||||
.content-wrapper {
|
||||
padding: 16px;
|
||||
margin: 0 16px;
|
||||
height: ~'calc(100% - 80px)';
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@ -42,10 +42,10 @@
|
||||
</Sider>
|
||||
<Content class="main-content-con">
|
||||
<Layout class="main-layout-con">
|
||||
<div class="tag-nav-wrapper" v-if="!headMenuNoShow">
|
||||
<tags-nav :value="$route" @input="handleClick" :list="tagNavList" @on-close="handleCloseTag" />
|
||||
</div>
|
||||
<Content class="content-wrapper">
|
||||
<div class="tag-nav-wrapper" v-if="!headMenuNoShow">
|
||||
<tags-nav :value="$route" @input="handleClick" :list="tagNavList" @on-close="handleCloseTag" />
|
||||
</div>
|
||||
<!-- <keep-alive :include="cacheList">
|
||||
<router-view v-if="reload" style="min-height: 600px" />
|
||||
</keep-alive> -->
|
||||
@ -104,7 +104,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
collapsed: JSON.parse(getCookies('collapsed') || 'false'),
|
||||
collapsed: JSON.parse(getCookies('collapsed') || 'true'),
|
||||
minLogo,
|
||||
maxLogo,
|
||||
isFullscreen: false,
|
||||
|
||||
@ -19,7 +19,7 @@ export default {
|
||||
name: 'marketing',
|
||||
header: 'marketing',
|
||||
redirect: {
|
||||
name: `${pre}storeCoupon`,
|
||||
name: `${pre}storeCouponIssue`,
|
||||
},
|
||||
component: BasicLayout,
|
||||
children: [
|
||||
|
||||
@ -186,6 +186,7 @@ body {
|
||||
|
||||
.ivu-layout-content {
|
||||
overflow-x: hidden !important;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.page {
|
||||
@ -682,7 +683,7 @@ body {
|
||||
/* form-create tips 样式 */
|
||||
.tips-info {
|
||||
line-height: 18px;
|
||||
margin-top: 8px;
|
||||
margin-top: 3px;
|
||||
color: rgb(153, 153, 153);
|
||||
}
|
||||
.pt10{
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user