mirror of https://github.com/grafana/grafana
parent
aa9a92d2e0
commit
dfcb82d233
@ -0,0 +1,66 @@ |
|||||||
|
<ul class="sidemenu sidemenu-main"> |
||||||
|
|
||||||
|
<li class="sidemenu-org-section dropdown" ng-if="ctrl.isSignedIn"> |
||||||
|
<div class="sidemenu-org" data-toggle="dropdown" ng-click="ctrl.openUserDropdown()"> |
||||||
|
<div class="sidemenu-org-avatar"> |
||||||
|
<img ng-src="{{ctrl.user.gravatarUrl}}"> |
||||||
|
</div> |
||||||
|
<div class="sidemenu-org-details"> |
||||||
|
<span class="sidemenu-org-user sidemenu-item-text">{{ctrl.user.name}}</span> |
||||||
|
<span class="sidemenu-org-name sidemenu-item-text">{{ctrl.user.orgName}}</span> |
||||||
|
</div> |
||||||
|
<i class="fa fa-caret-right small"></i> |
||||||
|
</div> |
||||||
|
<ul class="dropdown-menu" role="menu"> |
||||||
|
<li ng-repeat="menuItem in ctrl.orgMenu" ng-class="menuItem.cssClass"> |
||||||
|
<span ng-if="menuItem.section">{{menuItem.section}}</span> |
||||||
|
<a href="{{menuItem.url}}" ng-if="menuItem.url" target="{{menuItem.target}}"> |
||||||
|
<i class="{{menuItem.icon}}" ng-if="menuItem.icon"></i> |
||||||
|
{{menuItem.text}} |
||||||
|
</a> |
||||||
|
<a ng-click="menuItem.click()" ng-if="menuItem.click"> |
||||||
|
<i class="{{menuItem.icon}}"></i> |
||||||
|
{{menuItem.text}} |
||||||
|
</a> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
</li> |
||||||
|
|
||||||
|
<li class="sidemenu-system-section" ng-if="ctrl.systemSection"> |
||||||
|
<div class="sidemenu-system-section-inner"> |
||||||
|
<i class="fa fa-fw fa-cubes"></i> |
||||||
|
<div class="sidemenu-section-text-wrapper"> |
||||||
|
<div class="sidemenu-section-heading">Grafana Admin</div> |
||||||
|
<div class="sidemenu-section-tagline">v {{ctrl.grafanaVersion}}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</li> |
||||||
|
|
||||||
|
<li ng-repeat="item in ctrl.mainLinks"> |
||||||
|
<a href="{{item.url}}" class="sidemenu-item sidemenu-main-link" target="{{item.target}}"> |
||||||
|
<span class="icon-circle sidemenu-icon"> |
||||||
|
<i class="{{item.icon}}" ng-show="item.icon"></i> |
||||||
|
<img ng-src="{{item.img}}" ng-show="item.img"> |
||||||
|
</span> |
||||||
|
<span class="sidemenu-item-text">{{item.text}}</span> |
||||||
|
</a> |
||||||
|
</li> |
||||||
|
|
||||||
|
<ul class="sidemenu sidemenu-small" style="margin-top:50px" ng-if="ctrl.systemSection"> |
||||||
|
<li> |
||||||
|
<a href="{{ctrl.appSubUrl}}/" class="sidemenu-item"> |
||||||
|
<span class="icon-circle sidemenu-icon"><i class="fa fa-fw fa-backward"></i></span> |
||||||
|
<span class="sidemenu-item-text">Exit admin</span> |
||||||
|
</a> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
|
||||||
|
<li ng-if="!ctrl.isSignedIn"> |
||||||
|
<a href="login" class="sidemenu-item" target="_self"> |
||||||
|
<span class="icon-circle sidemenu-icon"><i class="fa fa-fw fa-sign-in"></i></span> |
||||||
|
<span class="sidemenu-item-text">Sign in</span> |
||||||
|
</a> |
||||||
|
</li> |
||||||
|
|
||||||
|
</ul> |
||||||
|
|
@ -0,0 +1,146 @@ |
|||||||
|
///<reference path="../../headers/common.d.ts" />
|
||||||
|
|
||||||
|
import config from 'app/core/config'; |
||||||
|
import store from 'app/core/store'; |
||||||
|
import _ from 'lodash'; |
||||||
|
import angular from 'angular'; |
||||||
|
import $ from 'jquery'; |
||||||
|
|
||||||
|
class SideMenuCtrl { |
||||||
|
isSignedIn: boolean; |
||||||
|
showSignout: boolean; |
||||||
|
user: any; |
||||||
|
mainLinks: any; |
||||||
|
orgMenu: any; |
||||||
|
systemSection: any; |
||||||
|
grafanaVersion: any; |
||||||
|
appSubUrl: string; |
||||||
|
|
||||||
|
constructor(private $scope, private $location, private contextSrv, private backendSrv) { |
||||||
|
this.isSignedIn = contextSrv.isSignedIn; |
||||||
|
this.user = contextSrv.user; |
||||||
|
this.appSubUrl = config.appSubUrl; |
||||||
|
this.showSignout = this.contextSrv.isSignedIn && !config['authProxyEnabled']; |
||||||
|
this.updateMenu(); |
||||||
|
this.$scope.$on('$routeChangeSuccess', () => this.updateMenu()); |
||||||
|
} |
||||||
|
|
||||||
|
getUrl(url) { |
||||||
|
return config.appSubUrl + url; |
||||||
|
} |
||||||
|
|
||||||
|
setupMainNav() { |
||||||
|
this.mainLinks = config.bootData.mainNavLinks.map(item => { |
||||||
|
return {text: item.text, icon: item.icon, img: item.img, url: this.getUrl(item.url)}; |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
openUserDropdown() { |
||||||
|
this.orgMenu = [ |
||||||
|
{section: 'You', cssClass: 'dropdown-menu-title'}, |
||||||
|
{text: 'Profile', url: this.getUrl('/profile')}, |
||||||
|
]; |
||||||
|
|
||||||
|
if (this.contextSrv.hasRole('Admin')) { |
||||||
|
this.orgMenu.push({section: this.user.orgName, cssClass: 'dropdown-menu-title'}); |
||||||
|
this.orgMenu.push({ |
||||||
|
text: "Settings", |
||||||
|
url: this.getUrl("/org"), |
||||||
|
}); |
||||||
|
this.orgMenu.push({ |
||||||
|
text: "Users", |
||||||
|
url: this.getUrl("/org/users"), |
||||||
|
}); |
||||||
|
this.orgMenu.push({ |
||||||
|
text: "API Keys", |
||||||
|
url: this.getUrl("/org/apikeys"), |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
this.orgMenu.push({cssClass: "divider"}); |
||||||
|
|
||||||
|
if (config.allowOrgCreate) { |
||||||
|
this.orgMenu.push({text: "New organization", icon: "fa fa-fw fa-plus", url: this.getUrl('/org/new')}); |
||||||
|
} |
||||||
|
|
||||||
|
this.backendSrv.get('/api/user/orgs').then(orgs => { |
||||||
|
orgs.forEach(org => { |
||||||
|
if (org.orgId === this.contextSrv.user.orgId) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
this.orgMenu.push({ |
||||||
|
text: "Switch to " + org.name, |
||||||
|
icon: "fa fa-fw fa-random", |
||||||
|
click: () => { |
||||||
|
this.switchOrg(org.orgId); |
||||||
|
} |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
this.orgMenu.push({cssClass: "divider"}); |
||||||
|
|
||||||
|
if (this.contextSrv.isGrafanaAdmin) { |
||||||
|
this.orgMenu.push({text: "Server admin", url: this.getUrl("/admin/settings")}); |
||||||
|
} |
||||||
|
if (this.isSignedIn) { |
||||||
|
this.orgMenu.push({text: "Sign out", url: this.getUrl("/logout"), target: "_self"}); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
switchOrg(orgId) { |
||||||
|
this.backendSrv.post('/api/user/using/' + orgId).then(() => { |
||||||
|
window.location.href = window.location.href; |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
setupAdminNav() { |
||||||
|
this.systemSection = true; |
||||||
|
this.grafanaVersion = config.buildInfo.version; |
||||||
|
|
||||||
|
this.mainLinks.push({ |
||||||
|
text: "System info", |
||||||
|
icon: "fa fa-fw fa-info", |
||||||
|
href: this.getUrl("/admin/settings"), |
||||||
|
}); |
||||||
|
|
||||||
|
this.mainLinks.push({ |
||||||
|
text: "Global Users", |
||||||
|
icon: "fa fa-fw fa-user", |
||||||
|
href: this.getUrl("/admin/users"), |
||||||
|
}); |
||||||
|
|
||||||
|
this.mainLinks.push({ |
||||||
|
text: "Global Orgs", |
||||||
|
icon: "fa fa-fw fa-users", |
||||||
|
href: this.getUrl("/admin/orgs"), |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
updateMenu() { |
||||||
|
this.systemSection = false; |
||||||
|
this.mainLinks = []; |
||||||
|
this.orgMenu = []; |
||||||
|
|
||||||
|
var currentPath = this.$location.path(); |
||||||
|
if (currentPath.indexOf('/admin') === 0) { |
||||||
|
this.setupAdminNav(); |
||||||
|
} else { |
||||||
|
this.setupMainNav(); |
||||||
|
} |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
function sideMenuDirective() { |
||||||
|
return { |
||||||
|
restrict: 'E', |
||||||
|
templateUrl: 'app/features/sidemenu/sidemenu.html', |
||||||
|
controller: SideMenuCtrl, |
||||||
|
bindToController: true, |
||||||
|
controllerAs: 'ctrl', |
||||||
|
scope: {}, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
angular.module('grafana.directives').directive('sidemenu', sideMenuDirective); |
@ -1,69 +0,0 @@ |
|||||||
<div ng-controller="SideMenuCtrl" ng-init="init()"> |
|
||||||
|
|
||||||
<ul class="sidemenu sidemenu-main"> |
|
||||||
|
|
||||||
<li class="sidemenu-org-section dropdown" ng-if="contextSrv.isSignedIn"> |
|
||||||
<div class="sidemenu-org" data-toggle="dropdown" ng-click="openUserDropdown()"> |
|
||||||
<div class="sidemenu-org-avatar"> |
|
||||||
<img ng-src="{{contextSrv.user.gravatarUrl}}"> |
|
||||||
</div> |
|
||||||
<div class="sidemenu-org-details"> |
|
||||||
<span class="sidemenu-org-user sidemenu-item-text">{{contextSrv.user.name}}</span> |
|
||||||
<span class="sidemenu-org-name sidemenu-item-text">{{contextSrv.user.orgName}}</span> |
|
||||||
</div> |
|
||||||
<i class="fa fa-caret-right small"></i> |
|
||||||
</div> |
|
||||||
<ul class="dropdown-menu" role="menu"> |
|
||||||
<li ng-repeat="menuItem in orgMenu" ng-class="menuItem.cssClass"> |
|
||||||
<span ng-if="menuItem.section">{{menuItem.section}}</span> |
|
||||||
<a href="{{menuItem.url}}" ng-if="menuItem.url" target="{{menuItem.target}}"> |
|
||||||
<i class="{{menuItem.icon}}" ng-if="menuItem.icon"></i> |
|
||||||
{{menuItem.text}} |
|
||||||
</a> |
|
||||||
<a ng-click="menuItem.click()" ng-if="menuItem.click"> |
|
||||||
<i class="{{menuItem.icon}}"></i> |
|
||||||
{{menuItem.text}} |
|
||||||
</a> |
|
||||||
</li> |
|
||||||
</ul> |
|
||||||
</li> |
|
||||||
|
|
||||||
<li class="sidemenu-system-section" ng-if="systemSection"> |
|
||||||
<div class="sidemenu-system-section-inner"> |
|
||||||
<i class="fa fa-fw fa-cubes"></i> |
|
||||||
<div class="sidemenu-section-text-wrapper"> |
|
||||||
<div class="sidemenu-section-heading">Grafana Admin</div> |
|
||||||
<div class="sidemenu-section-tagline">v {{grafanaVersion}}</div> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
</li> |
|
||||||
|
|
||||||
<li ng-repeat="item in mainLinks"> |
|
||||||
<a href="{{item.url}}" class="sidemenu-item sidemenu-main-link" target="{{item.target}}"> |
|
||||||
<span class="icon-circle sidemenu-icon"> |
|
||||||
<i class="{{item.icon}}" ng-show="item.icon"></i> |
|
||||||
<img ng-src="{{item.img}}" ng-show="item.img"> |
|
||||||
</span> |
|
||||||
<span class="sidemenu-item-text">{{item.text}}</span> |
|
||||||
</a> |
|
||||||
</li> |
|
||||||
|
|
||||||
<ul class="sidemenu sidemenu-small" style="margin-top:50px" ng-if="systemSection"> |
|
||||||
<li> |
|
||||||
<a href="{{appSubUrl}}/" class="sidemenu-item"> |
|
||||||
<span class="icon-circle sidemenu-icon"><i class="fa fa-fw fa-backward"></i></span> |
|
||||||
<span class="sidemenu-item-text">Exit admin</span> |
|
||||||
</a> |
|
||||||
</li> |
|
||||||
</ul> |
|
||||||
|
|
||||||
<li ng-if="!contextSrv.isSignedIn"> |
|
||||||
<a href="login" class="sidemenu-item" target="_self"> |
|
||||||
<span class="icon-circle sidemenu-icon"><i class="fa fa-fw fa-sign-in"></i></span> |
|
||||||
<span class="sidemenu-item-text">Sign in</span> |
|
||||||
</a> |
|
||||||
</li> |
|
||||||
|
|
||||||
</ul> |
|
||||||
|
|
||||||
</div> |
|
Loading…
Reference in new issue