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   26116x         279x     94x       94x 94x 94x 52232x 47x   94x 52232x 47x   94x       299x 125329x 125030x 220x   299x 125329x     125030x 125030x 99x     26x   299x 174x   299x 299x 125030x 125030x 26x         299x 273x       299x 125030x   56129x 129x 129x   299x 125030x 56666x 266x   299x 5849x 37x   299x 125030x 129x 56000x 22425x 106x   129x   299x   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>