taskana/web/src/app/administration/components/access-items-management/access-items-management.com...

134 lines
5.7 KiB
HTML

<div class="access-items">
<!-- SEARCH -->
<div class="access-items__typeahead">
<taskana-shared-type-ahead name="accessIdSelected" [(ngModel)]="accessIdSelected"
placeHolderMessage="Search for access id..." (selectedItem)="onSelectAccessId($event)" displayError=true
isRequired="false">
</taskana-shared-type-ahead>
</div>
<div *ngIf="!accessItemsForm" class="access-items__icon">
<h3>Select an access id</h3>
<svg-icon class="empty-icon" src="./assets/icons/users.svg"></svg-icon>
</div>
<!-- EXPANSION PANEL GROUPS -->
<mat-expansion-panel *ngIf="accessItemsForm" class="access-items__groups-expansion-panel">
<mat-expansion-panel-header>
<mat-panel-title>
Groups of {{accessId.accessId}}</mat-panel-title>
</mat-expansion-panel-header>
<mat-list class="access-items__expansion-panel__list" *ngIf="groups && groups.length > 0; else noGroups">
<mat-list-item *ngFor="let group of groups">
{{group.name}}
<mat-divider></mat-divider>
</mat-list-item>
</mat-list>
<ng-template #noGroups>The user is not associated to any groups </ng-template>
</mat-expansion-panel>
<!-- EXPANSION PANEL AUTHORIZATION -->
<mat-expansion-panel *ngIf="accessItemsForm" [expanded]="true" class="access-items__authorization-expansion-panel">
<mat-expansion-panel-header>
<mat-panel-title>
Authorizations of {{accessId.accessId}}</mat-panel-title>
</mat-expansion-panel-header>
<div *ngIf="accessItemsForm" class="access-items__table">
<ng-form [formGroup]="accessItemsForm">
<table>
<thead>
<tr>
<th></th>
<th class="align-left">Workbasket Key</th>
<th class="align-left">Access Id</th>
<th>Read</th>
<th>Open</th>
<th>Append</th>
<th>Transfer</th>
<th>Distribute</th>
<ng-container *ngFor="let customField of customFields$ | async">
<th *ngIf="customField.visible">
{{customField.field}}
</th>
</ng-container>
</tr>
<tr>
<th class="align-left">
<taskana-shared-sort [sortingFields]="sortingFields" (performSorting)="sorting($event)"
menuPosition="left" [defaultSortBy]="defaultSortBy">
</taskana-shared-sort>
</th>
<th>
<mat-form-field class="access-items__authorization-expansion-panel-filter" appearance="outline">
<mat-label>Workbasket filter</mat-label>
<input matInput formControlName="workbasketKeyFilter"
(keyup.enter)="searchForAccessItemsWorkbaskets()" type="text">
</mat-form-field>
</th>
<th>
<mat-form-field class="access-items__authorization-expansion-panel-filter" appearance="outline">
<mat-label>Access id filter</mat-label>
<input matInput formControlName="accessIdFilter" (keyup.enter)="searchForAccessItemsWorkbaskets()"
type="text">
</mat-form-field>
</th>
<th>
<button mat-stroked-button matTooltip="Clear filter" color="warn" (click)="clearFilter()">
<mat-icon>close</mat-icon>
</button>
</th>
<th>
<button mat-stroked-button color="basic" matTooltip="Apply filter"
(click)="searchForAccessItemsWorkbaskets()">
<mat-icon>search</mat-icon>
</button>
</th>
</tr>
</thead>
<tbody formArrayName="accessItemsGroups">
<tr class="access-items__authorization-expansion-panel__content"
*ngFor="let accessItem of accessItems; let index = index;" [formGroupName]="index.toString()">
<td></td>
<td class="align-left">
<label class="wrap">{{accessItem.workbasketKey}}</label>
</td>
<td class="align-left" *ngIf="(accessItemsCustomization$ | async)?.accessId.lookupField">
<label matTooltip="{{accessItem.accessId}}" class="wrap">{{accessItem.accessName}}</label>
</td>
<td>
<mat-checkbox id="checkbox-{{index}}-0" formControlName="permRead"></mat-checkbox>
</td>
<td>
<mat-checkbox id="checkbox-{{index}}-1" formControlName="permOpen"></mat-checkbox>
</td>
<td>
<mat-checkbox id="checkbox-{{index}}-2" formControlName="permAppend"></mat-checkbox>
</td>
<td>
<mat-checkbox id="checkbox-{{index}}-3" formControlName="permTransfer"></mat-checkbox>
</td>
<td>
<mat-checkbox id="checkbox-{{index}}-4" formControlName="permDistribute"></mat-checkbox>
</td>
<ng-container *ngFor="let customField of customFields$ | async; let customIndex = index">
<td *ngIf="customField.visible">
<mat-checkbox id="checkbox-{{index}}-{{customIndex + 5}}"
formControlName="permCustom{{customIndex + 1}}"></mat-checkbox>
</td>
</ng-container>
</tr>
</tbody>
</table>
<!-- Revoke Access button -->
<button mat-mini-fab class="access-items__revoke-button"
matTooltip="Revoke access" color="warn" *ngIf="accessItemsForm" (click)="revokeAccess()"
[disabled]=isGroup>
<mat-icon>clear</mat-icon>
</button>
</ng-form>
</div>
</mat-expansion-panel>
</div>