mirror of
https://framagit.org/framasoft/framadate/funky-framadate-front.git
synced 2023-08-25 13:53:14 +02:00
buttons to nav
This commit is contained in:
parent
9ebd22536b
commit
3808f19425
@ -1,7 +1,7 @@
|
||||
export const mockMyPolls =
|
||||
[{
|
||||
"id": 1,
|
||||
"title": "blehehehe heh hehhe e",
|
||||
"id": 1000001,
|
||||
"title": "blehehehe heh hehhe e test1",
|
||||
"customUrl": null,
|
||||
"description": "maaaaaaaaaaah",
|
||||
"creationDate": {"date": "2020-01-20 14:21:16.270157", "timezone_type": 3, "timezone": "Europe/Paris"},
|
||||
@ -19,5 +19,25 @@ export const mockMyPolls =
|
||||
"choices": {},
|
||||
"comments": {},
|
||||
"defaultExpiracyDaysFromNow": 60
|
||||
}, {
|
||||
"id": 1000002,
|
||||
"title": "bleh z zr erth tuyjikioy yylil test2",
|
||||
"customUrl": null,
|
||||
"description": "maaaaaaaaaaah 2",
|
||||
"creationDate": {"date": "2020-01-20 14:21:16.270157", "timezone_type": 3, "timezone": "Europe/Paris"},
|
||||
"expiracyDate": {"date": "2020-01-20 14:21:16.270178", "timezone_type": 3, "timezone": "Europe/Paris"},
|
||||
"owner": null,
|
||||
"kind": "text",
|
||||
"allowedAnswers": ["yes"],
|
||||
"modificationPolicy": "nobody",
|
||||
"mailOnComment": null,
|
||||
"mailOnVote": null,
|
||||
"hideResults": null,
|
||||
"showResultEvenIfPasswords": null,
|
||||
"votes": {},
|
||||
"stacksOfVotes": {},
|
||||
"choices": {},
|
||||
"comments": {},
|
||||
"defaultExpiracyDaysFromNow": 60
|
||||
}]
|
||||
;
|
||||
|
||||
@ -63,6 +63,7 @@
|
||||
[(ngModel)]="answer.text"
|
||||
(keyup.enter)="addAnswer()"
|
||||
(keyup)="navigateOrDelete($event,i)"
|
||||
required='required'
|
||||
placeholder="réponse"
|
||||
>
|
||||
<button
|
||||
@ -75,15 +76,19 @@
|
||||
<button
|
||||
class="btn btn--primary btn--outline"
|
||||
(click)="addAnswer()"
|
||||
[ngClass]="{'btn--primary': allAnswersAreValid}"
|
||||
i18n
|
||||
>
|
||||
<i class='fa fa-plus' ></i >
|
||||
Ajouter une proposition
|
||||
</button >
|
||||
<br >
|
||||
<button
|
||||
[routerLink]="'/step/resume'"
|
||||
class="btn btn--full btn--primary"
|
||||
class="btn btn--full "
|
||||
i18n
|
||||
[ngClass]="{'btn--primary': allAnswersAreValid}"
|
||||
[disabled]='!allAnswersAreValid'
|
||||
>
|
||||
Voyons ce que ça donne
|
||||
</button >
|
||||
|
||||
@ -1,8 +0,0 @@
|
||||
:host {
|
||||
.img-thumbnail {
|
||||
width: 5em;
|
||||
height: 5em;
|
||||
margin: 1ch 0;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
import {AfterViewInit, ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
|
||||
import {AfterViewInit, ChangeDetectorRef, Component, Inject, OnChanges, OnInit} from '@angular/core';
|
||||
import {BaseComponent} from '../base-page/base.component';
|
||||
import {ConfigService} from '../../services/config.service';
|
||||
|
||||
@ -9,7 +9,9 @@ import {DOCUMENT} from '@angular/common';
|
||||
templateUrl: './answers.component.html',
|
||||
styleUrls: ['./answers.component.scss']
|
||||
})
|
||||
export class AnswersComponent extends BaseComponent implements OnInit, AfterViewInit {
|
||||
export class AnswersComponent extends BaseComponent implements OnInit, AfterViewInit, OnChanges {
|
||||
|
||||
private allAnswersAreValid = false;
|
||||
|
||||
private answerList = [];
|
||||
private currentHeader: any = "";
|
||||
@ -26,8 +28,24 @@ export class AnswersComponent extends BaseComponent implements OnInit, AfterView
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
ngOnChanges() {
|
||||
|
||||
this.checkValidAnswers();
|
||||
}
|
||||
|
||||
checkValidAnswers() {
|
||||
this.allAnswersAreValid = true;
|
||||
this.config.answers.forEach(answer => {
|
||||
if (!answer.text.length) {
|
||||
this.allAnswersAreValid = false;
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.focusOnAnswer(0)
|
||||
this.focusOnAnswer(0);
|
||||
this.checkValidAnswers();
|
||||
}
|
||||
|
||||
trackFunction(index: number, item: any): number {
|
||||
|
||||
@ -1,32 +1,32 @@
|
||||
<div class="description">
|
||||
<router-outlet></router-outlet>
|
||||
<h1 i18n>
|
||||
<div class="description" >
|
||||
<router-outlet ></router-outlet >
|
||||
<h1 i18n >
|
||||
{{"creation.title"|translate}}
|
||||
</h1>
|
||||
</h1 >
|
||||
<span
|
||||
class="pre-selector"
|
||||
i18n
|
||||
>
|
||||
{{"creation.want"|translate}}
|
||||
</span>
|
||||
</span >
|
||||
<select
|
||||
[(ngModel)]="config.pollType"
|
||||
autofocus="autofocus"
|
||||
id="selector"
|
||||
name="selector"
|
||||
>
|
||||
<option value="dates">
|
||||
<option value="dates" >
|
||||
{{"creation.kind.date"|translate}}
|
||||
</option>
|
||||
<option value="classic">
|
||||
</option >
|
||||
<option value="classic" >
|
||||
{{"creation.kind.classic"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
</option >
|
||||
</select >
|
||||
|
||||
<span class="post-selector">
|
||||
</span>
|
||||
<span class="post-selector" >
|
||||
</span >
|
||||
|
||||
<div>
|
||||
<div >
|
||||
|
||||
<label
|
||||
class="title-label"
|
||||
@ -34,7 +34,7 @@
|
||||
i18n
|
||||
>
|
||||
{{"creation.choose_title"|translate}}
|
||||
</label>
|
||||
</label >
|
||||
<input
|
||||
[(ngModel)]="config.title"
|
||||
id="poll_title"
|
||||
@ -42,12 +42,12 @@
|
||||
placeholder="{{'creation.choose_title_placeholder'|translate}}"
|
||||
type="name"
|
||||
>
|
||||
</div>
|
||||
</div >
|
||||
|
||||
<div>
|
||||
<label for="my_name">
|
||||
<div >
|
||||
<label for="my_name" >
|
||||
{{"creation.name"|translate}} :
|
||||
</label>
|
||||
</label >
|
||||
<input
|
||||
[(ngModel)]="config.myName"
|
||||
id="my_name"
|
||||
@ -55,16 +55,17 @@
|
||||
placeholder="{{'creation.name_placeholder'|translate}}"
|
||||
type="name"
|
||||
>
|
||||
</div>
|
||||
</div >
|
||||
|
||||
<div>
|
||||
<div >
|
||||
<label
|
||||
class="title-label"
|
||||
for="poll_description"
|
||||
i18n
|
||||
>
|
||||
{{"creation.description"|translate}}
|
||||
</label>
|
||||
{{"creation.description"|translate}}:
|
||||
</label >
|
||||
<br >
|
||||
<textarea
|
||||
[(ngModel)]="config.description"
|
||||
cols="50"
|
||||
@ -72,12 +73,12 @@
|
||||
lines="5"
|
||||
name="poll_description"
|
||||
placeholder="description"
|
||||
></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<label for="email">
|
||||
></textarea >
|
||||
</div >
|
||||
<div >
|
||||
<label for="email" >
|
||||
Mon email pour administrer le sondage est
|
||||
</label>
|
||||
</label >
|
||||
<input
|
||||
[(ngModel)]="config.myEmail"
|
||||
autofocus="autofocus"
|
||||
@ -86,22 +87,22 @@
|
||||
required="required"
|
||||
type="email"
|
||||
/>
|
||||
<framadate-erasable-input [(inputModel)]="config.myEmail"></framadate-erasable-input>
|
||||
</div>
|
||||
<framadate-erasable-input [(inputModel)]="config.myEmail" ></framadate-erasable-input >
|
||||
</div >
|
||||
|
||||
<button
|
||||
[routerLink]="'/step/answers'"
|
||||
class="btn btn-block"
|
||||
class="btn btn--primary btn--full"
|
||||
i18n
|
||||
>
|
||||
Continuer
|
||||
</button>
|
||||
</button >
|
||||
<a
|
||||
[routerLink]="'/step/answers'"
|
||||
class="prev"
|
||||
i18n
|
||||
>
|
||||
Retour
|
||||
</a>
|
||||
<hr>
|
||||
</div>
|
||||
</a >
|
||||
<hr >
|
||||
</div >
|
||||
|
||||
@ -1,31 +1,45 @@
|
||||
<h1>
|
||||
<h1 >
|
||||
Récapitulatif
|
||||
</h1>
|
||||
<h2 class="hero-title">
|
||||
{{config.title}}
|
||||
</h2>
|
||||
<div class="creation">
|
||||
créé par
|
||||
{{config.myName}}
|
||||
</div>
|
||||
<div class="description">
|
||||
<p>
|
||||
{{config.description}}
|
||||
</p>
|
||||
</div>
|
||||
<section>
|
||||
<ul>
|
||||
<li markdown *ngFor="let questions of config.answers">
|
||||
{{questions.id + 1}}. {{questions.text}}
|
||||
</li>
|
||||
</ul>
|
||||
<button [routerLink]="'/step/answers'" class="btn btn-info">Retour</button>
|
||||
</section>
|
||||
<button [routerLink]="'/step/end'" class="btn btn--primary" i18n="@@confirm">C'est parfait!</button>
|
||||
</h1 >
|
||||
<div class='card content' >
|
||||
|
||||
<div class="back">
|
||||
<a [routerLink]="'/step/visibility'"
|
||||
class="btn btn--back">
|
||||
<h2 class="hero-title title" >
|
||||
{{config.title}}
|
||||
</h2 >
|
||||
<div class="creation" >
|
||||
créé par
|
||||
{{config.myName}}
|
||||
</div >
|
||||
<div class="description" >
|
||||
<p >
|
||||
{{config.description}}
|
||||
</p >
|
||||
</div >
|
||||
<section >
|
||||
<ul >
|
||||
<li
|
||||
markdown
|
||||
*ngFor="let questions of config.answers" >
|
||||
<img
|
||||
class='img-thumbnail'
|
||||
src='{{questions.url}}'
|
||||
alt='image {{questions.url}}' >
|
||||
{{questions.id + 1}}. {{questions.text}}
|
||||
</li >
|
||||
</ul >
|
||||
</section >
|
||||
|
||||
</div >
|
||||
<button
|
||||
[routerLink]="'/step/end'"
|
||||
class="btn btn--primary btn--full"
|
||||
i18n="@@confirm" >C'est parfait!
|
||||
</button >
|
||||
|
||||
<div class="back" >
|
||||
<a
|
||||
[routerLink]="'/step/answers'"
|
||||
class="prev" >
|
||||
Retour
|
||||
</a>
|
||||
</div>
|
||||
</a >
|
||||
</div >
|
||||
|
||||
@ -0,0 +1,5 @@
|
||||
.card {
|
||||
box-shadow: 0px 0px 0.5em #ccc;
|
||||
padding: 2em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
@ -1,162 +1,174 @@
|
||||
<h1 i18n>
|
||||
<h1 i18n >
|
||||
{{"visibility.top_txt"|translate}}
|
||||
</h1>
|
||||
<section class="answers">
|
||||
<h2>
|
||||
</h1 >
|
||||
<section class="answers" >
|
||||
<h2 >
|
||||
{{"visibility.title"|translate}}
|
||||
</h2>
|
||||
<span>
|
||||
</h2 >
|
||||
<span >
|
||||
{{"visibility.visibility_want"|translate}}
|
||||
</span>
|
||||
</span >
|
||||
<select
|
||||
name="visible_people"
|
||||
id="visible_people"
|
||||
[(ngModel)]="config.visibility"
|
||||
>
|
||||
<option value="link_only">
|
||||
<option value="link_only" >
|
||||
{{"visibility.visibility_link"|translate}}
|
||||
</option>
|
||||
<option value="only_me">
|
||||
</option >
|
||||
<option value="only_me" >
|
||||
{{"visibility.visibility_nobody"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
<span>
|
||||
</option >
|
||||
</select >
|
||||
<span >
|
||||
{{"visibility.visibility_see"|translate}}
|
||||
</span>
|
||||
</span >
|
||||
|
||||
</section>
|
||||
</section >
|
||||
|
||||
<section class="possible_votes">
|
||||
<h2>
|
||||
<section class="possible_votes" >
|
||||
<h2 >
|
||||
{{"visibility.votes"|translate}}
|
||||
</h2>
|
||||
<label for="votes">
|
||||
</h2 >
|
||||
<label for="votes" >
|
||||
{{"visibility.votes_possible"|translate}}
|
||||
</label>
|
||||
</label >
|
||||
<select
|
||||
name="votes"
|
||||
id="votes"
|
||||
[(ngModel)]="config.voteChoices"
|
||||
>
|
||||
<option value="only_yes">
|
||||
<option value="only_yes" >
|
||||
{{"visibility.votes_possible_single"|translate}}
|
||||
</option>
|
||||
<option value="normal">
|
||||
</option >
|
||||
<option value="normal" >
|
||||
{{"visibility.votes_possible_normal"|translate}}
|
||||
</option>
|
||||
<option value="full">
|
||||
</option >
|
||||
<option value="full" >
|
||||
{{"visibility.votes_possible_full"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
</section>
|
||||
<section class="expiracy">
|
||||
<label for="expirationDate">
|
||||
</option >
|
||||
</select >
|
||||
</section >
|
||||
<section class="expiracy" >
|
||||
<label for="expirationDate" >
|
||||
{{"visibility.archiving"|translate}}
|
||||
</label>
|
||||
</label >
|
||||
|
||||
<input type="date"
|
||||
id="expirationDate"
|
||||
[(ngModel)]="config.expirationDate">
|
||||
<div class="modification">
|
||||
<label for="modificationAbility">
|
||||
<input
|
||||
type="date"
|
||||
id="expirationDate"
|
||||
[(ngModel)]="config.expirationDate" >
|
||||
<div class="modification" >
|
||||
<label for="modificationAbility" >
|
||||
{{"visibility.archiving_start"|translate}}
|
||||
</label>
|
||||
</label >
|
||||
<select
|
||||
name="modificationAbility"
|
||||
id="modificationAbility"
|
||||
[(ngModel)]="config.canModifyAnswers">
|
||||
<option value="1">
|
||||
[(ngModel)]="config.canModifyAnswers" >
|
||||
<option value="1" >
|
||||
{{"visibility.archiving_can"|translate}}
|
||||
</option>
|
||||
<option value="0">
|
||||
</option >
|
||||
<option value="0" >
|
||||
{{"visibility.archiving_can_not"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
<label for="modificationScope">
|
||||
</option >
|
||||
</select >
|
||||
<label for="modificationScope" >
|
||||
{{"visibility.archiving_end"|translate}}
|
||||
</label>
|
||||
</label >
|
||||
|
||||
<select
|
||||
name="modificationScope"
|
||||
id="modificationScope"
|
||||
[(ngModel)]="config.whoModifiesAnswers"
|
||||
[disabled]="!config.canModifyAnswers">
|
||||
<option value="self">
|
||||
[disabled]="!config.canModifyAnswers" >
|
||||
<option value="self" >
|
||||
{{"visibility.modfiy_their"|translate}}
|
||||
</option>
|
||||
<option value="everybody">
|
||||
</option >
|
||||
<option value="everybody" >
|
||||
{{"visibility.modfiy_everyone"|translate}}
|
||||
</option>
|
||||
</select>
|
||||
</option >
|
||||
</select >
|
||||
|
||||
</div>
|
||||
</div >
|
||||
|
||||
|
||||
</section>
|
||||
<section class="access">
|
||||
<h2>
|
||||
</section >
|
||||
<section class="access" >
|
||||
<h2 >
|
||||
{{"visibility.access"|translate}}
|
||||
</h2>
|
||||
<label for="url">
|
||||
</h2 >
|
||||
<label for="url" >
|
||||
{{"visibility.access_url"|translate}}
|
||||
<br>
|
||||
<br >
|
||||
{{"visibility.access_url_key"|translate}}
|
||||
</label>
|
||||
<br>
|
||||
<input type="name"
|
||||
class="input-lg"
|
||||
name="url"
|
||||
id="url"
|
||||
[(ngModel)]="config.customUrl">
|
||||
</label >
|
||||
<br >
|
||||
<input
|
||||
type="name"
|
||||
class="input-lg"
|
||||
name="url"
|
||||
id="url"
|
||||
[(ngModel)]="config.customUrl" >
|
||||
|
||||
<sub class="instructions">
|
||||
<sub class="instructions" >
|
||||
{{"visibility.access_instructions"|translate}}
|
||||
</sub>
|
||||
<div class="preview-url">
|
||||
</sub >
|
||||
<div class="preview-url" >
|
||||
{{baseUrl + '/' + config.customUrl}}
|
||||
</div>
|
||||
<br>
|
||||
<label for="passwordAccess">
|
||||
</div >
|
||||
<br >
|
||||
<label for="passwordAccess" >
|
||||
{{"visibility.access_want"|translate}}
|
||||
</label>
|
||||
<select name="passwordAccess" id="passwordAccess" [(ngModel)]="config.passwordAccess">
|
||||
<option value="0"> {{"visibility.access_want_no"|translate}}</option>
|
||||
<option value="1"> {{"visibility.access_want_yes"|translate}}</option>
|
||||
</select>
|
||||
</label >
|
||||
<select
|
||||
name="passwordAccess"
|
||||
id="passwordAccess"
|
||||
[(ngModel)]="config.passwordAccess" >
|
||||
<option value="0" > {{"visibility.access_want_no"|translate}}</option >
|
||||
<option value="1" > {{"visibility.access_want_yes"|translate}}</option >
|
||||
</select >
|
||||
|
||||
<label for="password">
|
||||
<label for="password" >
|
||||
{{"visibility.access_protect"|translate}}
|
||||
</label>
|
||||
</label >
|
||||
|
||||
<div class="enablepassword" *ngIf="config.passwordAccess == '1'">
|
||||
<input type="password"
|
||||
name="password"
|
||||
id="password"
|
||||
min="8"
|
||||
*ngIf="!showCustomPassword"
|
||||
[(ngModel)]="config.password">
|
||||
<input type="name"
|
||||
name="password_visible"
|
||||
id="password_visible"
|
||||
min="8"
|
||||
*ngIf="showCustomPassword"
|
||||
[(ngModel)]="config.password">
|
||||
<button (click)="showCustomPassword = !showCustomPassword" [disabled]="!config.password"
|
||||
class="btn btn--default">
|
||||
<i class="fa fa-eye"></i>
|
||||
<div
|
||||
class="enablepassword"
|
||||
*ngIf="config.passwordAccess == '1'" >
|
||||
<input
|
||||
type="password"
|
||||
name="password"
|
||||
id="password"
|
||||
min="8"
|
||||
*ngIf="!showCustomPassword"
|
||||
[(ngModel)]="config.password" >
|
||||
<input
|
||||
type="name"
|
||||
name="password_visible"
|
||||
id="password_visible"
|
||||
min="8"
|
||||
*ngIf="showCustomPassword"
|
||||
[(ngModel)]="config.password" >
|
||||
<button
|
||||
(click)="showCustomPassword = !showCustomPassword"
|
||||
[disabled]="!config.password"
|
||||
class="btn btn--default" >
|
||||
<i class="fa fa-eye" ></i >
|
||||
{{"visibility.see_pass"|translate}}
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
</button >
|
||||
</div >
|
||||
</section >
|
||||
|
||||
<a [routerLink]="'/step/end'"
|
||||
class="btn btn-link btn--primary">
|
||||
<a
|
||||
[routerLink]="'/step/end'"
|
||||
class="btn btn-link btn--primary" >
|
||||
{{"visibility.validate_btn"|translate}}
|
||||
</a>
|
||||
<div class="back">
|
||||
</a >
|
||||
<div class="back" >
|
||||
|
||||
<a [routerLink]="'/step/answers'"
|
||||
class="btn btn--back">
|
||||
<a
|
||||
[routerLink]="'/step/answers'"
|
||||
class="prev" >
|
||||
Retour
|
||||
</a>
|
||||
</div>
|
||||
</a >
|
||||
</div >
|
||||
|
||||
@ -46,7 +46,6 @@ option {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
|
||||
background: none;
|
||||
border-radius: 0;
|
||||
|
||||
background-color: transparent;
|
||||
@ -164,3 +163,7 @@ select, input, textarea {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.btn, a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@ -1 +1,7 @@
|
||||
@charset "UTF-8";
|
||||
@charset "UTF-8";
|
||||
.img-thumbnail {
|
||||
width: 5em;
|
||||
height: 5em;
|
||||
margin: 1ch 0;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user