X-Git-Url: https://osm.etsi.org/gitweb/?a=blobdiff_plain;f=src%2Fapp%2Flayouts%2Fbreadcrumb%2FBreadcrumbComponent.ts;fp=src%2Fapp%2Flayouts%2Fbreadcrumb%2FBreadcrumbComponent.ts;h=ccb9588c12565815268ed0a127123730220772dc;hb=3b4814aa2d3dec621dadb52f058ba95a3dc3a86a;hp=0000000000000000000000000000000000000000;hpb=1434673f8f8dc53bce5c350f04ac8df67b2ff84f;p=osm%2FNG-UI.git

diff --git a/src/app/layouts/breadcrumb/BreadcrumbComponent.ts b/src/app/layouts/breadcrumb/BreadcrumbComponent.ts
new file mode 100644
index 0000000..ccb9588
--- /dev/null
+++ b/src/app/layouts/breadcrumb/BreadcrumbComponent.ts
@@ -0,0 +1,140 @@
+/*
+ Copyright 2020 TATA ELXSI
+
+ Licensed under the Apache License, Version 2.0 (the 'License');
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+ Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
+*/
+/**
+ * @file Bread Crumb component.
+ */
+import { Component, Injector, OnInit } from '@angular/core';
+import { ActivatedRoute, NavigationEnd, Router, RouterEvent, UrlSegment } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
+import { BREADCRUMBITEM } from 'CommonModel';
+import { filter, startWith } from 'rxjs/operators';
+import { isNullOrUndefined } from 'util';
+
+/**
+ * Creating component
+ * @Component takes BreadcrumbComponent.html as template url
+ */
+@Component({
+  selector: 'app-breadcrumb',
+  templateUrl: './BreadcrumbComponent.html',
+  styleUrls: ['./BreadcrumbComponent.scss']
+})
+
+/** Exporting a class @exports BreadcrumbComponent */
+export class BreadcrumbComponent implements OnInit {
+  /** To inject breadCrumb @public */
+  public static readonly ROUTE_DATA_BREADCRUMB: string = 'breadcrumb';
+
+  /** To inject services @public */
+  public injector: Injector;
+
+  /** To inject breadCrumb Default icon and url @public */
+  public readonly home: {} = { icon: 'pi pi-th-large', url: '/' };
+
+  /** To inject breadCrumb Menus @public */
+  public menuItems: BREADCRUMBITEM[];
+
+  /** Service holds the router information @private */
+  private router: Router;
+
+  /** Holds teh instance of AuthService class of type AuthService @private */
+  private activatedRoute: ActivatedRoute;
+
+  /** handle translate service @private */
+  private translateService: TranslateService;
+
+  constructor(injector: Injector) {
+    this.injector = injector;
+    this.router = this.injector.get(Router);
+    this.activatedRoute = this.injector.get(ActivatedRoute);
+    this.translateService = this.injector.get(TranslateService);
+  }
+  /** Lifecyle Hooks the trigger before component is instantiate @public */
+  public ngOnInit(): void {
+    this.router.events
+      .pipe(filter((event: RouterEvent) => event instanceof NavigationEnd), startWith(undefined))
+      .subscribe(() => this.menuItems = this.createBreadcrumbs(this.activatedRoute.root));
+  }
+
+  /** Generate breadcrumbs from data given the module routes @private */
+  private createBreadcrumbs(route: ActivatedRoute, url: string = '', breadcrumbs: BREADCRUMBITEM[] = []):
+    BREADCRUMBITEM[] {
+    const children: ActivatedRoute[] = route.children;
+    if (children.length === 0) {
+      return breadcrumbs;
+    }
+    for (const child of children) {
+      const routeURL: string = child.snapshot.url.map((segment: UrlSegment) => segment.path).join('/');
+      if (routeURL !== '') {
+        url += `/${routeURL}`;
+      }
+      let menuLIst: BREADCRUMBITEM[] = child.snapshot.data[BreadcrumbComponent.ROUTE_DATA_BREADCRUMB];
+      if (!isNullOrUndefined(menuLIst)) {
+        menuLIst = JSON.parse(JSON.stringify(menuLIst));
+        menuLIst.forEach((item: BREADCRUMBITEM) => {
+          if (!isNullOrUndefined(item.title)) {
+            item.title = item.title.replace('{type}', this.checkTitle(item, child.snapshot.params.type));
+            item.title = item.title.replace('{id}', child.snapshot.params.id);
+            item.title = item.title.replace('{project}', localStorage.getItem('project'));
+          }
+          if (!isNullOrUndefined(item.url)) {
+            item.url = item.url.replace('{type}', child.snapshot.params.type);
+            item.url = item.url.replace('{id}', child.snapshot.params.id);
+          }
+          breadcrumbs.push(item);
+        });
+      }
+      return this.createBreadcrumbs(child, url, breadcrumbs);
+    }
+  }
+  /** Check and update title based on type of operations @private */
+  private checkTitle(breadcrumbItem: BREADCRUMBITEM, opertionType: string): string {
+    if (!isNullOrUndefined(breadcrumbItem.url)) {
+      if (breadcrumbItem.url.indexOf('packages') !== -1) {
+        return this.matchPackageTitle(opertionType);
+      }
+      if (breadcrumbItem.url.indexOf('instances') !== -1) {
+        return this.matchInstanceTitle(opertionType);
+      }
+      return breadcrumbItem.title;
+    }
+  }
+  /** check and update package title based on package type @private */
+  private matchPackageTitle(opertionType: string): string {
+    if (opertionType === 'ns') {
+      return this.translateService.instant('NSPACKAGES');
+    } else if (opertionType === 'vnf') {
+      return this.translateService.instant('VNFPACKAGES');
+    } else {
+      return this.translateService.instant('PAGE.DASHBOARD.NETSLICETEMPLATE');
+    }
+  }
+  /** check and update package title based on instance type @private */
+  private matchInstanceTitle(opertionType: string): string {
+    if (opertionType === 'ns') {
+      return this.translateService.instant('NSINSTANCES');
+    } else if (opertionType === 'vnf') {
+      return this.translateService.instant('VNFINSTANCES');
+    } else if (opertionType === 'pdu') {
+      return this.translateService.instant('PDUINSTANCES');
+    } else {
+      return this.translateService.instant('PAGE.DASHBOARD.NETSLICEINSTANCE');
+    }
+  }
+
+}