mirror of
https://framagit.org/framasoft/framadate/funky-framadate-front.git
synced 2023-08-25 13:53:14 +02:00
display fav choices
This commit is contained in:
tykayn
parent
e3b2e685f1
commit
0fde16e14f
@ -1,6 +1,6 @@
|
||||
<div class="choice-bars-display" *ngIf="!detailledDisplay">
|
||||
<div class="columns" *ngIf="choice.yes && choice.yes.count > 0">
|
||||
<div class="column is-narrow">
|
||||
<div class="column is-narrow choice-label">
|
||||
{{ 'participation.yes' | translate }}
|
||||
</div>
|
||||
<div class="column">
|
||||
@ -15,7 +15,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns" *ngIf="choice.maybe && choice.maybe.count > 0">
|
||||
<div class="column is-narrow">
|
||||
<div class="column is-narrow choice-label">
|
||||
{{ 'participation.maybe' | translate }}
|
||||
</div>
|
||||
<div class="column">
|
||||
@ -28,7 +28,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns" *ngIf="choice.no && choice.no.count > 0">
|
||||
<div class="column is-narrow">
|
||||
<div class="column is-narrow choice-label">
|
||||
{{ 'participation.no' | translate }}
|
||||
</div>
|
||||
<div class="column">
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<app-header [linkToHome]="false"></app-header>
|
||||
|
||||
<section class="poll_loaded padded consultation step" *ngIf="!fetching && poll">
|
||||
<div class="contained-in-large-column">
|
||||
<section class="poll_loaded padded consultation" *ngIf="!fetching && poll">
|
||||
<div class="step contained-in-large-column">
|
||||
<div class="rounded-block admin-share-link" *ngIf="poll.admin_key || show_admin_stuff">
|
||||
<h2 class="title is-2">
|
||||
{{ 'participation.share_title' | translate }}
|
||||
@ -72,9 +72,23 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="has-votes" *ngIf="poll.stacks.length !== 0">
|
||||
{{ 'participation.fav_description_one' | translate: { maxYesCount: maxYesCount } }}
|
||||
{{ 'participation.fav_description_several' | translate }}
|
||||
<div class="has-votes" *ngIf="poll.stacks.length !== 0 && favChoicesList.length">
|
||||
<div class="one-fav" *ngIf="favChoicesList.length == 1">
|
||||
{{ 'participation.fav_description_one' | translate: { maxYesCount: maxYesCount } }}
|
||||
</div>
|
||||
<div class="several-fav" *ngIf="favChoicesList.length > 1">
|
||||
{{ 'participation.fav_description_several' | translate }}
|
||||
</div>
|
||||
<div class="fav block has-background-yes">
|
||||
<div class="fav-choice" *ngFor="let c of favChoicesList">
|
||||
<div class="date-choice" *ngIf="poll.kind == 'date'">
|
||||
{{ c.name | date }}
|
||||
</div>
|
||||
<div class="date-choice" *ngIf="poll.kind == 'text'">
|
||||
{{ c.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@ -106,18 +120,18 @@
|
||||
|
||||
<app-poll-results-dinum [poll]="poll" [detailledDisplay]="detailledDisplay"></app-poll-results-dinum>
|
||||
</section>
|
||||
<!-- <section class="poll-comments">-->
|
||||
<!-- <h2 class="title is-3">-->
|
||||
<!-- {{ 'participation.comments' | translate }}-->
|
||||
<!-- </h2>-->
|
||||
<!-- <div class="rounded-block">-->
|
||||
<!-- <!– *ngIf="poll.allow_comments"–>-->
|
||||
<!-- <app-comments [poll]="poll" [vote_stack]="storageService.vote_stack"></app-comments>-->
|
||||
<!-- <div class="alert has-background-info" *ngIf="!poll.allow_comments">-->
|
||||
<!-- Ce sondage ne permet pas d'ajouter de commentaires-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </section>-->
|
||||
<section class="poll-comments">
|
||||
<h2 class="title is-3">
|
||||
{{ 'participation.comments' | translate }}
|
||||
</h2>
|
||||
<div class="rounded-block">
|
||||
<!-- *ngIf="poll.allow_comments"-->
|
||||
<app-comments [poll]="poll" [vote_stack]="storageService.vote_stack"></app-comments>
|
||||
<div class="alert has-background-info" *ngIf="!poll.allow_comments">
|
||||
Ce sondage ne permet pas d'ajouter de commentaires
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
<section class="loadin_poll" *ngIf="fetching">
|
||||
|
||||
@ -9,6 +9,7 @@ import { StorageService } from '../../core/services/storage.service';
|
||||
import { ApiService } from '../../core/services/api.service';
|
||||
import { ToastService } from '../../core/services/toast.service';
|
||||
import { environment } from 'src/environments/environment';
|
||||
import { Choice } from '../../core/models/choice.model';
|
||||
|
||||
@Component({
|
||||
selector: 'app-consultation',
|
||||
@ -28,6 +29,7 @@ export class ConsultationComponent implements OnInit, OnDestroy {
|
||||
public detailledDisplay: boolean = false;
|
||||
public display_options_menu: boolean = false;
|
||||
public show_admin_stuff: boolean = true;
|
||||
public favChoicesList: Array<Choice> = [];
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
@ -50,6 +52,7 @@ export class ConsultationComponent implements OnInit, OnDestroy {
|
||||
if (newpoll) {
|
||||
this.isArchived = new Date(newpoll.expiracy_date) < new Date();
|
||||
this.poll.choices_grouped.map((elem) => (elem.subSetToYes = false));
|
||||
this.findFavouriteChoices(newpoll);
|
||||
}
|
||||
});
|
||||
|
||||
@ -122,4 +125,15 @@ export class ConsultationComponent implements OnInit, OnDestroy {
|
||||
this.toastService.display('erreur à l enregistrement');
|
||||
}
|
||||
}
|
||||
|
||||
private findFavouriteChoices(newpoll: Poll) {
|
||||
let tempFavChoiceList = [];
|
||||
newpoll.choices.map((choice: Choice) => {
|
||||
console.log('choice.score', choice.score, newpoll.max_score);
|
||||
if (choice.score === newpoll.max_score) {
|
||||
tempFavChoiceList.push(choice);
|
||||
}
|
||||
});
|
||||
this.favChoicesList = tempFavChoiceList;
|
||||
}
|
||||
}
|
||||
|
||||
@ -23,6 +23,7 @@
|
||||
<div class="column is-narrow">
|
||||
<span class="max_score" *ngIf="poll.max_score > 0 && choice.score == poll.max_score">
|
||||
<i class="fa fa-star fa-2x"></i>
|
||||
{{ choice.score }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="column is-narrow">
|
||||
|
||||
@ -4,6 +4,15 @@
|
||||
padding: 0.75rem;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
.favourite {
|
||||
max-width: 20em;
|
||||
}
|
||||
.poll-anwsers {
|
||||
.rounded-block {
|
||||
max-width: 20em;
|
||||
}
|
||||
}
|
||||
|
||||
.list-of-choices {
|
||||
.button {
|
||||
.icon {
|
||||
@ -11,19 +20,23 @@
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.choice-label {
|
||||
font-size: 1rem;
|
||||
color: #383838;
|
||||
}
|
||||
|
||||
.choice-header {
|
||||
margin-left: -0.75rem;
|
||||
margin-right: -0.75rem;
|
||||
border-bottom: 1px solid #e2e0fa;
|
||||
}
|
||||
|
||||
.max_score {
|
||||
color: #128149;
|
||||
}
|
||||
}
|
||||
|
||||
.date-label {
|
||||
font-size: 1rem;
|
||||
color: #383838;
|
||||
|
||||
@ -25,6 +25,11 @@ export class PollResultsDinumComponent implements OnInit {
|
||||
return new Date(date_string);
|
||||
}
|
||||
|
||||
/**
|
||||
* calculer localement le nombre max de réponses pour un choix parmi ses oui peut-être et non.
|
||||
* c'est différent que de calculer ce maximum par rapport à tous les choix possibles
|
||||
* @param c
|
||||
*/
|
||||
getMax(c: Choice) {
|
||||
return Math.max(c[Answer.YES].count, c[Answer.MAYBE].count, c[Answer.NO].count);
|
||||
}
|
||||
|
||||
@ -12,7 +12,7 @@ input.is-hovered,
|
||||
select.is-hovered,
|
||||
.is-hovered.textarea,
|
||||
.select select.is-hovered {
|
||||
border-color: $font-color !important ;
|
||||
border-color: $font-color !important;
|
||||
}
|
||||
|
||||
app-step-one,
|
||||
@ -38,12 +38,14 @@ textarea {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
button,
|
||||
.button {
|
||||
&:focus {
|
||||
@extend .outlined;
|
||||
}
|
||||
}
|
||||
|
||||
textarea,
|
||||
input,
|
||||
.input,
|
||||
@ -55,6 +57,7 @@ select,
|
||||
border: solid 1px $font-color !important;
|
||||
border-radius: 4px;
|
||||
@extend .clickable;
|
||||
|
||||
&:focus {
|
||||
@extend .outlined;
|
||||
}
|
||||
@ -88,11 +91,13 @@ textarea {
|
||||
overflow-x: auto;
|
||||
@extend .clickable;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding: 10px 30px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.button {
|
||||
label {
|
||||
margin-bottom: 0;
|
||||
@ -101,6 +106,7 @@ textarea {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
input[type='radio'] {
|
||||
padding: 1em;
|
||||
margin-bottom: 0;
|
||||
@ -299,11 +305,21 @@ mat-checkbox {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-top: 0;
|
||||
|
||||
.column {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
&.is-narrow {
|
||||
padding-right: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.choice-bars-display {
|
||||
.columns {
|
||||
.column {
|
||||
&.choice-label {
|
||||
width: 5em;
|
||||
text-align: right;
|
||||
padding-right: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -350,19 +366,10 @@ label {
|
||||
}
|
||||
}
|
||||
|
||||
.choice-bars-display {
|
||||
.is-narrow {
|
||||
width: 5em;
|
||||
text-align: right;
|
||||
padding-right: 1em;
|
||||
}
|
||||
.bar {
|
||||
}
|
||||
}
|
||||
|
||||
.people {
|
||||
max-width: $main-column-width/2;
|
||||
}
|
||||
|
||||
.bar-div {
|
||||
padding: 0.25rem 0.025rem;
|
||||
text-align: center;
|
||||
@ -377,12 +384,14 @@ div {
|
||||
color: #128149;
|
||||
@extend .bar-div;
|
||||
}
|
||||
|
||||
&.has-background-maybe {
|
||||
border: solid 1px #86671b;
|
||||
background: #fffaec;
|
||||
color: #86671b;
|
||||
@extend .bar-div;
|
||||
}
|
||||
|
||||
&.has-background-no {
|
||||
border: solid 1px #d51b38;
|
||||
background: #ffecee;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user