|
@@ -1,8 +1,8 @@
|
|
|
<template>
|
|
|
<div id="containercon">
|
|
|
<el-aside :width="isCollapse ? '70px' : '200px'" v-if="isHaveAside">
|
|
|
- <div id="main_left">
|
|
|
- <div class="logo_cont">
|
|
|
+ <div id="main_left" :style="{width:isCollapse ? '70px' : '200px'}">
|
|
|
+ <div class="logo_cont" :class="{'no-collapse':isCollapse}">
|
|
|
<!-- 正常logo尺寸 -->
|
|
|
<img class="logo" v-if="!isCollapse" :src="logoLarge" />
|
|
|
<!-- 折叠侧边栏logo尺寸 -->
|
|
@@ -24,6 +24,8 @@
|
|
|
unique-opened
|
|
|
router
|
|
|
class="el-menu-vertical-demo"
|
|
|
+ :style="{width:isCollapse ? '70px' : '200px'}"
|
|
|
+ :class="{'no-collapse-menu':isCollapse}"
|
|
|
@select="handleselect"
|
|
|
ref="expandmenu"
|
|
|
>
|
|
@@ -45,20 +47,22 @@
|
|
|
@click="handleClickSubMenuItem(item, $event)"
|
|
|
>
|
|
|
<img
|
|
|
- :src="getMenuIcon(item)"
|
|
|
+ :src="item.path === activePath?getActiveMenuIcon(item):getMenuIcon(item)"
|
|
|
alt=""
|
|
|
- style="width: 24px; height: 24px"
|
|
|
+ style="width: 20px; height: 20px;margin-top: -2px;"
|
|
|
/>
|
|
|
<span class="titleLetter" v-show="isCollapse">{{
|
|
|
isCollapse ? MenuLetterMap[item.name] || "" : ""
|
|
|
}}</span>
|
|
|
<span
|
|
|
+ class="title-text"
|
|
|
style="
|
|
|
display: inline-block;
|
|
|
width: 96px;
|
|
|
text-align: left;
|
|
|
- font-size: 15px;
|
|
|
- margin-left: 20px;
|
|
|
+ font-size: 16px;
|
|
|
+ margin-left: 4px;
|
|
|
+ color:#1D2129
|
|
|
"
|
|
|
>{{
|
|
|
$i18nt.locale === "zh" ? item.name : item.name_en
|
|
@@ -71,18 +75,20 @@
|
|
|
<img
|
|
|
:src="getMenuIcon(item)"
|
|
|
alt=""
|
|
|
- style="width: 24px; height: 24px"
|
|
|
+ style="width: 20px; height: 20px;margin-top: 2px;"
|
|
|
/>
|
|
|
<span class="titleLetter" v-show="isCollapse">{{
|
|
|
isCollapse ? MenuLetterMap[item.name] || "" : ""
|
|
|
}}</span>
|
|
|
<span
|
|
|
+ class="title-text"
|
|
|
style="
|
|
|
display: inline-block;
|
|
|
width: 96px;
|
|
|
text-align: left;
|
|
|
- font-size: 15px;
|
|
|
- margin-left: 20px;
|
|
|
+ font-size: 16px;
|
|
|
+ margin-left: 8px;
|
|
|
+ color:#1D2129
|
|
|
"
|
|
|
>{{
|
|
|
$i18nt.locale === "zh" ? item.name : item.name_en
|
|
@@ -105,7 +111,7 @@
|
|
|
}`"
|
|
|
@click="handleClickSubMenuItem(second, $event)"
|
|
|
>
|
|
|
- <svg
|
|
|
+ <!-- <svg
|
|
|
t="1689672247666"
|
|
|
class="icon"
|
|
|
viewBox="0 0 1024 1024"
|
|
@@ -124,8 +130,8 @@
|
|
|
: '#666'
|
|
|
"
|
|
|
></path>
|
|
|
- </svg>
|
|
|
- <span style="margin-left: 15px"
|
|
|
+ </svg> -->
|
|
|
+ <span class="title-text" style="margin-left: 29px;color:#1D2129;font-size:16px;"
|
|
|
>{{
|
|
|
$i18nt.locale === "zh"
|
|
|
? second.name
|
|
@@ -136,8 +142,8 @@
|
|
|
</el-menu-item>
|
|
|
<el-submenu v-else :index="second.MenuId" :key="second.MenuId">
|
|
|
<template slot="title">
|
|
|
- <span style="margin-left:-20px">
|
|
|
- <svg
|
|
|
+ <span >
|
|
|
+ <!-- <svg
|
|
|
t="1689672247666"
|
|
|
class="icon"
|
|
|
viewBox="0 0 1024 1024"
|
|
@@ -156,8 +162,8 @@
|
|
|
: '#666'
|
|
|
"
|
|
|
></path>
|
|
|
- </svg>
|
|
|
- <span style="margin-left: 10px">{{
|
|
|
+ </svg> -->
|
|
|
+ <span class="title-text" style="margin-left: 29px;font-size:16px;color:#1D2129">{{
|
|
|
$i18nt.locale === "zh"
|
|
|
? second.name
|
|
|
: second.name_en
|
|
@@ -177,12 +183,14 @@
|
|
|
@click="handleClickSubMenuItem(third,$event)"
|
|
|
>
|
|
|
<span
|
|
|
+ class="title-text"
|
|
|
style="
|
|
|
display: inline-block;
|
|
|
width: 96px;
|
|
|
text-align: left;
|
|
|
- font-size: 15px;
|
|
|
- margin-left:40px
|
|
|
+ font-size: 16px;
|
|
|
+ margin-left:40px;
|
|
|
+ color:#1D2129
|
|
|
"
|
|
|
>{{
|
|
|
$i18nt.locale === "zh" ? third.name : third.name_en
|
|
@@ -587,6 +595,7 @@ export default {
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
+ this.activePath=this.$route.path?this.$route.path.split('/')[1]:'home'
|
|
|
//this.isInitialPwd(); //判断是否为初始密码
|
|
|
this.Role = localStorage.getItem("Role") || "";
|
|
|
this.RoleType = localStorage.getItem("RoleType") || "";
|
|
@@ -623,12 +632,31 @@ export default {
|
|
|
['语义分析', require('@/assets/icons/menu/icon06.png')],
|
|
|
['BI看板', require('@/assets/icons/menu/icon07.png')],
|
|
|
['研报管理', require('@/assets/icons/menu/icon08.png')],
|
|
|
+ ['审批管理', require('@/assets/icons/menu/icon12.png')],
|
|
|
['任务管理', require('@/assets/icons/menu/icon09.png')],
|
|
|
['AI问答', require('@/assets/icons/menu/icon11.png')],
|
|
|
['系统设置', require('@/assets/icons/menu/icon10.png')],
|
|
|
])
|
|
|
return iconMap.get(item.name) || require('@/assets/icons/menu/icon01.png')
|
|
|
},
|
|
|
+ // 获取激活状态图片
|
|
|
+ getActiveMenuIcon(item) {
|
|
|
+ const iconMap = new Map([
|
|
|
+ ['首页', require('@/assets/icons/menu/active-icon01.png')],
|
|
|
+ ['数据分析', require('@/assets/icons/menu/active-icon02.png')],
|
|
|
+ ['模型应用', require('@/assets/icons/menu/active-icon03.png')],
|
|
|
+ ['图表工具', require('@/assets/icons/menu/active-icon04.png')],
|
|
|
+ ['知识资源', require('@/assets/icons/menu/active-icon05.png')],
|
|
|
+ ['语义分析', require('@/assets/icons/menu/active-icon06.png')],
|
|
|
+ ['BI看板', require('@/assets/icons/menu/active-icon07.png')],
|
|
|
+ ['研报管理', require('@/assets/icons/menu/active-icon08.png')],
|
|
|
+ ['审批管理', require('@/assets/icons/menu/active-icon12.png')],
|
|
|
+ ['任务管理', require('@/assets/icons/menu/active-icon09.png')],
|
|
|
+ ['AI问答', require('@/assets/icons/menu/active-icon11.png')],
|
|
|
+ ['系统设置', require('@/assets/icons/menu/active-icon10.png')],
|
|
|
+ ])
|
|
|
+ return iconMap.get(item.name) || require('@/assets/icons/menu/active-icon01.png')
|
|
|
+ },
|
|
|
|
|
|
// 跳转数据节点
|
|
|
handleGoSJJD(){
|
|
@@ -1060,6 +1088,7 @@ export default {
|
|
|
overflow: hidden;
|
|
|
display: flex;
|
|
|
.asider-cont {
|
|
|
+ // padding: 12px;
|
|
|
&::-webkit-scrollbar {
|
|
|
width: 0 !important;
|
|
|
}
|
|
@@ -1079,31 +1108,35 @@ export default {
|
|
|
top: 0;
|
|
|
z-index: 99;
|
|
|
.logo_cont {
|
|
|
- height: 60px;
|
|
|
+ height: 56px;
|
|
|
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+ padding-left: 16px;
|
|
|
border-bottom: 1px solid #dcdfe6;
|
|
|
.logo {
|
|
|
width: 148px;
|
|
|
- height: 38px;
|
|
|
+ height: 40px;
|
|
|
display: block;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
.logo_coll {
|
|
|
- width: 45px;
|
|
|
- height: 45px;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
display: block;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
}
|
|
|
+ .no-collapse{
|
|
|
+ justify-content: center;
|
|
|
+ padding-left: 0;
|
|
|
+ }
|
|
|
aside {
|
|
|
text-align: center;
|
|
|
z-index: 10;
|
|
|
margin-left: -1px;
|
|
|
.el-menu {
|
|
|
- width: 200px;
|
|
|
height: 100%;
|
|
|
box-sizing: border-box;
|
|
|
/* background: #323a58 !important; */
|
|
@@ -1129,26 +1162,43 @@ export default {
|
|
|
margin-right: 6px;
|
|
|
}
|
|
|
}
|
|
|
+ .el-menu-item{
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
.el-submenu .el-menu-item {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
font-size: 15px;
|
|
|
padding: 0 0 0 20px !important;
|
|
|
text-align: left;
|
|
|
+ min-width: 176px;
|
|
|
}
|
|
|
.el-menu-item.is-active {
|
|
|
- background: #ecf2fe !important;
|
|
|
+ background: #E3ECFF !important;
|
|
|
+ border-radius: 4px !important;
|
|
|
color: $theme-color !important;
|
|
|
a {
|
|
|
color: $theme-color !important;
|
|
|
}
|
|
|
+ .title-text{
|
|
|
+ color: $theme-color !important;
|
|
|
+ }
|
|
|
}
|
|
|
.el-submenu__title {
|
|
|
//padding-left: 0 !important;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+ .el-submenu__title,.el-submenu .el-menu-item,.el-menu-item{
|
|
|
+ margin-bottom: 4px;
|
|
|
+ padding: 0 12px !important;
|
|
|
}
|
|
|
.el-level-path {
|
|
|
position: relative;
|
|
|
- height: 56px;
|
|
|
+ height: 46px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
.titleLetter {
|
|
@@ -1168,10 +1218,16 @@ export default {
|
|
|
.el-menu--collapse .el-submenu__title {
|
|
|
padding-left: 20px !important;
|
|
|
}
|
|
|
+ .el-menu--collapse {
|
|
|
+ .el-submenu__title,.el-menu-item{
|
|
|
+ padding-left: 25px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.el-submenu__title:hover,
|
|
|
.el-menu-item:hover {
|
|
|
- background: #ecf2fe !important;
|
|
|
+ background: #EFF4FF !important;
|
|
|
+ border-radius: 4px !important;
|
|
|
}
|
|
|
.subItem {
|
|
|
overflow: hidden;
|
|
@@ -1194,7 +1250,8 @@ export default {
|
|
|
// width: 200px;
|
|
|
// min-height: calc(100vh - 80px);
|
|
|
color: #fff;
|
|
|
- padding-bottom: 20px;
|
|
|
+ // padding-bottom: 20px;
|
|
|
+ padding: 12px 12px 20px;
|
|
|
overflow: hidden;
|
|
|
overflow-y: auto;
|
|
|
border-right: none;
|
|
@@ -1203,8 +1260,12 @@ export default {
|
|
|
color: #fdb863 !important;
|
|
|
} */
|
|
|
}
|
|
|
+ .no-collapse-menu{
|
|
|
+ padding: 0 0 20px !important;
|
|
|
+ }
|
|
|
.el-submenu__title > i:nth-of-type(1) {
|
|
|
color: #c0c4cc !important;
|
|
|
+ font-size: 16px;
|
|
|
}
|
|
|
}
|
|
|
.left_section_logo {
|
|
@@ -1219,7 +1280,7 @@ export default {
|
|
|
.main_right_top {
|
|
|
// width: 100%;
|
|
|
background: #fff;
|
|
|
- height: 60px;
|
|
|
+ height: 56px;
|
|
|
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
|
|
|
box-sizing: border-box;
|
|
|
display: flex;
|
|
@@ -1377,7 +1438,7 @@ export default {
|
|
|
//padding-top: 22px;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
- top: 68px; //应该是60px 但为了留出header的box-shadow多移了8px
|
|
|
+ top: 64px; //应该是60px 但为了留出header的box-shadow多移了8px
|
|
|
bottom: 0;
|
|
|
z-index: 100;
|
|
|
/*修改滚动条样式*/
|