mirror of
https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
synced 2024-12-02 12:09:13 +08:00
添加Header菜单修改样式
This commit is contained in:
shiziyuan9527
parent
681db17d4c
commit
c2af2179b0
@ -1,8 +1,15 @@
|
||||
<template>
|
||||
<el-col v-if="auth">
|
||||
<el-row id="header-top" type="flex" justify="space-between" align="middle">
|
||||
<a class="logo"/>
|
||||
<ms-user/>
|
||||
<el-col :span="4">
|
||||
<a class="logo"/>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<ms-top-menus/>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<ms-user/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row id="header-bottom" type="flex" justify="space-between" align="middle">
|
||||
<el-col :span="10">
|
||||
@ -26,6 +33,7 @@
|
||||
|
||||
<script>
|
||||
import MsMenus from "./components/HeaderMenus";
|
||||
import MsTopMenus from "./components/HeaderTopMenus";
|
||||
import MsSetting from "./components/HeaderSetting";
|
||||
import MsView from "./components/router/View";
|
||||
import MsUser from "./components/HeaderUser";
|
||||
@ -49,7 +57,7 @@
|
||||
window.location.href = "/login"
|
||||
});
|
||||
},
|
||||
components: {MsWebSocket, MsUser, MsMenus, MsSetting, MsView},
|
||||
components: {MsWebSocket, MsUser, MsMenus, MsSetting, MsView, MsTopMenus},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
|
||||
39
frontend/src/performance/components/HeaderTopMenus.vue
Normal file
39
frontend/src/performance/components/HeaderTopMenus.vue
Normal file
@ -0,0 +1,39 @@
|
||||
<template>
|
||||
<el-menu mode="horizontal" menu-trigger="click"
|
||||
background-color="rgb(44, 42, 72)"
|
||||
class="header-top-menus"
|
||||
text-color="#F2F2F2"
|
||||
active-text-color="#fff"
|
||||
:default-active="$route.path"
|
||||
router>
|
||||
<el-menu-item index="1">功能测试</el-menu-item>
|
||||
<el-menu-item index="/createTest" onselectstart="return false">性能测试</el-menu-item>
|
||||
<el-menu-item index="/setting" onselectstart="return false">系统设置</el-menu-item>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "MsTopMenus"
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.header-top-menus.el-menu--horizontal > li {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.header-top-menus.el-menu--horizontal > li.el-submenu > * {
|
||||
height: 39px;
|
||||
line-height: 40px;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.header-top-menus.el-menu--horizontal > li.is-active {
|
||||
background: #595591 !important;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,46 +1,44 @@
|
||||
<template>
|
||||
<div class="ms-org-ws">
|
||||
<el-row :gutter="10" style="height:200px;">
|
||||
<el-col :span="16" :offset="4">
|
||||
<el-menu :unique-opened="true" mode="horizontal" router
|
||||
menu-trigger="click"
|
||||
class="header-user-menu"
|
||||
background-color="rgb(44, 42, 72)"
|
||||
text-color="#fff">
|
||||
<el-submenu index="1" popper-class="submenu">
|
||||
<template slot="title">组织</template>
|
||||
<label v-for="(item,index) in organizationList" :key="index">
|
||||
<el-menu-item @click="clickMenu(item)">{{item.name}}
|
||||
<i class="el-icon-check"
|
||||
v-if="item.id === currentUserInfo.lastSourceId || item.id === workspaceParentId"></i>
|
||||
</el-menu-item>
|
||||
</label>
|
||||
</el-submenu>
|
||||
<el-submenu index="2" popper-class="submenu">
|
||||
<template slot="title">工作空间</template>
|
||||
<label v-for="(item,index) in workspaceList" :key="index">
|
||||
<el-menu-item @click="clickMenu(item)">
|
||||
{{item.name}}
|
||||
<i class="el-icon-check" v-if="item.id === currentUserInfo.lastSourceId"></i>
|
||||
</el-menu-item>
|
||||
</label>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
</el-col>
|
||||
<el-row>
|
||||
<el-col :span="10" :offset="8">
|
||||
<el-menu :unique-opened="true" mode="horizontal" router
|
||||
menu-trigger="click"
|
||||
class="header-user-menu"
|
||||
background-color="rgb(44, 42, 72)"
|
||||
text-color="#fff">
|
||||
<el-submenu index="1" popper-class="submenu">
|
||||
<template slot="title">组织</template>
|
||||
<label v-for="(item,index) in organizationList" :key="index">
|
||||
<el-menu-item @click="clickMenu(item)">{{item.name}}
|
||||
<i class="el-icon-check"
|
||||
v-if="item.id === currentUserInfo.lastSourceId || item.id === workspaceParentId"></i>
|
||||
</el-menu-item>
|
||||
</label>
|
||||
</el-submenu>
|
||||
<el-submenu index="2" popper-class="submenu">
|
||||
<template slot="title">工作空间</template>
|
||||
<label v-for="(item,index) in workspaceList" :key="index">
|
||||
<el-menu-item @click="clickMenu(item)">
|
||||
{{item.name}}
|
||||
<i class="el-icon-check" v-if="item.id === currentUserInfo.lastSourceId"></i>
|
||||
</el-menu-item>
|
||||
</label>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="4">
|
||||
<el-dropdown size="medium" @command="handleCommand">
|
||||
<span class="dropdown-link">
|
||||
{{currentUser.name}}<i class="el-icon-caret-bottom el-icon--right"/>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item command="personal">个人信息</el-dropdown-item>
|
||||
<el-dropdown-item command="logout">退出系统</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-col :span="3" :offset="3">
|
||||
<el-dropdown size="medium" @command="handleCommand">
|
||||
<span class="dropdown-link">
|
||||
{{currentUser.name}}<i class="el-icon-caret-bottom el-icon--right"/>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item command="personal">个人信息</el-dropdown-item>
|
||||
<el-dropdown-item command="logout">退出系统</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -139,11 +137,6 @@
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
color: rgb(245, 245, 245);
|
||||
}
|
||||
|
||||
.ms-org-ws {
|
||||
width: 30%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user