agmission/Development/client/src/app/app.menu.component.ts

import { Component, OnInit } from '@angular/core';
import { AppMainComponent } from './app.main.component';

import { AuthService } from './domain/services/auth.service';
import { RoleIds } from './shared/global';

import { MenuItem } from 'primeng/api';

@Component({
  selector: 'app-menu',
  template: `
    <ul class="ultima-menu ultima-main-menu clearfix">
	    <li app-menuitem *ngFor="let item of model; let i = index;" [item]="item" [index]="i" [root]="true"></li>
    </ul>
  `
})
export class AppMenuComponent implements OnInit {
  /**
   Convention: every root item with children must have routerLink for selected check after page reloaded
  **/
  model: any[];

  constructor(

    public readonly app: AppMainComponent,
    private readonly authSvc: AuthService) {

  }

  ngOnInit() {
    const mItems: MenuItem[] = [
      { id: 'dashboard', label: $localize`:@@dashboard:Dashboard`, icon: 'dashboard', routerLink: ['/home'] }
    ];
    if (this.authSvc.hasRole([RoleIds.ADMIN])) {
      mItems.push(
        ...[
          { id: 'customers', label: $localize`:@@customers:Customers`, icon: 'assignment_ind', routerLink: ['/customers'] },
          { label: $localize`:@@billing:Billing`, icon: 'monetization_on', routerLink: ['/billing'] },
          // { label: $localize`:@@reports:Reports`, icon: 'print', routerLink: ['/reports'] },
        ]);
    } else {
      if (this.authSvc.hasRole([RoleIds.APP, RoleIds.APP_ADM])) {
        mItems.push({ id: 'accounts', label: $localize`:@@accounts:Accounts`, icon: 'assignment_ind', routerLink: ['/accounts'] });
      }

      if (!this.authSvc.isClientUser) {
        mItems.push({ id: 'clients', label: $localize`:@@clients:Clients`, icon: 'people', routerLink: ['/clients'] });
      }
      mItems.push({ id: 'jobs', label: $localize`:@@jobs:Jobs`, icon: 'assignment', routerLink: ['/jobs'] });

      if (this.authSvc.hasRole([RoleIds.APP, RoleIds.APP_ADM, RoleIds.CLIENT, RoleIds.PILOT, RoleIds.OFFICER])) {
        mItems.push({
          id: 'invoice',
          label: $localize`:@@invoices:Invoices`, icon: 'receipt_long',
          routerLink: ['/invoices'],
          items: [
          ]
        });
      }
      const invoice = mItems.filter(i => i.id === 'invoice');
      if (invoice && invoice.length && this.authSvc.hasRole([RoleIds.CLIENT, RoleIds.OFFICER, RoleIds.PILOT])) {
        invoice[0].items.push(...[
          { id: 'view', label: $localize`:@@viewInvoice:View Invoices`, icon: 'list', routerLink: ['/invoices'] }
        ]);
      }
      if (invoice && invoice.length && this.authSvc.hasRole([RoleIds.APP, RoleIds.APP_ADM])) {
        invoice[0].items.push(...[
          { id: 'view', label: $localize`:@@viewEditInvoice:View/Edit Invoices`, icon: 'list', routerLink: ['/invoices'] }
        ]);
      }
      if (invoice && invoice.length && this.authSvc.hasRole([RoleIds.APP, RoleIds.APP_ADM, RoleIds.OFFICER, RoleIds.PILOT])) {
        invoice[0].items.push(...[
          {
            id: 'costing-item',
            label: $localize`:@@costingItems:Costing Items`,
            icon: 'payments',
            routerLink: ['/invoices/costing-items']
          },
          ]);
      }
      if (invoice && invoice.length && this.authSvc.hasRole([RoleIds.APP, RoleIds.APP_ADM])) {
        invoice[0].items.push(...[
          {
            id: 'settings',
            label: $localize`:@@invoiceSettings:Invoice Settings`,
            icon: 'settings',
            routerLink: ['/invoices/settings']
          },
        ]);
      }
      if (!this.authSvc.hasRole([RoleIds.INSPECTOR])) {
        mItems.push(
          ...[
            {
              id: 'entities',
              label: $localize`:@@entities:Entities`, icon: 'library_books',
              routerLink: ['/entities'],
              items: this.authSvc.isClientUser ?
                [
                  { label: $localize`:@@crops:Crops`, icon: 'list', routerLink: ['/entities/crops'] },
                  { label: $localize`:@@products:Products`, icon: 'widgets', routerLink: ['/entities/products'] },
                ]
                : [
                  { label: $localize`:@@aircraft:Aircraft`, icon: 'airplanemode_active', routerLink: ['/entities/aircraft'] },
                  { label: $localize`:@@crops:Crops`, icon: 'list', routerLink: ['/entities/crops'] },
                  { label: $localize`:@@products:Products`, icon: 'widgets', routerLink: ['/entities/products'] },
                  { label: $localize`:@@pilots:Pilots`, icon: 'contacts', routerLink: ['/entities/pilots'] }
                ]
            },
            {
              id: 'tools',
              label: $localize`:@@tools:Tools`, icon: 'extension',
              routerLink: ['/tools'],
              items: [
                { id: 'upload', label: $localize`:@@uploadJobData:Upload Job Data`, icon: 'cloud_upload', routerLink: ['/tools/upload'] },
                { id: 'areaLib', label: $localize`:@@manageAreasLib:Manage Areas Library`, icon: 'folder_special', routerLink: ['/tools/areas'] }
              ]
            }
          ]);
      }

      if (!this.authSvc.hasRole([RoleIds.CLIENT, RoleIds.INSPECTOR])) {
        mItems.push({ id: 'track', label: $localize`:@@tracking:Tracking`, icon: 'track_changes', routerLink: ['/track'] });
      }

      const tools = mItems.filter(i => i.id === 'tools');
      if (tools && tools.length) {
        tools[0].items.push({ id: 'settings', label: $localize`:@@settings:Settings`, icon: 'settings', routerLink: ['/tools/settings'] });
      }

    }
    this.model = mItems;
    // let validLinks = [];
    // this.getValidLinks(this.router.config, this.router.config[0], validLinks);
    // this.updateMenuItem(this.model, validLinks);
  }

  /*
  private getValidLinks(routes: Route[], parent: Route, links: string[]) {
      for (const route of routes) {
          if (!route.children || route.children.length === 0) {
              if (!route.data || (route.data && (!route.data.roles || this.authService.hasRole(route.data.roles)))) {
                  if (route.path !== '**') {
                      let combinedPath = parent ? `/${parent.path}/${route.path}` : route.path;
                      combinedPath = combinedPath.replace('/:id', '');
                      if (!combinedPath.startsWith('/')) {
                          combinedPath = '/' + combinedPath;
                      }
                      if (combinedPath.length > 1 && combinedPath.endsWith('/')) {
                          combinedPath = combinedPath.slice(0, combinedPath.length - 1);
                      }
                      links.push(combinedPath);
                  }
              }
          } else {
              this.getValidLinks(route.children, route, links);
              parent = null;
          }
      }
  }

  private updateMenuItem(mnuItems: MenuItem[], validLinks: string[]) {
      for (const it of mnuItems) {
          if (it.items) {
              // this.updateMenuItem(it.items, validLinks);
              let visible = false;
              // it.items.forEach(el => {
              //     if (!el.hasOwnProperty('visible') || el.visible) {
              //         visible = true;
              //         return;
              //     }
              // });
              if (!visible) {
                  it.visible = false;     // hide menu item which has none sub-items allowed to be shown
              }
          } else {
              if (it.routerLink && it.routerLink.length > 0) {
                  if (validLinks.indexOf(it.routerLink[0]) === -1) {
                      it.visible = false;
                  }
              }
          }
      }
  }
  */
}