数据可视化大屏
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

navigation.component.html 2.1KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <div class="navigation-container">
  2. <ul>
  3. <!-- Always display the "My Workstation" menu -->
  4. <ng-container id="parent-menu" *ngFor="let menu of visibleMenuList">
  5. <li class="dropdown-submenu" (mouseover)="menuOver(menu, $event)">
  6. <ng-container *ngIf="menu.childShowType == 'menu'">
  7. <a href="javascript:void(0);" class="menu-group" [class.active]="isActive(true)" (click)="navigate(menu)">
  8. <img
  9. *ngIf="menu.icon"
  10. width="1rem"
  11. src="assets/{{ menu.icon.includes('svg') ? menu.icon : menu.icon + '.svg' }}"
  12. alt="{{ menu.text }}"
  13. />
  14. {{
  15. menu.menuCode == 'Home' && selectedParentMenu && selectedParentMenu.menuCode != 'Home' ? '/ ' + selectedParentMenu.text : ''
  16. }}
  17. {{ menu.menuCode != 'Home' ? menu.text : '' }}
  18. </a>
  19. </ng-container>
  20. <ng-container *ngIf="menu.childShowType == 'drop-down'">
  21. <ng-container *ngIf="menu.children && menu.children.length > 0; else noChildren">
  22. <a nz-dropdown class="menu-group" [nzDropdownMenu]="childMenu">
  23. {{ menu.text }}
  24. <span nz-icon nzType="down"></span>
  25. </a>
  26. <nz-dropdown-menu #childMenu="nzDropdownMenu">
  27. <ul nz-menu nzSelectable>
  28. <li nz-menu-item *ngFor="let subItem of menu.children" (click)="navigate(subItem)">
  29. {{ subItem.text }}
  30. </li>
  31. </ul>
  32. </nz-dropdown-menu>
  33. </ng-container>
  34. <ng-template #noChildren>
  35. <a href="javascript:void(0);" class="menu-group" [class.active]="isActive(true)" (click)="navigate(menu)">
  36. <img
  37. *ngIf="menu.icon"
  38. width="1rem"
  39. src="assets/{{ menu.icon.includes('svg') ? menu.icon : menu.icon + '.svg' }}"
  40. alt="{{ menu.text }}"
  41. />
  42. {{ menu.menuCode != 'Home' ? menu.text : '' }}
  43. </a>
  44. </ng-template>
  45. </ng-container>
  46. </li>
  47. </ng-container>
  48. <!-- If a menu is selected, display its submenu -->
  49. </ul>
  50. </div>