link to base config

This commit is contained in:
Tykayn 2021-02-05 15:34:00 +01:00 committed by tykayn
parent f96dc1f3c4
commit 2d49389d11
6 changed files with 111 additions and 98 deletions

View File

@ -8,9 +8,12 @@ import { User } from './user.model';
export class Poll {
constructor(
public owner: User = new User(),
public slug: string = 'default-slug',
public title: string = 'default title',
public slug: string = '',
public title: string = '',
public description?: string,
public creatorPseudo?: string,
public creatorEmail?: string,
public isAboutDate?: boolean,
public configuration: PollConfiguration = new PollConfiguration(),
public comments: Comment[] = [],
public choices: Choice[] = [],

View File

@ -1,6 +1,6 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { TranslateModule } from '@ngx-translate/core';
import { SharedModule } from '../../shared/shared.module';
@ -35,6 +35,7 @@ import { AdvancedConfigComponent } from './form/advanced-config/advanced-config.
CommonModule,
ReactiveFormsModule,
SharedModule,
FormsModule,
TranslateModule.forChild({ extend: true }),
DateValueAccessorModule,
],

View File

@ -4,11 +4,12 @@
<p>
{{ 'creation.choose_title' | translate }}
</p>
<h2 class="title is-2">slug: {{ form.value.slug }}</h2>
<br />
<label class="hidden" for="title">Titre</label>
<input
#title
matInput
#title
[placeholder]="'creation.choose_title_placeholder' | translate"
formControlName="title"
id="title"
@ -18,11 +19,11 @@
/>
<button
mat-button
*ngIf="title.value"
*ngIf="form.value.title"
matSuffix
mat-icon-button
aria-label="Clear"
(click)="title.value = ''"
(click)="form.patchValue({ title: '' })"
>
<i class="fa fa-close"></i>
</button>
@ -35,7 +36,7 @@
</label>
<input
#title
#creatorEmail
matInput
placeholder="{{ 'creation.email_placeholder' | translate }}"
formControlName="creatorEmail"
@ -49,57 +50,64 @@
{{ 'creation.name' | translate }}
</span>
</label>
<input #title matInput placeholder="pseudo" formControlName="creatorPseudo" id="creatorPseudo" required />
<input
#creatorPseudo
matInput
placeholder="pseudo"
formControlName="creatorPseudo"
id="creatorPseudo"
required
/>
</div>
<hr />
</div>
<hr />
<div class="columns">
<div class="column">
<!-- <img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />-->
<div>
<h2>
{{ 'choices.title' | translate }}
</h2>
{{ 'dates.add' | translate }}
<p>
<i>
{{ 'choices.helper' | translate }}
</i>
</p>
{{ 'choices.answer_preset_1' | translate }}
{{ 'choices.add' | translate }}
{{ 'choices.continue' | translate }}
</div>
</div>
</div>
<div class="column">
<button class="btn btn--warning" (click)="askInitFormDefault()">
<i class="fa fa-refresh"></i>
Tout réinitialiser
</button>
<br />
<button class="btn is-success" (click)="createPoll()">
<i class="fa fa-save"></i>
Enregistrer le sondage
</button>
<br />
<button class="btn is-default" (click)="automaticSlug()">
<i class="fa fa-refresh"></i>
Slug automatique
</button>
<!-- <div class="columns">-->
<!-- <div class="column">-->
<!-- <img src="assets/img/undraw_Moving_twwf.svg" alt="image WIP" />-->
<!-- <div>-->
<!-- <h2>-->
<!-- {{ 'choices.title' | translate }}-->
<!-- </h2>-->
<!-- {{ 'dates.add' | translate }}-->
<!-- <p>-->
<!-- <i>-->
<!-- {{ 'choices.helper' | translate }}-->
<!-- </i>-->
<!-- </p>-->
<!-- {{ 'choices.answer_preset_1' | translate }}-->
<!-- {{ 'choices.add' | translate }}-->
<!-- {{ 'choices.continue' | translate }}-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="column">-->
<!-- <button class="btn btn&#45;&#45;warning" (click)="askInitFormDefault()">-->
<!-- <i class="fa fa-refresh"></i>-->
<!-- Tout réinitialiser-->
<!-- </button>-->
<!-- <br />-->
<!-- <button class="btn is-success" (click)="createPoll()">-->
<!-- <i class="fa fa-save"></i>-->
<!-- Enregistrer le sondage-->
<!-- </button>-->
<!-- <br />-->
<!-- <button class="btn is-default" (click)="automaticSlug()">-->
<!-- <i class="fa fa-refresh"></i>-->
<!-- Slug automatique-->
<!-- </button>-->
<div class="columns">
<div class="column">
Slug:
</div>
<div class="column">
<div class="well">
{{ poll.slug }}
</div>
</div>
</div>
</div>
<!-- <div class="columns">-->
<!-- <div class="column">-->
<!-- Slug:-->
<!-- </div>-->
<!-- <div class="column">-->
<!-- <div class="well">-->
<!-- {{ form.slug }}-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</form>

View File

@ -1,4 +1,4 @@
import { ChangeDetectorRef, Component, Inject, Input, OnInit } from '@angular/core';
import { ChangeDetectorRef, Component, EventEmitter, Inject, Input, OnInit, Output } from '@angular/core';
import { ToastService } from '../../../../core/services/toast.service';
import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { UuidService } from '../../../../core/services/uuid.service';
@ -30,12 +30,10 @@ export class BaseConfigComponent implements OnInit {
@Inject(DOCUMENT) private document: Document
) {}
ngOnInit(): void {
this.initFormDefault(false);
}
ngOnInit(): void {}
askInitFormDefault(): void {
this.initFormDefault(false);
// this.initFormDefault(false);
this.toastService.display('formulaire réinitialisé');
}
@ -60,29 +58,6 @@ export class BaseConfigComponent implements OnInit {
// }
}
initFormDefault(showDemoValues = true): void {
this.form = this.fb.group({
title: ['', [Validators.required, Validators.minLength(12)]],
creatorPseudo: ['', [Validators.required]],
creatorEmail: ['', [Validators.required]],
slug: [this.uuidService.getUUID(), [Validators.required]],
description: ['', [Validators.required]],
choices: new FormArray([]),
whoModifiesAnswers: ['', [Validators.required]],
whoCanChangeAnswers: ['', [Validators.required]],
isAboutDate: [true, [Validators.required]],
startDateInterval: ['', [Validators.required]],
endDateInterval: ['', [Validators.required]],
isProtectedByPassword: [false, [Validators.required]],
isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]],
isOwnerNotifiedByEmailOnNewComment: [false, [Validators.required]],
isMaybeAnswerAvailable: [false, [Validators.required]],
areResultsPublic: [true, [Validators.required]],
expiracyNumberOfDays: [60, [Validators.required, Validators.min(0)]],
});
console.log('this.form ', this.form);
}
public updateSlug(): void {
const newValueFormatted = 'TODO';
this.form.patchValue({ slug: newValueFormatted });
@ -94,4 +69,8 @@ export class BaseConfigComponent implements OnInit {
automaticSlug() {
this.form.patchValue({ slug: this.pollService.makeSlug(this.poll) });
}
formUpdate() {
this.formChange.emit(this.form);
}
}

View File

@ -1,13 +1,29 @@
<div class="admin-form padded">
<form [formGroup]="form">
<h1>
{{ 'creation.title' | translate }}
</h1>
<p class="subtitle">
{{ 'creation.want' | translate }}
</p>
<app-kind-select [poll]="poll" [form]="form"></app-kind-select>
<app-base-config [poll]="poll" [form]="form"></app-base-config>
<div class="columns">
<div class="column">
<h1>
{{ 'creation.title' | translate }}
</h1>
<p class="subtitle">
{{ 'creation.want' | translate }}
</p>
<app-kind-select [(form)]="form"></app-kind-select>
<app-base-config [(form)]="form"></app-base-config>
</div>
<div class="column">
<pre class="debug padded warning">
form values :
{{ form.value | json }}
</pre
>
<pre class="debug padded warning">
poll initial values :
{{ poll | json }}
</pre
>
</div>
</div>
<!-- choix spécialement pour les dates-->
<!-- <app-date-select ng-if="form.kind == 'date'"></app-date-select>-->

View File

@ -77,20 +77,26 @@ export class FormComponent implements OnInit {
*/
setDemoValues(): void {
this.form.patchValue({
title: 'mon titre',
title: '',
description: 'répondez SVP <3 ! *-* ',
slug: this.uuidService.getUUID(),
creatorPseudo: 'Chuck Norris',
creatorEmail: 'chucknorris@example.com',
isAboutDate: true,
whoModifiesAnswers: 'everybody',
whoCanChangeAnswers: 'everybody',
isProtectedByPassword: false,
isOwnerNotifiedByEmailOnNewVote: false,
isOwnerNotifiedByEmailOnNewComment: false,
isMaybeAnswerAvailable: false,
areResultsPublic: true,
expiracyNumberOfDays: 60,
// configuration: {
// whoModifiesAnswers: 'everybody',
// whoCanChangeAnswers: 'everybody'
// isProtectedByPassword: false,
// isOwnerNotifiedByEmailOnNewVote: false,
// isOwnerNotifiedByEmailOnNewComment: false,
// isMaybeAnswerAvailable: false,
// areResultsPublic: true,
// expiracyNumberOfDays: 60,
// },
comments: [],
choices: [],
dateChoices: [],
timeChoices: [],
});
}
}