D-Net

import {NgModule} from '@angular/core';

import {RouterModule} from '@angular/router';

import {IsCommunity} from '../../openaireLibrary/connect/communityGuard/isCommunity.guard';

import {ConnectAdminLoginGuard} from '../../openaireLibrary/connect/communityGuard/connectAdminLoginGuard.guard';

import {ManagersComponent} from './managers.component';

@NgModule({

  imports:[RouterModule.forChild([

    {path: '', canActivate: [IsCommunity, ConnectAdminLoginGuard], component: ManagersComponent}

  ])]

})

export class ManagersRoutingModule {

}

<div class="uk-card uk-card-default uk-card-body">

  <div *ngIf="error"  class="uk-alert uk-alert-danger uk-flex uk-flex-top">

    <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

    <div>

        {{error}}

    </div>

  </div>

  <div *ngIf="loadManagers || loadPending" class="loading-gif"></div>

  <div *ngIf="!loadManagers && !loadPending">

    <div class="uk-text-large uk-text-bold uk-text-center uk-margin-medium-bottom">Managers</div>

    <div class="uk-flex uk-flex-right">

      <button class="uk-button uk-button-primary" (click)="openInviteModal()">Invite a Manager</button>

    </div>

    <ul uk-tab class="uk-tab links">

      <li *ngIf="managers" [class.uk-active]="showManagers" (click)="showManagers = true">

        <a>Managers <span class="uk-badge space">{{managers.length | number}}</span></a>

      </li>

      <li *ngIf="pending" [class.uk-active]="!showManagers" (click)="showManagers = false">

        <a>Pending Managers <span class="uk-badge space">{{pending.length | number}}</span></a>

      </li>

    </ul>

    <div class="custom-dataTable-content">

      <div class="uk-overflow-container">

        <table class="uk-table uk-table-striped divider-table" id="dpTable">

          <thead>

          <tr>

            <th class="uk-text-center">Email</th>

            <th class="uk-text-center">Action</th>

          </tr>

          </thead>

          <tbody>

          <tr class="uk-table-middle" *ngFor="let item of (showManagers)?managers:pending">

            <td class="uk-text-center uk-width-1-2">

              {{(showManagers)?item.email:item}}

            </td>

            <td class="uk-text-center uk-width-1-2">

              <a (click)="openDeleteModal(item)" class="uk-icon-button remove uk-button-danger" uk-icon="icon: close; ratio: 1" title="Remove"></a>

            </td>

          </tr>

          </tbody>

        </table>

      </div>

    </div>

  </div>

</div>

<modal-alert #inviteManagerModal (alertOutput)="inviteManager()" [okDisabled]="invited && invited.invalid">

  <div *ngIf="invited" class="uk-padding uk-text-center">

    <span class="uk-text-bold">Email: </span>

    <input class="uk-input space uk-width-medium" [class.uk-form-danger]="invited.invalid" [formControl]="invited">

  </div>

</modal-alert>

<modal-alert #deleteManagerModal (alertOutput)="deleteManager()"></modal-alert>

<modal-alert #deletePendingModal (alertOutput)="deletePendingManager()"></modal-alert>

import {Component, OnDestroy, OnInit, ViewChild} from '@angular/core';

import {UserRegistryService} from '../../openaireLibrary/services/user-registry.service';

import {Subscription} from 'rxjs/Rx';

import {ActivatedRoute} from '@angular/router';

import {AlertModal} from '../../openaireLibrary/utils/modal/alert';

import {FormBuilder, FormControl, Validators} from '@angular/forms';

import {CommunityService} from '../../openaireLibrary/connect/community/community.service';

import {properties} from '../../../environments/environment';

@Component({

  selector: 'managers',

  templateUrl: 'managers.component.html'

})

export class ManagersComponent implements OnInit, OnDestroy {

  public managers: any[];

  public pending: any[];

  public communityId: string;

  public showManagers: boolean = true;

  public subs: any[] = [];

  public loadManagers: boolean = true;

  public loadPending: boolean = true;

  public error: string;

  public selectedUser: string = null;

  public invited: FormControl;

  public communityName: string;

  @ViewChild('inviteManagerModal') inviteManagerModal: AlertModal;

  @ViewChild('deleteManagerModal') deleteManagerModal: AlertModal;

  @ViewChild('deletePendingModal') deletePendingModal: AlertModal;

  constructor(private userRegistryService: UserRegistryService,

              private communityService: CommunityService,

              private fb: FormBuilder,

              private route: ActivatedRoute) {

  }

  ngOnInit() {

    this.subs.push(this.route.queryParams.subscribe(params => {

      if (params && params['communityId']) {

        this.communityId = params['communityId'];

        this.subs.push(this.communityService.getCommunity(properties, properties.communityAPI + this.communityId).subscribe(community => {

          this.communityName = community.title;

        }));

        this.subs.push(this.userRegistryService.getManagersEmail('community', this.communityId).subscribe(managers => {

          this.managers = managers;

          this.loadManagers = false;

        }, error => {

          this.managers = [];

          this.error = error.error.response;

          this.loadManagers = false;

        }));

        this.subs.push(this.userRegistryService.getPendingManagers('community', this.communityId).subscribe(pending => {

          this.pending = pending;

          this.loadPending = false;

        }, error => {

          this.managers = [];

          this.error = error.error.response;

          this.loadManagers = false;

        }));

      }

    }));

  }

  ngOnDestroy() {

    this.subs.forEach(sub => {

      if (sub instanceof Subscription) {

        sub.unsubscribe();

      }

    });

  }

  openDeleteModal(item: any) {

    if(this.showManagers) {

      this.selectedUser = item.email;

      this.deleteManagerModal.alertTitle = 'Delete ' + item.email + ' from managers';

      this.deleteManagerModal.open();

    } else {

      this.selectedUser = item;

      this.deletePendingModal.alertTitle = 'Delete ' + item + ' from managers';

      this.deletePendingModal.open();

    }

  }

  openInviteModal() {

    this.inviteManagerModal.alertTitle = 'Invite user to be manager';

    this.inviteManagerModal.okButtonLeft = false;

    this.invited = this.fb.control('', [Validators.required, Validators.email]);

    this.inviteManagerModal.open();

  }

  deleteManager() {

    this.loadManagers = true;

    this.userRegistryService.removeManager('community', this.communityId, this.selectedUser).subscribe(() => {

      this.managers = this.managers.filter(manager => manager.email != this.selectedUser);

      this.loadManagers = false;

      this.error = null;

    },error => {

      this.error = error.error.response;

      this.loadManagers = false;

    });

  }

  deletePendingManager() {

    this.loadPending = true;

    this.userRegistryService.cancelManagerInvitation('community', this.communityId, this.selectedUser).subscribe(() => {

      this.pending = this.pending.filter(manager => manager != this.selectedUser);

      this.error = null;

      this.loadPending = false;

    },error => {

      this.error = error.error.response;

      this.loadPending = false;

    });

  }

  inviteManager() {

    this.loadManagers = true;

    let details = {

      name: this.communityName,

      link: this.getURL()

    }

    this.userRegistryService.inviteManager('community', this.communityId, this.invited.value, details).subscribe(invitation => {

      this.error = null;

      if(!this.pending.includes(this.invited.value)) {

        this.pending.push(this.invited.value);

      }

      this.loadManagers = false;

    },error => {

      this.error = error.error.response;

      this.loadManagers = false;

    })

  }

  private getURL(): string {

    if(properties.environment != "production") {

      return 'https://beta.' + this.communityId + ".openaire.eu/verify/";

    } else {

      return 'https://' + this.communityId + ".openaire.eu/verify/";

    }

  }

}

import {NgModule} from '@angular/core';

import {CommonModule} from '@angular/common';

import {ManagersRoutingModule} from './managers-routing.module';

import {ManagersComponent} from './managers.component';

import {IsCommunity} from '../../openaireLibrary/connect/communityGuard/isCommunity.guard';

import {ConnectAdminLoginGuard} from '../../openaireLibrary/connect/communityGuard/connectAdminLoginGuard.guard';

import {EmailService} from '../../openaireLibrary/utils/email/email.service';

import {AlertModalModule} from '../../openaireLibrary/utils/modal/alertModal.module';

import {ReactiveFormsModule} from '@angular/forms';

@NgModule({

  imports: [CommonModule, ManagersRoutingModule, AlertModalModule, ReactiveFormsModule],

  declarations: [ManagersComponent],

  exports: [ManagersComponent],

  providers: [IsCommunity, ConnectAdminLoginGuard, EmailService]

})

export class ManagersModule {}

        if(this.properties.environment === "development") {

          users.items.push({

            rootItem: new MenuItem('managers', 'Managers', '/managers',

              '/managers', false, [], [], {communityId: this.communityId}),

            items: []

          });

        }

        path: 'managers',

        loadChildren: './pages/managers/managers.module#ManagersModule',

        resolve: { envSpecific: EnvironmentSpecificResolver  }

    },

    {