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

97.33% Statements 73/75
100% Branches 6/6
100% Functions 1/1
100% Lines 36/36

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 63202x   404x 4x   4x 4x   4x 4x               4x   404x 3x   268x   3x       134x   134x     3x 3x 3x 3x 3x 3x   3x   813x 813x 813x 813x 9x 804x 268x 6x 804x 804x   9x     3x 3x 268x     3x  
<app-error *ngIf="error" [error]="error"></app-error>
 
<div *ngIf="!device && !error">
    <div  class="skeleton-lines">
        <div></div>
        <div></div>
    </div>
 
    <div class="skeleton-block">
        Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
        Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh,
        ut fermentum massa justo sit amet risus. Donec sed odio dui.
        Nullam quis risus eget urna mollis ornare vel eu leo.
        Cum sociis natoque penatibus et magnis dis parturient montes,
        nascetur ridiculous mus. Nullam id dolor id
        nibh ultricies vehicula ut id elit.
    </div>
</div>
 
<div *ngIf="device">
    <section class="section">
 
      <app-device-card [deviceId]="device.device_id"></app-device-card>
 
    </section>
 
 
    <section class="section">
    <p-table [value]="device.modes" [tableStyle]="{ 'min-width': '50rem' }" [paginator]="true" [rows]="10"
    [rowsPerPageOptions]="[10, 20, 50]" [showCurrentPageReport]="true"
    currentPageReportTemplate="{first} - {last} of {totalRecords} modes" [rowHover]="true">
    <ng-template pTemplate="header">
        <tr>
            <th pSortableColumn="device_id">id <p-sortIcon field="mode_id"></p-sortIcon></th>
            <th pSortableColumn="name">Mode name<p-sortIcon field="name"></p-sortIcon></th>
            <th pSortableColumn="frequency_multiplier">Frequency multiplier<p-sortIcon field="frequency_multiplier"></p-sortIcon></th>
            <th pSortableColumn="min_frequency">Min Frequency<p-sortIcon field="min_frequency"></p-sortIcon></th>
            <th>Actions</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-mode let-i="rowIndex">
        <tr>
            <td>{{ mode.mode_id }}</td>
            <td>{{ mode.name }}</td>
            <td>{{ mode.frequency_multiplier }}</td>
            <td>{{ mode.min_frequency }}</td>
            <td>
                <button *ngIf="device.status==='up' && device.current_mode_id!==i+1" class="button"
                 (click)="changeMode(mode)" [ngClass]="{'is-loading': isLoading}">
                 Switch mode</button>
                <button *ngIf="device.status==='up' && device.current_mode_id===i+1" class="button is-link"  [ngClass]="{'is-loading': isLoading}" disabled>Current mode</button>
                <button *ngIf="device.status==='down'" class="button is-link" disabled>Device down</button>
            </td>
        </tr>
    </ng-template>
    </p-table>
</section>
<section class="section">
<app-signals-table [deviceId]="device.device_id"></app-signals-table>
</section>
 
</div>