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 85177x 50x     354x       256x 256x   2x     2x 2x 2x         129x 254x 2x 2x   2x 254x 1x                     2x 1x   36x     1x 1x   1x       1x 1x 1x 1x 1x   1x   740x 740x 740x   20x 740x 20x 740x 20x       20x   1x   2x 2x 127x       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>
}