45 lines
2.0 KiB
HTML
45 lines
2.0 KiB
HTML
<h2>Vocabularies</h2>
|
|
|
|
<button mat-stroked-button color="primary" (click)="newVocabularyDialog()">create a new vocabulary</button>
|
|
|
|
<mat-form-field style="width: 100%; margin-top: 10px;">
|
|
<mat-label>Filter</mat-label>
|
|
<input matInput (keyup)="applyFilter($event)" placeholder="Filter..." #input />
|
|
</mat-form-field>
|
|
|
|
<table mat-table [dataSource]="vocsDatasource" matSort class="mat-elevation-z8">
|
|
|
|
<ng-container matColumnDef="id">
|
|
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by ID"> Id </th>
|
|
<td mat-cell *matCellDef="let element">
|
|
<a [routerLink]="['/voc_editor']" [queryParams]="{id: element.id}">{{element.id}}</a>
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="name">
|
|
<th mat-header-cell *matHeaderCellDef style="width: 20%;" mat-sort-header sortActionDescription="Sort by Name"> Name </th>
|
|
<td mat-cell *matCellDef="let element"> {{element.name}} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="description">
|
|
<th mat-header-cell *matHeaderCellDef style="width: 40%;" mat-sort-header sortActionDescription="Sort by Description"> Description </th>
|
|
<td mat-cell *matCellDef="let element"> {{element.description}} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="buttons">
|
|
<th mat-header-cell *matHeaderCellDef style="text-align: right;"></th>
|
|
<td mat-cell *matCellDef="let element" class="table-buttons">
|
|
<button mat-stroked-button color="primary" (click)="editVocabularyDialog(element)">edit</button>
|
|
<button mat-stroked-button color="warn" (click)="deleteVocabularyDialog(element)">delete</button>
|
|
</td>
|
|
</ng-container>
|
|
|
|
<tr mat-header-row *matHeaderRowDef="colums"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: colums;"></tr>
|
|
|
|
<!-- Row shown when there is no matching data. -->
|
|
<tr class="mat-row" *matNoDataRow>
|
|
<td class="mat-cell" colspan="4" style="padding: 0 16px;">No data matching the filter "{{input.value}}"</td>
|
|
</tr>
|
|
</table>
|