afficher les choix de plage horaires identiques

This commit is contained in:
Tykayn 2021-05-18 12:02:36 +02:00 committed by tykayn
parent 422090e997
commit 5028a54fb7
8 changed files with 39 additions and 31 deletions

View File

@ -30,7 +30,6 @@
</span> </span>
</div> </div>
<div class="actions columns"> <div class="actions columns">
<div class="column"></div>
<div class="column has-text-right"> <div class="column has-text-right">
<button <button
(click)="addTime()" (click)="addTime()"
@ -65,28 +64,28 @@
réinitialiser réinitialiser
</span> </span>
</button> </button>
</div> <fieldset class="range-container is-boxed">
<fieldset class="range-container is-boxed"> <div class="range-time" *ngIf="!form.value.hasSeveralHours">
<div class="range-time" *ngIf="!form.value.hasSeveralHours"> <h2>
<h2> <span class="count-dates-txt">
<span class="count-dates-txt"> {{ 'dates.count_time' | translate }}
{{ 'dates.count_time' | translate }} </span>
(identique pour chaque jour) </h2>
</span> <div class="title">
</h2> <span class="count-dates">
<div class="title"> {{ timeList.length }}
<span class="count-dates"> </span>
{{ timeList.length }} <button class="button is-warning" (click)="removeAllTimes()">
</span> <i class="fa fa-trash"></i>
<button class="button is-warning" (click)="removeAllTimes()"> </button>
<i class="fa fa-trash"></i> <button class="button is-info" (click)="resetTimes()">
</button> <i class="fa fa-refresh"></i>
<button class="button is-info" (click)="resetTimes()"> </button>
<i class="fa fa-refresh"></i> </div>
</button>
</div> </div>
</div> <app-time-list [timeSlices]="timeList"></app-time-list>
</fieldset> </fieldset>
</div>
</div> </div>
</div> </div>

View File

@ -52,4 +52,9 @@
.movable { .movable {
cursor: move; cursor: move;
} }
app-time-list {
margin-top: 1em;
display: block;
}
} }

View File

@ -26,8 +26,8 @@ export class DateSelectComponent implements OnInit {
@Input() @Input()
form: FormGroup; form: FormGroup;
displaySeveralHoursChoice = false; displaySeveralHoursChoice = true;
allowSeveralHours = false; allowSeveralHours = true;
today = new Date(); today = new Date();
endDateInterval: string; endDateInterval: string;

View File

@ -1,6 +1,5 @@
<p>time-list works!</p> <div *ngFor="let time of timeSlices; index as id" class="time-choice">
<div *ngFor="let time of timeList; index as id" class="time-choice"> <label class="icon" for="timeChoices_{{ id }}">
<label for="timeChoices_{{ id }}">
<i class="fa fa-clock-o" aria-hidden="true"></i> <i class="fa fa-clock-o" aria-hidden="true"></i>
</label> </label>
<input [(ngModel)]="time.literal" name="timeChoices_{{ id }}" type="text" id="timeChoices_{{ id }}" /> <input [(ngModel)]="time.literal" name="timeChoices_{{ id }}" type="text" id="timeChoices_{{ id }}" />

View File

@ -0,0 +1,6 @@
:host {
margin-top: 0.5em;
.icon {
margin-right: 1ch;
}
}

View File

@ -10,7 +10,6 @@ import { moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
export class TimeListComponent implements OnInit { export class TimeListComponent implements OnInit {
@Input() @Input()
public timeSlices: TimeSlices[]; public timeSlices: TimeSlices[];
timeList: any;
constructor() {} constructor() {}
ngOnInit(): void {} ngOnInit(): void {}

View File

@ -18,8 +18,8 @@
{{ 'creation.want' | translate }} {{ 'creation.want' | translate }}
</p> </p>
<!-- <div class="step-choices" *ngIf="currentStep === 'base'">--> <!-- <div class="step-choices" *ngIf="currentStep === 'base'">-->
<app-kind-select [form]="form"></app-kind-select> <!-- <app-kind-select [form]="form"></app-kind-select>-->
<app-base-config [form]="form"></app-base-config> <!-- <app-base-config [form]="form"></app-base-config>-->
<!-- </div>--> <!-- </div>-->
<!-- <div class="step-choices" *ngIf="currentStep === 'choices'"> </div>--> <!-- <div class="step-choices" *ngIf="currentStep === 'choices'"> </div>-->
<app-date-select *ngIf="form.value && form.value.kind == 'date'" [form]="form"></app-date-select> <app-date-select *ngIf="form.value && form.value.kind == 'date'" [form]="form"></app-date-select>

View File

@ -22,7 +22,7 @@ export class FormComponent implements OnInit {
public form: FormGroup; public form: FormGroup;
public displayDatePicker = false; public displayDatePicker = false;
public advancedDisplayEnabled = true; public advancedDisplayEnabled = false;
public show_debug_data = false; public show_debug_data = false;
public currentStep = 'base'; public currentStep = 'base';
public steps = ['base', 'choices', 'advanced']; public steps = ['base', 'choices', 'advanced'];