tykayn
/
funky-framadate-front
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git
1
1
Fork 0
Code Issues Projects Releases Wiki Activity

flatten form fields

This commit is contained in:
Tykayn 2021-04-30 12:37:04 +02:00 committed by tykayn
parent 12a41b5022
commit d08bba4fcb
10 changed files with 77 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
mocks/old-stuff/config/PollConfig.ts
View File

@ -40,7 +40,7 @@ export class PollConfig {
myEmail: string = environment.production ? '' : 'tktest@tktest.com'; myEmail: string = environment.production ? '' : 'tktest@tktest.com';
myPolls: any = []; // list of retrieved polls from the backend api myPolls: any = []; // list of retrieved polls from the backend api
/* /*
date specific poll, we have the choice to setup different hours (timeList) for all possible dates (dateList), or use the same hours for all dates date specific poll, we have the choice to setup different hours (timeSlices) for all possible dates (dateList), or use the same hours for all dates
*/ */
allowSeveralHours = 'true'; allowSeveralHours = 'true';
// access // access

12
src/app/core/models/poll.model.ts
View File

@ -4,6 +4,7 @@ import { Choice } from './choice.model';
import { Comment } from './comment.model'; import { Comment } from './comment.model';
import { PollConfiguration } from './configuration.model'; import { PollConfiguration } from './configuration.model';
import { Owner } from './owner.model'; import { Owner } from './owner.model';
import { DateChoice, TimeSlices } from '../../../../mocks/old-stuff/config/defaultConfigs';
export class Poll { export class Poll {
public id = 0; public id = 0;
@ -23,11 +24,18 @@ export class Poll {
public creatorEmail?: string; public creatorEmail?: string;
public is_archived?: boolean; public is_archived?: boolean;
public is_zero_knowledge?: boolean = false;
public allow_comments?: boolean = true;
public has_several_hours?: boolean = false;
public allowSeveralHours?: boolean; public allowSeveralHours?: boolean;
public archiveNumberOfDays?: number; public archiveNumberOfDays?: number;
public max_score?: number; public max_score?: number;
public max_count_of_answers?: number = 150;
public configuration: PollConfiguration = new PollConfiguration(); public configuration: PollConfiguration = new PollConfiguration();
public comments: Comment[] = []; public comments: Comment[] = [];
@ -42,9 +50,9 @@ export class Poll {
public modification_policy = 'everybody'; public modification_policy = 'everybody';
public dateChoices: Choice[] = []; public dateChoices: DateChoice[] = [];
// sets of days as strings, config to set identical time for days in a special days poll // sets of days as strings, config to set identical time for days in a special days poll
public timeChoices: Choice[] = []; // ranges of time expressed as strings public timeSlices: TimeSlices[] = []; // ranges of time expressed as strings
constructor(public owner: Owner = new Owner(), public title = 'mon titre', public custom_url: string = '') {} constructor(public owner: Owner = new Owner(), public title = 'mon titre', public custom_url: string = '') {}
public getAdministrationUrl(): string { public getAdministrationUrl(): string {

4
src/app/core/services/poll.service.ts
View File

@ -14,6 +14,7 @@ import { HttpClient } from '@angular/common/http';
import { environment } from '../../../environments/environment'; import { environment } from '../../../environments/environment';
import { StorageService } from './storage.service'; import { StorageService } from './storage.service';
import { Title } from '@angular/platform-browser'; import { Title } from '@angular/platform-browser';
import { TimeSlices } from '../../../../mocks/old-stuff/config/defaultConfigs';
@Injectable({ @Injectable({
providedIn: 'root', providedIn: 'root',
@ -200,7 +201,8 @@ export class PollService implements Resolve<Poll> {
newpoll[fieldOfForm] = form.value[fieldOfForm]; newpoll[fieldOfForm] = form.value[fieldOfForm];
} }
} }
newpoll.expiracy_date = form.value.expiracy_date; newpoll.dateChoices = this.storageService.dateList;
newpoll.timeSlices = this.storageService.timeSlices;
console.log('newpoll', newpoll); console.log('newpoll', newpoll);
return newpoll; return newpoll;

18
src/app/core/services/storage.service.ts
View File

@ -7,6 +7,12 @@ import { Stack } from '../models/stack.model';
import { Choice } from '../models/choice.model'; import { Choice } from '../models/choice.model';
import { Vote } from '../models/vote.model'; import { Vote } from '../models/vote.model';
import { environment } from '../../../environments/environment'; import { environment } from '../../../environments/environment';
import {
DateChoice,
moreTimeOfDay,
otherDefaultDates,
TimeSlices,
} from '../../../../mocks/old-stuff/config/defaultConfigs';
@Injectable({ @Injectable({
providedIn: 'root', providedIn: 'root',
@ -21,13 +27,19 @@ export class StorageService {
@LocalStorage() @LocalStorage()
public userPollsIds: string[]; public userPollsIds: string[];
@LocalStorage()
public dateList: DateChoice[] = otherDefaultDates;
@LocalStorage()
public timeSlices: TimeSlices[] = moreTimeOfDay;
@LocalStorage() @LocalStorage()
public vote_stack: Stack = new Stack(); public vote_stack: Stack = new Stack();
setChoicesForVoteStack(choices_list: Choice[]) { setChoicesForVoteStack(choices_list: Choice[]) {
this.vote_stack.votes = []; this.vote_stack.votes = [];
for (let choice of choices_list) { for (const choice of choices_list) {
if (environment.autofill) { if (environment.autofill) {
this.vote_stack.votes.push(new Vote(choice.id, 'yes')); this.vote_stack.votes.push(new Vote(choice.id, 'yes'));
} else { } else {
@ -37,7 +49,7 @@ export class StorageService {
} }
toggleAnswer(choice_id: number, value: string) { toggleAnswer(choice_id: number, value: string) {
for (let vote of this.vote_stack.votes) { for (const vote of this.vote_stack.votes) {
if (vote.choice_id == choice_id) { if (vote.choice_id == choice_id) {
if (vote.value == value) { if (vote.value == value) {
vote.value = ''; vote.value = '';
@ -49,7 +61,7 @@ export class StorageService {
} }
choiceHasAnswerOfValue(choice_id: number, value: any) { choiceHasAnswerOfValue(choice_id: number, value: any) {
for (let vote of this.vote_stack.votes) { for (const vote of this.vote_stack.votes) {
if (vote.choice_id == choice_id) { if (vote.choice_id == choice_id) {
if (vote.value == value) { if (vote.value == value) {
return true; return true;

2
src/app/features/administration/form/advanced-config/advanced-config.component.html
View File

@ -148,7 +148,7 @@
Nombre de réponses limitées à ce nombre Nombre de réponses limitées à ce nombre
</mat-checkbox> </mat-checkbox>
<input <input
*ngIf="form.value.configuration.hasMaxCountOfAnswers" *ngIf="form.value.hasMaxCountOfAnswers"
#maxCountOfAnswers #maxCountOfAnswers
id="maxCountOfAnswers" id="maxCountOfAnswers"
matInput matInput

20
src/app/features/administration/form/date-select/date-select.component.html
View File

@ -43,10 +43,10 @@
<div class="dates-list"> <div class="dates-list">
<button <button
class="btn" class="btn"
[class.is-primary]="form.value.configuration.hasSeveralHours" [class.is-primary]="form.value.hasSeveralHours"
(click)=" (click)="
form.patchValue({ form.patchValue({
configuration: { hasSeveralHours: !form.value.configuration.hasSeveralHours } configuration: { hasSeveralHours: !form.value.hasSeveralHours }
}) })
" "
> >
@ -55,10 +55,10 @@
<span> horaires avancées</span> <span> horaires avancées</span>
</button> </button>
<div class="is-info notification"> <div class="is-info notification">
<span *ngIf="form.value.configuration.hasSeveralHours"> <span *ngIf="form.value.hasSeveralHours">
Chaque jour aura ses plages de temps personnalisées Chaque jour aura ses plages de temps personnalisées
</span> </span>
<span *ngIf="!form.value.configuration.hasSeveralHours"> <span *ngIf="!form.value.hasSeveralHours">
Tous les jours auront les mêmes plages de temps Tous les jours auront les mêmes plages de temps
</span> </span>
</div> </div>
@ -68,7 +68,7 @@
<div class="column has-text-right"> <div class="column has-text-right">
<button <button
(click)="addTime()" (click)="addTime()"
*ngIf="!form.value.configuration.hasSeveralHours" *ngIf="!form.value.hasSeveralHours"
class="btn btn--primary" class="btn btn--primary"
id="add_time_button" id="add_time_button"
> >
@ -79,7 +79,7 @@
</button> </button>
<button <button
(click)="removeAllTimes()" (click)="removeAllTimes()"
*ngIf="form.value.configuration.hasSeveralHours" *ngIf="form.value.hasSeveralHours"
class="btn btn--warning" class="btn btn--warning"
id="remove_time_button" id="remove_time_button"
> >
@ -90,7 +90,7 @@
</button> </button>
<button <button
(click)="resetTimes()" (click)="resetTimes()"
*ngIf="form.value.configuration.hasSeveralHours" *ngIf="form.value.hasSeveralHours"
class="btn btn--warning" class="btn btn--warning"
id="reset_time_button" id="reset_time_button"
> >
@ -101,7 +101,7 @@
</button> </button>
</div> </div>
</div> </div>
<div class="range-time" *ngIf="!form.value.configuration.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 }}
@ -182,12 +182,12 @@
</button> </button>
<button <button
(click)="addTimeToDate(choice, id)" (click)="addTimeToDate(choice, id)"
*ngIf="form.value.configuration.hasSeveralHours" *ngIf="form.value.hasSeveralHours"
class="btn btn--primary" class="btn btn--primary"
> >
{{ 'dates.add_time' | translate }} {{ 'dates.add_time' | translate }}
</button> </button>
<div *ngIf="form.value.configuration.hasSeveralHours" class="several-times"> <div *ngIf="form.value.hasSeveralHours" class="several-times">
plage horaire distincte plage horaire distincte
<br /> <br />
<div *ngFor="let timeItem of choice.timeList; index as idTime" class="time-choice"> <div *ngFor="let timeItem of choice.timeList; index as idTime" class="time-choice">

13
src/app/features/administration/form/date-select/date-select.component.ts
View File

@ -15,6 +15,7 @@ import {
} from '../../../../../../mocks/old-stuff/config/defaultConfigs'; } from '../../../../../../mocks/old-stuff/config/defaultConfigs';
import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop'; import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { StorageService } from '../../../../core/services/storage.service';
@Component({ @Component({
selector: 'app-date-select', selector: 'app-date-select',
@ -32,8 +33,8 @@ export class DateSelectComponent implements OnInit {
endDateInterval: string; endDateInterval: string;
intervalDays: any; intervalDays: any;
intervalDaysDefault = 7; intervalDaysDefault = 7;
dateList: DateChoice[] = otherDefaultDates; // sets of days as strings, config to set identical time for days in a special days poll dateList: DateChoice[]; // sets of days as strings, config to set identical time for days in a special days poll
timeList: TimeSlices[] = moreTimeOfDay; // ranges of time expressed as strings timeList: TimeSlices[]; // ranges of time expressed as strings
dateCalendarEnum: Date[] = [new Date('02/09/2021')]; dateCalendarEnum: Date[] = [new Date('02/09/2021')];
selectionKind = 'range'; selectionKind = 'range';
@ -45,10 +46,14 @@ export class DateSelectComponent implements OnInit {
private pollService: PollService, private pollService: PollService,
public dateUtilities: DateUtilitiesService, public dateUtilities: DateUtilitiesService,
private apiService: ApiService, private apiService: ApiService,
private storageService: StorageService,
private router: Router, private router: Router,
private translateService: TranslateService, private translateService: TranslateService,
@Inject(DOCUMENT) private document: any @Inject(DOCUMENT) private document: any
) {} ) {
this.dateList = this.storageService.dateList;
this.timeList = this.storageService.timeSlices;
}
ngOnInit(): void { ngOnInit(): void {
// this.setDefaultDatesForInterval(); // this.setDefaultDatesForInterval();
@ -249,7 +254,7 @@ export class DateSelectComponent implements OnInit {
} }
dropTimeItem(event: any) { dropTimeItem(event: any) {
// moveItemInArray(this.timeList, event.previousIndex, event.currentIndex); // moveItemInArray(this.timeSlices, event.previousIndex, event.currentIndex);
if (event.previousContainer === event.container) { if (event.previousContainer === event.container) {
moveItemInArray(event.container.data, event.previousIndex, event.currentIndex); moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
} else { } else {

5
src/app/features/administration/form/form.component.html
View File

@ -37,10 +37,7 @@
</div> </div>
<app-base-config [form]="form"></app-base-config> <app-base-config [form]="form"></app-base-config>
<app-date-select <app-date-select *ngIf="form.value && form.value.kind == 'date'" [form]="form"></app-date-select>
*ngIf="form.value.configuration && form.value.kind == 'date'"
[form]="form"
></app-date-select>
<app-text-select *ngIf="!form.value.kind == 'date'" [form]="form"></app-text-select> <app-text-select *ngIf="!form.value.kind == 'date'" [form]="form"></app-text-select>
<button <button

55
src/app/features/administration/form/form.component.ts
View File

@ -42,7 +42,7 @@ export class FormComponent implements OnInit {
const creationDate = new Date(); const creationDate = new Date();
this.form = this.fb.group({ this.form = this.fb.group({
title: ['', [Validators.required, Validators.minLength(12)]], title: ['', [Validators.required, Validators.minLength(5)]],
creatorPseudo: ['', [Validators.required]], creatorPseudo: ['', [Validators.required]],
creatorEmail: ['', [Validators.required]], creatorEmail: ['', [Validators.required]],
custom_url: [this.pollUtilitiesService.makeUuid(), [Validators.required]], custom_url: [this.pollUtilitiesService.makeUuid(), [Validators.required]],
@ -64,30 +64,28 @@ export class FormComponent implements OnInit {
]), ]),
}), }),
]), ]),
// these time choice are meant to be the same for each day
timeChoices: this.fb.array([ timeChoices: this.fb.array([
this.fb.group({ this.fb.group({
label: ['', [Validators.required]], label: ['', [Validators.required]],
}), }),
]), ]),
kind: ['', [Validators.required]], kind: ['', [Validators.required]],
configuration: this.fb.group({ areResultsPublic: [true, [Validators.required]],
areResultsPublic: [true, [Validators.required]], whoCanChangeAnswers: ['everybody', [Validators.required]],
whoCanChangeAnswers: ['everybody', [Validators.required]], isProtectedByPassword: [false, [Validators.required]],
isProtectedByPassword: [false, [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]], isAboutDate: [true, [Validators.required]],
isZeroKnoledge: [false, [Validators.required]],
isAboutDate: [true, [Validators.required]], expiresDaysDelay: [60, [Validators.required, Validators.min(1)]],
isZeroKnoledge: [false, [Validators.required]], maxCountOfAnswers: [150, [Validators.required, Validators.min(1)]],
expiresDaysDelay: [60, [Validators.required, Validators.min(1)]], allowComments: [true, [Validators.required]],
maxCountOfAnswers: [150, [Validators.required, Validators.min(1)]], password: [this.pollUtilitiesService.makeUuid(), [Validators.required]],
allowComments: [true, [Validators.required]], dateCreated: [creationDate, [Validators.required]],
password: [this.pollUtilitiesService.makeUuid(), [Validators.required]], hasSeveralHours: [true, [Validators.required]],
dateCreated: [creationDate, [Validators.required]], hasMaxCountOfAnswers: [true, [Validators.required, Validators.min(1)]],
hasSeveralHours: [true, [Validators.required]],
hasMaxCountOfAnswers: [true, [Validators.required, Validators.min(1)]],
}),
startDateInterval: ['', [Validators.required]], startDateInterval: ['', [Validators.required]],
endDateInterval: ['', [Validators.required]], endDateInterval: ['', [Validators.required]],
}); });
@ -111,22 +109,19 @@ export class FormComponent implements OnInit {
this.form.patchValue({ this.form.patchValue({
title: title, title: title,
custom_url: this.pollUtilitiesService.makeSlugFromString(title), custom_url: this.pollUtilitiesService.makeSlugFromString(title),
description: 'répondez SVP <3 ! *-* ', description: 'répondez SVP <3 ! *-*',
creatorPseudo: 'Chuck Norris', creatorPseudo: 'Chuck Norris',
creatorEmail: 'chucknorris@example.com', creatorEmail: 'chucknorris@example.com',
isAboutDate: true, isAboutDate: true,
// hasSeveralHours: true, // hasSeveralHours: true,
kind: 'date', kind: 'date',
// TODO aplatir les contrôles whoCanChangeAnswers: 'everybody',
configuration: { isProtectedByPassword: false,
whoCanChangeAnswers: 'everybody', isOwnerNotifiedByEmailOnNewVote: false,
isProtectedByPassword: false, isOwnerNotifiedByEmailOnNewComment: false,
isOwnerNotifiedByEmailOnNewVote: false, isMaybeAnswerAvailable: false,
isOwnerNotifiedByEmailOnNewComment: false, areResultsPublic: true,
isMaybeAnswerAvailable: false, expiresDaysDelay: 60,
areResultsPublic: true,
expiresDaysDelay: 60,
},
comments: [], comments: [],
choices: [ choices: [
{ {

4
src/app/features/administration/form/kind-select/kind-select.component.html
View File

@ -13,7 +13,7 @@
<div class="column"> <div class="column">
<button <button
class="btn-block btn" class="btn-block btn"
[ngClass]="{ 'is-primary': form.value.configuration.isAboutDate }" [ngClass]="{ 'is-primary': form.value.isAboutDate }"
(click)=" (click)="
form.patchValue({ form.patchValue({
configuration: { configuration: {
@ -29,7 +29,7 @@
<div class="column"> <div class="column">
<button <button
class="btn-block btn btn-default" class="btn-block btn btn-default"
[ngClass]="{ 'is-primary': !form.value.configuration.isAboutDate }" [ngClass]="{ 'is-primary': !form.value.isAboutDate }"
(click)=" (click)="
form.patchValue({ form.patchValue({
configuration: { configuration: {