src/app/centers/detail/center.detail.component.html [18:47]:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
<fims-layout-card-over title="{{employee.givenName}} {{employee.surname}}" [navigateBackTo]="'/employees'">
  <fims-layout-card-over-header-menu layout="row" layout-align="end center">
    <td-search-box placeholder="{{'Search' | translate}}" (search)="searchEmployee($event)" [alwaysVisible]="false"></td-search-box>
    <button mat-icon-button (click)="deleteEmployee()" title="{{'Delete this employee' | translate}}" *hasPermission="{ id: 'office_employees', accessLevel: 'DELETE' }"><mat-icon>delete</mat-icon></button>
  </fims-layout-card-over-header-menu>
  <mat-list>
    <h3 mat-subheader translate>Assigned office</h3>
    <mat-list-item>
      <mat-icon matListAvatar>store</mat-icon>
      <h3 matLine *ngIf="employee.assignedOffice">{{employee.assignedOffice}}</h3>
      <h3 matLine *ngIf="!employee.assignedOffice" translate>No office assigned</h3>
    </mat-list-item>
    <h3 mat-subheader translate>Assigned role</h3>
    <mat-list-item>
      <mat-icon matListAvatar>lock</mat-icon>
      <h3 matLine>{{user.role}}</h3>
    </mat-list-item>
    <h3 mat-subheader translate>Contact Information</h3>
    <mat-list-item [ngSwitch]="detail.type" *ngFor="let detail of employee.contactDetails">
      <mat-icon *ngSwitchCase="'EMAIL'" matListAvatar>email</mat-icon>
      <mat-icon *ngSwitchCase="'PHONE'" matListAvatar>phone</mat-icon>
      <mat-icon *ngSwitchCase="'MOBILE'" matListAvatar>smartphone</mat-icon>
      <h3 matLine>{{detail.value}}</h3>
    </mat-list-item>
    <mat-list-item *ngIf="!employee.contactDetails.length">
      <h3 matLine translate>No contact details available</h3>
    </mat-list-item>
  </mat-list>
</fims-layout-card-over>
<fims-fab-button title="{{'Edit member ' | translate}}" icon="mode_edit" [link]="['edit']" [permission]="{ id: 'office_employees', accessLevel: 'CHANGE'}"></fims-fab-button>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -



src/app/employees/detail/employee.detail.component.html [18:47]:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
<fims-layout-card-over title="{{employee.givenName}} {{employee.surname}}" [navigateBackTo]="'/employees'">
  <fims-layout-card-over-header-menu layout="row" layout-align="end center">
    <td-search-box placeholder="{{'Search' | translate}}" (search)="searchEmployee($event)" [alwaysVisible]="false"></td-search-box>
    <button mat-icon-button (click)="deleteEmployee()" title="{{'Delete this employee' | translate}}" *hasPermission="{ id: 'office_employees', accessLevel: 'DELETE' }"><mat-icon>delete</mat-icon></button>
  </fims-layout-card-over-header-menu>
  <mat-list>
    <h3 mat-subheader translate>Assigned office</h3>
    <mat-list-item>
      <mat-icon matListAvatar>store</mat-icon>
      <h3 matLine *ngIf="employee.assignedOffice">{{employee.assignedOffice}}</h3>
      <h3 matLine *ngIf="!employee.assignedOffice" translate>No office assigned</h3>
    </mat-list-item>
    <h3 mat-subheader translate>Assigned role</h3>
    <mat-list-item>
      <mat-icon matListAvatar>lock</mat-icon>
      <h3 matLine>{{user.role}}</h3>
    </mat-list-item>
    <h3 mat-subheader translate>Contact Information</h3>
    <mat-list-item [ngSwitch]="detail.type" *ngFor="let detail of employee.contactDetails">
      <mat-icon *ngSwitchCase="'EMAIL'" matListAvatar>email</mat-icon>
      <mat-icon *ngSwitchCase="'PHONE'" matListAvatar>phone</mat-icon>
      <mat-icon *ngSwitchCase="'MOBILE'" matListAvatar>smartphone</mat-icon>
      <h3 matLine>{{detail.value}}</h3>
    </mat-list-item>
    <mat-list-item *ngIf="!employee.contactDetails.length">
      <h3 matLine translate>No contact details available</h3>
    </mat-list-item>
  </mat-list>
</fims-layout-card-over>
<fims-fab-button title="{{'Edit member ' | translate}}" icon="mode_edit" [link]="['edit']" [permission]="{ id: 'office_employees', accessLevel: 'CHANGE'}"></fims-fab-button>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -