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 85185x 60x     370x       252x 252x   2x     2x 2x 2x         127x 250x 2x 2x   2x 250x 1x                     2x 1x   32x     1x 1x   1x       1x 1x 1x 1x 1x   1x   660x 660x 660x   20x 660x 20x 660x 20x       20x   1x   2x 2x 125x       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>
}