|
1
|
<h1 mat-dialog-title>Výběr volna</h1>
|
|
2
|
|
|
3
|
<div mat-dialog-content>
|
|
4
|
<div class="vacation-selection-container">
|
|
5
|
<label id="vacation-type-radio-group-label" class="dialog-label">Typ volna: </label>
|
|
6
|
<mat-radio-group aria-labelledby="vacation-type-radio-group-label" class="vacation-type-radio-group" [(ngModel)]="selectedVacationType">
|
|
7
|
<mat-radio-button class="vacation-type-radio-button" [value]=vacationType.SICKDAY>
|
|
8
|
{{vacationType.SICKDAY}}
|
|
9
|
</mat-radio-button>
|
|
10
|
<mat-radio-button class="vacation-type-radio-button" [value]=vacationType.VACATION>
|
|
11
|
{{vacationType.VACATION}}
|
|
12
|
</mat-radio-button>
|
|
13
|
</mat-radio-group>
|
|
14
|
</div>
|
|
15
|
<div class="datetime-selection-container">
|
|
16
|
<div class="date-selection">
|
|
17
|
<span class="dialog-label">Datum:</span>
|
|
18
|
<mat-form-field class="date-input">
|
|
19
|
<input id="date-input" matInput [matDatepicker]="datePicker" [(ngModel)]="data.date">
|
|
20
|
<mat-datepicker-toggle matSuffix [for]="datePicker"></mat-datepicker-toggle>
|
|
21
|
<mat-datepicker #datePicker></mat-datepicker>
|
|
22
|
</mat-form-field>
|
|
23
|
</div>
|
|
24
|
<div class="datetime-interval" *ngIf="selectedVacationType == vacationType.VACATION">
|
|
25
|
<div class="from-time">
|
|
26
|
<span class="dialog-label">Od:</span>
|
|
27
|
<div class="time-input-container">
|
|
28
|
<input class="time-input" [format]="24" [value]="data.fromTime" [ngxTimepicker]="fromTimePicker">
|
|
29
|
<ngx-material-timepicker [minutesGap]="MINUTE_STEP" (timeSet)="data.fromTime = $event" #fromTimePicker></ngx-material-timepicker>
|
|
30
|
<i class="material-icons">access_time</i>
|
|
31
|
</div>
|
|
32
|
</div>
|
|
33
|
<div class="to-time">
|
|
34
|
<span class="dialog-label">Do:</span>
|
|
35
|
<div class="time-input-container">
|
|
36
|
<input class="time-input" [format]="24" [value]="data.toTime" [ngxTimepicker]="toTimePicker">
|
|
37
|
<ngx-material-timepicker [minutesGap]="MINUTE_STEP" (timeSet)="data.toTime = $event" #toTimePicker></ngx-material-timepicker>
|
|
38
|
<i class="material-icons">access_time</i>
|
|
39
|
</div>
|
|
40
|
</div>
|
|
41
|
</div>
|
|
42
|
</div>
|
|
43
|
</div>
|
|
44
|
|
|
45
|
<div mat-dialog-actions align="end">
|
|
46
|
<button mat-raised-button color="primary" (click)="onConfirmClick()">Potvrdit</button>
|
|
47
|
<button mat-raised-button color="basic" (click)="onCloseClick()">Zavřít</button>
|
|
48
|
</div>
|