| <!--******************************************************************************** |
| * Copyright (c) 2015, 2023 Contributors to the Eclipse Foundation |
| * |
| * See the NOTICE file(s) distributed with this work for additional |
| * information regarding copyright ownership. |
| * |
| * This program and the accompanying materials are made available under the |
| * terms of the Eclipse Public License v. 2.0 which is available at |
| * http://www.eclipse.org/legal/epl-2.0. |
| * |
| * SPDX-License-Identifier: EPL-2.0 |
| * |
| ********************************************************************************--> |
| <div *ngIf="loading" style="text-align: center; margin: 1em"> |
| <div class="fa fa-spinner fa-pulse fa-fw"></div> |
| <!-- Suchergebnisse werden geladen--> |
| {{ "tableview.tableview.loading-search-results" | translate }} |
| </div> |
| <div *ngIf="!loading" style="overflow-x: auto"> |
| <p-contextMenu #cm [model]="menuItems" appendTo="body"></p-contextMenu> |
| <p-table |
| [value]="viewRows" |
| [columns]="turboViewColumns" |
| [resizableColumns]="true" |
| columnResizeMode="expand" |
| [reorderableColumns]="true" |
| sortMode="single" |
| [customSort]="true" |
| (sortFunction)="customSort($event)" |
| [sortField]="view?.sortField" |
| [sortOrder]="view?.sortOrder" |
| [(selection)]="selectedViewRows" |
| (dataKey)="(idField)" |
| [(contextMenuSelection)]="menuSelectedRow" |
| [contextMenu]="cm" |
| [paginator]="true" |
| [pageLinks]="3" |
| [rows]="10" |
| [rowsPerPageOptions]="[3, 10, 20, 50, 100, 200, 500, 1000]" |
| (onColReorder)="onColReorder($event)" |
| (onColResize)="onColResize($event)" |
| (onSort)="onSort($event)" |
| (onContextMenuSelect)="onContextMenuSelect($event)" |
| (onRowSelect)="onSelectionChanged($event)" |
| (onRowUnselect)="onSelectionChanged($event)" |
| styleClass="table-hover p-datatable-gridlines" |
| responsiveLayout="scroll" |
| paginatorDropdownAppendTo="body" |
| > |
| <ng-template pTemplate="header" let-columns> |
| <tr> |
| <th style="width: 3em"> |
| <p-tableHeaderCheckbox></p-tableHeaderCheckbox> |
| </th> |
| <th style="width: 3em"></th> |
| <th style="width: 3em"></th> |
| <th |
| *ngFor="let col of columns" |
| [pSortableColumn]="col.field" |
| pReorderableColumn |
| pResizableColumn |
| pTooltip="{{ col.type | mdmTranslate | async }}" |
| > |
| <div class="table-view-col-header"> |
| {{ col.type | mdmTranslate : undefined : col.attribute | async }} |
| <p-sortIcon [field]="col.field"></p-sortIcon> |
| </div> |
| </th> |
| </tr> |
| </ng-template> |
| <ng-template pTemplate="body" let-rowData let-columns="columns"> |
| <tr [pSelectableRow]="rowData" [pContextMenuRow]="rowData"> |
| <td> |
| <p-tableCheckbox [value]="rowData"></p-tableCheckbox> |
| </td> |
| <td> |
| <a |
| class="icon" |
| [ngClass]="getNodeClass(rowData.type)" |
| title="{{ getRowTitle(rowData) }}" |
| style="color: black; cursor: pointer" |
| (click)="openInTree(rowData, $event)" |
| > |
| </a> |
| </td> |
| <td> |
| <span |
| class="fa" |
| [ngClass]="{ |
| 'fa-shopping-cart': isShopable, |
| 'fa-times': isRemovable |
| }" |
| style="cursor: pointer" |
| title="{{ getIconTitle() | translate }}" |
| (click)="functionalityProvider(rowData)" |
| > |
| </span> |
| </td> |
| <td *ngFor="let col of columns" [pTooltip]="tooltipValue(rowData[col.field]?.measured)" tooltipPosition="top"> |
| <div style="float: left"> |
| {{ value(rowData[col.field]?.measured) }} |
| </div> |
| <div style="float: right" *ngIf="rowData[col.field]?.ordered !== rowData[col.field]?.measured"> |
| <span |
| class="fa fa-question-circle-o" |
| style="cursor: pointer" |
| title="{{ 'tableview.tableview.tooltip-values' | translate : rowData[col.field] }}" |
| > |
| </span> |
| </div> |
| </td> |
| </tr> |
| </ng-template> |
| |
| <!-- add 3 cols for the button columns --> |
| <ng-template pTemplate="emptymessage" let-columns> |
| <tr> |
| <td [attr.colspan]="columns?.length + 3"> |
| {{ "tableview.tableview.no-records-found" | translate }} |
| </td> |
| </tr> |
| </ng-template> |
| </p-table> |
| </div> |