114 lines
3.6 KiB
HTML
114 lines
3.6 KiB
HTML
<div class="step min-height">
|
|
<app-stepper [step_current]="3" [step_max]="5"></app-stepper>
|
|
<app-errors-list [form]="pollService.form"></app-errors-list>
|
|
<!-- choix spécialement pour les dates-->
|
|
<div class="calendar" *ngIf="mode_calendar">
|
|
<p-calendar
|
|
[(ngModel)]="pollService.calendar"
|
|
firstDayOfWeek="1"
|
|
selectionMode="multiple"
|
|
inputId="multiple"
|
|
showButtonBar="true"
|
|
[locale]="'calendar_widget' | translate"
|
|
[disabledDates]="pollService.disabled_dates"
|
|
[inline]="true"
|
|
[showWeek]="false"
|
|
></p-calendar>
|
|
</div>
|
|
|
|
<div class="text-date-list" *ngIf="!mode_calendar">
|
|
<app-day-list
|
|
[form]="pollService.form"
|
|
[dateChoices]="pollService.dateChoiceList"
|
|
[hasSeveralHours]="pollService.form.value.hasSeveralHours"
|
|
></app-day-list>
|
|
</div>
|
|
|
|
<button class="button" (click)="changeDateInputMode()" [ngClass]="{ 'is-primary': !mode_calendar }">
|
|
<span *ngIf="mode_calendar"> <i class="fa fa-pencil"></i> Saisir les dates manuellement </span>
|
|
<span *ngIf="!mode_calendar"> <i class="fa fa-calendar-o"></i> Saisir les dates dans le calendrier </span>
|
|
</button>
|
|
</div>
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="dates-list">
|
|
<div class="actions">
|
|
<button
|
|
(click)="pollService.addTime()"
|
|
*ngIf="false == pollService.allowSeveralHours"
|
|
class="button is-primary is-block is-fullwidth"
|
|
id="add_time_button"
|
|
>
|
|
<i class="fa fa-plus" aria-hidden="true"></i>
|
|
{{ 'dates.add_time' | translate }}
|
|
</button>
|
|
<button class="button" (click)="pollService.allowSeveralHours = !pollService.allowSeveralHours">
|
|
<i class="fa fa-clock-o" aria-hidden="true"></i> Horaires différentes pour chaque jour
|
|
</button>
|
|
|
|
<button
|
|
(click)="pollService.removeAllTimes()"
|
|
*ngIf="pollService.timeList.length && false == pollService.allowSeveralHours"
|
|
class="btn is-warning marged"
|
|
id="remove_time_button"
|
|
>
|
|
<i class="fa fa-trash" aria-hidden="true"></i>
|
|
Aucune plage horaire
|
|
</button>
|
|
<button
|
|
(click)="pollService.resetTimes()"
|
|
*ngIf="pollService.timeList.length && false == pollService.allowSeveralHours"
|
|
class="btn is-warning marged"
|
|
id="reset_time_button"
|
|
>
|
|
<i class="fa fa-refresh" aria-hidden="true"></i>
|
|
réinitialiser
|
|
</button>
|
|
</div>
|
|
<div class="title" *ngIf="pollService.timeList.length">
|
|
<span class="count-dates">
|
|
{{ pollService.timeList.length }}
|
|
</span>
|
|
<span class="count-dates-txt">
|
|
{{ 'dates.count_time' | translate }}
|
|
(pour chaque jour)
|
|
</span>
|
|
</div>
|
|
<div
|
|
*ngIf="pollService.timeList.length && false == pollService.allowSeveralHours"
|
|
class="marged padded identical-dates"
|
|
>
|
|
<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
|
|
<div *ngFor="let time of pollService.timeList; index as id" class="time-choice" cdkDrag>
|
|
<label for="timeChoices_{{ id }}">
|
|
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
|
</label>
|
|
<input
|
|
[(ngModel)]="time.literal"
|
|
name="timeChoices_{{ id }}"
|
|
type="text"
|
|
id="timeChoices_{{ id }}"
|
|
/>
|
|
<button (click)="time.timeList.splice(id, 1)" class="btn btn-warning">
|
|
<i class="fa fa-times" aria-hidden="true"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="columns">
|
|
<div class="column">
|
|
<button class="button is-secondary is-fullwidth" [routerLink]="['/administration/step/2']">
|
|
précédent
|
|
</button>
|
|
</div>
|
|
<div class="column">
|
|
<!-- [disabled]="form.invalid"-->
|
|
<button class="button is-primary is-fullwidth" [routerLink]="['/administration/step/4']">
|
|
suivant
|
|
</button>
|
|
</div>
|
|
</div>
|