mirror of
https://framagit.org/framasoft/framadate/funky-framadate-front.git
synced 2023-08-25 13:53:14 +02:00
add choices for the future
This commit is contained in:
parent
2d49389d11
commit
237984c040
@ -36,22 +36,22 @@ export class Poll {
|
|||||||
new User(item.owner.pseudo, item.owner.email, undefined),
|
new User(item.owner.pseudo, item.owner.email, undefined),
|
||||||
item.slug,
|
item.slug,
|
||||||
item.title,
|
item.title,
|
||||||
item.description,
|
item.description
|
||||||
item.configuration,
|
// item.configuration,
|
||||||
item.comments
|
// item.comments
|
||||||
.map(
|
// .map(
|
||||||
(c: Pick<Comment, 'author' | 'content' | 'dateCreated'>) =>
|
// (c: Pick<Comment, 'author' | 'content' | 'dateCreated'>) =>
|
||||||
new Comment(c.author, c.content, new Date(c.dateCreated))
|
// new Comment(c.author, c.content, new Date(c.dateCreated))
|
||||||
)
|
// )
|
||||||
.sort(Comment.sortChronologically),
|
// .sort(Comment.sortChronologically),
|
||||||
item.choices.map((c: Pick<Choice, 'label' | 'imageUrl' | 'participants' | 'counts'>) => {
|
// item.choices.map((c: Pick<Choice, 'label' | 'imageUrl' | 'participants' | 'counts'>) => {
|
||||||
const choice = new Choice(c.label, c.imageUrl, new Map(c.participants));
|
// const choice = new Choice(c.label, c.imageUrl, new Map(c.participants));
|
||||||
choice.participants.forEach((value, key) => {
|
// choice.participants.forEach((value, key) => {
|
||||||
choice.participants.set(key, new Set(value));
|
// choice.participants.set(key, new Set(value));
|
||||||
});
|
// });
|
||||||
choice.updateCounts();
|
// choice.updateCounts();
|
||||||
return choice;
|
// return choice;
|
||||||
})
|
// })
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -23,9 +23,8 @@
|
|||||||
|
|
||||||
<br />
|
<br />
|
||||||
|
|
||||||
<label for="slug"
|
<label for="slug">
|
||||||
>Url pour les participants
|
Url personnalisée pour les participants
|
||||||
|
|
||||||
<i class="fa fa-close"></i>
|
<i class="fa fa-close"></i>
|
||||||
</label>
|
</label>
|
||||||
<br />
|
<br />
|
||||||
@ -48,13 +47,16 @@
|
|||||||
<input #slug matInput id="slug" placeholder="Url" formControlName="slug" required />
|
<input #slug matInput id="slug" placeholder="Url" formControlName="slug" required />
|
||||||
<br />
|
<br />
|
||||||
<div appearance="outline" class="is-not-flex">
|
<div appearance="outline" class="is-not-flex">
|
||||||
<mat-label>Nombre de jours avant expiration</mat-label>
|
<mat-label
|
||||||
|
>Nombre de jours avant expiration de la possibilité de voter, après le sondage reste
|
||||||
|
consultable</mat-label
|
||||||
|
>
|
||||||
<input
|
<input
|
||||||
#expiracy
|
#expiracy
|
||||||
id="expiracy"
|
id="expiracy"
|
||||||
matInput
|
matInput
|
||||||
type="number"
|
type="number"
|
||||||
placeholder="Nombre de jours avant expiration"
|
placeholder="Nombre de jours avant fin des votes"
|
||||||
formControlName="expiracyNumberOfDays"
|
formControlName="expiracyNumberOfDays"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
@ -69,15 +71,57 @@
|
|||||||
<i class="fa fa-close"></i>
|
<i class="fa fa-close"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
<div appearance="outline" class="is-not-flex">
|
||||||
|
<mat-label
|
||||||
|
>Nombre de jours avant archivage, après quoi le sondage n'est plus visible par le public</mat-label
|
||||||
|
>
|
||||||
|
<input
|
||||||
|
#archive
|
||||||
|
id="archive"
|
||||||
|
matInput
|
||||||
|
type="number"
|
||||||
|
placeholder="Nombre de jours avant archivage"
|
||||||
|
formControlName="archiveNumberOfDays"
|
||||||
|
required
|
||||||
|
/>
|
||||||
|
<button
|
||||||
|
mat-button
|
||||||
|
*ngIf="archive.value"
|
||||||
|
matSuffix
|
||||||
|
mat-icon-button
|
||||||
|
aria-label="Clear"
|
||||||
|
(click)="archive.value = ''"
|
||||||
|
>
|
||||||
|
<i class="fa fa-close"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
<mat-checkbox class="is-not-flex" formControlName="areResultsPublic">
|
<mat-checkbox class="is-not-flex" formControlName="areResultsPublic">
|
||||||
Les participants pourront consulter les résultats
|
Les participants pourront consulter les résultats
|
||||||
</mat-checkbox>
|
</mat-checkbox>
|
||||||
<mat-checkbox class="is-not-flex" formControlName="isAboutDate">
|
<h3 class="title is-3">
|
||||||
Les choix possibles concerneront des dates
|
<i class="fa fa-lock"></i>
|
||||||
</mat-checkbox>
|
Accès sécurisé
|
||||||
|
</h3>
|
||||||
|
|
||||||
<mat-checkbox class="is-not-flex" formControlName="isProtectedByPassword">
|
<mat-checkbox class="is-not-flex" formControlName="isProtectedByPassword">
|
||||||
Le sondage sera protégé par un mot de passe
|
Le sondage sera protégé par un mot de passe
|
||||||
</mat-checkbox>
|
</mat-checkbox>
|
||||||
|
|
||||||
|
<input
|
||||||
|
*ngIf="form.value.isProtectedByPassword"
|
||||||
|
#password
|
||||||
|
id="password"
|
||||||
|
matInput
|
||||||
|
type="password"
|
||||||
|
placeholder="password"
|
||||||
|
formControlName="password"
|
||||||
|
required
|
||||||
|
/>
|
||||||
|
|
||||||
|
<h3 class="title is-3">
|
||||||
|
<i class="fa fa-enveloppe"></i>
|
||||||
|
Notifications
|
||||||
|
</h3>
|
||||||
<mat-checkbox class="is-not-flex" formControlName="isOwnerNotifiedByEmailOnNewVote">
|
<mat-checkbox class="is-not-flex" formControlName="isOwnerNotifiedByEmailOnNewVote">
|
||||||
Vous recevrez un mail à chaque nouvelle participation
|
Vous recevrez un mail à chaque nouvelle participation
|
||||||
</mat-checkbox>
|
</mat-checkbox>
|
||||||
@ -88,4 +132,34 @@
|
|||||||
La réponse « peut-être » sera disponible
|
La réponse « peut-être » sera disponible
|
||||||
</mat-checkbox>
|
</mat-checkbox>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
|
|
||||||
|
<fieldset>
|
||||||
|
<h2>
|
||||||
|
Fonctionnalités pas encore disponibles:
|
||||||
|
</h2>
|
||||||
|
<app-wip-todo></app-wip-todo>
|
||||||
|
<mat-checkbox class="is-not-flex" formControlName="isProtectedByPassword">
|
||||||
|
Spécifier un lien unique de vote à des participants définis
|
||||||
|
</mat-checkbox>
|
||||||
|
<mat-checkbox class="is-not-flex" formControlName="allowComments">
|
||||||
|
Autoriser les commentaires
|
||||||
|
</mat-checkbox>
|
||||||
|
<mat-checkbox class="is-not-flex" formControlName="hasMaxCountOfAnswers">
|
||||||
|
Nombre de réponses limitées à ce nombre
|
||||||
|
</mat-checkbox>
|
||||||
|
<input
|
||||||
|
*ngIf="form.value.hasMaxCountOfAnswers"
|
||||||
|
#limitCount
|
||||||
|
id="limitCount"
|
||||||
|
matInput
|
||||||
|
type="number"
|
||||||
|
placeholder="Nombre de réponses max"
|
||||||
|
formControlName="maxCountOfAnswers"
|
||||||
|
required
|
||||||
|
/>
|
||||||
|
|
||||||
|
<mat-checkbox class="is-not-flex" formControlName="isZeroKnoledge">
|
||||||
|
Les informations du sondage seront chiffrés en base de données
|
||||||
|
</mat-checkbox>
|
||||||
|
</fieldset>
|
||||||
</form>
|
</form>
|
||||||
|
@ -64,50 +64,39 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr />
|
<hr />
|
||||||
<!-- <div class="columns">-->
|
<div class="columns">
|
||||||
<!-- <div class="column">-->
|
<div class="column">
|
||||||
<!-- <img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />-->
|
<img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />
|
||||||
<!-- <div>-->
|
<div>
|
||||||
<!-- <h2>-->
|
<h2>
|
||||||
<!-- {{ 'choices.title' | translate }}-->
|
{{ 'choices.title' | translate }}
|
||||||
<!-- </h2>-->
|
</h2>
|
||||||
<!-- {{ 'dates.add' | translate }}-->
|
{{ 'dates.add' | translate }}
|
||||||
<!-- <p>-->
|
<p>
|
||||||
<!-- <i>-->
|
<i>
|
||||||
<!-- {{ 'choices.helper' | translate }}-->
|
{{ 'choices.helper' | translate }}
|
||||||
<!-- </i>-->
|
</i>
|
||||||
<!-- </p>-->
|
</p>
|
||||||
<!-- {{ 'choices.answer_preset_1' | translate }}-->
|
{{ 'choices.answer_preset_1' | translate }}
|
||||||
<!-- {{ 'choices.add' | translate }}-->
|
{{ 'choices.add' | translate }}
|
||||||
<!-- {{ 'choices.continue' | translate }}-->
|
{{ 'choices.continue' | translate }}
|
||||||
<!-- </div>-->
|
</div>
|
||||||
<!-- </div>-->
|
</div>
|
||||||
<!-- </div>-->
|
</div>
|
||||||
<!-- <div class="column">-->
|
<div class="column">
|
||||||
<!-- <button class="btn btn--warning" (click)="askInitFormDefault()">-->
|
<button class="btn btn--warning" (click)="askInitFormDefault()">
|
||||||
<!-- <i class="fa fa-refresh"></i>-->
|
<i class="fa fa-refresh"></i>
|
||||||
<!-- Tout réinitialiser-->
|
Tout réinitialiser
|
||||||
<!-- </button>-->
|
</button>
|
||||||
<!-- <br />-->
|
<br />
|
||||||
<!-- <button class="btn is-success" (click)="createPoll()">-->
|
<button class="btn is-success" (click)="createPoll()">
|
||||||
<!-- <i class="fa fa-save"></i>-->
|
<i class="fa fa-save"></i>
|
||||||
<!-- Enregistrer le sondage-->
|
Enregistrer le sondage
|
||||||
<!-- </button>-->
|
</button>
|
||||||
<!-- <br />-->
|
<br />
|
||||||
<!-- <button class="btn is-default" (click)="automaticSlug()">-->
|
<button class="btn is-default" (click)="automaticSlug()">
|
||||||
<!-- <i class="fa fa-refresh"></i>-->
|
<i class="fa fa-refresh"></i>
|
||||||
<!-- Slug automatique-->
|
Slug automatique
|
||||||
<!-- </button>-->
|
</button>
|
||||||
|
</div>
|
||||||
<!-- <div class="columns">-->
|
|
||||||
<!-- <div class="column">-->
|
|
||||||
<!-- Slug:-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="column">-->
|
|
||||||
<!-- <div class="well">-->
|
|
||||||
<!-- {{ form.slug }}-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
</form>
|
</form>
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import { ChangeDetectorRef, Component, EventEmitter, Inject, Input, OnInit, Output } from '@angular/core';
|
import { ChangeDetectorRef, Component, Inject, Input, OnInit } from '@angular/core';
|
||||||
import { ToastService } from '../../../../core/services/toast.service';
|
import { ToastService } from '../../../../core/services/toast.service';
|
||||||
import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
|
import { FormBuilder, FormGroup } from '@angular/forms';
|
||||||
import { UuidService } from '../../../../core/services/uuid.service';
|
import { UuidService } from '../../../../core/services/uuid.service';
|
||||||
import { PollService } from '../../../../core/services/poll.service';
|
import { PollService } from '../../../../core/services/poll.service';
|
||||||
import { ApiService } from '../../../../core/services/api.service';
|
import { ApiService } from '../../../../core/services/api.service';
|
||||||
@ -13,7 +13,7 @@ import { Poll } from '../../../../core/models/poll.model';
|
|||||||
templateUrl: './base-config.component.html',
|
templateUrl: './base-config.component.html',
|
||||||
styleUrls: ['./base-config.component.scss'],
|
styleUrls: ['./base-config.component.scss'],
|
||||||
})
|
})
|
||||||
export class BaseConfigComponent implements OnInit {
|
export class BaseConfigComponent {
|
||||||
@Input()
|
@Input()
|
||||||
public poll?: Poll;
|
public poll?: Poll;
|
||||||
@Input()
|
@Input()
|
||||||
@ -30,8 +30,6 @@ export class BaseConfigComponent implements OnInit {
|
|||||||
@Inject(DOCUMENT) private document: Document
|
@Inject(DOCUMENT) private document: Document
|
||||||
) {}
|
) {}
|
||||||
|
|
||||||
ngOnInit(): void {}
|
|
||||||
|
|
||||||
askInitFormDefault(): void {
|
askInitFormDefault(): void {
|
||||||
// this.initFormDefault(false);
|
// this.initFormDefault(false);
|
||||||
this.toastService.display('formulaire réinitialisé');
|
this.toastService.display('formulaire réinitialisé');
|
||||||
@ -43,19 +41,18 @@ export class BaseConfigComponent implements OnInit {
|
|||||||
console.log('newpoll', newpoll);
|
console.log('newpoll', newpoll);
|
||||||
const router = this.router;
|
const router = this.router;
|
||||||
|
|
||||||
this.apiService.createPoll(newpoll).then((resp) => {
|
if (this.form.valid) {
|
||||||
console.log('resp', resp);
|
console.log('Le sondage est correctement rempli, prêt à enregistrer.');
|
||||||
router.navigate(['success']);
|
const newpoll = this.pollService.newPollFromForm(this.form);
|
||||||
});
|
// TODO : save the poll
|
||||||
// this.router
|
|
||||||
// if (this.form.valid) {
|
this.apiService.createPoll(newpoll).then((resp) => {
|
||||||
// console.log('Le sondage est correctement rempli, prêt à enregistrer.');
|
console.log('resp', resp);
|
||||||
// const newpoll = this.pollService.newPollFromForm(this.form);
|
router.navigate(['success']);
|
||||||
// // TODO : save the poll
|
});
|
||||||
// this.apiService.createPoll(newpoll);
|
} else {
|
||||||
// } else {
|
this.toastService.display('invalid form');
|
||||||
// this.toastService.display('invalid form');
|
}
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public updateSlug(): void {
|
public updateSlug(): void {
|
||||||
@ -67,10 +64,6 @@ export class BaseConfigComponent implements OnInit {
|
|||||||
* set the poll slug from other data of the poll
|
* set the poll slug from other data of the poll
|
||||||
*/
|
*/
|
||||||
automaticSlug() {
|
automaticSlug() {
|
||||||
this.form.patchValue({ slug: this.pollService.makeSlug(this.poll) });
|
this.form.patchValue({ slug: this.pollService.makeSlug(this.form.value) });
|
||||||
}
|
|
||||||
|
|
||||||
formUpdate() {
|
|
||||||
this.formChange.emit(this.form);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,139 +1,145 @@
|
|||||||
<div class="date-selection">
|
<div class="date-selection">
|
||||||
<!-- interval-->
|
<form [formGroup]="form">
|
||||||
|
<!-- interval-->
|
||||||
|
|
||||||
<section *ngIf="showDateInterval" class="date-interval form-row">
|
<!-- <section *ngIf="showDateInterval" class="date-interval form-row">-->
|
||||||
<button
|
<!-- <button-->
|
||||||
(click)="showDateInterval = !showDateInterval"
|
<!-- (click)="showDateInterval = !showDateInterval"-->
|
||||||
[ngClass]="{ active: showDateInterval }"
|
<!-- [ngClass]="{ active: showDateInterval }"-->
|
||||||
class="btn btn--primary"
|
<!-- class="btn btn--primary"-->
|
||||||
id="toggle_interval_button"
|
<!-- id="toggle_interval_button"-->
|
||||||
>
|
<!-- >-->
|
||||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
<!-- <i class="fa fa-clock-o" aria-hidden="true"></i>-->
|
||||||
{{ 'dates.add_interval' | translate }}
|
<!-- {{ 'dates.add_interval' | translate }}-->
|
||||||
</button>
|
<!-- </button>-->
|
||||||
<h2>{{ 'dates.add_interval' | translate }}</h2>
|
<!-- <h2>{{ 'dates.add_interval' | translate }}</h2>-->
|
||||||
<div class="columns">
|
<!-- <div class="columns">-->
|
||||||
<div class="column">
|
<!-- <div class="column">-->
|
||||||
{{ 'dates.interval_propose' | translate }}
|
<!-- {{ 'dates.interval_propose' | translate }}-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="column">
|
<!-- <div class="column">-->
|
||||||
<label for="start_interval" class="hidden">start</label>
|
<!-- <label for="start_interval" class="hidden">start</label>-->
|
||||||
<input id="start_interval" (change)="countDays()" formControlName="startDateInterval" type="date" />
|
<!-- <input id="start_interval" (change)="countDays()" formControlName="startDateInterval" type="date" />-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="columns">
|
<!-- <div class="columns">-->
|
||||||
<div class="column">
|
<!-- <div class="column">-->
|
||||||
{{ 'dates.interval_span' | translate }}
|
<!-- {{ 'dates.interval_span' | translate }}-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="column">
|
<!-- <div class="column">-->
|
||||||
<label for="end_interval" class="hidden">end</label>
|
<!-- <label for="end_interval" class="hidden">end</label>-->
|
||||||
<input id="end_interval" formControlName="endDateInterval" type="date" />
|
<!-- <input id="end_interval" formControlName="endDateInterval" type="date" />-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<button (click)="addIntervalOfDates()" class="btn btn-block btn--primary">
|
<!-- <button (click)="addIntervalOfDates()" class="btn btn-block btn--primary">-->
|
||||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
<!-- <i class="fa fa-plus" aria-hidden="true"></i>-->
|
||||||
{{ 'dates.interval_button' | translate }}
|
<!-- {{ 'dates.interval_button' | translate }}-->
|
||||||
{{ intervalDays }}
|
<!-- {{ intervalDays }}-->
|
||||||
{{ 'dates.interval_button_dates' | translate }}
|
<!-- {{ 'dates.interval_button_dates' | translate }}-->
|
||||||
</button>
|
<!-- </button>-->
|
||||||
</section>
|
<!-- </section>-->
|
||||||
|
|
||||||
<div class="dates-list">
|
<div class="dates-list">
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<span class="count-dates">
|
<span class="count-dates">
|
||||||
{{ timeList.length }}
|
{{ timeList.length }}
|
||||||
|
</span>
|
||||||
|
<span class="count-dates-txt">
|
||||||
|
{{ 'dates.count_time' | translate }}
|
||||||
|
(pour chaque jour)
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="actions">
|
||||||
|
<button
|
||||||
|
(click)="addTime()"
|
||||||
|
*ngIf="'false' === allowSeveralHours"
|
||||||
|
class="btn btn--primary"
|
||||||
|
id="add_time_button"
|
||||||
|
>
|
||||||
|
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||||
|
{{ 'dates.add_time' | translate }}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
(click)="removeAllTimes()"
|
||||||
|
*ngIf="'false' === allowSeveralHours"
|
||||||
|
class="btn btn--warning"
|
||||||
|
id="remove_time_button"
|
||||||
|
>
|
||||||
|
<i class="fa fa-trash" aria-hidden="true"></i>
|
||||||
|
Aucune plage horaire
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
(click)="resetTimes()"
|
||||||
|
*ngIf="'false' === allowSeveralHours"
|
||||||
|
class="btn btn--warning"
|
||||||
|
id="reset_time_button"
|
||||||
|
>
|
||||||
|
<i class="fa fa-refresh" aria-hidden="true"></i>
|
||||||
|
réinitialiser
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="'false' === allowSeveralHours" class="identical-dates">
|
||||||
|
<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
|
||||||
|
<div *ngFor="let time of 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>
|
||||||
|
<hr />
|
||||||
|
<span class="count-dates title">
|
||||||
|
{{ dateList.length }}
|
||||||
</span>
|
</span>
|
||||||
<span class="count-dates-txt">
|
<span>
|
||||||
{{ 'dates.count_time' | translate }}
|
{{ 'dates.count_dates' | translate }}
|
||||||
(pour chaque jour)
|
|
||||||
</span>
|
</span>
|
||||||
</div>
|
<button class="btn btn--primary" (click)="addChoice()">
|
||||||
<div class="actions">
|
{{ 'dates.add' | translate }}
|
||||||
<button
|
|
||||||
(click)="addTime()"
|
|
||||||
*ngIf="'false' === allowSeveralHours"
|
|
||||||
class="btn btn--primary"
|
|
||||||
id="add_time_button"
|
|
||||||
>
|
|
||||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
|
||||||
{{ 'dates.add_time' | translate }}
|
|
||||||
</button>
|
</button>
|
||||||
<button
|
<div *ngFor="let choice of dateList; index as id" class="date-choice">
|
||||||
(click)="removeAllTimes()"
|
{{ id }})
|
||||||
*ngIf="'false' === allowSeveralHours"
|
<input
|
||||||
class="btn btn--warning"
|
[(ngModel)]="choice.date_object"
|
||||||
id="remove_time_button"
|
name="dateChoices_{{ id }}"
|
||||||
>
|
id="dateChoices_{{ id }}"
|
||||||
<i class="fa fa-trash" aria-hidden="true"></i>
|
useValueAsDate
|
||||||
Aucune plage horaire
|
type="date"
|
||||||
</button>
|
/>
|
||||||
<button
|
<button (click)="dateList.splice(id, 1)" class="btn btn-warning">
|
||||||
(click)="resetTimes()"
|
<i class="fa fa-times" aria-hidden="true"></i>
|
||||||
*ngIf="'false' === allowSeveralHours"
|
</button>
|
||||||
class="btn btn--warning"
|
<button
|
||||||
id="reset_time_button"
|
(click)="addTimeToDate(choice, id)"
|
||||||
>
|
*ngIf="'true' === allowSeveralHours"
|
||||||
<i class="fa fa-refresh" aria-hidden="true"></i>
|
class="btn btn--primary"
|
||||||
réinitialiser
|
>
|
||||||
</button>
|
{{ 'dates.add_time' | translate }}
|
||||||
</div>
|
</button>
|
||||||
|
<div *ngIf="'true' === allowSeveralHours" class="several-times">
|
||||||
<div *ngIf="'false' === allowSeveralHours" class="identical-dates">
|
<div *ngFor="let timeItem of choice.timeList; index as idTime" class="time-choice">
|
||||||
<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
|
<input
|
||||||
<div *ngFor="let time of timeList; index as id" class="time-choice" cdkDrag>
|
[(ngModel)]="timeItem.literal"
|
||||||
<label for="timeChoices_{{ id }}">
|
name="dateTime_{{ id }}_Choices_{{ idTime }}"
|
||||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
id="dateTime_{{ id }}_Choices_{{ idTime }}"
|
||||||
</label>
|
type="text"
|
||||||
<input
|
/>
|
||||||
[(ngModel)]="time.literal"
|
<button (click)="choice.timeList.splice(idTime, 1)" class="btn btn-warning">
|
||||||
name="timeChoices_{{ id }}"
|
<i class="fa fa-times" aria-hidden="true"></i>
|
||||||
type="text"
|
</button>
|
||||||
id="timeChoices_{{ id }}"
|
</div>
|
||||||
/>
|
|
||||||
<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>
|
||||||
<hr />
|
</form>
|
||||||
<span class="count-dates title">
|
|
||||||
{{ dateList.length }}
|
|
||||||
</span>
|
|
||||||
<span>
|
|
||||||
{{ 'dates.count_dates' | translate }}
|
|
||||||
</span>
|
|
||||||
<button class="btn btn--primary" (click)="addChoice()">
|
|
||||||
{{ 'dates.add' | translate }}
|
|
||||||
</button>
|
|
||||||
<div *ngFor="let choice of dateList; index as id" class="date-choice">
|
|
||||||
{{ id }})
|
|
||||||
<input
|
|
||||||
[(ngModel)]="choice.date_object"
|
|
||||||
name="dateChoices_{{ id }}"
|
|
||||||
id="dateChoices_{{ id }}"
|
|
||||||
useValueAsDate
|
|
||||||
type="date"
|
|
||||||
/>
|
|
||||||
<button (click)="dateList.splice(id, 1)" class="btn btn-warning">
|
|
||||||
<i class="fa fa-times" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
<button (click)="addTimeToDate(choice, id)" *ngIf="'true' === allowSeveralHours" class="btn btn--primary">
|
|
||||||
{{ 'dates.add_time' | translate }}
|
|
||||||
</button>
|
|
||||||
<div *ngIf="'true' === allowSeveralHours" class="several-times">
|
|
||||||
<div *ngFor="let timeItem of choice.timeList; index as idTime" class="time-choice">
|
|
||||||
<input
|
|
||||||
[(ngModel)]="timeItem.literal"
|
|
||||||
name="dateTime_{{ id }}_Choices_{{ idTime }}"
|
|
||||||
id="dateTime_{{ id }}_Choices_{{ idTime }}"
|
|
||||||
type="text"
|
|
||||||
/>
|
|
||||||
<button (click)="choice.timeList.splice(idTime, 1)" class="btn btn-warning">
|
|
||||||
<i class="fa fa-times" aria-hidden="true"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -9,6 +9,7 @@ import { Router } from '@angular/router';
|
|||||||
import { DOCUMENT } from '@angular/common';
|
import { DOCUMENT } from '@angular/common';
|
||||||
import { DateChoice, otherDefaultDates } from '../../../old-stuff/config/defaultConfigs';
|
import { DateChoice, otherDefaultDates } from '../../../old-stuff/config/defaultConfigs';
|
||||||
import { Poll } from '../../../../core/models/poll.model';
|
import { Poll } from '../../../../core/models/poll.model';
|
||||||
|
import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-date-select',
|
selector: 'app-date-select',
|
||||||
@ -16,8 +17,6 @@ import { Poll } from '../../../../core/models/poll.model';
|
|||||||
styleUrls: ['./date-select.component.scss'],
|
styleUrls: ['./date-select.component.scss'],
|
||||||
})
|
})
|
||||||
export class DateSelectComponent implements OnInit {
|
export class DateSelectComponent implements OnInit {
|
||||||
@Input()
|
|
||||||
public poll?: Poll;
|
|
||||||
@Input()
|
@Input()
|
||||||
public form: FormGroup;
|
public form: FormGroup;
|
||||||
|
|
||||||
@ -163,7 +162,7 @@ export class DateSelectComponent implements OnInit {
|
|||||||
imageUrl: 'mon url',
|
imageUrl: 'mon url',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
this.choices.push(newControlGroup);
|
this.form.value.choices.push(newControlGroup);
|
||||||
this.cd.detectChanges();
|
this.cd.detectChanges();
|
||||||
console.log('this.choices.length', this.choices.length);
|
console.log('this.choices.length', this.choices.length);
|
||||||
|
|
||||||
@ -238,4 +237,8 @@ export class DateSelectComponent implements OnInit {
|
|||||||
this.addChoice('raisin');
|
this.addChoice('raisin');
|
||||||
this.addChoice('abricot');
|
this.addChoice('abricot');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
drop(event: CdkDragDrop<string[]>) {
|
||||||
|
moveItemInArray(this.form.value.choices, event.previousIndex, event.currentIndex);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -8,26 +8,27 @@
|
|||||||
<p class="subtitle">
|
<p class="subtitle">
|
||||||
{{ 'creation.want' | translate }}
|
{{ 'creation.want' | translate }}
|
||||||
</p>
|
</p>
|
||||||
<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-date-select ng-if="form.value.isAboutDate" [form]="form"></app-date-select>
|
||||||
|
<app-text-select ng-if="!form.value.isAboutDate" [form]="form"></app-text-select>
|
||||||
|
|
||||||
|
<app-base-config [form]="form"></app-base-config>
|
||||||
</div>
|
</div>
|
||||||
<div class="column">
|
</div>
|
||||||
<pre class="debug padded warning">
|
<div class="column">
|
||||||
|
<pre class="debug padded warning">
|
||||||
form values :
|
form values :
|
||||||
{{ form.value | json }}
|
{{ form.value | json }}
|
||||||
</pre
|
</pre
|
||||||
>
|
>
|
||||||
<pre class="debug padded warning">
|
<pre class="debug padded warning">
|
||||||
poll initial values :
|
poll initial values :
|
||||||
{{ poll | json }}
|
{{ poll | json }}
|
||||||
</pre
|
</pre
|
||||||
>
|
>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- choix spécialement pour les dates-->
|
<!-- choix spécialement pour les dates-->
|
||||||
<!-- <app-date-select ng-if="form.kind == 'date'"></app-date-select>-->
|
|
||||||
<!-- <app-text-select ng-if="form.kind == 'classic'"></app-text-select>-->
|
|
||||||
<button class="btn is-info" (click)="advancedDisplayEnabled = !advancedDisplayEnabled">
|
<button class="btn is-info" (click)="advancedDisplayEnabled = !advancedDisplayEnabled">
|
||||||
<i class="fa fa-save"></i>
|
<i class="fa fa-save"></i>
|
||||||
{{ 'creation.advanced' | translate }}
|
{{ 'creation.advanced' | translate }}
|
||||||
|
@ -20,7 +20,7 @@ export class FormComponent implements OnInit {
|
|||||||
public poll?: Poll;
|
public poll?: Poll;
|
||||||
public form: FormGroup;
|
public form: FormGroup;
|
||||||
|
|
||||||
public advancedDisplayEnabled = false;
|
public advancedDisplayEnabled = true;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private fb: FormBuilder,
|
private fb: FormBuilder,
|
||||||
@ -34,10 +34,6 @@ export class FormComponent implements OnInit {
|
|||||||
@Inject(DOCUMENT) private document: any
|
@Inject(DOCUMENT) private document: any
|
||||||
) {}
|
) {}
|
||||||
|
|
||||||
drop(event: CdkDragDrop<string[]>) {
|
|
||||||
// moveItemInArray(this.choices, event.previousIndex, event.currentIndex);
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.initFormDefault();
|
this.initFormDefault();
|
||||||
|
|
||||||
@ -53,16 +49,21 @@ export class FormComponent implements OnInit {
|
|||||||
slug: [this.uuidService.getUUID(), [Validators.required]],
|
slug: [this.uuidService.getUUID(), [Validators.required]],
|
||||||
description: ['', [Validators.required]],
|
description: ['', [Validators.required]],
|
||||||
choices: new FormArray([]),
|
choices: new FormArray([]),
|
||||||
|
// configuration: new FormGroup(),
|
||||||
whoModifiesAnswers: ['', [Validators.required]],
|
whoModifiesAnswers: ['', [Validators.required]],
|
||||||
whoCanChangeAnswers: ['', [Validators.required]],
|
whoCanChangeAnswers: ['', [Validators.required]],
|
||||||
isAboutDate: [true, [Validators.required]],
|
isAboutDate: [true, [Validators.required]],
|
||||||
startDateInterval: ['', [Validators.required]],
|
startDateInterval: ['', [Validators.required]],
|
||||||
endDateInterval: ['', [Validators.required]],
|
endDateInterval: ['', [Validators.required]],
|
||||||
isProtectedByPassword: [false, [Validators.required]],
|
isProtectedByPassword: [false, [Validators.required]],
|
||||||
|
hasMaxCountOfAnswers: [true, [Validators.required]],
|
||||||
|
allowComments: [true, [Validators.required]],
|
||||||
|
maxCountOfAnswers: [150, [Validators.required]],
|
||||||
isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]],
|
isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]],
|
||||||
isOwnerNotifiedByEmailOnNewComment: [false, [Validators.required]],
|
isOwnerNotifiedByEmailOnNewComment: [false, [Validators.required]],
|
||||||
isMaybeAnswerAvailable: [false, [Validators.required]],
|
isMaybeAnswerAvailable: [false, [Validators.required]],
|
||||||
areResultsPublic: [true, [Validators.required]],
|
areResultsPublic: [true, [Validators.required]],
|
||||||
|
password: [this.uuidService.getUUID(), [Validators.required]],
|
||||||
expiracyNumberOfDays: [60, [Validators.required, Validators.min(0)]],
|
expiracyNumberOfDays: [60, [Validators.required, Validators.min(0)]],
|
||||||
});
|
});
|
||||||
console.log('this.form ', this.form);
|
console.log('this.form ', this.form);
|
||||||
@ -83,16 +84,16 @@ export class FormComponent implements OnInit {
|
|||||||
creatorPseudo: 'Chuck Norris',
|
creatorPseudo: 'Chuck Norris',
|
||||||
creatorEmail: 'chucknorris@example.com',
|
creatorEmail: 'chucknorris@example.com',
|
||||||
isAboutDate: true,
|
isAboutDate: true,
|
||||||
// configuration: {
|
configuration: {
|
||||||
// whoModifiesAnswers: 'everybody',
|
whoModifiesAnswers: 'everybody',
|
||||||
// whoCanChangeAnswers: 'everybody'
|
whoCanChangeAnswers: 'everybody',
|
||||||
// isProtectedByPassword: false,
|
isProtectedByPassword: false,
|
||||||
// isOwnerNotifiedByEmailOnNewVote: false,
|
isOwnerNotifiedByEmailOnNewVote: false,
|
||||||
// isOwnerNotifiedByEmailOnNewComment: false,
|
isOwnerNotifiedByEmailOnNewComment: false,
|
||||||
// isMaybeAnswerAvailable: false,
|
isMaybeAnswerAvailable: false,
|
||||||
// areResultsPublic: true,
|
areResultsPublic: true,
|
||||||
// expiracyNumberOfDays: 60,
|
expiracyNumberOfDays: 60,
|
||||||
// },
|
},
|
||||||
comments: [],
|
comments: [],
|
||||||
choices: [],
|
choices: [],
|
||||||
dateChoices: [],
|
dateChoices: [],
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, Input, OnInit } from '@angular/core';
|
||||||
|
import { FormGroup } from '@angular/forms';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-text-select',
|
selector: 'app-text-select',
|
||||||
@ -6,6 +7,9 @@ import { Component, OnInit } from '@angular/core';
|
|||||||
styleUrls: ['./text-select.component.scss'],
|
styleUrls: ['./text-select.component.scss'],
|
||||||
})
|
})
|
||||||
export class TextSelectComponent implements OnInit {
|
export class TextSelectComponent implements OnInit {
|
||||||
|
@Input()
|
||||||
|
public form: FormGroup;
|
||||||
|
|
||||||
constructor() {}
|
constructor() {}
|
||||||
|
|
||||||
ngOnInit(): void {}
|
ngOnInit(): void {}
|
||||||
|
Loading…
Reference in New Issue
Block a user