All files / src/app/components/themes-list themes-list.component.html

98.96% Statements 96/97
100% Branches 20/20
100% Functions 6/6
98.24% Lines 56/57

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 9594x   26184x         279x     94x       94x 94x 94x 52368x 47x   94x 52368x 47x   94x       304x 125508x 125204x 224x   304x 125508x     125204x 125204x 100x     28x   304x 176x   304x 304x 125204x 125204x 28x         304x 276x       304x 125204x   55874x 132x 132x   304x 125204x 56526x 271x   304x 6076x 38x   304x 125204x 132x 55742x 22447x 109x   132x   304x   94x   96x 96x   94x  
<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>