front end version 2 de framadate, un gestionnaire de sondage
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
funky-framadate-front/src/app/features/administration/form/form.component.ts

207 lines
6.8 KiB

import { ChangeDetectorRef, Component, Inject, Input, OnInit } from '@angular/core';
import { Poll } from '../../../core/models/poll.model';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ApiService } from '../../../core/services/api.service';
import { ToastService } from '../../../core/services/toast.service';
import { PollService } from '../../../core/services/poll.service';
import { DOCUMENT } from '@angular/common';
import { Router } from '@angular/router';
import { environment } from '../../../../environments/environment';
import { PollUtilitiesService } from '../../../core/services/poll.utilities.service';
import { StorageService } from '../../../core/services/storage.service';
import { defaultDates, defaultTimeOfDay } from '../../../../../mocks/old-stuff/config/defaultConfigs';
@Component({
selector: 'app-admin-form',
templateUrl: './form.component.html',
styleUrls: ['./form.component.scss'],
})
export class FormComponent implements OnInit {
@Input()
public poll?: Poll;
public form: FormGroup;
public advancedDisplayEnabled = true;
public show_debug_data = false;
public currentStep = 'base';
public steps = ['base', 'choices', 'advanced'];
public environment = environment;
constructor(
private fb: FormBuilder,
private cd: ChangeDetectorRef,
private pollUtilitiesService: PollUtilitiesService,
private toastService: ToastService,
private pollService: PollService,
private storageService: StorageService,
public apiService: ApiService,
private router: Router,
@Inject(DOCUMENT) private document: any
) {}
ngOnInit(): void {
this.initFormDefault();
// this.goNextStep();
}
initFormDefault(showDemoValues = environment.autofill): void {
const creationDate = new Date();
this.form = this.fb.group({
title: ['', [Validators.required, Validators.minLength(5)]],
creatorPseudo: ['', [Validators.required]],
creatorEmail: ['', [Validators.required]],
custom_url: [this.pollUtilitiesService.makeUuid(), [Validators.required]],
description: ['', [Validators.required]],
// choices: this.fb.array([
// this.fb.group({
// label: ['', [Validators.required]],
// imageUrl: ['', [Validators.required]],
// }),
// ]),
// dateChoices: this.fb.array([
// this.fb.group({
// label: ['', [Validators.required]],
// // if we have enabled detailed time choices per date choice, we have to make a time property for each date choice
// timeChoices: this.fb.array([
// this.fb.group({
// label: ['', [Validators.required]],
// }),
// ]),
// }),
// ]),
// // these time choice are meant to be the same for each day
// timeChoices: this.fb.array([
// this.fb.group({
// label: ['', [Validators.required]],
// }),
// ]),
kind: ['', [Validators.required]],
areResultsPublic: [true, [Validators.required]],
whoCanChangeAnswers: ['everybody', [Validators.required]],
isProtectedByPassword: [false, [Validators.required]],
allowNewDateTime: [false, [Validators.required]],
isOwnerNotifiedByEmailOnNewVote: [false, [Validators.required]],
isOwnerNotifiedByEmailOnNewComment: [false, [Validators.required]],
isYesAnswerAvailable: [false, [Validators.required]],
isMaybeAnswerAvailable: [false, [Validators.required]],
isNoAnswerAvailable: [false, [Validators.required]],
isAboutDate: [true, [Validators.required]],
isZeroKnoledge: [false, [Validators.required]],
expiresDaysDelay: [60, [Validators.required, Validators.min(1)]],
maxCountOfAnswers: [150, [Validators.required, Validators.min(1)]],
allowComments: [true, [Validators.required]],
password: ['', []],
dateCreated: [creationDate, [Validators.required]],
hasSeveralHours: [false, [Validators.required]],
hasMaxCountOfAnswers: [true, [Validators.required, Validators.min(1)]],
startDateInterval: ['', [Validators.required]],
endDateInterval: ['', [Validators.required]],
});
console.log('this.form ', this.form);
if (showDemoValues) {
this.setDemoValues();
this.toastService.display('default values filled for demo');
}
if (environment.autoSendNewPoll) {
this.createPoll();
}
}
/**
* add example values to the form, overrides defaults of PollConfiguration
*/
setDemoValues(): void {
const title = 'le titre de démo oh oh ' + new Date().getTime();
this.form.patchValue({
title: title,
custom_url: this.pollUtilitiesService.makeSlugFromString(title),
description: 'répondez SVP <3 ! *-*',
creatorPseudo: 'Chuck Norris',
creatorEmail: 'chucknorris@example.com',
isAboutDate: true,
hasSeveralHours: false,
kind: 'date',
password: '',
whoCanChangeAnswers: 'everybody',
isProtectedByPassword: false,
isOwnerNotifiedByEmailOnNewVote: false,
isOwnerNotifiedByEmailOnNewComment: false,
isYesAnswerAvailable: true,
isMaybeAnswerAvailable: false,
isNoAnswerAvailable: false,
isZeroKnoledge: true,
areResultsPublic: true,
allowComments: true,
expiresDaysDelay: 60,
maxCountOfAnswers: 150,
allowNewDateTime: false,
startDateInterval: new Date(),
endDateInterval: new Date(),
comments: [],
// choices: [
// {
// name: 'un choix',
// url: 'https://placekitten.com/120/150',
// },
// ],
// dateChoices: defaultDates,
// timeChoices: defaultTimeOfDay,
});
}
goPreviousStep() {
alert('todo');
}
goNextStep() {
console.log('this.steps', this.steps);
let indexCurrentStep = this.steps.indexOf(this.currentStep);
indexCurrentStep += 1;
this.currentStep = this.steps[indexCurrentStep];
window.scrollTo(0, 0);
}
public createPoll(): void {
console.log('this.form', this.form);
const newpoll = this.pollService.newPollFromForm(this.form);
console.log('newpoll', newpoll);
const router = this.router;
if (!environment.production) {
this.toastService.display('mode dev : envoi du form sans validation');
this.apiService.createPoll(newpoll).then(
(resp: any) => {
this.pollService.updateCurrentPoll(resp.data.poll);
this.storageService.userPolls.push(resp.data.poll);
this.storageService.vote_stack.owner.polls.push(resp.data.poll);
this.toastService.display('sauvegarde du nouveau sondage réussie');
router.navigate(['success']);
},
(err) => {
this.toastService.display('erreur lors de la sauvegarde');
}
);
} else {
if (this.form.valid) {
this.apiService.createPoll(newpoll).then(
(resp: any) => {
this.pollService.updateCurrentPoll(resp.data.poll);
this.storageService.userPolls.push(resp.data.poll);
this.storageService.vote_stack.owner.polls.push(resp.data.poll);
this.toastService.display('sauvegarde du nouveau sondage réussie');
router.navigate(['success']);
},
(err) => {
this.toastService.display('erreur lors de la sauvegarde');
}
);
} else {
this.toastService.display('invalid form');
}
}
}
}