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

reorder questions

This commit is contained in:
tykayn 2020-11-05 19:13:43 +01:00 committed by Baptiste Lemoine
parent 10c1930e4d
commit 8df2b95c1e
12 changed files with 132 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
main.lqa Normal file
View File

@ -0,0 +1,4 @@
<?xml version='1.0' encoding='UTF-8'?>
<qa version="1.0">
<category name="default"/>
</qa>

4
src/app/core/components/footer/footer.component.scss
View File

@ -0,0 +1,4 @@
.app-logo {
max-width: 5em;
max-height: 5em;
}

4
src/app/core/components/header/header.component.html
View File

@ -3,7 +3,7 @@
<div class="navbar-brand"> <div class="navbar-brand">
<a class="navbar-item" routerLink="/"> <a class="navbar-item" routerLink="/">
<img class="app-logo logo" *ngIf="appLogo" src="{{ appLogo }}" alt="{{ appTitle }}" /> <img class="app-logo logo" *ngIf="appLogo" src="{{ appLogo }}" alt="{{ appTitle }}" />
<span class="app-title title"> <span class="app-title title is-2">
{{ appTitle }} {{ appTitle }}
</span> </span>
<span class="dev-env" *ngIf="!env.production"> <span class="dev-env" *ngIf="!env.production">
@ -39,7 +39,7 @@
<app-language-selector></app-language-selector> <app-language-selector></app-language-selector>
<app-theme-selector></app-theme-selector> <app-theme-selector></app-theme-selector>
<a class="navbar-item btn btn-primary" routerLink="user/polls" routerLinkActive="is-active"> <a class="navbar-item btn btn-primary" routerLink="user/polls" routerLinkActive="is-active">
<i class="fa fa-user"></i> {{ 'config.find_my_polls' | translate }} <i class="fa fa-user"></i>
</a> </a>
</div> </div>
</div> </div>

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

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

4
src/app/core/models/user.model.ts
View File

@ -3,8 +3,8 @@ import { Poll } from './poll.model';
export class User { export class User {
constructor( constructor(
public pseudo: string, public pseudo: string = 'pseudo',
public email: string, public email: string = 'example@example.com',
public polls: Poll[] = [], public polls: Poll[] = [],
public role?: UserRole, public role?: UserRole,
public token?: string public token?: string

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

@ -10,6 +10,7 @@ import { ApiService } from './api.service';
import { ToastService } from './toast.service'; import { ToastService } from './toast.service';
import { UserService } from './user.service'; import { UserService } from './user.service';
import { UuidService } from './uuid.service'; import { UuidService } from './uuid.service';
import { Form } from '@angular/forms';
@Injectable({ @Injectable({
providedIn: 'root', providedIn: 'root',
@ -124,4 +125,13 @@ export class PollService implements Resolve<Poll> {
return list; return list;
} }
newPollFromForm(form: any) {
const newpoll = new Poll(
this.userService.getCurrentUser(),
this.uuidService.getUUID(),
form.controls.title.value
);
return newpoll;
}
} }

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

@ -2,9 +2,7 @@
<h1> <h1>
{{ 'creation.title' | translate }} {{ 'creation.title' | translate }}
</h1> </h1>
<span class="pre-selector">
{{ 'creation.want' | translate }}
</span>
<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
@ -12,37 +10,38 @@
<form [formGroup]="form"> <form [formGroup]="form">
<div class="form-field"> <div class="form-field">
<h2>Choix de réponse</h2> <span class="pre-selector">
<span formArrayName="choices"> {{ 'creation.want' | translate }}
<h3>Choix proposés</h3> </span>
<button (click)="addChoice()"> <div class="kind-of-poll">
<i class="fa fa-plus"></i> <h1 class="title is-1">
Ajouter un choix <i class="fa fa-calendar" aria-hidden="true"></i> {{ 'dates.title' | translate }}
</button> </h1>
<button (click)="reinitChoices()"> <button
<i class="fa fa-recycle"></i> class="btn"
Réinitialiser [ngClass]="{ 'is-primary': form.controls.isAboutDate.value }"
</button> (click)="form.controls.isAboutDate.setValue(true)"
>
<div *ngFor="let choice of choices.controls; let i = index"> <i class="fa fa-calendar"></i>
<div class="form-row" [formGroup]="choice"> {{ 'creation.kind.date' | translate }}
<label for="label" class="hidden">label</label> </button>
<input formControlName="label" id="label" placeholder="Enter a choice description" /> <button
<label for="imageUrl" class="imageUrl">image Url</label> [ngClass]="{ 'is-primary': !form.controls.isAboutDate.value }"
<input formControlName="imageUrl" id="imageUrl" placeholder="URL de l' image" /> (click)="form.controls.isAboutDate.setValue(false)"
<button (click)="deleteChoiceField(i)"> >
<i class="fa fa-times"></i> <i class="fa fa-doc-text"></i>
</button> {{ 'creation.kind.classic' | translate }}
</div> </button>
</div> </div>
<span>
{{ 'creation.choose_title' | translate }}
</span> </span>
</div>
<div class="form-field">
<label class="hidden" for="title">Titre</label> <label class="hidden" for="title">Titre</label>
<input <input
#title #title
matInput matInput
placeholder="Votre titre de sondage" [placeholder]="'creation.choose_title_placeholder' | translate"
formControlName="title" formControlName="title"
id="title" id="title"
autofocus="autofocus" autofocus="autofocus"
@ -60,6 +59,47 @@
<i class="fa fa-close"></i> <i class="fa fa-close"></i>
</button> </button>
</div> </div>
<div class="form-field">
<h2>Choix de réponse</h2>
<span>
<span class="columns">
<span class="column">
<button class="btn is-primary" (click)="addChoice()">
<i class="fa fa-plus"></i>
Ajouter un choix
</button>
</span>
<span class="column pull-right">
<button class="btn is-warning" (click)="reinitChoices()">
<i class="fa fa-recycle"></i>
Réinitialiser
</button>
</span>
</span>
<span *ngFor="let choice of choices.controls; let i = index">
<div class="form-row" [formGroup]="choice">
<div class="columns">
<div class="column">{{ i * 1 + 1 }})</div>
<div class="column">
<label for="label" class="hidden">label</label>
<input formControlName="label" id="label" placeholder="Enter a choice description" />
<br />
<label for="imageUrl" class="imageUrl">image Url</label>
<input formControlName="imageUrl" id="imageUrl" placeholder="URL de l' image" />
</div>
<div class="column">
<button class="btn btn-warning" (click)="deleteChoiceField(i)">
<i class="fa fa-times"></i>
</button>
</div>
</div>
</div>
</span>
</span>
</div>
<div> <div>
<label class="hidden" for="creatorEmail">creator email</label> <label class="hidden" for="creatorEmail">creator email</label>
<input <input
@ -129,23 +169,6 @@
</span> </span>
<input #slug matInput id="slug" placeholder="Url" formControlName="slug" required /> <input #slug matInput id="slug" placeholder="Url" formControlName="slug" required />
<br /> <br />
<h2>
Type de sondage
</h2>
<h1 class="title is-1"><i class="fa fa-calendar" aria-hidden="true"></i> {{ 'dates.title' | translate }}</h1>
<button class="btn" (click)="form.setValue({ isAboutDate: true })">
Spécial date
</button>
<button class="btn" (click)="form.controls.isAboutDate.setValue(false)">
Classique - textes
</button>
<button
[ngClass]="{ 'is-primary': !form.controls.isAboutDate.value }"
(click)="form.controls.isAboutDate.setValue(false)"
>
Classique - textes
</button>
<h2>Version complète du formulaire</h2> <h2>Version complète du formulaire</h2>
<div appearance="outline" class="is-flex"> <div appearance="outline" class="is-flex">
<mat-label>Nombre de jours avant expiration</mat-label> <mat-label>Nombre de jours avant expiration</mat-label>
@ -188,12 +211,22 @@
La réponse « peut-être » sera disponible La réponse « peut-être » sera disponible
</mat-checkbox> </mat-checkbox>
<button mat-button (click)="createPoll()" [disabled]="!form.valid || !form.valid"> <button class="btn is-info" (click)="advancedDisplayEnabled = !advancedDisplayEnabled">
<i class="fa fa-save"></i> <i class="fa fa-save"></i>
Enregistrer le sondage Options avancées
</button> </button>
<span class="complete well" *ngIf="longFormVersionEnabled"> <div class="columns">
version longue du formulaire activée <div class="column">
</span> <span class="complete well" *ngIf="advancedDisplayEnabled">
version longue du formulaire activée
</span>
</div>
<div class="column">
<button class="btn is-success" (click)="createPoll()" [disabled]="!form.valid || !form.valid">
<i class="fa fa-save"></i>
Enregistrer le sondage
</button>
</div>
</div>
</form> </form>
</div> </div>

2
src/app/features/administration/form/form.component.scss
View File

@ -17,7 +17,5 @@
padding-left: 1em; padding-left: 1em;
} }
.fa { .fa {
margin-right: 1em;
color: $primary_color;
} }
} }

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

@ -4,6 +4,7 @@ import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { UuidService } from '../../../core/services/uuid.service'; import { UuidService } from '../../../core/services/uuid.service';
import { ApiService } from '../../../core/services/api.service'; import { ApiService } from '../../../core/services/api.service';
import { ToastService } from '../../../core/services/toast.service'; import { ToastService } from '../../../core/services/toast.service';
import { PollService } from '../../../core/services/poll.service';
@Component({ @Component({
selector: 'app-admin-form', selector: 'app-admin-form',
@ -15,14 +16,14 @@ export class FormComponent implements OnInit {
public poll?: Poll; public poll?: Poll;
public form: FormGroup; public form: FormGroup;
public longFormVersionEnabled = true;
public urlPrefix: string = window.location.origin + '/participation/'; public urlPrefix: string = window.location.origin + '/participation/';
public advancedDisplayEnabled = false;
constructor( constructor(
private fb: FormBuilder, private fb: FormBuilder,
private uuidService: UuidService, private uuidService: UuidService,
private toastService: ToastService, private toastService: ToastService,
private pollService: PollService,
private apiService: ApiService private apiService: ApiService
) {} ) {}
@ -33,8 +34,9 @@ export class FormComponent implements OnInit {
public createPoll(): void { public createPoll(): void {
if (this.form.valid && this.form.valid) { if (this.form.valid && this.form.valid) {
console.log('Le sondage est correctement rempli, prêt à enregistrer.'); console.log('Le sondage est correctement rempli, prêt à enregistrer.');
let newpoll = this.pollService.newPollFromForm(this.form);
// TODO : save the poll // TODO : save the poll
this.apiService.createPoll(this.poll); this.apiService.createPoll(newpoll);
} }
} }
@ -47,13 +49,18 @@ export class FormComponent implements OnInit {
return this.form.get('choices') as FormArray; return this.form.get('choices') as FormArray;
} }
addChoice() { addChoice(optionalLabel: string = '') {
this.choices.push( let newControlGroup = this.fb.group({
this.fb.group({ label: this.fb.control('', [Validators.required]),
label: this.fb.control('', [Validators.required]), imageUrl: ['', [Validators.required]],
imageUrl: ['', [Validators.required]], });
})
); if (optionalLabel) {
newControlGroup.patchValue({
label: optionalLabel,
});
}
this.choices.push(newControlGroup);
} }
deleteChoiceField(index: number) { deleteChoiceField(index: number) {
@ -84,9 +91,9 @@ export class FormComponent implements OnInit {
}); });
console.log('this.form ', this.form); console.log('this.form ', this.form);
this.addChoice(); this.addChoice('orange');
this.addChoice(); this.addChoice('raisin');
this.addChoice(); this.addChoice('abricot');
this.form.patchValue({ this.form.patchValue({
title: 'mon titre', title: 'mon titre',

3
src/app/shared/components/selectors/theme-selector/theme-selector.component.html
View File

@ -1,7 +1,4 @@
<div class="columns"> <div class="columns">
<div class="column">
<p>Theme</p>
</div>
<div class="column"> <div class="column">
<div class="buttons has-addons"> <div class="buttons has-addons">
<button <button

3
src/assets/i18n/en.json → src/assets/i18n/EN.json
View File

@ -133,6 +133,9 @@
"choiceNotColorblind": "I am not", "choiceNotColorblind": "I am not",
"colorblindText": "colorblind." "colorblindText": "colorblind."
}, },
"selectors": {
"lang": "Select the lang"
},
"LANGUAGES": { "LANGUAGES": {
"DE": "Allemand", "DE": "Allemand",
"FR": "French", "FR": "French",

0
src/assets/i18n/fr.json → src/assets/i18n/FR.json
View File