File

src/app/admin/users/users.component.ts

Implements

OnInit

Metadata

selector crm-users
styleUrls users.component.scss
templateUrl ./users.component.html

Index

Properties
Methods

Constructor

constructor(companyProfilesService: CompanyProfilesService, confirmDialogService: ConfirmDialogService, usersService: UsersService, permissionsService: PermissionsService, authService: AuthService)
Parameters :
Name Type Optional Description
companyProfilesService CompanyProfilesService
confirmDialogService ConfirmDialogService
usersService UsersService
permissionsService PermissionsService
authService AuthService

Methods

ngOnInit
ngOnInit()
Returns : void
onActivateUser
onActivateUser(profile: Profile)
Parameters :
Name Type Optional Description
profile Profile
Returns : void
onDeactivateUser
onDeactivateUser(profile: Profile)
Parameters :
Name Type Optional Description
profile Profile
Returns : void
showActions
showActions(profile: Profile)
Parameters :
Name Type Optional Description
profile Profile
Returns : boolean

Properties

profiles
profiles: Profile[]
Type : Profile[]
userStates
userStates:
Default value : UserStates
import {Component, OnInit} from "@angular/core";
import {CompanyProfilesService} from "../../core/profile/company-profiles.service";
import {Profile} from "../../core/models/profile/profile.model";
import {ConfirmDialogService} from "../../core/confirm-dialog/confirm-dialog.service";
import {UsersService} from "./users.service";
import {UserStates, UserState} from "../../core/models/auth/user-state.type";
import {PermissionsService} from "../../core/auth/permissions.service";
import {Actions} from "../../core/models/auth/action.type";
import {AuthService} from "../../core/auth/auth.service";


@Component({
  selector: 'crm-users',
  templateUrl: './users.component.html',
  styleUrls: ['./users.component.scss']
})
export class UsersComponent implements OnInit {

  profiles: Profile[];

  userStates = UserStates;

  constructor(private companyProfilesService: CompanyProfilesService,
              private confirmDialogService: ConfirmDialogService,
              private usersService: UsersService,
              private permissionsService: PermissionsService,
              private authService: AuthService) { }

  ngOnInit() {
    this.profiles = this.companyProfilesService.getProfilesList();
  }

  showActions(profile: Profile) {
    return this.permissionsService.isAllow(Actions.CompanyManagement) && profile.userId !== this.authService.getUser().id
  }


  onActivateUser(profile: Profile) {
    this.confirmDialogService.ask('You really want activate ' + profile.nickname, 'Activate', 'User activation').then(
      confirm => {
        this.usersService.activateUser(profile.userId).subscribe(
          ok => profile.user.state = UserStates.Activated,
          error => console.error(error)
        )
      },
      cancel => console.log('cancel')
    )
  }

  onDeactivateUser(profile: Profile) {
    this.confirmDialogService.ask('You really want deactivate ' + profile.nickname, 'Deactivate', 'User deactivation').then(
      confirm => {
        this.usersService.deactivateUser(profile.userId).subscribe(
          ok => profile.user.state = UserStates.Deactivated,
          error => console.error(error)
        )
      },
      cancel => console.log('cancel')
    )
  }

}
<div class="card">
  <div class="card-block">

    <table class="table table-hover table-outline m-b-0">
      <thead class="thead-default">
      <tr>
        <th class="text-xs-center"><i class="icon-people"></i></th>
        <th>Nickname</th>
        <th>Name</th>
        <th>Email</th>
        <th>Role</th>
        <th></th>
        <th></th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let profile of profiles">
        <td class="text-xs-center">
          <div class="avatar">
            <img alt="{{profile.nickname}}" class="img-avatar" src="{{profile.avatarUrl}}">
          </div>
        </td>
        <td>
          {{profile.nickname}}
        </td>
        <td>
          {{profile.firstName}} {{profile.lastName}}
        </td>
        <td>
          {{profile.user.email}}
        </td>
        <td>
          {{profile.user.role.name}}
        </td>
        <td class="text-xs-center">
          <a class="btn btn-link" [routerLink]="['/contacts', profile.userId]"
             [queryParams]="{email: profile.user.email}">Contacts</a>
        </td>
        <td>
          <div *ngIf="showActions(profile)">
            <button class="btn btn-danger" (click)="onDeactivateUser(profile)"
                    *ngIf="profile.user.state === userStates.Activated">Deactivate
            </button>
            <button class="btn btn-success" (click)="onActivateUser(profile)"
                    *ngIf="profile.user.state === userStates.Deactivated">Activate
            </button>
          </div>
          <div *ngIf="!showActions(profile)">
            {{profile.user.state}}
          </div>
        </td>
      </tr>

      </tbody>
    </table>

  </div>
</div>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""