tykayn/funky-framadate-front
1
1
Fork 1
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git synced 2023-08-25 13:53:14 +02:00
Code Issues Projects Releases Wiki Activity

result simple bar width calculations

Browse Source
This commit is contained in:
Tykayn 2022-02-11 09:36:22 +01:00 committed by tykayn
parent e3b9a82928
commit e3b2e685f1
7 changed files with 43 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/features/administration/stepper/stepper.component.html
View File

@ -109,7 +109,7 @@
[(visible)]="display_cancel_dialog"
[breakpoints]="{ '960px': '75vw' }"
[style]="{ width: '50vw', 'border-radius': '1rem' }"
[styleClass]="'round-borders'"
[styleClass]="'roundToPercentWidth-borders'"
[draggable]="false"
[showHeader]="false"
[resizable]="false"

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

@ -4,8 +4,13 @@
{{ 'participation.yes' | translate }}
</div>
<div class="column">
<div class="bar has-text-centered has-background-yes" *ngIf="choice.yes">
<div
class="bar has-text-centered has-background-yes"
*ngIf="choice.yes"
[style.width]="roundToPercentWidth(choice.yes.count)"
>
{{ choice.yes.count }}
<!-- sur {{countMaxVotesForThisAnswer}}. {{roundToPercentWidth(choice.yes.count) }}-->
</div>
</div>
</div>
@ -14,7 +19,10 @@
{{ 'participation.maybe' | translate }}
</div>
<div class="column">
<div class="bar has-text-centered has-background-maybe">
<div
class="bar has-text-centered has-background-maybe"
[style.width]="roundToPercentWidth(choice.maybe.count)"
>
{{ choice.maybe.count }}
</div>
</div>
@ -24,7 +32,7 @@
{{ 'participation.no' | translate }}
</div>
<div class="column">
<div class="bar has-text-centered has-background-no">
<div class="bar has-text-centered has-background-no" [style.width]="roundToPercentWidth(choice.no.count)">
{{ choice.no.count }}
</div>
</div>

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

@ -9,7 +9,13 @@ import { Choice } from '../../../core/models/choice.model';
export class ChoiceTableComponent implements OnInit {
@Input() detailledDisplay: boolean;
@Input() choice: Choice;
@Input() countMaxVotesForThisAnswer: number = 5;
constructor() {}
ngOnInit(): void {}
roundToPercentWidth(number: number) {
return Math.ceil((number / this.countMaxVotesForThisAnswer) * 100) + '%';
}
}

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

@ -106,18 +106,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">-->
<!-- &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>-->
</div>
</section>
<section class="loadin_poll" *ngIf="fetching">

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

@ -31,7 +31,11 @@
</div>
<div class="choice-header" *ngIf="poll.max_score > 0"></div>
<app-choice-table [choice]="choice" [detailledDisplay]="detailledDisplay"></app-choice-table>
<app-choice-table
[choice]="choice"
[detailledDisplay]="detailledDisplay"
[countMaxVotesForThisAnswer]="getMax(choice)"
></app-choice-table>
</div>
</div>
</div>

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

@ -3,6 +3,7 @@ import { Poll } from '../../../core/models/poll.model';
import { Answer } from '../../../core/enums/answer.enum';
import { ModalService } from '../../../core/services/modal.service';
import { StorageService } from '../../../core/services/storage.service';
import { Choice, ChoiceGroup } from '../../../core/models/choice.model';
@Component({
selector: 'app-poll-results-dinum',
@ -12,7 +13,6 @@ import { StorageService } from '../../../core/services/storage.service';
export class PollResultsDinumComponent implements OnInit {
@Input() public poll: Poll;
@Input() public detailledDisplay: boolean = false;
public answerEnum = Answer;
constructor(private modalService: ModalService, private storageService: StorageService) {}
ngOnInit(): void {}
@ -24,4 +24,8 @@ export class PollResultsDinumComponent implements OnInit {
showAsDate(date_string: string) {
return new Date(date_string);
}
getMax(c: Choice) {
return Math.max(c[Answer.YES].count, c[Answer.MAYBE].count, c[Answer.NO].count);
}
}

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

@ -360,6 +360,9 @@ label {
}
}
.people {
max-width: $main-column-width/2;
}
.bar-div {
padding: 0.25rem 0.025rem;
text-align: center;