|
|
@@ -3,57 +3,16 @@
|
|
|
<div class="LoginNav">
|
|
|
<div class="logo">
|
|
|
<template v-if="configInfor">
|
|
|
- <img :src="configInfor.logo_image_url" alt="logo" class="logo-image" />
|
|
|
+ <img :src="configInfor.logo_image_url" alt="logo" class="logo-image" @click="handleSelect" />
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<span class="logo-img"> logo </span>
|
|
|
</template>
|
|
|
-
|
|
|
- <el-menu
|
|
|
- :default-active="activeIndex"
|
|
|
- class="el-menu-demo"
|
|
|
- mode="horizontal"
|
|
|
- @select="handleSelect"
|
|
|
- text-color="#000"
|
|
|
- active-text-color="#FF9900"
|
|
|
- >
|
|
|
- <el-menu-item index="1">主页</el-menu-item>
|
|
|
- <el-menu-item index="2">
|
|
|
- <template v-if="projectList.length > 1">
|
|
|
- <el-dropdown trigger="click" @command="handleCommand">
|
|
|
- <span
|
|
|
- class="el-dropdown-link"
|
|
|
- :style="{ color: activeIndex == 2 ? '#FF9900' : '#000' }"
|
|
|
- >
|
|
|
- {{ projectName }}
|
|
|
- <!-- SYSTEM -->
|
|
|
- <i class="el-icon-arrow-down el-icon--right"></i>
|
|
|
- </span>
|
|
|
- <el-dropdown-menu slot="dropdown" style="min-width: 278px">
|
|
|
- <el-dropdown-item
|
|
|
- :class="i == LoginNavIndex ? 'menuActive' : ''"
|
|
|
- :command="i"
|
|
|
- :key="i"
|
|
|
- class="projectList"
|
|
|
- v-for="(item, i) in projectList"
|
|
|
- >
|
|
|
- <img
|
|
|
- style="position: relative; width: 24px"
|
|
|
- :src="item.icon_url_memu_default"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- <span style="margin-left: 16px">
|
|
|
- {{ item.name }}
|
|
|
- </span>
|
|
|
- </el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </el-dropdown>
|
|
|
- </template>
|
|
|
- <template v-else>{{
|
|
|
- projectList.length > 0 && projectList[0].name
|
|
|
- }}</template>
|
|
|
- </el-menu-item>
|
|
|
- </el-menu>
|
|
|
+ <ul class="logo-projectlist">
|
|
|
+ <li v-for="(itemI,indexI) in projectList" :key="indexI" :class="indexI==LoginNavIndex?'active':''" @click="handleCommand(indexI)">
|
|
|
+ {{ itemI.name }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
</div>
|
|
|
<div class="userName">
|
|
|
<template>
|
|
|
@@ -210,11 +169,8 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
// 切换导航
|
|
|
- handleSelect(key, keyPath) {
|
|
|
- this.activeIndex = key;
|
|
|
- if (this.activeIndex == "1") {
|
|
|
- window.location.href = "/";
|
|
|
- }
|
|
|
+ handleSelect() {
|
|
|
+ window.location.href = "/";
|
|
|
},
|
|
|
// 切换项目
|
|
|
handleCommand(command) {
|
|
|
@@ -318,33 +274,29 @@ export default {
|
|
|
font-family: "sourceR";
|
|
|
.logo {
|
|
|
&-image {
|
|
|
- height: 50px;
|
|
|
- }
|
|
|
- &-img {
|
|
|
- font-style: normal;
|
|
|
- font-weight: 600;
|
|
|
- font-size: 30px;
|
|
|
- font-variant: small-caps;
|
|
|
- color: #000000;
|
|
|
- margin-right: 29px;
|
|
|
- line-height: 64px;
|
|
|
+ height: 48px;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- .el-menu-demo {
|
|
|
- background: rgba(0, 0, 0, 0);
|
|
|
- // margin-left: 100px;
|
|
|
- li:hover {
|
|
|
- background: none;
|
|
|
- }
|
|
|
- li {
|
|
|
- font-size: 16px;
|
|
|
- background: none;
|
|
|
- }
|
|
|
- }
|
|
|
- // 取消组件默认的样式
|
|
|
- .el-menu.el-menu--horizontal {
|
|
|
- border-bottom: none;
|
|
|
+ .logo-projectlist{
|
|
|
+ display: flex;
|
|
|
+ padding: 0 24px;
|
|
|
+ height: 64px;
|
|
|
+ li{
|
|
|
+ padding: 0 12px;
|
|
|
+ color: rgba(0, 0, 0, 0.45);
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 64px;
|
|
|
+ cursor: pointer;
|
|
|
+ &:hover{
|
|
|
+ background: #F6F6F6;
|
|
|
+ }
|
|
|
+ &.active{
|
|
|
+ color: #FF9900;
|
|
|
+ background: #FFEFD6;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.userName {
|
natasha