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 85169x 46x     338x       248x 248x   2x     2x 2x 2x         125x 246x 2x 2x   2x 246x 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 123x       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>
}