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

93.5% Statements 72/77
75% Branches 6/8
25% Functions 1/4
100% Lines 42/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 85191x 88x     382x       208x 208x   2x     2x 2x 2x         105x 206x 2x 2x   2x 206x 1x                     2x 1x   24x     1x 1x   1x       1x 1x 1x 1x 1x   1x   490x 490x 490x   10x 490x 10x 490x 10x       10x   1x   2x 2x 103x       2x    
@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>
}