[personal-cabinet/provider-admins]Show button for deputy/admin creation correctly #1355

src/app/header/header.component.html

@@ -98,8 +98,8 @@ <h2 class="header_descr">
             {{roles[user.role]}}</button></a>
         <a [routerLink]="'./personal-cabinet/workshops'"><button mat-menu-item>Мої гуртки</button></a>
         <a [routerLink]="'./personal-cabinet/applications'"><button mat-menu-item>Мої заяви</button></a>
-        <a *ngIf="user.role === Role.provider && subrole !== Role.providerAdmin" [routerLink]="'./personal-cabinet/administration'"><button
-            mat-menu-item>Адміністрування</button></a>
+        <a *ngIf="user.role === Role.provider && subrole !== Role.ProviderAdmin" [routerLink]="'./personal-cabinet/administration'">
+          <button mat-menu-item>Адміністрування</button></a>
         <a *ngIf="user.role === Role.parent" [routerLink]="'./personal-cabinet/parent/favorite'"><button
             mat-menu-item>Улюблене</button></a>
         <button mat-menu-item (click)="logout()">Вийти</button>

src/app/header/header.component.ts

@@ -17,6 +17,7 @@ import { SidenavToggle } from '../shared/store/navigation.actions';
 import { AppState } from '../shared/store/app.state';
 import { FeaturesList } from '../shared/models/featuresList.model';
 import { AdminState } from '../shared/store/admin.state';
+import { providerAdminRoleUkr } from '../shared/enum/enumUA/provider-admin';
 
 @Component({
   selector: 'app-header',
@@ -62,6 +63,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
   isMobile: boolean;
   navigationPaths: Navigation[];
   subrole: string;
+  btnView: string = providerAdminRoleUkr.all;
 
   private destroy$: Subject<boolean> = new Subject<boolean>();
 
@@ -79,16 +81,28 @@ export class HeaderComponent implements OnInit, OnDestroy {
       this.isLoadingResultPage$,
       this.isLoadingMetaData$,
       this.isLoadingCabinet$,
-    ])
+    ]);
 
-    combineLatest([this.isLoadingResultPage$, this.isLoadingMetaData$, this.isLoadingCabinet$, this.isLoadingAdminData$])
+    combineLatest([
+      this.isLoadingResultPage$,
+      this.isLoadingMetaData$,
+      this.isLoadingCabinet$,
+      this.isLoadingAdminData$,
+    ])
       .pipe(takeUntil(this.destroy$), delay(0))
-      .subscribe(([isLoadingResult, isLoadingMeta, isLoadingCabinet, isLoadingAdminData]) => {
-        this.isLoadingResultPage = isLoadingResult;
-        this.isLoadingMetaData = isLoadingMeta;
-        this.isLoadingCabinet = isLoadingCabinet;
-        this.isLoadingAdminData = isLoadingAdminData
-      });
+      .subscribe(
+        ([
+          isLoadingResult,
+          isLoadingMeta,
+          isLoadingCabinet,
+          isLoadingAdminData,
+        ]) => {
+          this.isLoadingResultPage = isLoadingResult;
+          this.isLoadingMetaData = isLoadingMeta;
+          this.isLoadingCabinet = isLoadingCabinet;
+          this.isLoadingAdminData = isLoadingAdminData;
+        }
+      );
 
     combineLatest([this.isMobileScreen$, this.navigationPaths$])
       .pipe(takeUntil(this.destroy$), delay(0))

src/app/shell/personal-cabinet/provider-admins/provider-admins.component.html

@@ -12,7 +12,7 @@
         placeholder="Пошук за ПІБ, електронною поштою, телефоном, містом чи статусом"
       />
     </div>
-    <ng-template [ngIf]="btnView == providerAdminRoleUkr.all && subrole !== Role.ProviderAdmin">
+    <ng-template [ngIf]="btnView == providerAdminRoleUkr.all">
       <button class="btn" mat-raised-button [matMenuTriggerFor]="add">
         Додати <mat-icon>arrow_drop_down</mat-icon>
       </button>
@@ -21,10 +21,10 @@
         <a [routerLink]="['/create-provider-admin', providerAdminRole.admin]"><button mat-menu-item>Адміністратора гуртка</button></a>
       </mat-menu>
     </ng-template>
-    <ng-template [ngIf]="btnView == providerAdminRoleUkr.admin && subrole !== Role.ProviderAdmin ">
+    <ng-template [ngIf]="btnView == providerAdminRoleUkr.deputy && subrole !== Role.ProviderAdmin">
       <a [routerLink]="['/create-provider-admin', providerAdminRole.deputy]"><button class="btn" mat-raised-button>Додати</button></a>
     </ng-template>
-    <ng-template [ngIf]="btnView == providerAdminRoleUkr.admin && subrole !== Role.ProviderAdmin ">
+    <ng-template [ngIf]="btnView == providerAdminRoleUkr.admin && subrole !== Role.ProviderAdmin">
       <a [routerLink]="['/create-provider-admin', providerAdminRole.admin]"><button class="btn" mat-raised-button>Додати</button></a>
     </ng-template>
   </div>

src/app/shell/personal-cabinet/provider-admins/provider-admins.component.ts

@@ -55,7 +55,7 @@ export class ProviderAdminsComponent implements OnInit {
   provider: Provider;
   filter = new FormControl('');
   filterValue: string;
-  btnView: string= providerAdminRoleUkr.all;
+  btnView: string = providerAdminRoleUkr.all;
   destroy$: Subject<boolean> = new Subject<boolean>();
   tabIndex: number;
   subrole: string;
@@ -88,11 +88,10 @@ export class ProviderAdminsComponent implements OnInit {
       .subscribe((providerAdmins: ProviderAdmin[]) => {
         this.providerAdmins = this.updateStructureForTheTable(providerAdmins);
       });
+
     this.route.queryParams
-      .pipe(takeUntil(this.destroy$))
       .subscribe((params: Params) => {
-        this.tabIndex = Object.keys(this.providerAdminRole).indexOf(params['role']);
-        this.btnView = providerAdminRoleUkr[params['role']];
+        this.tabIndex = Object.keys(this.providerAdminRole).indexOf(params['role']);      
       });
 
     this.provider$