Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 | 96x 26610x 273x 96x 96x 96x 96x 53220x 48x 96x 53220x 48x 96x 307x 124525x 124218x 226x 307x 124525x 124218x 124218x 101x 28x 307x 178x 307x 307x 124218x 124218x 28x 307x 279x 307x 124218x 55657x 133x 133x 307x 124218x 56026x 273x 307x 6083x 39x 307x 124218x 133x 55524x 22267x 110x 133x 307x 96x 98x 98x 96x | <p-table #dt1 [value]="graphThemes" [paginator]="true" [rows]="5" [rowsPerPageOptions]="[5, 10]"
[showCurrentPageReport]="true" currentPageReportTemplate="{first} - {last} of {totalRecords} phases"
[rowHover]="true" emptymessage="No graph themes to display" [globalFilterFields]="['name', 'signal_id']">
<ng-template pTemplate="caption">
<div class="columns">
<div class="column is-flex is-justify-content-right">
<span>
<input id="filterInput" class="input" type="text" (input)="dt1.filterGlobal(this.getFilter($event), 'contains')" placeholder="Filter" />
</span>
</div>
</div>
</ng-template>
<ng-template pTemplate="header">
<tr>
<th pSortableColumn="name">Name <p-sortIcon field="name"></p-sortIcon></th>
<th pSortableColumn="signal_id">Signal <p-sortIcon field="signal_id"></p-sortIcon></th>
<th>Style</th>
@if (canBeActive) {
<th>Active</th>
}
<th></th>
@if (canBeActive) {
<th></th>
}
</tr>
</ng-template>
<ng-template pTemplate="body" let-theme let-i="rowIndex">
<tr>
<td>
{{ theme.name }}
@if (theme.created_by_user) {
<i class="pi pi-crown icon-small" title="Created by user"></i>
}
</td>
<td>{{ theme.signal_id }}</td>
<td>
<div class="preview">
<span [ngStyle]="{'color': theme.value_color}" class="preview" title="Value line">
@if (theme.value_line_style === "dotted") {
<i class="pi pi-ellipsis-h"></i>
}
@else if(theme.value_line_style === "dashed") {
---
}
@else {
<i class="pi pi-minus"></i>
}
</span>
|
<span [ngStyle]="{'color': theme.forced_value_color}" class="preview" title="Forced value line">
@if (theme.forced_value_line_style === "dotted") {
<i class="pi pi-ellipsis-h"></i>
}
@else if(theme.forced_value_line_style === "dashed") {
---
}
@else {
<i class="pi pi-minus"></i>
}
</span>
</div>
</td>
@if (canBeActive) {
<td>
<p-toggleswitch [(ngModel)]="theme.active_for_user" [disabled]="!theme.in_user_library"
(onChange)="handleThemeActivation($event, theme)"></p-toggleswitch>
</td>
}
<td>
@if (theme.in_user_library) {
<p-button icon="pi pi-heart" [rounded]="true" size="small"
(onClick)="handleThemeFavoriting(theme, false)"></p-button>
}
@else {
<p-button icon="pi pi-heart" [rounded]="true" size="small" outlined="true"
(onClick)="handleThemeFavoriting(theme, true)"></p-button>
}
</td>
@if (canBeActive) {
<td>
@if (theme.created_by_user) {
<p-button icon="pi pi-pen-to-square" [rounded]="true" size="small" [text]="true"
(onClick)="editTheme(theme.id)" />
}
</td>
}
</tr>
</ng-template>
<ng-template pTemplate="emptymessage">
<tr>
<td colspan="6">No graph themes to display.</td>
</tr>
</ng-template>
</p-table>
|