Revize a28c9b6e
Přidáno uživatelem Lukáš Moučka před téměř 4 roky(ů)
| src/app/unit/components/unit.component.html | ||
|---|---|---|
| 1 | 1 |
<app-nav-bar></app-nav-bar> |
| 2 | 2 |
|
| 3 | 3 |
<div class="container graph"> |
| 4 |
<div class="row graph-information">
|
|
| 4 |
<div class="graph-information"> |
|
| 5 | 5 |
<div class="graph-desc"> |
| 6 | 6 |
<div> |
| 7 | 7 |
<span class="graph-attr-heading">Unit description: </span> |
| ... | ... | |
| 9 | 9 |
</div> |
| 10 | 10 |
</div> |
| 11 | 11 |
<div class="graph-range-dates"> |
| 12 |
<div class="col-xs-12"> |
|
| 13 |
<div class="input-group form-group"> |
|
| 14 |
<div class="input-group-prepend"> |
|
| 15 |
<span class="input-group-text text-color-date background-date-color"><i class="fa fa-calendar-alt" aria-hidden="false"></i></span> |
|
| 16 |
</div> |
|
| 17 |
<p-calendar id="from" [style]="{'width':'100%'}" [inputStyle]="{'width':'100%'}" [(ngModel)]="from" [showTime]="true" (onSelect)="aggregationShow()" [maxDate]="today" showButtonBar="true"></p-calendar>
|
|
| 12 |
<div class="input-group form-group"> |
|
| 13 |
<div class="input-group-prepend"> |
|
| 14 |
<span class="input-group-text text-color-date background-date-color"><i class="fa fa-calendar-alt" aria-hidden="false"></i></span> |
|
| 18 | 15 |
</div> |
| 16 |
<p-calendar id="from" [style]="{'width':'100%'}" [inputStyle]="{'width':'100%'}" [(ngModel)]="from" [showTime]="true" (onSelect)="aggregationShow()" [maxDate]="today" showButtonBar="true"></p-calendar>
|
|
| 19 | 17 |
</div> |
| 20 |
<div class="graph-range-dates-separator"></div> |
|
| 21 |
<div class="col-xs-12"> |
|
| 22 |
<div class="input-group form-group"> |
|
| 23 |
<div class="input-group-prepend"> |
|
| 24 |
<span class="input-group-text text-color-date background-date-color"><i class="fa fa-calendar-alt" aria-hidden="false"></i></span> |
|
| 25 |
</div> |
|
| 26 |
<p-calendar id="to" [style]="{'width':'100%'}" [inputStyle]="{'width':'100%'}" [(ngModel)]="to" [showTime]="true" (onSelect)="aggregationShow()" [maxDate]="today" showButtonBar="true"></p-calendar>
|
|
| 27 |
</div> |
|
| 18 |
<div class="graph-range-dates-separator"> |
|
| 19 |
<div></div> |
|
| 28 | 20 |
</div> |
| 29 |
<div class=""> |
|
| 30 |
<div class="input-group form-group"> |
|
| 31 |
<div class="input-group form-group"> |
|
| 32 |
<p-listbox *ngIf="showAggregation" [options]="aggregationFunction" [(ngModel)]="selectedAggregationFunction" optionLabel="name" optionValue="code"></p-listbox> |
|
| 33 |
</div> |
|
| 21 |
<div class="input-group form-group"> |
|
| 22 |
<div class="input-group-prepend"> |
|
| 23 |
<span class="input-group-text text-color-date background-date-color"><i class="fa fa-calendar-alt" aria-hidden="false"></i></span> |
|
| 34 | 24 |
</div> |
| 25 |
<p-calendar id="to" [style]="{'width':'100%'}" [inputStyle]="{'width':'100%'}" [(ngModel)]="to" [showTime]="true" (onSelect)="aggregationShow()" [maxDate]="today" showButtonBar="true"></p-calendar>
|
|
| 35 | 26 |
</div> |
| 27 |
<p-listbox *ngIf="showAggregation" [options]="aggregationFunction" [(ngModel)]="selectedAggregationFunction" optionLabel="name" optionValue="code"></p-listbox> |
|
| 36 | 28 |
<div> |
| 37 |
<button pButton type="button" *ngIf="dateChanged" label="Load data" class="p-button-primary" icon="pi pi-check" (click)="showGraph()"></button>
|
|
| 29 |
<button pButton type="button" *ngIf="dateChanged" label="Load data" class="p-button-primary" icon="pi pi-chart-line" (click)="showGraph()"></button>
|
|
| 38 | 30 |
</div> |
| 39 | 31 |
</div> |
| 40 | 32 |
</div> |
| 41 |
<ng-container *ngFor="let group of sensorGroups"> |
|
| 42 |
<div class="row"> |
|
| 43 |
<div class="graph-group-heading"> |
|
| 44 |
Group of |
|
| 45 |
<ng-container *ngFor="let sensorType of sensorTypes"> |
|
| 46 |
<ng-container *ngIf="sensorType.sensorId.toString().slice(0, 5) === group"> |
|
| 47 |
{{sensorType.sensorType}}
|
|
| 33 |
<div class="graph-view-wrapper"> |
|
| 34 |
<ng-container *ngFor="let group of sensorGroups"> |
|
| 35 |
<div class="row"> |
|
| 36 |
<div class="graph-group-heading"> |
|
| 37 |
Group of |
|
| 38 |
<ng-container *ngFor="let sensorType of sensorTypes"> |
|
| 39 |
<ng-container *ngIf="sensorType.sensorId.toString().slice(0, 5) === group"> |
|
| 40 |
{{sensorType.sensorType}}
|
|
| 41 |
</ng-container> |
|
| 48 | 42 |
</ng-container> |
| 49 |
</ng-container> |
|
| 50 |
sensors: |
|
| 51 |
</div> |
|
| 52 |
<ng-container *ngFor="let sensor of sensors"> |
|
| 43 |
sensors: |
|
| 44 |
</div> |
|
| 45 |
<ng-container *ngFor="let sensor of sensors"> |
|
| 53 | 46 |
<div *ngIf="sensor.sensorId.toString().slice(0, 5) === group" class="p-field-checkbox"> |
| 54 | 47 |
<p-checkbox [id]="sensor.sensorId" name="{{group}}" [value]="sensor.sensorId.toString()" [(ngModel)]="selectedSensors" [inputId]="sensor.sensorId.toString()" (onChange)="addSensorToGraph(sensor.sensorId.toString(), $event)"></p-checkbox>
|
| 55 | 48 |
<label>{{sensor.sensorName}}</label>
|
| 56 | 49 |
</div> |
| 57 |
</ng-container> |
|
| 58 |
</div> |
|
| 59 |
<div id="vega_container_{{group}}"></div>
|
|
| 60 |
</ng-container> |
|
| 50 |
</ng-container> |
|
| 51 |
</div> |
|
| 52 |
<div id="vega_container_{{group}}"></div>
|
|
| 53 |
</ng-container> |
|
| 54 |
</div> |
|
| 61 | 55 |
</div> |
Také k dispozici: Unified diff
+ Add styles for responsive charts