Liness/framadate-responsive
5
0
Fork 0
forked from tykayn/funky-framadate-front
Code Pull Requests Activity

display fav choices

Browse Source
This commit is contained in:
Tykayn 2022-02-11 10:02:05 +01:00 committed by tykayn
parent e3b2e685f1
commit 0fde16e14f
7 changed files with 89 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/features/consultation/choice-table/choice-table.component.html
View File

@ -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">

48
src/app/features/consultation/consultation.component.html
View File

@ -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">-->
<!-- &lt;!&ndash; *ngIf="poll.allow_comments"&ndash;&gt;-->
<!-- <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">

14
src/app/features/consultation/consultation.component.ts
View File

@ -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;
}
}

1
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.html
View File

@ -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">

13
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.scss
View File

@ -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;

5
src/app/features/consultation/poll-results-dinum/poll-results-dinum.component.ts
View File

@ -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);
}

35
src/styles/partials/_forms.scss
View File

@ -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;