76 lines
2.8 KiB
HTML
76 lines
2.8 KiB
HTML
<div class="interval" [formGroup]="form">
|
|
<button
|
|
(click)="showDateInterval = !showDateInterval"
|
|
[ngClass]="{ active: showDateInterval }"
|
|
class="btn btn--primary"
|
|
id="toggle_interval_button"
|
|
>
|
|
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
|
<span>
|
|
{{ 'dates.add_interval' | translate }}
|
|
</span>
|
|
</button>
|
|
<fieldset *ngIf="showDateInterval" class="date-interval form-row is-boxed">
|
|
<div class="columns">
|
|
<div class="column">
|
|
<app-wip-todo></app-wip-todo>
|
|
{{ 'dates.interval_propose' | translate }}
|
|
<input type="text" formControlName="natural_lang_interval" />
|
|
<sub>
|
|
exemple "du 10 au 17", ou "lundi à samedi"
|
|
</sub>
|
|
<button (click)="addNaturalInstruction()" class="btn btn-block btn--primary">
|
|
interpréter
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="columns">
|
|
<div class="column">
|
|
<!-- <mat-form-field appearance="fill">-->
|
|
<!-- <mat-label>Enter a date range</mat-label>-->
|
|
<!-- <mat-date-range-input [formGroup]="form" [rangePicker]="picker">-->
|
|
<!-- <input matStartDate formControlName="startDateInterval" placeholder="Start date">-->
|
|
<!-- <input matEndDate formControlName="endDateInterval" placeholder="End date">-->
|
|
<!-- </mat-date-range-input>-->
|
|
<!-- <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>-->
|
|
<!-- <mat-date-range-picker #picker></mat-date-range-picker>-->
|
|
|
|
<!-- <mat-error *ngIf="form.controls.startDateInterval.hasError('matStartDateInvalid')">Invalid start date</mat-error>-->
|
|
<!-- <mat-error *ngIf="form.controls.endDateInterval.hasError('matEndDateInvalid')">Invalid end date</mat-error>-->
|
|
<!-- </mat-form-field>-->
|
|
</div>
|
|
<div class="column">
|
|
<label for="start_interval" class="hidden">start</label>
|
|
{{ form.value.startDateInterval }}
|
|
<input id="start_interval" formControlName="startDateInterval" type="date" />
|
|
</div>
|
|
</div>
|
|
<div class="columns">
|
|
<div class="column">
|
|
{{ 'dates.interval_span' | translate }}
|
|
</div>
|
|
<div class="column">
|
|
<label for="end_interval" class="hidden">end</label>
|
|
<input id="end_interval" formControlName="endDateInterval" type="date" />
|
|
{{ form.value.endDateInterval }}
|
|
<div class="span resume">
|
|
<div class="well">
|
|
Du
|
|
{{ form.value.startDateInterval | date: 'EEEE d':'Europe/Paris':'fr_FR' }}
|
|
au
|
|
{{ form.value.endDateInterval | date: 'EEEE d':'Europe/Paris':'fr_FR' }}
|
|
, soit {{ intervalDays }} jours.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button (click)="addIntervalOfDates()" class="btn btn-block btn--primary">
|
|
<i class="fa fa-plus" aria-hidden="true"></i>
|
|
{{ 'dates.interval_button' | translate }}
|
|
{{ intervalDays }}
|
|
{{ 'dates.interval_button_dates' | translate }}
|
|
</button>
|
|
</fieldset>
|
|
</div>
|