18 changed files with 382 additions and 155 deletions
@ -0,0 +1,104 @@ |
|||||
|
/* |
||||
|
* Copyright © 2016-2017 The Thingsboard Authors |
||||
|
* |
||||
|
* Licensed under the Apache License, Version 2.0 (the "License"); |
||||
|
* you may not use this file except in compliance with the License. |
||||
|
* You may obtain a copy of the License at |
||||
|
* |
||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
* |
||||
|
* Unless required by applicable law or agreed to in writing, software |
||||
|
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
|
* See the License for the specific language governing permissions and |
||||
|
* limitations under the License. |
||||
|
*/ |
||||
|
|
||||
|
import './user-menu.scss'; |
||||
|
|
||||
|
/* eslint-disable import/no-unresolved, import/default */ |
||||
|
|
||||
|
import userMenuTemplate from './user-menu.tpl.html'; |
||||
|
|
||||
|
/* eslint-enable import/no-unresolved, import/default */ |
||||
|
|
||||
|
export default angular.module('thingsboard.directives.usermenu', []) |
||||
|
.directive('tbUserMenu', UserMenu) |
||||
|
.name; |
||||
|
|
||||
|
/*@ngInject*/ |
||||
|
function UserMenu() { |
||||
|
return { |
||||
|
restrict: "E", |
||||
|
scope: true, |
||||
|
bindToController: { |
||||
|
displayUserInfo: '=', |
||||
|
}, |
||||
|
controller: UserMenuController, |
||||
|
controllerAs: 'vm', |
||||
|
templateUrl: userMenuTemplate |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
/*@ngInject*/ |
||||
|
function UserMenuController($scope, userService, $translate, $state) { |
||||
|
|
||||
|
var vm = this; |
||||
|
|
||||
|
var dashboardUser = userService.getCurrentUser(); |
||||
|
|
||||
|
vm.authorityName = authorityName; |
||||
|
vm.displaySearchMode = displaySearchMode; |
||||
|
vm.logout = logout; |
||||
|
vm.openProfile = openProfile; |
||||
|
vm.userDisplayName = userDisplayName; |
||||
|
|
||||
|
function displaySearchMode() { |
||||
|
return $scope.searchConfig.searchEnabled && |
||||
|
$scope.searchConfig.showSearch; |
||||
|
} |
||||
|
|
||||
|
function authorityName() { |
||||
|
var name = "user.anonymous"; |
||||
|
if (dashboardUser) { |
||||
|
var authority = dashboardUser.authority; |
||||
|
if (authority === 'SYS_ADMIN') { |
||||
|
name = 'user.sys-admin'; |
||||
|
} else if (authority === 'TENANT_ADMIN') { |
||||
|
name = 'user.tenant-admin'; |
||||
|
} else if (authority === 'CUSTOMER_USER') { |
||||
|
name = 'user.customer'; |
||||
|
} |
||||
|
} |
||||
|
return $translate.instant(name); |
||||
|
} |
||||
|
|
||||
|
function userDisplayName() { |
||||
|
var name = ""; |
||||
|
if (dashboardUser) { |
||||
|
if ((dashboardUser.firstName && dashboardUser.firstName.length > 0) || |
||||
|
(dashboardUser.lastName && dashboardUser.lastName.length > 0)) { |
||||
|
if (dashboardUser.firstName) { |
||||
|
name += dashboardUser.firstName; |
||||
|
} |
||||
|
if (dashboardUser.lastName) { |
||||
|
if (name.length > 0) { |
||||
|
name += " "; |
||||
|
} |
||||
|
name += dashboardUser.lastName; |
||||
|
} |
||||
|
} else { |
||||
|
name = dashboardUser.email; |
||||
|
} |
||||
|
} |
||||
|
return name; |
||||
|
} |
||||
|
|
||||
|
function openProfile() { |
||||
|
$state.go('home.profile'); |
||||
|
} |
||||
|
|
||||
|
function logout() { |
||||
|
userService.logout(); |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,41 @@ |
|||||
|
/** |
||||
|
* Copyright © 2016-2017 The Thingsboard Authors |
||||
|
* |
||||
|
* Licensed under the Apache License, Version 2.0 (the "License"); |
||||
|
* you may not use this file except in compliance with the License. |
||||
|
* You may obtain a copy of the License at |
||||
|
* |
||||
|
* http://www.apache.org/licenses/LICENSE-2.0 |
||||
|
* |
||||
|
* Unless required by applicable law or agreed to in writing, software |
||||
|
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
|
* See the License for the specific language governing permissions and |
||||
|
* limitations under the License. |
||||
|
*/ |
||||
|
|
||||
|
div.tb-user-info { |
||||
|
line-height: 1.5; |
||||
|
span { |
||||
|
text-transform: none; |
||||
|
text-align: left; |
||||
|
} |
||||
|
span.tb-user-display-name { |
||||
|
font-size: 0.800rem; |
||||
|
font-weight: 300; |
||||
|
letter-spacing: 0.008em; |
||||
|
} |
||||
|
span.tb-user-authority { |
||||
|
font-size: 0.800rem; |
||||
|
font-weight: 300; |
||||
|
letter-spacing: 0.005em; |
||||
|
opacity: 0.8; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
md-icon.tb-mini-avatar { |
||||
|
margin: auto 8px; |
||||
|
font-size: 36px; |
||||
|
height: 36px; |
||||
|
width: 36px; |
||||
|
} |
||||
@ -0,0 +1,28 @@ |
|||||
|
<section layout="row"> |
||||
|
<div hide-xs hide-sm ng-show="vm.displayUserInfo" class="tb-user-info" layout="row"> |
||||
|
<md-icon aria-label="{{ 'home.avatar' | translate }}" class="material-icons tb-mini-avatar">account_circle</md-icon> |
||||
|
<div layout="column"> |
||||
|
<span class="tb-user-display-name">{{vm.userDisplayName()}}</span> |
||||
|
<span class="tb-user-authority">{{vm.authorityName()}}</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
<md-menu md-position-mode="target-right target"> |
||||
|
<md-button class="md-icon-button" aria-label="{{ 'home.open-user-menu' | translate }}" ng-click="$mdOpenMenu($event)"> |
||||
|
<md-icon md-menu-origin aria-label="{{ 'home.open-user-menu' | translate }}" class="material-icons">more_vert</md-icon> |
||||
|
</md-button> |
||||
|
<md-menu-content width="4"> |
||||
|
<md-menu-item> |
||||
|
<md-button ng-click="vm.openProfile()"> |
||||
|
<md-icon md-menu-align-target aria-label="{{ 'home.profile' | translate }}" class="material-icons">account_circle</md-icon> |
||||
|
<span translate>home.profile</span> |
||||
|
</md-button> |
||||
|
</md-menu-item> |
||||
|
<md-menu-item> |
||||
|
<md-button ng-click="vm.logout()"> |
||||
|
<md-icon md-menu-align-target aria-label="{{ 'home.logout' | translate }}" class="material-icons">exit_to_app</md-icon> |
||||
|
<span translate>home.logout</span> |
||||
|
</md-button> |
||||
|
</md-menu-item> |
||||
|
</md-menu-content> |
||||
|
</md-menu> |
||||
|
</section> |
||||
@ -0,0 +1,31 @@ |
|||||
|
/** |
||||
|
* Copyright © 2016-2017 The Thingsboard Authors |
||||
|
* |
||||
|
* Licensed under the Apache License, Version 2.0 (the "License"); |
||||
|
* you may not use this file except in compliance with the License. |
||||
|
* You may obtain a copy of the License at |
||||
|
* |
||||
|
* http://www.apache.org/licenses/LICENSE-2.0 |
||||
|
* |
||||
|
* Unless required by applicable law or agreed to in writing, software |
||||
|
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
|
* See the License for the specific language governing permissions and |
||||
|
* limitations under the License. |
||||
|
*/ |
||||
|
|
||||
|
@import '../../scss/constants'; |
||||
|
|
||||
|
.tb-default-dashboard { |
||||
|
.tb-default-dashboard-label { |
||||
|
padding-bottom: 8px; |
||||
|
} |
||||
|
tb-dashboard-select { |
||||
|
@media (min-width: $layout-breakpoint-gt-sm) { |
||||
|
padding-right: 12px; |
||||
|
} |
||||
|
@media (max-width: $layout-breakpoint-gt-sm) { |
||||
|
padding-bottom: 12px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
Loading…
Reference in new issue