All files / src/app/components/device-states device-states.component.html

44.15% Statements 34/77
62.5% Branches 5/8
0% Functions 0/4
45.23% Lines 19/42

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 85116x 84x     232x       65x 65x   1x     1x 1x 1x         33x 64x 1x 1x   1x 64x                                                                                                 1x 1x 32x       1x    
@if (error) {
  <app-error [error]="error"></app-error>
}
 
@if (!error) {
  <div>
    <div>
      <section class="section">
        <h1>{{ deviceName }}</h1>
        <h2 class="subtitle is-5">device #{{ deviceId.slice(8) }}</h2>
      </section>
    </div>
    <p-tabs value="0">
      <p-tablist>
        <p-tab value="0">State</p-tab>
        <p-tab value="1">Status</p-tab>
      </p-tablist>
      <p-tabpanels>
        <p-tabpanel value="0">
          <div class="property-selector">
            <p-floatlabel>
              <p-multiselect display="chip" [options]="deviceProperties" [(ngModel)]="selectedProperties"
                optionLabel="label" [style]="{ 'min-width': '200px' }"
                (onChange)="onModifiedPropertiesChanged($event.value)" id="modifiedProperties"/>
              <label for="modifiedProperties">Modified properties</label>
            </p-floatlabel>
          </div>
          @if (versions) {
            <p-table
              [value]="versions.items"
              [tableStyle]="{ 'min-width': '50rem' }"
              [paginator]="true"
              [rows]="rows"
              [rowsPerPageOptions]="filteredRowsPerPageOptions"
              [showCurrentPageReport]="true"
              [first]="offset"
              [totalRecords]="versions.total"
              [lazy] = true
              currentPageReportTemplate="Showing {first} - {last} of {totalRecords} entries"
              (onPage)="onTableEvent($event)"
              (onLazyLoad)="loadEvents($event)"
              sortField="timestamp"
              [sortOrder]="-1">
              <ng-template pTemplate="caption">
                <div class="columns">
                  <div class="column">
                    Last changes
                  </div>
                </div>
              </ng-template>
              <ng-template pTemplate="header">
                <tr>
                  <th pSortableColumn="timestamp">Date <p-sortIcon field="timestamp"></p-sortIcon></th>
                  <th>Mode</th>
                  <th>Load</th>
                  <th>Actions</th>
                </tr>
              </ng-template>
              <ng-template pTemplate="body" let-version>
                <tr>
                  <td>{{ version.timestamp * 1000 | date:'yyyy/MM/dd - HH:mm:ss' }}</td>
                  <td>{{ version.mode }}</td>
                  <td>{{ version.load*100 | number: '1.0-0' }}%</td>
                  <td>
                    <div class="tags">
                      @for (token of version.tokens; track token) {
                        <div class="tag">
                          {{ petriNetwork.places[token].name }}
                        </div>
                      }
                    </div>
                  </td>
                </tr>
              </ng-template>
            </p-table>
          }
        </p-tabpanel>
        <p-tabpanel value="1">
          <app-signals-graphs [showLegend]="true" [showSignals]="false" [inputIsLive]="false" [displayCommandCenter]="false"></app-signals-graphs>
        </p-tabpanel>
      </p-tabpanels>
    </p-tabs>
  </div>
}