put poll actions in pollService, nav on step one two three
This commit is contained in:
parent
1d33d0787c
commit
303457afd6
|
@ -1,23 +1,10 @@
|
||||||
<mat-sidenav-container (backdropClick)="sidenav.toggle()">
|
<div id="big_container" [class]="themeClass">
|
||||||
<mat-sidenav #sidenav mode="side">
|
<div class="container">
|
||||||
<app-navigation></app-navigation>
|
<app-header [appTitle]="appTitle" [appLogo]="appLogo"></app-header>
|
||||||
</mat-sidenav>
|
<main>
|
||||||
|
<router-outlet></router-outlet>
|
||||||
<mat-sidenav-content>
|
</main>
|
||||||
<div id="big_container" [class]="themeClass">
|
<app-footer></app-footer>
|
||||||
<div class="container">
|
<app-feedback></app-feedback>
|
||||||
<app-header [appTitle]="appTitle" [appLogo]="appLogo"></app-header>
|
</div>
|
||||||
<main>
|
</div>
|
||||||
<router-outlet></router-outlet>
|
|
||||||
<div *ngIf="devModeEnabled">
|
|
||||||
<br />
|
|
||||||
<mat-slide-toggle (change)="sidenav.toggle()" label="dev menu"> </mat-slide-toggle> menu
|
|
||||||
développeur
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
<app-footer></app-footer>
|
|
||||||
<app-feedback></app-feedback>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</mat-sidenav-content>
|
|
||||||
</mat-sidenav-container>
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { ChangeDetectorRef, Inject, Injectable } from '@angular/core';
|
import { Inject, Injectable } from '@angular/core';
|
||||||
import { ActivatedRoute, ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot } from '@angular/router';
|
import { ActivatedRoute, ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot } from '@angular/router';
|
||||||
import { BehaviorSubject, Observable, Subscription } from 'rxjs';
|
import { BehaviorSubject, Observable, Subscription } from 'rxjs';
|
||||||
|
|
||||||
|
@ -120,6 +120,11 @@ export class PollService implements Resolve<Poll> {
|
||||||
return form;
|
return form;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public updateSlug(): void {
|
||||||
|
console.log('this.form.value', this.form.value);
|
||||||
|
this.form.patchValue({ custom_url: this.makeSlug(this.form) });
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* auto fetch a poll when route is looking for one in the administration pattern
|
* auto fetch a poll when route is looking for one in the administration pattern
|
||||||
* @param route
|
* @param route
|
||||||
|
@ -334,7 +339,6 @@ export class PollService implements Resolve<Poll> {
|
||||||
|
|
||||||
initFormDefault(showDemoValues = true): void {
|
initFormDefault(showDemoValues = true): void {
|
||||||
this.form = this.createFormGroup();
|
this.form = this.createFormGroup();
|
||||||
console.log('this.form ', this.form);
|
|
||||||
this.setDefaultDatesForInterval();
|
this.setDefaultDatesForInterval();
|
||||||
|
|
||||||
if (showDemoValues) {
|
if (showDemoValues) {
|
||||||
|
@ -363,7 +367,6 @@ export class PollService implements Resolve<Poll> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
this.choices.push(newControlGroup);
|
this.choices.push(newControlGroup);
|
||||||
console.log('this.choices.length', this.choices.length);
|
|
||||||
|
|
||||||
this.focusOnChoice(this.choices.length - 1);
|
this.focusOnChoice(this.choices.length - 1);
|
||||||
}
|
}
|
||||||
|
@ -406,7 +409,6 @@ export class PollService implements Resolve<Poll> {
|
||||||
const pollUrl: Subscription = await this.apiService.createPoll(this._poll.getValue());
|
const pollUrl: Subscription = await this.apiService.createPoll(this._poll.getValue());
|
||||||
// TODO: Maybe handle the url to update currentPoll according to backend response
|
// TODO: Maybe handle the url to update currentPoll according to backend response
|
||||||
if (pollUrl) {
|
if (pollUrl) {
|
||||||
console.log('pollUrl', pollUrl);
|
|
||||||
this.toastService.display('Le sondage a été enregistré.');
|
this.toastService.display('Le sondage a été enregistré.');
|
||||||
} else {
|
} else {
|
||||||
this.toastService.display('Le sondage n’a été correctement enregistré, veuillez ré-essayer.');
|
this.toastService.display('Le sondage n’a été correctement enregistré, veuillez ré-essayer.');
|
||||||
|
|
|
@ -12,6 +12,7 @@ const routes: Routes = [
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
component: AdministrationComponent,
|
component: AdministrationComponent,
|
||||||
|
redirectTo: 'step/1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: 'step',
|
path: 'step',
|
||||||
|
|
|
@ -15,6 +15,7 @@ import { StepTwoComponent } from './form/step-two/step-two.component';
|
||||||
import { StepThreeComponent } from './form/step-three/step-three.component';
|
import { StepThreeComponent } from './form/step-three/step-three.component';
|
||||||
import { StepFourComponent } from './form/step-four/step-four.component';
|
import { StepFourComponent } from './form/step-four/step-four.component';
|
||||||
import { StepFiveComponent } from './form/step-five/step-five.component';
|
import { StepFiveComponent } from './form/step-five/step-five.component';
|
||||||
|
import { DevMenuComponent } from './dev-menu/dev-menu.component';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
|
@ -27,6 +28,7 @@ import { StepFiveComponent } from './form/step-five/step-five.component';
|
||||||
StepThreeComponent,
|
StepThreeComponent,
|
||||||
StepFourComponent,
|
StepFourComponent,
|
||||||
StepFiveComponent,
|
StepFiveComponent,
|
||||||
|
DevMenuComponent,
|
||||||
],
|
],
|
||||||
imports: [
|
imports: [
|
||||||
AdministrationRoutingModule,
|
AdministrationRoutingModule,
|
||||||
|
|
|
@ -0,0 +1,14 @@
|
||||||
|
<mat-sidenav-container (backdropClick)="sidenav.toggle()">
|
||||||
|
<mat-sidenav #sidenav mode="side">
|
||||||
|
<app-navigation></app-navigation>
|
||||||
|
</mat-sidenav>
|
||||||
|
|
||||||
|
<mat-sidenav-content> </mat-sidenav-content>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
<div *ngIf="devModeEnabled">
|
||||||
|
<br />
|
||||||
|
<mat-slide-toggle (change)="sidenav.toggle()" label="dev menu"></mat-slide-toggle>
|
||||||
|
menu développeur
|
||||||
|
</div>
|
||||||
|
</mat-sidenav-container>
|
|
@ -0,0 +1,24 @@
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { DevMenuComponent } from './dev-menu.component';
|
||||||
|
|
||||||
|
describe('DevMenuComponent', () => {
|
||||||
|
let component: DevMenuComponent;
|
||||||
|
let fixture: ComponentFixture<DevMenuComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [DevMenuComponent],
|
||||||
|
}).compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(DevMenuComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,14 @@
|
||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-dev-menu',
|
||||||
|
templateUrl: './dev-menu.component.html',
|
||||||
|
styleUrls: ['./dev-menu.component.scss'],
|
||||||
|
})
|
||||||
|
export class DevMenuComponent implements OnInit {
|
||||||
|
devModeEnabled: boolean = false;
|
||||||
|
|
||||||
|
constructor() {}
|
||||||
|
|
||||||
|
ngOnInit(): void {}
|
||||||
|
}
|
|
@ -12,21 +12,10 @@
|
||||||
</section>
|
</section>
|
||||||
<footer>
|
<footer>
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
<div class="column">
|
<div class="column"></div>
|
||||||
<button
|
|
||||||
class="button is-large is-secondary"
|
|
||||||
[routerLink]="pollService.previousRouteName"
|
|
||||||
*ngIf="pollService.step_current != 1"
|
|
||||||
>
|
|
||||||
précédent
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="column">
|
<div class="column">
|
||||||
<!-- [disabled]="form.invalid"-->
|
<!-- [disabled]="form.invalid"-->
|
||||||
<button
|
<button class="button is-primary is-fullwidth" [routerLink]="['administration/step/2']">
|
||||||
class="button is-primary is-large is-pulled-right"
|
|
||||||
[routerLink]="[pollService.nextRouteName, { from: route }]"
|
|
||||||
>
|
|
||||||
suivant
|
suivant
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<div class="step">
|
<div class="step">
|
||||||
<form [formGroup]="form">
|
<form [formGroup]="pollService.form">
|
||||||
<section class="poll-title">
|
<section class="poll-title">
|
||||||
<h2 class="title is-2">
|
<h2 class="title is-2">
|
||||||
{{ 'creation.choose_title' | translate }}
|
{{ 'creation.choose_title' | translate }}
|
||||||
|
@ -16,7 +16,8 @@
|
||||||
placeholder="Quel resto ce soir ?"
|
placeholder="Quel resto ce soir ?"
|
||||||
id="title"
|
id="title"
|
||||||
autofocus="autofocus"
|
autofocus="autofocus"
|
||||||
(change)="updateSlug()"
|
(keyup)="pollService.updateSlug()"
|
||||||
|
(blur)="pollService.updateSlug()"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -43,8 +44,11 @@
|
||||||
|
|
||||||
<mat-checkbox formControlName="richTextMode" id="richTextMode"></mat-checkbox>
|
<mat-checkbox formControlName="richTextMode" id="richTextMode"></mat-checkbox>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="rich-toolbar" *ngIf="pollService.form.value.richTextMode">
|
||||||
|
richTextMode activé
|
||||||
|
</div>
|
||||||
<textarea
|
<textarea
|
||||||
class="ui-inputtextarea"
|
class="ui-inputtextarea is-fullwidth is-block"
|
||||||
#description
|
#description
|
||||||
matInput
|
matInput
|
||||||
id="descr"
|
id="descr"
|
||||||
|
@ -52,6 +56,7 @@
|
||||||
placeholder="Description"
|
placeholder="Description"
|
||||||
formControlName="description"
|
formControlName="description"
|
||||||
required
|
required
|
||||||
|
maxlength="300"
|
||||||
></textarea>
|
></textarea>
|
||||||
<div class="text-info">
|
<div class="text-info">
|
||||||
300 caractères maximum
|
300 caractères maximum
|
||||||
|
@ -71,5 +76,19 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
slug: {{ pollService.form.value.custom_url }}
|
||||||
</form>
|
</form>
|
||||||
|
<div class="columns">
|
||||||
|
<div class="column">
|
||||||
|
<button class="button is-secondary is-fullwidth" [routerLink]="['/administration/step/1']">
|
||||||
|
précédent
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<!-- [disabled]="form.invalid"-->
|
||||||
|
<button class="button is-primary is-fullwidth" [routerLink]="['/administration/step/3']">
|
||||||
|
suivant
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -8,7 +8,7 @@ import { PollService } from '../../../../core/services/poll.service';
|
||||||
styleUrls: ['./step-one.component.scss'],
|
styleUrls: ['./step-one.component.scss'],
|
||||||
})
|
})
|
||||||
export class StepOneComponent implements OnInit {
|
export class StepOneComponent implements OnInit {
|
||||||
constructor(private pollService: PollService) {}
|
constructor(public pollService: PollService) {}
|
||||||
|
|
||||||
@Input()
|
@Input()
|
||||||
step_max: any;
|
step_max: any;
|
||||||
|
@ -16,9 +16,4 @@ export class StepOneComponent implements OnInit {
|
||||||
form: FormGroup;
|
form: FormGroup;
|
||||||
|
|
||||||
ngOnInit(): void {}
|
ngOnInit(): void {}
|
||||||
|
|
||||||
public updateSlug(): void {
|
|
||||||
const newValueFormatted = 'TODO';
|
|
||||||
this.form.patchValue({ slug: this.pollService.makeSlug(this.form.value['custom_url']) });
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
<app-stepper [step_current]="3" [step_max]="step_max"></app-stepper>
|
<app-stepper [step_current]="3" [step_max]="5"></app-stepper>
|
||||||
|
|
||||||
<!-- choix spécialement pour les dates-->
|
<!-- choix spécialement pour les dates-->
|
||||||
<div class="dates-list">
|
<div class="dates-list">
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<span class="count-dates">
|
<span class="count-dates">
|
||||||
{{ timeList.length }}
|
{{ pollService.timeList.length }}
|
||||||
</span>
|
</span>
|
||||||
<span class="count-dates-txt">
|
<span class="count-dates-txt">
|
||||||
{{ 'dates.count_time' | translate }}
|
{{ 'dates.count_time' | translate }}
|
||||||
|
@ -12,13 +12,18 @@
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<button (click)="addTime()" *ngIf="'false' === allowSeveralHours" class="btn btn--primary" id="add_time_button">
|
<button
|
||||||
|
(click)="pollService.addTime()"
|
||||||
|
*ngIf="'false' === pollService.allowSeveralHours"
|
||||||
|
class="btn btn--primary"
|
||||||
|
id="add_time_button"
|
||||||
|
>
|
||||||
<i class="fa fa-plus" aria-hidden="true"></i>
|
<i class="fa fa-plus" aria-hidden="true"></i>
|
||||||
{{ 'dates.add_time' | translate }}
|
{{ 'dates.add_time' | translate }}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
(click)="removeAllTimes()"
|
(click)="pollService.removeAllTimes()"
|
||||||
*ngIf="'false' === allowSeveralHours"
|
*ngIf="'false' === pollService.allowSeveralHours"
|
||||||
class="btn btn--warning"
|
class="btn btn--warning"
|
||||||
id="remove_time_button"
|
id="remove_time_button"
|
||||||
>
|
>
|
||||||
|
@ -26,8 +31,8 @@
|
||||||
Aucune plage horaire
|
Aucune plage horaire
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
(click)="resetTimes()"
|
(click)="pollService.resetTimes()"
|
||||||
*ngIf="'false' === allowSeveralHours"
|
*ngIf="'false' === pollService.allowSeveralHours"
|
||||||
class="btn btn--warning"
|
class="btn btn--warning"
|
||||||
id="reset_time_button"
|
id="reset_time_button"
|
||||||
>
|
>
|
||||||
|
@ -36,9 +41,9 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div *ngIf="'false' === allowSeveralHours" class="identical-dates">
|
<div *ngIf="'false' === pollService.allowSeveralHours" class="identical-dates">
|
||||||
<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
|
<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
|
||||||
<div *ngFor="let time of timeList; index as id" class="time-choice" cdkDrag>
|
<div *ngFor="let time of pollService.timeList; index as id" class="time-choice" cdkDrag>
|
||||||
<label for="timeChoices_{{ id }}">
|
<label for="timeChoices_{{ id }}">
|
||||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||||
</label>
|
</label>
|
||||||
|
@ -51,15 +56,15 @@
|
||||||
</div>
|
</div>
|
||||||
<hr />
|
<hr />
|
||||||
<span class="count-dates title">
|
<span class="count-dates title">
|
||||||
{{ dateList.length }}
|
{{ pollService.dateList.length }}
|
||||||
</span>
|
</span>
|
||||||
<span>
|
<span>
|
||||||
{{ 'dates.count_dates' | translate }}
|
{{ 'dates.count_dates' | translate }}
|
||||||
</span>
|
</span>
|
||||||
<button class="btn btn--primary" (click)="addChoice()">
|
<button class="btn btn--primary" (click)="pollService.addChoice()">
|
||||||
{{ 'dates.add' | translate }}
|
{{ 'dates.add' | translate }}
|
||||||
</button>
|
</button>
|
||||||
<div *ngFor="let choice of dateList; index as id" class="date-choice">
|
<div *ngFor="let choice of pollService.dateList; index as id" class="date-choice">
|
||||||
<input
|
<input
|
||||||
[(ngModel)]="choice.date_object"
|
[(ngModel)]="choice.date_object"
|
||||||
name="dateChoices_{{ id }}"
|
name="dateChoices_{{ id }}"
|
||||||
|
@ -67,13 +72,17 @@
|
||||||
useValueAsDate
|
useValueAsDate
|
||||||
type="date"
|
type="date"
|
||||||
/>
|
/>
|
||||||
<button (click)="dateList.splice(id, 1)" class="btn btn-warning">
|
<button (click)="pollService.dateList.splice(id, 1)" class="btn btn-warning">
|
||||||
<i class="fa fa-times" aria-hidden="true"></i>
|
<i class="fa fa-times" aria-hidden="true"></i>
|
||||||
</button>
|
</button>
|
||||||
<button (click)="addTimeToDate(choice, id)" *ngIf="'true' === allowSeveralHours" class="btn btn--primary">
|
<button
|
||||||
|
(click)="pollService.addTimeToDate(choice, id)"
|
||||||
|
*ngIf="'true' === pollService.allowSeveralHours"
|
||||||
|
class="btn btn--primary"
|
||||||
|
>
|
||||||
{{ 'dates.add_time' | translate }}
|
{{ 'dates.add_time' | translate }}
|
||||||
</button>
|
</button>
|
||||||
<div *ngIf="'true' === allowSeveralHours" class="several-times">
|
<div *ngIf="'true' === pollService.allowSeveralHours" class="several-times">
|
||||||
<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">
|
||||||
<input
|
<input
|
||||||
[(ngModel)]="timeItem.literal"
|
[(ngModel)]="timeItem.literal"
|
||||||
|
@ -90,15 +99,15 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button
|
<button
|
||||||
(click)="showDateInterval = !showDateInterval"
|
(click)="pollService.showDateInterval = !pollService.showDateInterval"
|
||||||
[ngClass]="{ active: showDateInterval }"
|
[ngClass]="{ active: pollService.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>
|
||||||
<section *ngIf="showDateInterval" class="date-interval form-row">
|
<section *ngIf="pollService.showDateInterval" class="date-interval form-row">
|
||||||
<h2>{{ 'dates.add_interval' | translate }}</h2>
|
<h2>{{ 'dates.add_interval' | translate }}</h2>
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
<div class="column">
|
<div class="column">
|
||||||
|
@ -106,7 +115,12 @@
|
||||||
</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)="pollService.countDays()"
|
||||||
|
formControlName="startDateInterval"
|
||||||
|
type="date"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
|
@ -118,10 +132,24 @@
|
||||||
<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)="pollService.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 }}
|
{{ pollService.intervalDays }}
|
||||||
{{ 'dates.interval_button_dates' | translate }}
|
{{ 'dates.interval_button_dates' | translate }}
|
||||||
</button>
|
</button>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<div class="columns">
|
||||||
|
<div class="column">
|
||||||
|
<button class="button is-secondary is-fullwidth" [routerLink]="['/administration/step/2']">
|
||||||
|
précédent
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<!-- [disabled]="form.invalid"-->
|
||||||
|
<button class="button is-primary is-fullwidth" [routerLink]="['/administration/step/4']">
|
||||||
|
suivant
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import { Component, Input, OnInit } from '@angular/core';
|
import { Component, Input, OnInit } from '@angular/core';
|
||||||
|
import { PollService } from '../../../../core/services/poll.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-step-three',
|
selector: 'app-step-three',
|
||||||
|
@ -10,7 +11,8 @@ export class StepThreeComponent implements OnInit {
|
||||||
step_max: any;
|
step_max: any;
|
||||||
@Input()
|
@Input()
|
||||||
form: any;
|
form: any;
|
||||||
constructor() {}
|
|
||||||
|
constructor(public pollService: PollService) {}
|
||||||
|
|
||||||
ngOnInit(): void {}
|
ngOnInit(): void {}
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,8 +6,8 @@
|
||||||
<div class="kind-of-poll columns">
|
<div class="kind-of-poll columns">
|
||||||
<div class="column">
|
<div class="column">
|
||||||
<button
|
<button
|
||||||
class="btn-block btn"
|
class="button is-fullwidth"
|
||||||
[ngClass]="{ 'is-primary': pollService.form.controls.isAboutDate.value }"
|
[ngClass]="{ 'is-selected is-primary': pollService.form.controls.isAboutDate.value }"
|
||||||
(click)="pollService.form.controls.isAboutDate.setValue(true)"
|
(click)="pollService.form.controls.isAboutDate.setValue(true)"
|
||||||
>
|
>
|
||||||
<i class="fa fa-calendar"></i>
|
<i class="fa fa-calendar"></i>
|
||||||
|
@ -16,8 +16,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="column">
|
<div class="column">
|
||||||
<button
|
<button
|
||||||
class="btn-block btn btn-default"
|
class="button is-fullwidth"
|
||||||
[ngClass]="{ 'is-primary': !pollService.form.controls.isAboutDate.value }"
|
[ngClass]="{ 'is-selected is-primary': !pollService.form.controls.isAboutDate.value }"
|
||||||
(click)="pollService.form.controls.isAboutDate.setValue(false)"
|
(click)="pollService.form.controls.isAboutDate.setValue(false)"
|
||||||
>
|
>
|
||||||
<i class="fa fa-list-ul"></i>
|
<i class="fa fa-list-ul"></i>
|
||||||
|
@ -25,4 +25,17 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="columns">
|
||||||
|
<div class="column">
|
||||||
|
<button class="button is-secondary is-fullwidth" [routerLink]="['/administration/step/1']">
|
||||||
|
précédent
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<!-- [disabled]="form.invalid"-->
|
||||||
|
<button class="button is-primary is-fullwidth" [routerLink]="['/administration/step/3']">
|
||||||
|
suivant
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -19,14 +19,14 @@ label {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not([for]) {
|
//&:not([for]) {
|
||||||
color: $dusty-orange;
|
// color: $dusty-orange;
|
||||||
|
//
|
||||||
&:before {
|
// &:before {
|
||||||
content: "### debug: ce label n'a pas d'attribut for, c'est mal. ### ";
|
// content: "### debug: ce label n'a pas d'attribut for, c'est mal. ### ";
|
||||||
color: $violet;
|
// color: $violet;
|
||||||
}
|
// }
|
||||||
}
|
//}
|
||||||
}
|
}
|
||||||
|
|
||||||
input {
|
input {
|
||||||
|
|
|
@ -5,11 +5,13 @@ textarea {
|
||||||
@extend .input;
|
@extend .input;
|
||||||
padding: calc(0.5em - 1px);
|
padding: calc(0.5em - 1px);
|
||||||
border-color: $border-color !important;
|
border-color: $border-color !important;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
min-height: 3em;
|
min-height: 3em;
|
||||||
width: 100%;
|
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue