summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--usecaseui-portal/package.json2
-rw-r--r--usecaseui-portal/src/app/app.component.html53
-rw-r--r--usecaseui-portal/src/app/app.component.less2
-rw-r--r--usecaseui-portal/src/app/app.component.ts74
4 files changed, 46 insertions, 85 deletions
diff --git a/usecaseui-portal/package.json b/usecaseui-portal/package.json
index 9bfae90f..8001ac14 100644
--- a/usecaseui-portal/package.json
+++ b/usecaseui-portal/package.json
@@ -37,7 +37,7 @@
"lodash": "^4.17.15",
"ng-zorro-antd": "^0.7.1",
"ngx-echarts": "^2.2.0",
- "rxjs": "^5.5.6",
+ "rxjs": "^5.5.12",
"zone.js": "^0.8.19"
},
"devDependencies": {
diff --git a/usecaseui-portal/src/app/app.component.html b/usecaseui-portal/src/app/app.component.html
index e0051383..26e736de 100644
--- a/usecaseui-portal/src/app/app.component.html
+++ b/usecaseui-portal/src/app/app.component.html
@@ -19,66 +19,61 @@
<img src="assets/images/uui-logo130.png" alt="">
</div>
<ul nz-menu [nzTheme]="'dark'" [nzMode]="'inline'">
- <li nz-menu-item [ngClass]="{'activeMenuBar':activeMenuBar[0] == true}" (click)="thisActive(0)">
+ <li nz-menu-item [ngClass]="{'activeMenuBar': url === 'home'}">
<a routerLink="home">
<span title>
<i>
- <img
- src="{{activeMenuBar[0] == true ? 'assets/images/home-icon-active.png':'assets/images/home-icon.png'}}"
- alt="home">
+ <img src="{{ url === 'home' ? 'assets/images/home-icon-active.png':'assets/images/home-icon.png'}}" alt="home">
</i>
<span> {{"i18nTextDefine_Home" | translate}} </span>
</span>
</a>
</li>
<hr>
- <li nz-menu-item [ngClass]="{'activeMenuBar':activeMenuBar[1] == true}" (click)="thisActive(1)">
+ <li nz-menu-item [ngClass]="{'activeMenuBar': url === 'management'}">
<a routerLink="management">
<span title>
- <i>
- <img
- src="{{activeMenuBar[1] == true ? 'assets/images/customer-icon-active.png':'assets/images/customer-icon.png'}}"
- alt="home">
+ <i>
+ <img src="{{url === 'management' ? 'assets/images/customer-icon-active.png':'assets/images/customer-icon.png'}}" alt="home">
</i>
<span> {{"i18nTextDefine_Customer" | translate}} </span>
</span>
</a>
</li>
<hr>
- <li nz-menu-item [ngClass]="{'activeMenuBar':activeMenuBar[2]== true}" (click)="thisActive(2)">
- <a href="#" onclick="window.open('http://172.30.1.80:5601/app/kibana#/dashboards')">
+ <li nz-menu-item [ngClass]="{'activeMenuBar': url === 'fcaps'}">
+ <a routerLink="fcaps">
<span title>
<i>
- <img
- src="{{activeMenuBar[2] == true ? 'assets/images/monitor-icon-active.png':'assets/images/monitor-icon.png'}}"
- alt="home">
+ <img src="{{ url === 'fcaps' ? 'assets/images/monitor-icon-active.png':'assets/images/monitor-icon.png'}}" alt="home">
</i>
<span> {{"i18nTextDefine_Monitor" | translate}} </span>
</span>
</a>
</li>
<hr>
- <li nz-submenu [ngClass]="{'activeMenuBar':activeMenuBar[3] == true}" (click)="thisActive(3)">
- <span title> <i>
- <img
- src="{{activeMenuBar[3] == true ? 'assets/images/Services-icon-active.png':'assets/images/Services-icon.png'}}"
- alt="home">
- </i> {{"i18nTextDefine_Services" | translate}} </span>
+ <li nz-submenu [ngClass]="{'activeMenuBar': url.indexOf('services') === 0}" [nzOpen]="flag">
+ <span title>
+ <i>
+ <img src="{{url.indexOf('services') === 0 ? 'assets/images/Services-icon-active.png':'assets/images/Services-icon.png'}}" alt="home">
+ </i>
+ {{"i18nTextDefine_Services" | translate}}
+ </span>
<ul>
- <li nz-menu-item [ngClass]="{'activeMenuList':activeMenuList[0] == true}" (click)="thisListActive(0)"><a
- routerLink='services/services-list'> {{"i18nTextDefine_ServicesList" | translate}} </a></li>
- <li nz-menu-item [ngClass]="{'activeMenuList':activeMenuList[1] == true}" (click)="thisListActive(1)"><a
- routerLink='services/onboard-vnf-vm'> {{"i18nTextDefine_PackageManagement" | translate}} </a></li>
+ <li nz-menu-item [ngClass]="{'activeMenuList': url === 'services/services-list'}">
+ <a routerLink='services/services-list'> {{"i18nTextDefine_ServicesList" | translate}} </a>
+ </li>
+ <li nz-menu-item [ngClass]="{'activeMenuList': url === 'services/onboard-vnf-vm'}">
+ <a routerLink='services/onboard-vnf-vm'> {{"i18nTextDefine_PackageManagement" | translate}} </a>
+ </li>
</ul>
</li>
<hr>
- <li nz-menu-item [ngClass]="{'activeMenuBar':activeMenuBar[4] == true}" (click)="thisActive(4)">
+ <li nz-menu-item [ngClass]="{'activeMenuBar': url === 'network'}">
<a routerLink="network">
<span title>
- <i>
- <img
- src="{{activeMenuBar[4] == true ? 'assets/images/network-icon-active.png':'assets/images/network-icon.png'}}"
- alt="home">
+ <i>
+ <img src="{{url === 'network' ? 'assets/images/network-icon-active.png':'assets/images/network-icon.png'}}" alt="home">
</i>
<span> {{"i18nTextDefine_NetworkTopology" | translate}} </span>
</span>
diff --git a/usecaseui-portal/src/app/app.component.less b/usecaseui-portal/src/app/app.component.less
index 4055dc81..ade860b1 100644
--- a/usecaseui-portal/src/app/app.component.less
+++ b/usecaseui-portal/src/app/app.component.less
@@ -28,7 +28,7 @@ nz-layout {
left: 0;
z-index: 100;
height: 100vh;
- background: #313449 url('../assets/images/UUIMenuBar.png') no-repeat;
+ background: #313449 url('assets/images/UUIMenuBar.png') no-repeat;
background-size: 100%;
.siderContent{
width: 100%;
diff --git a/usecaseui-portal/src/app/app.component.ts b/usecaseui-portal/src/app/app.component.ts
index d654900c..7306db1c 100644
--- a/usecaseui-portal/src/app/app.component.ts
+++ b/usecaseui-portal/src/app/app.component.ts
@@ -17,7 +17,8 @@ import {Component} from '@angular/core';
import {TranslateService} from '@ngx-translate/core';
import {MyhttpService} from "./core/services/myhttp.service";
import {HomesService} from "./core/services/homes.service";
-
+import {NavigationEnd, Router} from '@angular/router';
+import 'rxjs/add/operator/map';
@Component({
selector: 'app-root',
@@ -25,10 +26,20 @@ import {HomesService} from "./core/services/homes.service";
styleUrls: ['./app.component.less']
})
export class AppComponent {
+ public url:string = 'home';
- constructor(private translate: TranslateService,private myhttp: HomesService) {
+ constructor(private translate: TranslateService,private myhttp: HomesService,private router:Router,) {
this.currentLanguageGet();
- // translate.use('en');
+ this.getUrl();
+
+
+ }
+ getUrl(){
+ this.router.events.map(event=> {
+ if(event instanceof NavigationEnd){
+ this.url = event['url'].slice(1)
+ }
+ }).subscribe(event=>{})
}
@@ -57,57 +68,12 @@ export class AppComponent {
sessionStorage.setItem("DefaultLang",this.currentLanguage);
}
}
- activeMenuBar =[true,false,false,false,false];
- activeMenuList =[false,false];
- thisActive(item){
- if(this.activeMenuBar[item] == true){
- this.activeMenuBar.map((its,index) => {
- if(item != index){
- this.activeMenuBar[index] = false;
- }
- })
- }else {
- this.activeMenuBar.map((its,index) => {
- if(item == index){
- this.activeMenuBar[item] = true;
- }else {
- this.activeMenuBar[index] = false;
- }
- })
- this.activeMenuList.map((its,index) => {
- this.activeMenuList[index] = false;
- })
+ get flag () {
+ if(!this.url.indexOf('services')){
+ return true
+ }else{
+ return false
}
}
- thisListActive(item){
- if(this.activeMenuBar[3] = true){
- if(this.activeMenuList[item] == true){
- this.activeMenuList.map((its,index) => {
- if(item != index){
- this.activeMenuList[index] = false;
- }
- })
- }else {
- this.activeMenuList.map((its,index) => {
- if(item == index){
- this.activeMenuList[item] = true;
- }else {
- this.activeMenuList[index] = false;
- }
- })
-
- }
- }else {
- this.activeMenuList.map((its,index) => {
- this.activeMenuList[index] = false;
- })
- }
- }
- //
- // selectLanguage = "en";
-
- // changeLanguage(item){
- // this.selectLanguage = item;
- // this.translate.use(item);
- // }
+
}