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 26686x 279x 96x 96x 96x 96x 53372x 48x 96x 53372x 48x 96x 307x 126853x 126546x 226x 307x 126853x 126546x 126546x 101x 28x 307x 178x 307x 307x 126546x 126546x 28x 307x 279x 307x 126546x 56777x 133x 133x 307x 126546x 57116x 273x 307x 6157x 39x 307x 126546x 133x 56644x 22772x 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>
|