Merge pull request #203 from OS2iot/bugfix/administration-navbar

Changed name and check for who should be able to see administration

Author: augusthjerrild

src/app/navbar/global-admin/global-admin.component.html renamed to src/app/navbar/administration/administration.component.html

@@ -1,4 +1,6 @@
-@if(isGlobalAdmin){
+@if(isGlobalAdmin || isUserAdmin){
+
+<div class="nav-bar-title">{{ "NAV.TITLES.ADMINISTRATION" | translate }}</div>
 
 <ul class="navbar-nav flex-column">
   <li class="nav-item">
@@ -11,7 +13,7 @@
       {{ "NAV.PERMISSIONS" | translate }}
     </a>
   </li>
-  <li class="nav-item">
+  <li class="nav-item" *ngIf="isGlobalAdmin">
     <a routerLink="/admin/organisations" routerLinkActive="active">
       {{ "NAV.ORGANISATIONS" | translate }}
     </a>

src/app/navbar/global-admin/global-admin.component.scss renamed to src/app/navbar/administration/administration.component.scss

@@ -1,5 +1,15 @@
 @import "../../../assets/scss/setup/variables";
 
+.nav-bar-title {
+  color: $default-color;
+  font-size: 14px;
+  font-weight: 400;
+  font-family: "Inter", sans-serif;
+  margin-top: 40px;
+  margin-left: 5px;
+  margin-bottom: 10px;
+}
+
 mat-expansion-panel {
   box-shadow: none !important;
 }

src/app/navbar/global-admin/global-admin.component.ts renamed to src/app/navbar/administration/administration.component.ts

@@ -1,21 +1,29 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, Input, OnInit } from "@angular/core";
 import { UserResponse } from "@app/admin/users/user.model";
+import { OrganizationAccessScope } from "@shared/enums/access-scopes";
 import { MeService } from "@shared/services/me.service";
 import { SharedVariableService } from "@shared/shared-variable/shared-variable.service";
 
 @Component({
-  selector: "app-global-admin",
-  templateUrl: "./global-admin.component.html",
-  styleUrls: ["./global-admin.component.scss"],
+  selector: "app-administration",
+  templateUrl: "./administration.component.html",
+  styleUrls: ["./administration.component.scss"],
 })
-export class GlobalAdminComponent implements OnInit {
+export class AdministrationComponent implements OnInit {
   public user: UserResponse;
   public isGlobalAdmin = false;
 
+  public isUserAdmin = false;
+  @Input() orgId: number;
+
   constructor(private sharedVariableService: SharedVariableService, private meService: MeService) {}
 
   ngOnInit(): void {
     this.user = this.sharedVariableService.getUserInfo().user;
     this.isGlobalAdmin = this.meService.hasGlobalAdmin();
+    this.isUserAdmin = this.meService.hasAccessToTargetOrganization(
+      OrganizationAccessScope.UserAdministrationWrite,
+      this.orgId
+    );
   }
 }

src/app/navbar/navbar.component.html

@@ -3,7 +3,7 @@
   aria-expanded="false"
   class="navbar-container navbar navbar-expand-md navbar-light d-md-flex align-items-md-start flex-md-column p-3 no-shadow"
 >
-  <img [src]="imagePath" alt="OS2IoT-logo" class="img-logo"/>
+  <img [src]="imagePath" alt="OS2IoT-logo" class="img-logo" />
 
   <div *ngIf="!isLoggedIn(); else loggedInBlock" class="collapse navbar-collapse flex-grow-0" id="navbar-login">
     <ul class="navbar-nav flex-column">
@@ -43,7 +43,7 @@
                 <mat-select-trigger>
                   <div class="nav-bar-selector-trigger">
                     <div class="nav-bar-selector-building-icon">
-                      <img height="20" src="assets/images/building.svg" width="20"/>
+                      <img height="20" src="assets/images/building.svg" width="20" />
                     </div>
                     {{ getOrgName(selected) }}
                   </div>
@@ -54,8 +54,8 @@
               </mat-select>
 
               <div class="custom-dropdown-icon" matSuffix>
-                <img class="dropdown-up" height="7" src="assets/images/angle-up.svg" width="11"/>
-                <img class="dropdown-down" height="7" src="assets/images/angle-down.svg" width="11"/>
+                <img class="dropdown-up" height="7" src="assets/images/angle-up.svg" width="11" />
+                <img class="dropdown-down" height="7" src="assets/images/angle-down.svg" width="11" />
               </div>
             </mat-form-field>
 
@@ -118,10 +118,8 @@
             </ul>
           </li>
 
-          <div class="nav-bar-title">{{ "NAV.TITLES.ADMINISTRATION" | translate }}</div>
-
           <li class="nav-item">
-            <app-global-admin></app-global-admin>
+            <app-administration [orgId]="selected"></app-administration>
           </li>
         </div>
       </ul>

src/app/navbar/navbar.module.ts

@@ -15,10 +15,10 @@ import { TranslateModule } from "@ngx-translate/core";
 import { NGMaterialModule } from "@shared/Modules/materiale.module";
 import { InlineSVGModule } from "ng-inline-svg-2";
 import { RestService } from "../shared/services/rest.service";
-import { GlobalAdminComponent } from "./global-admin/global-admin.component";
+import { AdministrationComponent } from "./administration/administration.component";
 
 @NgModule({
-  declarations: [NavbarComponent, GlobalAdminComponent],
+  declarations: [NavbarComponent, AdministrationComponent],
   imports: [
     CommonModule,
     SharedModule,