summaryrefslogtreecommitdiffstats
path: root/portal-FE-common/src/app/layout
diff options
context:
space:
mode:
authorSunder Tattavarada <statta@research.att.com>2020-01-28 22:58:33 +0000
committerGerrit Code Review <gerrit@onap.org>2020-01-28 22:58:33 +0000
commit602630618626d0ca1fd5fe6ac4f3347029bfd4c7 (patch)
tree41746329526c99771015c16e2da2edb17cabbd5e /portal-FE-common/src/app/layout
parenta5aa8126eeaf5a2f84df510f3208eafed483ab52 (diff)
parent91e3434fc7c515416ff2da10d55acf1d2dbcde71 (diff)
Merge "Adding new components with portal-FE-common"
Diffstat (limited to 'portal-FE-common/src/app/layout')
-rw-r--r--portal-FE-common/src/app/layout/components/footer/footer.component.scss52
-rw-r--r--portal-FE-common/src/app/layout/components/footer/footer.component.spec.ts62
-rw-r--r--portal-FE-common/src/app/layout/components/footer/footer.component.ts65
-rw-r--r--portal-FE-common/src/app/layout/components/header-menu/header-menu.component.html130
-rw-r--r--portal-FE-common/src/app/layout/components/header-menu/header-menu.component.scss150
-rw-r--r--portal-FE-common/src/app/layout/components/header-menu/header-menu.component.spec.ts62
-rw-r--r--portal-FE-common/src/app/layout/components/header-menu/header-menu.component.ts231
-rw-r--r--portal-FE-common/src/app/layout/components/header/header.component.html130
-rw-r--r--portal-FE-common/src/app/layout/components/header/header.component.scss84
-rw-r--r--portal-FE-common/src/app/layout/components/header/header.component.spec.ts63
-rw-r--r--portal-FE-common/src/app/layout/components/header/header.component.ts181
-rw-r--r--portal-FE-common/src/app/layout/components/sidebar/sidebar.component.html72
-rw-r--r--portal-FE-common/src/app/layout/components/sidebar/sidebar.component.scss228
-rw-r--r--portal-FE-common/src/app/layout/components/sidebar/sidebar.component.spec.ts62
-rw-r--r--portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts158
-rw-r--r--portal-FE-common/src/app/layout/components/tabbar/tab.ts50
-rw-r--r--portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html97
-rw-r--r--portal-FE-common/src/app/layout/components/tabbar/tabbar.component.scss80
-rw-r--r--portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts63
-rw-r--r--portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts95
-rw-r--r--portal-FE-common/src/app/layout/components/userbar/userbar.component.html51
-rw-r--r--portal-FE-common/src/app/layout/components/userbar/userbar.component.scss114
-rw-r--r--portal-FE-common/src/app/layout/components/userbar/userbar.component.spec.ts63
-rw-r--r--portal-FE-common/src/app/layout/components/userbar/userbar.component.ts133
-rw-r--r--portal-FE-common/src/app/layout/layout-routing.module.ts57
-rw-r--r--portal-FE-common/src/app/layout/layout.component.html44
-rw-r--r--portal-FE-common/src/app/layout/layout.component.scss68
-rw-r--r--portal-FE-common/src/app/layout/layout.component.spec.ts62
-rw-r--r--portal-FE-common/src/app/layout/layout.component.ts56
-rw-r--r--portal-FE-common/src/app/layout/layout.module.ts65
30 files changed, 2828 insertions, 0 deletions
diff --git a/portal-FE-common/src/app/layout/components/footer/footer.component.scss b/portal-FE-common/src/app/layout/components/footer/footer.component.scss
new file mode 100644
index 00000000..82c81d7c
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/footer/footer.component.scss
@@ -0,0 +1,52 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+$topnav-background-color: #222;
+
+.footerText {
+ background-color: $topnav-background-color;
+}
+
+.copyright-text {
+ background-color: $topnav-background-color;
+ color: #fff;
+ font-size: 11px;
+ margin-bottom: 0;
+ line-height: 3rem;
+ margin-top: 20px;
+ text-align: center;
+}
diff --git a/portal-FE-common/src/app/layout/components/footer/footer.component.spec.ts b/portal-FE-common/src/app/layout/components/footer/footer.component.spec.ts
new file mode 100644
index 00000000..b8340222
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/footer/footer.component.spec.ts
@@ -0,0 +1,62 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FooterComponent } from './footer.component';
+
+describe('FooterComponent', () => {
+ let component: FooterComponent;
+ let fixture: ComponentFixture<FooterComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ FooterComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(FooterComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/components/footer/footer.component.ts b/portal-FE-common/src/app/layout/components/footer/footer.component.ts
new file mode 100644
index 00000000..2561a26a
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/footer/footer.component.ts
@@ -0,0 +1,65 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+import { Component, OnInit } from '@angular/core';
+import { ManifestService } from 'src/app/shared/services';
+
+
+@Component({
+ selector: 'app-footer',
+ templateUrl: './footer.component.html',
+ styleUrls: ['./footer.component.scss']
+})
+export class FooterComponent implements OnInit {
+
+ buildVersion: string;
+ constructor(private manifest: ManifestService) { }
+
+ ngOnInit() {
+ this.buildVersion = '';
+ this.manifestDetails();
+ }
+
+ manifestDetails() {
+ this.manifest.getManifest().subscribe((_res: any) => {
+ this.buildVersion = _res.manifest['Build-Number'];
+ }, (_err) => {
+
+ });
+ }
+}
diff --git a/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.html b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.html
new file mode 100644
index 00000000..45b4e9f9
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.html
@@ -0,0 +1,130 @@
+<!--
+ ============LICENSE_START==========================================
+ ONAP Portal
+ ===================================================================
+ Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the "License");
+ you may not use this software 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.
+
+ Unless otherwise specified, all documentation contained herein is licensed
+ under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ you may not use this documentation except in compliance with the License.
+ You may obtain a copy of the License at
+
+ https://creativecommons.org/licenses/by/4.0/
+
+ Unless required by applicable law or agreed to in writing, documentation
+ 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.
+
+ ============LICENSE_END============================================
+
+
+ -->
+
+<div style="bottom: tabBottom; display: flex; height: 100%; overflow: hidden">
+ <nav class="navbar navbar-expand-lg fixed-top">
+ <a class="navbar-brand" href=""> <img src="assets/images/global.logo" style="width:14%"/> &nbsp; ONAP Portal</a>
+ <div class="header-menu-display">
+ <app-header-menu></app-header-menu>
+ </div>
+ <button class="navbar-toggler" type="button" (click)="toggleSidebar()">
+ <i class="icon ion-md-menu" style="color:white;"></i>
+ </button>
+ <div class="collapse navbar-collapse">
+ <ul class="navbar-nav ml-auto">
+ <app-global-search></app-global-search>
+ <li class="nav-item dropdown" ngbDropdown>
+ <a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
+ <i class="icon ion-md-bulb"></i> <b class="caret"></b><span class="sr-only"></span>
+ </a>
+ <div class="custom-dropdown-item" ngbDropdownMenu>
+
+ <li class="dropdown-divider"></li>
+ </div>
+ </li>
+ <li class="nav-item dropdown" ngbDropdown>
+ <a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
+ <i class="icon ion-md-flag"></i> <b class="caret"></b><span class="sr-only"></span>
+ </a>
+ <div class="dropdown-menu-right" ngbDropdownMenu>
+ <a style="margin-left: 8%;" id="application-role" [routerLink]="['/recentNotifications']"
+ href="javascript:void(0);">
+ {{ 'View All Recent Notifications' }} </a>
+ <li class="dropdown-divider"></li>
+</div>
+</li>
+<li class="nav-item dropdown" ngbDropdown>
+ <a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
+ <i class="icon ion-md-person"></i> {{firstName}} <b class="caret"></b>
+ </a>
+ <div class="dropdown-menu-right" ngbDropdownMenu>
+<li class="dropdown-item" style="font-weight: lighter">
+ {{firstName}}, {{lastName}}
+</li>
+<li class="dropdown-item">
+ <span class="dropdown-item-name"> {{ 'Email'}}: </span>
+ <div>
+ <span class="dropdown-item-value">
+ {{loginSnippetEmail}}
+ </span>
+ </div>
+</li>
+<li class="dropdown-item">
+ <span class="dropdown-item-name"> {{ 'User Id' }}: </span>
+ <div>
+ <span class="dropdown-item-value">
+ {{loginSnippetUserid}}
+ </span>
+ </div>
+</li>
+<li class="dropdown-item">
+ <span class="dropdown-item-name"> {{ 'Last login' }}: </span>
+ <div>
+ <span class="dropdown-item-value">
+ {{lastLogin | date:'medium'}}
+ </span>
+ </div>
+</li>
+<li class="custom-display-item">
+ <a (click)="getUserApplicationRoles()" href="javascript:void(0);"><span><i class="icon ion-md-add-circle-outline"
+ [ngClass]="{true: 'icon ion-md-add-circle-outline', false: 'icon ion-md-remove-circle-outline'}[ !displayUserAppRoles]"></i>
+ {{ 'Applications and Roles' }} </span></a>
+ <span class="onap-spinner" *ngIf="isLoading"></span>
+</li> <br>
+<div class="custom-display-item approles" [hidden]="!displayUserAppRoles">
+ <div *ngFor="let ua of userapproles ; index as i">
+ <div class="reg-userApp-value">
+ <span class="dropdown-item-name">{{ua.App}}:</span>
+ </div>
+ <div *ngFor="let role of ua.Roles ; index as i" class="reg-userAppRoles-value">
+ <span *ngIf="role.indexOf('global_')!=-1" id="required" style="color: Red;" visible="false">
+ *</span> <span class="dropdown-item-value">{{role}}</span>
+ </div>
+ <br>
+ </div>
+</div>
+<hr>
+<div id="reg-logout-div" >
+<button type="button" class="btn btn-primary" (click)="allAppsLogout()">
+ <i class="icon ion-md-log-out"></i> {{ 'Log Out' }} </button></div>
+</div>
+</li>
+</ul>
+</div>
+</nav>
+</div> \ No newline at end of file
diff --git a/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.scss b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.scss
new file mode 100644
index 00000000..d69b8580
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.scss
@@ -0,0 +1,150 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+ .header-menu-item-div
+ {
+ float: left;
+ margin-right: 5%;
+
+ }
+ .header-menu-item-li
+ {
+ float: left;
+ margin-right: 2%;
+
+
+ }
+ .header-menu-item-link
+ {
+ font-family:"Open Sans", Arial;
+ font-size:16px;
+ color:#999;
+ text-decoration:none;
+
+ }
+ #parentmenu-tabs:hover {
+ color: #fff;
+ }
+
+
+
+
+ .third-level-menu{
+ column-count: 4;
+ line-height: 12px;
+ overflow-x: hidden;
+ overflow-y: hidden;
+ column-gap: 13px;
+ column-rule: 1px outset #d2d2d2;
+ margin-left:20px;
+ }
+
+
+
+ .third-level-menu a{
+ color:black;
+ }
+
+ .third-level-menu li a {
+ color: #333;
+ display: inline-flex;
+ padding: 7px 15px;
+ font-family:"Omnes-ECOMP-W02", Arial;
+ margin-top:5px;
+ margin-bottom:5px;
+ }
+
+ .third-level-menu li{
+ width:100%;
+ border-bottom: 1px solid #d2d2d2;
+ }
+
+
+ .b2b-header-tabs .header-secondary .header-subitem a.menu__item{
+ font-size:16px;
+ }
+
+ .third-level-title{
+ font-size:15px;
+ font-weight: 700;
+ }
+ .header-secondlevel-menu
+ {
+ background-color: #fff;
+ position: fixed;
+ right:1%;
+ width: -webkit-fill-available;
+
+ }
+
+ .header-thirdlevel-menu
+ {
+ background-color: #fff;
+ position: fixed;
+ left:0;
+ height: 70%;
+ width: 100%;
+ }
+
+ a.menu__item{
+ font-size:16px;
+ font-family:"Open Sans", Arial;
+ color:#333;
+ }
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ \ No newline at end of file
diff --git a/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.spec.ts b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.spec.ts
new file mode 100644
index 00000000..889f499a
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.spec.ts
@@ -0,0 +1,62 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HeaderMenuComponent } from './header-menu.component';
+
+describe('HeaderMenuComponent', () => {
+ let component: HeaderMenuComponent;
+ let fixture: ComponentFixture<HeaderMenuComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ HeaderMenuComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(HeaderMenuComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.ts b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.ts
new file mode 100644
index 00000000..eb8f747a
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header-menu/header-menu.component.ts
@@ -0,0 +1,231 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import * as _ from 'underscore';
+import { Component, OnInit } from '@angular/core';
+import { MenusService } from 'src/app/shared/services/menus/menus.service';
+import { AddTabFunctionService } from 'src/app/shared/services/tab/add-tab-function.service';
+import { Router } from '@angular/router';
+
+@Component({
+ selector: 'app-header-menu',
+ templateUrl: './header-menu.component.html',
+ styleUrls: ['./header-menu.component.scss']
+})
+export class HeaderMenuComponent implements OnInit {
+ hideMenus: boolean[] = [];
+ hideSecondLevelMenus: boolean[][] = [];
+ hideThirdLevelMenus: boolean[] = [];
+ megaMenuDataObject: any[];
+ favoritesMenuItems: any[];
+ favoritesWindow: boolean;
+ showFavorites: boolean;
+ emptyFavorites: boolean;
+ favoriteItemsCount: number;
+
+ constructor(public router: Router, private menusService: MenusService, private addTabFuntionService: AddTabFunctionService) { }
+
+ ngOnInit() {
+ //this.hideMenus[0] = false;
+ this.getFunctionalMenuForUser();
+
+ }
+
+ unflatten(array: any, parent?: any, tree?: any) {
+ tree = typeof tree !== 'undefined' ? tree : [];
+ parent = typeof parent !== 'undefined' ? parent : { menuId: null };
+ var children = _.filter(array, function (child: any) {
+ return child.parentMenuId == parent.menuId;
+ });
+ if (!_.isEmpty(children)) {
+ if (parent.menuId === null) {
+ tree = children;
+ } else {
+ parent['children'] = children
+ }
+ _.each(children, function (child: any) {
+ this.unflatten(array, child)
+ }, this);
+ }
+
+ return tree;
+ }
+ getFunctionalMenuForUser() {
+ this.menusService.getFunctionalMenuForUser().subscribe((jsonHeaderMenu: any) => {
+ this.megaMenuDataObject = this.unflatten(jsonHeaderMenu);
+ // for (let entry of this.megaMenuDataObject) {
+ // console.log('First level '+entry.text);
+ // for (let secondLevel of entry.children)
+ // {
+ // if(secondLevel)
+ // {
+ // console.log('Second level '+secondLevel.text);
+ // for (let thirdLevel of secondLevel.children)
+ // {
+ // console.log('Third level '+thirdLevel.text);
+ // }
+ // }
+
+ // }
+
+ // }
+
+
+ }, (err) => {
+ console.log('HeaderCtrl::GetFunctionalMenuForUser: HeaderCtrl json returned: ' + err);
+ });
+
+ }
+ getFavoriteItems() {
+ this.menusService.getFavoriteItems().toPromise().then((jsonFavourites: any) => {
+ this.favoritesMenuItems = jsonFavourites;
+ if (this.favoritesMenuItems) {
+ this.favoriteItemsCount = this.favoritesMenuItems.length;
+ }
+ }, (err) => {
+ console.log('HeaderCtrl::getFavoriteItems: HeaderCtrl json returned: ' + err);
+ });
+ }
+ loadFirstLevel(index: any) {
+ this.hideMenus = [];
+ this.hideSecondLevelMenus = [];
+ for (let firstLevelIndex = 0; firstLevelIndex < this.megaMenuDataObject.length; firstLevelIndex++) {
+ this.hideMenus.push(false);
+ this.hideSecondLevelMenus.push(new Array(this.megaMenuDataObject[firstLevelIndex].length).fill(false));
+ }
+ this.hideMenus[index] = true;
+ if (!this.favoritesMenuItems) {
+ this.getFavoriteItems();
+ }
+
+ }
+ isUrlFavorite(menuId: any) {
+ if (this.favoritesMenuItems) {
+ var jsonMenu = JSON.stringify(this.favoritesMenuItems);
+ var isMenuFavorite = jsonMenu.indexOf('menuId\":' + menuId);
+ if (isMenuFavorite == -1) {
+ return false;
+ } else {
+ return true;
+ }
+ }
+ else {
+ return false;
+ }
+ }
+ submenuLevelAction(index: any, column: any) {
+ //console.log('index and column' + index + column);
+ if (index == 'Favorites' && this.favoriteItemsCount != 0) {
+ this.favoritesWindow = true;
+ this.showFavorites = true;
+ this.emptyFavorites = false;
+ }
+ if (index == 'Favorites' && this.favoriteItemsCount == 0) {
+ this.favoritesWindow = true;
+ this.showFavorites = false;
+ this.emptyFavorites = true;
+ }
+ if (index != 'Favorites') {
+ this.favoritesWindow = false;
+ this.showFavorites = false;
+ this.emptyFavorites = false;
+ }
+ }
+ hideFavoritesWindow() {
+ this.showFavorites = false;
+ this.emptyFavorites = false;
+ }
+ removeAsFavoriteItem(event: any, menuId: any) {
+ this.menusService.removeFavoriteItem(menuId).subscribe(() => {
+ //angular.element('#' + event.target.id).css('color', '#666666');
+ this.getFavoriteItems();
+ }, (err) => {
+ console.error('HeaderCtrl::removeAsFavoriteItem: API removeFavoriteItem error: ' + err);
+ });
+ }
+ hideThirdLevelMenu(firstLevelIndex: any, secondLevelIndex: any) {
+ this.hideSecondLevelMenus = [];
+ for (let firstLevelIndex = 0; firstLevelIndex < this.megaMenuDataObject.length; firstLevelIndex++) {
+ this.hideSecondLevelMenus.push(new Array(this.megaMenuDataObject[firstLevelIndex].length).fill(false));
+ }
+ this.hideSecondLevelMenus[firstLevelIndex][secondLevelIndex] = true;
+ }
+
+ clickOutSide(event: any) {
+ this.hideMenus = [];
+ this.hideSecondLevelMenus = [];
+ for (let firstLevelIndex = 0; firstLevelIndex < this.megaMenuDataObject.length; firstLevelIndex++) {
+ this.hideMenus.push(false);
+ this.hideSecondLevelMenus.push(new Array(this.megaMenuDataObject[firstLevelIndex].length).fill(false));
+ }
+
+ }
+ setAsFavoriteItem(event: any, menuId: any) {
+
+ }
+ goToUrl(item: any) {
+ //console.log('Get into URL function' + item.url);
+ let url = item.url;
+ let restrictedApp = item.restrictedApp;
+ if (!url) {
+ console.log('HeaderCtrl::goToUrl: No url found for this application, doing nothing..');
+ return;
+ }
+ if (restrictedApp) {
+ window.open(url, '_blank');
+ } else {
+ if (item.url == "getAccess" || item.url == "contactUs") {
+
+ this.router.navigate(['/' + item.url]);
+
+ } else {
+ var tabContent = {
+ id: new Date(),
+ title: item.text,
+ url: item.url,
+ appId: item.appid
+ };
+ this.addTabFuntionService.filter(tabContent);
+ }
+ }
+
+ }
+ auditLog(link: any, action: any) {
+
+ }
+
+}
diff --git a/portal-FE-common/src/app/layout/components/header/header.component.html b/portal-FE-common/src/app/layout/components/header/header.component.html
new file mode 100644
index 00000000..45b4e9f9
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header/header.component.html
@@ -0,0 +1,130 @@
+<!--
+ ============LICENSE_START==========================================
+ ONAP Portal
+ ===================================================================
+ Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the "License");
+ you may not use this software 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.
+
+ Unless otherwise specified, all documentation contained herein is licensed
+ under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ you may not use this documentation except in compliance with the License.
+ You may obtain a copy of the License at
+
+ https://creativecommons.org/licenses/by/4.0/
+
+ Unless required by applicable law or agreed to in writing, documentation
+ 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.
+
+ ============LICENSE_END============================================
+
+
+ -->
+
+<div style="bottom: tabBottom; display: flex; height: 100%; overflow: hidden">
+ <nav class="navbar navbar-expand-lg fixed-top">
+ <a class="navbar-brand" href=""> <img src="assets/images/global.logo" style="width:14%"/> &nbsp; ONAP Portal</a>
+ <div class="header-menu-display">
+ <app-header-menu></app-header-menu>
+ </div>
+ <button class="navbar-toggler" type="button" (click)="toggleSidebar()">
+ <i class="icon ion-md-menu" style="color:white;"></i>
+ </button>
+ <div class="collapse navbar-collapse">
+ <ul class="navbar-nav ml-auto">
+ <app-global-search></app-global-search>
+ <li class="nav-item dropdown" ngbDropdown>
+ <a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
+ <i class="icon ion-md-bulb"></i> <b class="caret"></b><span class="sr-only"></span>
+ </a>
+ <div class="custom-dropdown-item" ngbDropdownMenu>
+
+ <li class="dropdown-divider"></li>
+ </div>
+ </li>
+ <li class="nav-item dropdown" ngbDropdown>
+ <a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
+ <i class="icon ion-md-flag"></i> <b class="caret"></b><span class="sr-only"></span>
+ </a>
+ <div class="dropdown-menu-right" ngbDropdownMenu>
+ <a style="margin-left: 8%;" id="application-role" [routerLink]="['/recentNotifications']"
+ href="javascript:void(0);">
+ {{ 'View All Recent Notifications' }} </a>
+ <li class="dropdown-divider"></li>
+</div>
+</li>
+<li class="nav-item dropdown" ngbDropdown>
+ <a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
+ <i class="icon ion-md-person"></i> {{firstName}} <b class="caret"></b>
+ </a>
+ <div class="dropdown-menu-right" ngbDropdownMenu>
+<li class="dropdown-item" style="font-weight: lighter">
+ {{firstName}}, {{lastName}}
+</li>
+<li class="dropdown-item">
+ <span class="dropdown-item-name"> {{ 'Email'}}: </span>
+ <div>
+ <span class="dropdown-item-value">
+ {{loginSnippetEmail}}
+ </span>
+ </div>
+</li>
+<li class="dropdown-item">
+ <span class="dropdown-item-name"> {{ 'User Id' }}: </span>
+ <div>
+ <span class="dropdown-item-value">
+ {{loginSnippetUserid}}
+ </span>
+ </div>
+</li>
+<li class="dropdown-item">
+ <span class="dropdown-item-name"> {{ 'Last login' }}: </span>
+ <div>
+ <span class="dropdown-item-value">
+ {{lastLogin | date:'medium'}}
+ </span>
+ </div>
+</li>
+<li class="custom-display-item">
+ <a (click)="getUserApplicationRoles()" href="javascript:void(0);"><span><i class="icon ion-md-add-circle-outline"
+ [ngClass]="{true: 'icon ion-md-add-circle-outline', false: 'icon ion-md-remove-circle-outline'}[ !displayUserAppRoles]"></i>
+ {{ 'Applications and Roles' }} </span></a>
+ <span class="onap-spinner" *ngIf="isLoading"></span>
+</li> <br>
+<div class="custom-display-item approles" [hidden]="!displayUserAppRoles">
+ <div *ngFor="let ua of userapproles ; index as i">
+ <div class="reg-userApp-value">
+ <span class="dropdown-item-name">{{ua.App}}:</span>
+ </div>
+ <div *ngFor="let role of ua.Roles ; index as i" class="reg-userAppRoles-value">
+ <span *ngIf="role.indexOf('global_')!=-1" id="required" style="color: Red;" visible="false">
+ *</span> <span class="dropdown-item-value">{{role}}</span>
+ </div>
+ <br>
+ </div>
+</div>
+<hr>
+<div id="reg-logout-div" >
+<button type="button" class="btn btn-primary" (click)="allAppsLogout()">
+ <i class="icon ion-md-log-out"></i> {{ 'Log Out' }} </button></div>
+</div>
+</li>
+</ul>
+</div>
+</nav>
+</div> \ No newline at end of file
diff --git a/portal-FE-common/src/app/layout/components/header/header.component.scss b/portal-FE-common/src/app/layout/components/header/header.component.scss
new file mode 100644
index 00000000..65a4be04
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header/header.component.scss
@@ -0,0 +1,84 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+$topnav-background-color: #222;
+:host {
+ .navbar {
+ background-color: $topnav-background-color;
+ .navbar-brand {
+ color: #fff;
+ }
+ .nav-item > a {
+ color: #999;
+ &:hover {
+ color: #fff;
+ }
+ }
+ }
+
+ .dropdown-menu-right.dropdown-menu.show{
+ width: 250px;
+ }
+ .dropdown-item-name {
+ font-weight: bold;
+ }
+
+ .dropdown-item-value {
+ font-weight: lighter;
+ }
+
+ .custom-display-item {
+ display: block;
+ width: 100%;
+ padding: 0.25rem 1.5rem;
+ clear: both;
+ font-weight: 400;
+ color: #212529;
+ text-align: inherit;
+ white-space: nowrap;
+ background-color: transparent;
+ border: 0;
+ }
+
+ .custom-display-item.approles {
+ overflow-y: scroll;
+ height: 250px;
+ }
+ .header-menu-display {
+ width: 250px;
+ }
+}
diff --git a/portal-FE-common/src/app/layout/components/header/header.component.spec.ts b/portal-FE-common/src/app/layout/components/header/header.component.spec.ts
new file mode 100644
index 00000000..1bcd2ffb
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header/header.component.spec.ts
@@ -0,0 +1,63 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HeaderComponent } from './header.component';
+
+describe('HeaderComponent', () => {
+ let component: HeaderComponent;
+ let fixture: ComponentFixture<HeaderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ HeaderComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(HeaderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/components/header/header.component.ts b/portal-FE-common/src/app/layout/components/header/header.component.ts
new file mode 100644
index 00000000..cb6bdd31
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/header/header.component.ts
@@ -0,0 +1,181 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { Component, OnInit } from '@angular/core';
+import { Router, NavigationEnd } from '@angular/router';
+import { UserProfileService, MenusService } from 'src/app/shared/services';
+import { CookieService } from 'ngx-cookie-service';
+
+@Component({
+ selector: 'app-header',
+ templateUrl: './header.component.html',
+ styleUrls: ['./header.component.scss']
+})
+export class HeaderComponent implements OnInit {
+ public pushRightClass: string;
+ firstName: string;
+ lastName: string;
+ loginSnippetUserid: any;
+ lastLogin: number;
+ loginSnippetEmail: any;
+ userapproles: any[];
+ displayUserAppRoles: any;
+ isLoading: boolean;
+
+ constructor(public router: Router, private userProfileService: UserProfileService, private menusService: MenusService, private cookieService: CookieService) {
+
+ this.router.events.subscribe(val => {
+ if (
+ val instanceof NavigationEnd &&
+ window.innerWidth <= 992 &&
+ this.isToggled()
+ ) {
+ this.toggleSidebar();
+ }
+ });
+ }
+
+ ngOnInit() {
+ this.pushRightClass = 'push-right';
+ this.getUserInformation();
+ }
+
+ getUserInformation() {
+ this.userProfileService.getFunctionalMenuStaticInfo().toPromise().then((res: any) => {
+ if (res == null || res.firstName == null || res.firstName == '' || res.lastName == null || res.lastName == '') {
+ // $log.info('HeaderCtrl: failed to get all required data, trying user profile');
+ this.userProfileService.getUserProfile().toPromise().then((profile: any) => {
+ this.firstName = profile.firstName;
+ this.lastName = profile.lastName;
+ }, (err) => {
+ // $log.error('Header Controller:: getUserProfile() failed: ' + err);
+ });
+ } else {
+ this.firstName = res.firstName;
+ this.lastName = res.lastName;
+ this.loginSnippetEmail = res.email;
+ this.loginSnippetUserid = res.userId;
+ this.lastLogin = Date.parse(res.last_login);
+ }
+ sessionStorage.userId = res.userId;
+ this.menusService.getFunctionalMenuForUser().toPromise().then((jsonHeaderMenu: any) => {
+ // $scope.menuItems = unflatten(jsonHeaderMenu);
+ // $scope.megaMenuDataObject = $scope.menuItems;
+ }, (err) => {
+ // $log.error('HeaderCtrl::GetFunctionalMenuForUser: HeaderCtrl json returned: ' + err);
+ });
+
+ }, (err) => {
+ // $log.error('HeaderCtrl::getFunctionalMenuStaticInfo failed: ' + err);
+ })
+ }
+
+ // unflatten = function( array, parent, tree ){
+
+ // tree = typeof tree !== 'undefined' ? tree : [];
+ // parent = typeof parent !== 'undefined' ? parent : { menuId: null };
+ // var children = _.filter( array, function(child){ return child.parentMenuId == parent.menuId; });
+
+ // if( !_.isEmpty( children ) ){
+ // if( parent.menuId === null ){
+ // tree = children;
+ // }else{
+ // parent['children'] = children
+ // }
+ // _.each( children, function( child ){ unflatten( array, child ) } );
+ // }
+
+ // return tree;
+ // }
+
+ getUserApplicationRoles() {
+ this.userapproles = [];
+ if (this.displayUserAppRoles) {
+ this.displayUserAppRoles = false;
+ } else {
+ this.displayUserAppRoles = true;
+ this.isLoading = true;
+ this.userProfileService.getUserAppRoles(this.loginSnippetUserid)
+ .subscribe((res: any) => {
+ this.isLoading = false;
+ for (var i = 0; i < res.length; i++) {
+ var userapprole = {
+ App: res[i].appName,
+ Roles: res[i].roleNames,
+ };
+ this.userapproles.push(userapprole);
+ }
+ }, (err) => {
+ this.isLoading = false;
+ });
+ }
+ }
+
+ allAppsLogout() {
+ this.firstName="";
+ this.lastName="";
+ this.displayUserAppRoles=false;
+ var cookieTabs = this.cookieService.get("visInVisCookieTabs").toString;
+ if(cookieTabs!=null){
+ for(var t in cookieTabs){
+
+ var url = cookieTabs[t].content;
+ if(url != "") {
+ this.menusService.logout(url);
+ }
+ }
+ }
+ // wait for individual applications to log out before the portal logout
+ setTimeout(function() {
+ window.location.href = "logout.htm";
+ }, 2000);
+ }
+
+ isToggled(): boolean {
+ const dom: Element = document.querySelector('body');
+ return dom.classList.contains(this.pushRightClass);
+ }
+
+ toggleSidebar() {
+ const dom: any = document.querySelector('body');
+ dom.classList.toggle(this.pushRightClass);
+ }
+
+ onLoggedout() {
+ localStorage.removeItem('isLoggedin');
+ }
+}
diff --git a/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.html b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.html
new file mode 100644
index 00000000..e2f4f3a0
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.html
@@ -0,0 +1,72 @@
+<!--
+ ============LICENSE_START==========================================
+ ONAP Portal
+ ===================================================================
+ Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the "License");
+ you may not use this software 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.
+
+ Unless otherwise specified, all documentation contained herein is licensed
+ under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ you may not use this documentation except in compliance with the License.
+ You may obtain a copy of the License at
+
+ https://creativecommons.org/licenses/by/4.0/
+
+ Unless required by applicable law or agreed to in writing, documentation
+ 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.
+
+ ============LICENSE_END============================================
+
+
+ -->
+
+<nav class="sidebar" [ngClass]="{sidebarPushRight: isActive, collapsed: collapsed}">
+ <div class="toggle-button" [ngClass]="{collapsed: collapsed}" (click)="toggleCollapsed()">
+ <i class="icon ion-md-arrow-{{collapsed?'dropright':'dropleft'}}" style="float:right"></i> <i
+ class="icon ion-md-arrow-{{collapsed?'dropright':'dropleft'}}" style="float:right"></i>&nbsp;
+ </div>
+ <div class="list-group" *ngFor="let menu of menuData ; index as item">
+ <a href="{{menu.href}}" *ngIf="!showOnlyParentMenu" [routerLinkActive]="['router-link-active']"
+ class="list-group-item">
+ <i class="icon ion-md-{{menu.imageSrc}}"></i>&nbsp;
+ <span>{{menu.name}}</span>
+ </a>
+ <a [routerLink]="menu.state" *ngIf="showOnlyParentMenu" [routerLinkActive]="['router-link-active']"
+ class="list-group-item">
+ <i class="icon ion-md-{{menu.imageSrc}}"></i>&nbsp;
+ <span>{{menu.name}}</span>
+ </a>
+ <div class="nested-menu" *ngIf="menu.menuItems.length > 0">
+ <a href="javascript:void(0)" class="list-group-item" (click)="addExpandClass(menu.name)">
+ <i class="fa fa-plus"></i>&nbsp;
+ <span>{{menu.name}}</span>
+ </a>
+ <li class="nested" [class.expand]="showMenu === menu.name">
+ <ul class="submenu">
+ <li *ngFor="let menuItems of menu.menuItems">
+ <a href="{{menuItems.href}}">
+ <i class="fa fa-monument"></i>&nbsp;
+ <span>{{ menuItems.name }}</span>
+ </a>
+ </li>
+ </ul>
+ </li>
+ </div>
+ </div>
+</nav> \ No newline at end of file
diff --git a/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.scss b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.scss
new file mode 100644
index 00000000..8d3c51fe
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.scss
@@ -0,0 +1,228 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+$topnav-background-color: #fff;
+.sidebar {
+ border-radius: 0;
+ position: relative;
+ z-index: 1000;
+ //top: 56px;
+ left: 270px;
+ width: 270px;
+ margin-left: -270px;
+ margin-bottom: 48px;
+ border: none;
+ border-radius: 0;
+ overflow-y: auto;
+ background-color: $topnav-background-color;
+ bottom: 0;
+ overflow-x: hidden;
+ padding-bottom: 40px;
+ white-space: nowrap;
+ -webkit-transition: all 0.2s ease-in-out;
+ -moz-transition: all 0.2s ease-in-out;
+ -ms-transition: all 0.2s ease-in-out;
+ -o-transition: all 0.2s ease-in-out;
+ transition: all 0.2s ease-in-out;
+ .list-group {
+ a.list-group-item {
+ background: $topnav-background-color;
+ border: 0;
+ border-top: 1px solid #999;
+ border-radius: 0;
+ color: #0568ae;
+ text-decoration: none;
+ .icon {
+ margin-right: 10px;
+ color: #000;
+ }
+ }
+ a:hover {
+ background: darken($topnav-background-color, 2%);
+ color: #000;
+ }
+ a.router-link-active {
+ background: darken($topnav-background-color, 5%);
+ color: #000;
+ }
+ .header-fields {
+ padding-top: 10px;
+
+ > .list-group-item:first-child {
+ border-top: 1px solid rgba(255, 255, 255, 0.2);
+ }
+ }
+ }
+ .sidebar-dropdown {
+ *:focus {
+ border-radius: none;
+ border: none;
+ }
+ .panel-title {
+ font-size: 1rem;
+ height: 50px;
+ margin-bottom: 0;
+ a {
+ color: #999;
+ text-decoration: none;
+ font-weight: 400;
+ background: $topnav-background-color;
+ span {
+ position: relative;
+ display: block;
+ padding: 0.75rem 1.5rem;
+ padding-top: 1rem;
+ }
+ }
+ a:hover,
+ a:focus {
+ color: #fff;
+ outline: none;
+ outline-offset: -2px;
+ }
+ }
+ .panel-title:hover {
+ background: darken($topnav-background-color, 5%);
+ }
+ .panel-collapse {
+ border-radious: 0;
+ border: none;
+ .panel-body {
+ .list-group-item {
+ border-radius: 0;
+ background-color: $topnav-background-color;
+ border: 0 solid transparent;
+ a {
+ color: #999;
+ }
+ a:hover {
+ color: #fff;
+ }
+ }
+ .list-group-item:hover {
+ background: darken($topnav-background-color, 5%);
+ }
+ }
+ }
+ }
+}
+
+.nested-menu {
+ .list-group-item {
+ cursor: pointer;
+ }
+ .nested {
+ list-style-type: none;
+ }
+ ul.submenu {
+ display: none;
+ height: 0;
+ }
+ & .expand {
+ ul.submenu {
+ display: block;
+ list-style-type: none;
+ height: auto;
+ li {
+ a {
+ color: #0568ae;
+ padding: 10px;
+ display: block;
+ }
+ }
+ }
+ }
+}
+@media screen and (max-width: 992px) {
+ .sidebar {
+ top: 54px;
+ left: 0px;
+ }
+}
+@media print {
+ .sidebar {
+ display: none !important;
+ }
+}
+@media (min-width: 992px) {
+ .header-fields {
+ display: none;
+ }
+}
+
+::-webkit-scrollbar {
+ width: 8px;
+}
+
+::-webkit-scrollbar-track {
+ -webkit-box-shadow: inset 0 0 0px rgba(255, 255, 255, 1);
+ border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb {
+ border-radius: 3px;
+ -webkit-box-shadow: inset 0 0 3px rgba(255, 255, 255, 1);
+}
+
+.toggle-button {
+ width: 270px;
+ cursor: pointer;
+ padding: 12px;
+ bottom: 0;
+ color: #0568ae;
+ background: #fff;
+ i {
+ font-size: 23px;
+ }
+ &:hover {
+ background: darken($topnav-background-color, 2%);
+ color: #000;
+ }
+ border-top: 1px solid #999;
+ -webkit-transition: all 0.2s ease-in-out;
+ -moz-transition: all 0.2s ease-in-out;
+ -ms-transition: all 0.2s ease-in-out;
+ -o-transition: all 0.2s ease-in-out;
+ transition: all 0.2s ease-in-out;
+}
+
+.collapsed {
+ width: 60px;
+ span {
+ display: none;
+ }
+}
diff --git a/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.spec.ts b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.spec.ts
new file mode 100644
index 00000000..92caeb42
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.spec.ts
@@ -0,0 +1,62 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SidebarComponent } from './sidebar.component';
+
+describe('SidebarComponent', () => {
+ let component: SidebarComponent;
+ let fixture: ComponentFixture<SidebarComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ SidebarComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(SidebarComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts
new file mode 100644
index 00000000..1c689e16
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts
@@ -0,0 +1,158 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { Component, Output, EventEmitter, OnInit, Input } from '@angular/core';
+import { Router, NavigationEnd } from '@angular/router';
+import { SidebarService } from '../../../shared/services/index'
+
+@Component({
+ selector: 'app-sidebar',
+ templateUrl: './sidebar.component.html',
+ styleUrls: ['./sidebar.component.scss']
+})
+export class SidebarComponent implements OnInit {
+ @Input() labelName: string;
+ isActive: boolean;
+ collapsed: boolean;
+ showMenu: string;
+ pushRightClass: string;
+ result: any;
+ showOnlyParentMenu: boolean;
+ leftParentData: any;
+ leftChildData: any;
+ menuData: Array<object> = [];
+ page: any;
+
+ @Output() collapsedEvent = new EventEmitter<boolean>();
+
+ constructor(public router: Router, public sidebarService: SidebarService) {
+ this.router.events.subscribe(val => {
+ if (
+ val instanceof NavigationEnd &&
+ window.innerWidth <= 992 &&
+ this.isToggled()
+ ) {
+ this.toggleSidebar();
+ }
+ });
+ }
+
+ ngOnInit() {
+ this.isActive = false;
+ this.collapsed = false;
+ this.showMenu = '';
+ this.pushRightClass = 'push-right';
+ this.sidebarService.getLeftMenu()
+ .subscribe(data => {
+ this.result = data;
+ if (this.result.data && this.result.data2) {
+ this.leftParentData = JSON.parse(this.result.data);
+ this.leftChildData = JSON.parse(this.result.data2);
+ } else {
+ this.labelName = this.result.label;
+ this.leftParentData = this.result.navItems;
+ this.showOnlyParentMenu = true;
+ }
+
+ for (var i = 0; i < this.leftParentData.length; i++) {
+ var parentItem = {
+ name: null,
+ imageSrc: null,
+ href: null,
+ menuItems: [],
+ state: null
+ }
+ if (this.showOnlyParentMenu) {
+ parentItem.name = this.leftParentData[i].name;
+ parentItem.imageSrc = this.leftParentData[i].imageSrc;
+ parentItem.state = '/'+this.leftParentData[i].state;
+ } else {
+ parentItem.name = this.leftParentData[i].label;
+ parentItem.imageSrc = this.leftParentData[i].imageSrc;
+ }
+ // Add link to items with no subitems
+ if (!this.showOnlyParentMenu) {
+ if (this.leftChildData[i].length == 0)
+ parentItem.href = this.leftParentData[i].action;
+
+ for (var j = 0; j < this.leftChildData[i].length; j++) {
+
+ var childItem = {
+ name: null,
+ href: null
+ };
+ if (this.leftChildData[i][j].label != null && this.leftChildData[i][j].label.length > 0) {
+
+ childItem.name = this.leftChildData[i][j].label;
+ childItem.href = this.leftChildData[i][j].action;
+ parentItem.menuItems.push(childItem);
+ }
+ }
+ }
+ this.menuData.push(parentItem);
+ }
+
+ });
+
+ }
+ eventCalled() {
+ this.isActive = !this.isActive;
+ }
+
+ addExpandClass(element: any) {
+ if (element === this.showMenu) {
+ this.showMenu = '0';
+ } else {
+ this.showMenu = element;
+ }
+ }
+
+ toggleCollapsed() {
+ this.collapsed = !this.collapsed;
+ this.collapsedEvent.emit(this.collapsed);
+ }
+
+ isToggled(): boolean {
+ const dom: Element = document.querySelector('body');
+ return dom.classList.contains(this.pushRightClass);
+ }
+
+ toggleSidebar() {
+ const dom: any = document.querySelector('body');
+ dom.classList.toggle(this.pushRightClass);
+ }
+}
diff --git a/portal-FE-common/src/app/layout/components/tabbar/tab.ts b/portal-FE-common/src/app/layout/components/tabbar/tab.ts
new file mode 100644
index 00000000..bdccdc18
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/tabbar/tab.ts
@@ -0,0 +1,50 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+import { SafeUrl } from '@angular/platform-browser';
+
+export class Tab {
+ label: string;
+ url: SafeUrl;
+ active: boolean;
+
+ constructor(label: string) {
+ this.label = label;
+ }
+
+}
diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html
new file mode 100644
index 00000000..31bb197c
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html
@@ -0,0 +1,97 @@
+<!--
+ ============LICENSE_START==========================================
+ ONAP Portal
+ ===================================================================
+ Copyright (C) 2017-2018 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the "License");
+ you may not use this software 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.
+
+ Unless otherwise specified, all documentation contained herein is licensed
+ under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ you may not use this documentation except in compliance with the License.
+ You may obtain a copy of the License at
+
+ https://creativecommons.org/licenses/by/4.0/
+
+ Unless required by applicable law or agreed to in writing, documentation
+ 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.
+
+ ============LICENSE_END============================================
+
+ -->
+
+ <div style="display: flex; flex-direction:column">
+
+ <mat-tab-group [selectedIndex]="selected.value" (selectedIndexChange)="selected.setValue($event)"
+ (selectedTabChange)="tabChanged($event)">
+ <mat-tab [label]="mainTab">
+ <!--
+ <mat-grid-list cols="5">
+ <mat-grid-tile [colspan]="1" [rowspan]="3">
+ <app-sidebar (collapsedEvent)="receiveCollapsed($event)"></app-sidebar>
+ <app-userbar></app-userbar>
+ </mat-grid-tile>
+ <mat-grid-tile [colspan]="4" style="height: calc(100vh - 24px);overflow-y: hidden">
+ <div class="container">
+ <router-outlet></router-outlet>
+ </div>
+ </mat-grid-tile>
+ </mat-grid-list>
+ -->
+
+
+ <div style="display: flex; flex-direction:column; overflow-y: scroll; height: calc(100vh - 100px)">
+ <div style="display: flex; flex-direction:row;">
+ <app-sidebar (collapsedEvent)="receiveCollapsed($event)"></app-sidebar>
+ <app-userbar></app-userbar>
+ <div class="container" style="margin-left: 370px;">
+ <router-outlet></router-outlet>
+ </div>
+ </div>
+ <app-footer></app-footer>
+ </div>
+
+ </mat-tab>
+
+ <mat-tab *ngFor="let tab of tabs; let index = index">
+ <ng-template mat-tab-label>
+ {{tab.label | elipsis: 13}} &nbsp;
+ <i class="icon ion-md-close-circle" (click)="removeTab(index)"></i>
+ </ng-template>
+
+
+ </mat-tab>
+
+ </mat-tab-group>
+
+
+
+
+
+ <div *ngFor="let tab of tabs; let index = index"
+ [style.display]='tab.active? "inline" : "none"'
+ [style.position]='tab.active? "static" : "absolute"'
+ [style.height]='tab.active? "calc(100vh)" : "calc(0vh)"'>
+
+ <iframe id="tabframe-{{tab.label.split(' ').join('-')}}" scrolling='yes' frameBorder='0' width='100%'
+ scrolling='yes' frameBorder='0' width='100%' height='90%' [src]='tab.url'></iframe>
+
+ </div>
+
+
+ </div>
diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.scss b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.scss
new file mode 100644
index 00000000..807e2d57
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.scss
@@ -0,0 +1,80 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+ .input-label,
+ .add-tab-button,
+ .delete-tab-button {
+ margin: 8px;
+ }
+ .search-bar {
+ position: absolute;
+ right: 10%;
+ }
+
+ #mat-tab-label-0-1 {
+ position: fixed;
+ right: 1em;
+ }
+
+ .mat-tab-group{
+ margin-top: 55px;
+ }
+
+ ::ng-deep .mat-tab-label {
+ font-size: 13px !important;
+ line-height: 30px !important;
+ margin: 5px 0px 0 !important;
+ border-top-left-radius: 88px 205px !important;
+ border-top-right-radius: 88px 205px !important;
+ padding: 0 30px 0 25px !important;
+ height: 35px !important;
+ background: #d2d2d2 !important;
+ position: relative !important;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5) !important;
+ width: 180px !important;
+ max-width: 200px !important;
+ min-width: 20px !important;
+ border: 1px solid #aaa !important;
+ text-transform: capitalize !important;
+ text-align: left !important;
+ }
+
+
+ ::ng-deep .mat-tab-label.mat-ripple.ng-star-inserted.mat-tab-label-active {
+ opacity: 1;
+ } \ No newline at end of file
diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts
new file mode 100644
index 00000000..94866e4e
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts
@@ -0,0 +1,63 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2017-2018 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TabbarComponent } from './tabbar.component';
+
+describe('TabbarComponent', () => {
+ let component: TabbarComponent;
+ let fixture: ComponentFixture<TabbarComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ TabbarComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(TabbarComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts
new file mode 100644
index 00000000..7a10e39d
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts
@@ -0,0 +1,95 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2017-2018 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { Component, OnInit } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { DomSanitizer } from '@angular/platform-browser';
+import { Tab } from './tab';
+import { AddTabFunctionService } from 'src/app/shared/services/tab/add-tab-function.service';
+
+@Component({
+ selector: 'app-tabbar',
+ templateUrl: './tabbar.component.html',
+ styleUrls: ['./tabbar.component.scss']
+})
+export class TabbarComponent implements OnInit {
+
+ tabs = [];
+ mainTab = 'Home';
+ selected = new FormControl(0);
+ collapedSideBar: boolean;
+
+ constructor(private sanitizer: DomSanitizer, private addTabFuntionService: AddTabFunctionService) {
+
+ }
+
+ ngOnInit(): void {
+
+ this.addTabFuntionService.listen().subscribe((m: any) => {
+ console.log(m);
+ this.addTab(true, m.title, m.url);
+ })
+ }
+
+ addTab(selectAfterAdding: boolean, label: string, url: string) {
+ const tab = new Tab(label);
+ tab.url = this.sanitizer.bypassSecurityTrustResourceUrl(url);
+ tab.active = true;
+ this.tabs.push(tab);
+
+ if (selectAfterAdding) {
+ this.selected.setValue(this.tabs.length);
+ }
+ }
+
+ removeTab(index: number) {
+ this.tabs.splice(index, 1);
+ }
+
+ receiveCollapsed($event) {
+ this.collapedSideBar = $event;
+ }
+
+ tabChanged($event) {
+
+ for (const ttab of this.tabs) {
+ ttab.active = false;
+ }
+ if(this.tabs.length != 0 && $event.index != 0)
+ this.tabs[$event.index - 1].active = true;
+ }
+}
diff --git a/portal-FE-common/src/app/layout/components/userbar/userbar.component.html b/portal-FE-common/src/app/layout/components/userbar/userbar.component.html
new file mode 100644
index 00000000..0ff5a554
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/userbar/userbar.component.html
@@ -0,0 +1,51 @@
+<!--
+ ============LICENSE_START==========================================
+ ONAP Portal
+ ===================================================================
+ Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the "License");
+ you may not use this software 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.
+
+ Unless otherwise specified, all documentation contained herein is licensed
+ under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ you may not use this documentation except in compliance with the License.
+ You may obtain a copy of the License at
+
+ https://creativecommons.org/licenses/by/4.0/
+
+ Unless required by applicable law or agreed to in writing, documentation
+ 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.
+
+ ============LICENSE_END============================================
+
+
+ -->
+
+<button type="button" class="btn btn-primary" href="javascript:void(0)"
+[ngStyle]="{'right': isOpen ? '65px' : '-18px' }" (click)="toggleSidebar()">
+ <span id="user-chevron-down" class="icon-controls-down" [hidden]="!isOpen">Close</span>
+ <span id="user-chevron-up" class="icon-controls-upPRIMARY" [hidden]="isOpen"><span class="right-menu-button"><i
+ class="icon ion-md-arrow-dropup"></i> Users</span></span>
+</button>
+<nav [ngStyle]="{'right': isOpen ? '18px' : '-75px' }" class="usb-item usb-item-vertical usb-item-right" id="usb-item-s2">
+ <h3>Online Users</h3>
+ <div *ngFor="let user of userList" style="font-size: 10px;">
+ <a [href]="user.linkQ"><img class="activeUserIcon" [src]="user.linkPic" alt="User Link"></a>
+ <div class="userId-txt">{{user.userId}}</div>
+ </div>
+</nav> \ No newline at end of file
diff --git a/portal-FE-common/src/app/layout/components/userbar/userbar.component.scss b/portal-FE-common/src/app/layout/components/userbar/userbar.component.scss
new file mode 100644
index 00000000..81801104
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/userbar/userbar.component.scss
@@ -0,0 +1,114 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+.usb-item {
+ background: #fff;
+ position: fixed;
+}
+
+.usb-item h3 {
+ color: #ef6f00;
+ font-size: 14px;
+ padding: 20px;
+ margin: 0;
+ text-align: center;
+ font-weight: 300;
+ background: #f8f9fa;
+}
+
+.usb-item a {
+ display: block;
+ color: #fff;
+ font-size: 1.1em;
+ font-weight: 300;
+ transition: all 0.2s ease-in-out;
+ -ms-transition: all 0.2s ease-in-out; /* IE 9 */
+ -webkit-transition: all 0.2s ease-in-out; /* Safari 3-8 */
+}
+
+.usb-item a:active {
+ background: #afdefa;
+ color: #47a3da;
+}
+
+.usb-item-right {
+ transition: all 0.5s ease-in-out;
+ -ms-transition: all 0.5s ease-in-out; /* IE 9 */
+ -webkit-transition: all 0.5s ease-in-out; /* Safari 3-8 */
+}
+
+.usb-item a:hover {
+ -ms-transform: scale(1.5); /* IE 9 */
+ -webkit-transform: scale(1.5); /* Safari 3-8 */
+ transform: scale(1.5);
+}
+
+.usb-item-vertical {
+ margin-top: 105px;
+ text-align: center;
+ width: 75px;
+ height: 79%;
+ top: 0;
+ z-index: 1000;
+ box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
+}
+
+.usb-item-vertical a {
+ padding: 0.5em;
+}
+
+button {
+ transition: all 0.5s ease-in-out;
+ -ms-transition: all 0.5s ease-in-out; /* IE 9 */
+ -webkit-transition: all 0.5s ease-in-out; /* Safari 3-8 */
+ z-index: 9999;
+ top: 450px;
+ -ms-transform: rotate(-90deg); /* IE 9 */
+ -webkit-transform: rotate(-90deg); /* Safari 3-8 */
+ transform: rotate(-90deg);
+ position: fixed;
+}
+
+.activeUserIcon {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ height: 55px;
+ width: 55px;
+ border-radius: 50%;
+}
diff --git a/portal-FE-common/src/app/layout/components/userbar/userbar.component.spec.ts b/portal-FE-common/src/app/layout/components/userbar/userbar.component.spec.ts
new file mode 100644
index 00000000..62b9c543
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/userbar/userbar.component.spec.ts
@@ -0,0 +1,63 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserbarComponent } from './userbar.component';
+
+describe('UserbarComponent', () => {
+ let component: UserbarComponent;
+ let fixture: ComponentFixture<UserbarComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ UserbarComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(UserbarComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/components/userbar/userbar.component.ts b/portal-FE-common/src/app/layout/components/userbar/userbar.component.ts
new file mode 100644
index 00000000..661317bf
--- /dev/null
+++ b/portal-FE-common/src/app/layout/components/userbar/userbar.component.ts
@@ -0,0 +1,133 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { Component, OnInit } from '@angular/core';
+import { UserbarService, UserProfileService } from 'src/app/shared/services';
+import { DomSanitizer } from '@angular/platform-browser';
+import { environment } from 'src/environments/environment';
+
+@Component({
+ selector: 'app-userbar',
+ templateUrl: './userbar.component.html',
+ styleUrls: ['./userbar.component.scss']
+})
+export class UserbarComponent implements OnInit {
+
+ userList;
+ isOpen: boolean;
+ intervalPromise = null;
+ updateRate: number;
+ myservice: UserbarService;
+ api = environment.api;
+ constructor(private sanitizer: DomSanitizer, private userbarService: UserbarService, private userProfileService: UserProfileService) { }
+
+ ngOnInit() {
+ this.userList = [];
+ this.myservice = this.userbarService;
+ this.isOpen = true;
+ // this.userbarService.getOnlineUserUpdateRate().subscribe((_res: any) => {
+ // if (_res != null) {
+ // var rate = parseInt(_res.onlineUserUpdateRate);
+ // var duration = parseInt(_res.onlineUserUpdateDuration);
+ // this.userbarService.setMaxRefreshCount((duration / rate) + 1);
+ // this.userbarService.setRefreshCount(this.userbarService.maxCount);
+ // if (rate != NaN && duration != NaN) {
+ // // $log.debug('UserbarCtlr: scheduling function at interval ' + millis);
+ // this.updateRate = rate;
+ // this.start(this.updateRate);
+ // }
+ // }
+ // })
+ this.updateActiveUsers();
+ }
+
+ updateActiveUsers() {
+ // this.userbarService.decrementRefreshCount();
+ this.userProfileService.getActiveUser().subscribe((_res: any) => {
+ if (_res == null) {
+ // $log.error('UserbarCtrl::updateActiveUsers: failed to get active user');
+ this.stop();
+ } else {
+ var maxItems = 25;
+ if (_res.length < maxItems)
+ maxItems = _res.length;
+ for (var i = 0; i < maxItems; i++) {
+ var data = {
+ userId: _res[i],
+ linkQ: this.api.linkQ,
+ linkPic: this.api.linkPic
+ }
+ this.userList.push(data);
+ }
+ }
+
+ }, (err) => {
+ this.userList = [];
+ this.stop();
+ })
+
+ // .add(() => {
+ // var footerOff = $('#online-userbar').offset().top;
+ // var headOff = $('#footer').offset().top;
+ // var defaultOffSet = 45;
+ // $(".online-user-container").css({
+ // "height": headOff - footerOff - defaultOffSet
+ // });
+ // })
+
+ }
+
+ toggleSidebar() {
+ this.isOpen = !this.isOpen;
+ }
+
+ start(rate) {
+ // stops any running interval to avoid two intervals running at the same time
+ this.stop();
+ // store the interval promise
+ this.intervalPromise = setInterval(this.updateActiveUsers, rate);
+ }
+
+
+ stop() {
+ if (this.intervalPromise != null) {
+ clearInterval(this.intervalPromise);
+ this.intervalPromise = null;
+ }
+ }
+
+}
diff --git a/portal-FE-common/src/app/layout/layout-routing.module.ts b/portal-FE-common/src/app/layout/layout-routing.module.ts
new file mode 100644
index 00000000..5fa77e3a
--- /dev/null
+++ b/portal-FE-common/src/app/layout/layout-routing.module.ts
@@ -0,0 +1,57 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { LayoutComponent } from './layout.component';
+
+const routes: Routes = [
+ {
+ path: '',
+ component: LayoutComponent,
+ children: [
+ //redirecting to pages module
+ { path: '', redirectTo: 'app', },
+ { path: 'app', loadChildren: () => import('../pages/pages.module').then(m => m.PagesModule) }, ]
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule]
+})
+export class LayoutRoutingModule {}
diff --git a/portal-FE-common/src/app/layout/layout.component.html b/portal-FE-common/src/app/layout/layout.component.html
new file mode 100644
index 00000000..fa7ada03
--- /dev/null
+++ b/portal-FE-common/src/app/layout/layout.component.html
@@ -0,0 +1,44 @@
+<!--
+ ============LICENSE_START==========================================
+ ONAP Portal
+ ===================================================================
+ Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the "License");
+ you may not use this software 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.
+
+ Unless otherwise specified, all documentation contained herein is licensed
+ under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ you may not use this documentation except in compliance with the License.
+ You may obtain a copy of the License at
+
+ https://creativecommons.org/licenses/by/4.0/
+
+ Unless required by applicable law or agreed to in writing, documentation
+ 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.
+
+ ============LICENSE_END============================================
+
+
+ -->
+
+ <app-header></app-header>
+ <app-tabbar></app-tabbar>
+
+
+
+
diff --git a/portal-FE-common/src/app/layout/layout.component.scss b/portal-FE-common/src/app/layout/layout.component.scss
new file mode 100644
index 00000000..a8adf264
--- /dev/null
+++ b/portal-FE-common/src/app/layout/layout.component.scss
@@ -0,0 +1,68 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+* {
+ -webkit-transition: margin-left 0.2s ease-in-out;
+ -moz-transition: margin-left 0.2s ease-in-out;
+ -ms-transition: margin-left 0.2s ease-in-out;
+ -o-transition: margin-left 0.2s ease-in-out;
+ transition: margin-left 0.2s ease-in-out;
+}
+.main-container {
+ margin-top: 56px;
+ margin-left: 270px;
+ padding: 15px;
+ -ms-overflow-x: hidden;
+ overflow-x: hidden;
+ overflow-y: scroll;
+ position: relative;
+ overflow: hidden;
+}
+.collapsed {
+ margin-left: 60px;
+}
+@media screen and (max-width: 992px) {
+ .main-container {
+ margin-left: 0px !important;
+ }
+}
+@media print {
+ .main-container {
+ margin-top: 0px !important;
+ margin-left: 0px !important;
+ }
+}
diff --git a/portal-FE-common/src/app/layout/layout.component.spec.ts b/portal-FE-common/src/app/layout/layout.component.spec.ts
new file mode 100644
index 00000000..5184fe43
--- /dev/null
+++ b/portal-FE-common/src/app/layout/layout.component.spec.ts
@@ -0,0 +1,62 @@
+/*-
+ * ============LICENSE_START==========================================
+ * ONAP Portal
+ * ===================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LayoutComponent } from './layout.component';
+
+describe('LayoutComponent', () => {
+ let component: LayoutComponent;
+ let fixture: ComponentFixture<LayoutComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ LayoutComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LayoutComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/portal-FE-common/src/app/layout/layout.component.ts b/portal-FE-common/src/app/layout/layout.component.ts
new file mode 100644
index 00000000..b512988d
--- /dev/null
+++ b/portal-FE-common/src/app/layout/layout.component.ts
@@ -0,0 +1,56 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright © 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-layout',
+ templateUrl: './layout.component.html',
+ styleUrls: ['./layout.component.scss']
+})
+export class LayoutComponent implements OnInit {
+
+ collapedSideBar: boolean;
+
+ constructor() {}
+
+ ngOnInit() {}
+
+ receiveCollapsed($event) {
+ this.collapedSideBar = $event;
+ }
+}
diff --git a/portal-FE-common/src/app/layout/layout.module.ts b/portal-FE-common/src/app/layout/layout.module.ts
new file mode 100644
index 00000000..63a99d86
--- /dev/null
+++ b/portal-FE-common/src/app/layout/layout.module.ts
@@ -0,0 +1,65 @@
+/*
+ * ============LICENSE_START==========================================
+ * ONAP Portal SDK
+ * ===================================================================
+ * Copyright � 2019 AT&T Intellectual Property. All rights reserved.
+ * ===================================================================
+ *
+ * Unless otherwise specified, all software contained herein is licensed
+ * under the Apache License, Version 2.0 (the "License");
+ * you may not use this software 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.
+ *
+ * Unless otherwise specified, all documentation contained herein is licensed
+ * under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+ * you may not use this documentation except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://creativecommons.org/licenses/by/4.0/
+ *
+ * Unless required by applicable law or agreed to in writing, documentation
+ * 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.
+ *
+ * ============LICENSE_END============================================
+ *
+ *
+ */
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
+import { NgMaterialModule } from '../ng-material-module';
+import { LayoutRoutingModule } from './layout-routing.module';
+import { LayoutComponent } from './layout.component';
+import { SidebarComponent } from './components/sidebar/sidebar.component';
+import { HeaderComponent } from './components/header/header.component';
+import { GlobalSearchComponent } from './components/global-search/global-search.component';
+import { ClickOutsideModule } from 'ng-click-outside';
+import { TabbarComponent } from './components/tabbar/tabbar.component';
+import { HeaderMenuComponent } from './components/header-menu/header-menu.component';
+import { UserbarComponent } from './components/userbar/userbar.component';
+import { FooterComponent } from './components/footer/footer.component';
+import { ApplicationPipesModule } from '../shared/pipes/application-pipes.module';
+
+@NgModule({
+ imports: [
+ CommonModule,
+ NgMaterialModule,
+ LayoutRoutingModule,
+ ApplicationPipesModule,
+ NgbDropdownModule,
+ ClickOutsideModule
+ ],
+ declarations: [LayoutComponent, SidebarComponent, HeaderComponent,GlobalSearchComponent, TabbarComponent, HeaderMenuComponent, UserbarComponent, FooterComponent]
+})
+export class LayoutModule {}