display a table of answers

This commit is contained in:
Baptiste Lemoine 2020-01-29 17:30:39 +01:00
parent 0369d934bd
commit 43ea524c26
5 changed files with 356 additions and 160 deletions

View File

@ -47,22 +47,37 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"choice_id": 5
},
"6": {
"id": 3,
"vote_id": 5,
"value": "maybe",
"choice_id": 6,
"text": "Boumbo petite automobile"
},
"7": {
"id": 3, "id": 3,
"vote_id": 4, "vote_id": 4,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
}, },
{ "8": {
"id": 3, "choice_id": 8
"vote_id": 5, },
"value": "maybe", "9": {
"choice_id": 6, "choice_id": 9
"text": "Boumbo petite automobile" },
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 4, "id": 4,
@ -72,29 +87,37 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"choice_id": 5
},
"6": {
"id": 4, "id": 4,
"vote_id": 6, "vote_id": 6,
"value": "yes", "value": "yes",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 4,
"vote_id": 7,
"value": "yes",
"choice_id": 7,
"text": "Les mystérieuses cités d'or"
},
{
"id": 4, "id": 4,
"vote_id": 8, "vote_id": 8,
"value": "no", "value": "no",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 5, "id": 5,
@ -104,29 +127,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 5, "id": 5,
"vote_id": 9, "vote_id": 9,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 5, "id": 5,
"vote_id": 10, "vote_id": 10,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 5, "id": 5,
"vote_id": 11, "vote_id": 11,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 6, "id": 6,
@ -136,29 +171,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 6, "id": 6,
"vote_id": 12, "vote_id": 12,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 6, "id": 6,
"vote_id": 13, "vote_id": 13,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 6, "id": 6,
"vote_id": 14, "vote_id": 14,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 7, "id": 7,
@ -168,29 +215,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 7, "id": 7,
"vote_id": 15, "vote_id": 15,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 7, "id": 7,
"vote_id": 16, "vote_id": 16,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 7, "id": 7,
"vote_id": 17, "vote_id": 17,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 8, "id": 8,
@ -200,29 +259,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 8, "id": 8,
"vote_id": 18, "vote_id": 18,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 8, "id": 8,
"vote_id": 19, "vote_id": 19,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 8, "id": 8,
"vote_id": 20, "vote_id": 20,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 9, "id": 9,
@ -232,29 +303,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 9, "id": 9,
"vote_id": 21, "vote_id": 21,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 9, "id": 9,
"vote_id": 22, "vote_id": 22,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 9, "id": 9,
"vote_id": 23, "vote_id": 23,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 10, "id": 10,
@ -264,29 +347,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 10, "id": 10,
"vote_id": 24, "vote_id": 24,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 10, "id": 10,
"vote_id": 25, "vote_id": 25,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 10, "id": 10,
"vote_id": 26, "vote_id": 26,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 11, "id": 11,
@ -296,29 +391,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 11, "id": 11,
"vote_id": 27, "vote_id": 27,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 11, "id": 11,
"vote_id": 28, "vote_id": 28,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 11, "id": 11,
"vote_id": 29, "vote_id": 29,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 12, "id": 12,
@ -328,29 +435,41 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"id": 12, "id": 12,
"vote_id": 30, "vote_id": 30,
"value": "no", "value": "no",
"choice_id": 5, "choice_id": 5,
"text": "Vic le viking" "text": "Vic le viking"
}, },
{ "6": {
"id": 12, "id": 12,
"vote_id": 31, "vote_id": 31,
"value": "maybe", "value": "maybe",
"choice_id": 6, "choice_id": 6,
"text": "Boumbo petite automobile" "text": "Boumbo petite automobile"
}, },
{ "7": {
"id": 12, "id": 12,
"vote_id": 32, "vote_id": 32,
"value": "yes", "value": "yes",
"choice_id": 7, "choice_id": 7,
"text": "Les mystérieuses cités d'or" "text": "Les mystérieuses cités d'or"
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
} }
] }
}, },
{ {
"id": 13, "id": 13,
@ -360,15 +479,36 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"choice_id": 5
},
"6": {
"choice_id": 6
},
"7": {
"choice_id": 7
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
},
"2": {
"id": 13, "id": 13,
"vote_id": 33, "vote_id": 33,
"value": "yes", "value": "yes",
"choice_id": 2, "choice_id": 2,
"text": null "text": null
} }
] }
}, },
{ {
"id": 14, "id": 14,
@ -378,15 +518,36 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"choice_id": 5
},
"6": {
"choice_id": 6
},
"7": {
"choice_id": 7
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
},
"2": {
"id": 14, "id": 14,
"vote_id": 34, "vote_id": 34,
"value": "yes", "value": "yes",
"choice_id": 2, "choice_id": 2,
"text": null "text": null
} }
] }
}, },
{ {
"id": 15, "id": 15,
@ -396,15 +557,36 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"choice_id": 5
},
"6": {
"choice_id": 6
},
"7": {
"choice_id": 7
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
},
"2": {
"id": 15, "id": 15,
"vote_id": 35, "vote_id": 35,
"value": "yes", "value": "yes",
"choice_id": 2, "choice_id": 2,
"text": null "text": null
} }
] }
}, },
{ {
"id": 16, "id": 16,
@ -414,22 +596,43 @@ export const mockPoll3 = {
"timezone_type": 3, "timezone_type": 3,
"timezone": "Europe/Berlin" "timezone": "Europe/Berlin"
}, },
"votes": [ "votes": {
{ "5": {
"choice_id": 5
},
"6": {
"choice_id": 6
},
"7": {
"choice_id": 7
},
"8": {
"choice_id": 8
},
"9": {
"choice_id": 9
},
"10": {
"choice_id": 10
},
"11": {
"choice_id": 11
},
"1": {
"id": 16, "id": 16,
"vote_id": 36, "vote_id": 36,
"value": "no", "value": "no",
"choice_id": 1, "choice_id": 1,
"text": "orange" "text": "orange"
}, },
{ "2": {
"id": 16, "id": 16,
"vote_id": 37, "vote_id": 37,
"value": "yes", "value": "yes",
"choice_id": 2, "choice_id": 2,
"text": null "text": null
} }
] }
} }
], ],
"choices_count": { "choices_count": {
@ -545,10 +748,6 @@ export const mockPoll3 = {
] ]
} }
} }
},
"people": {
"voting_people_TEST": "yes",
"tk_TEST": "yes"
} }
}, },
"choices": [ "choices": [

View File

@ -1,35 +1,38 @@
<div class="poll" > <div class="poll" >
<nav class='sections-nav' > <div id='table' >
<ul > <framadate-voting-summary ></framadate-voting-summary >
<li > </div >
<a href='#title' > <!-- <nav class='sections-nav' >-->
{{config.currentPoll.poll.title}} <!-- <ul >-->
</a > <!-- <li >-->
</li > <!-- <a href='#title' >-->
<li > <!-- {{config.currentPoll.poll.title}}-->
<a href='#table' > <!-- </a >-->
{{config.currentPoll.stacks.length}} <!-- </li >-->
votes <!-- <li >-->
</a > <!-- <a href='#table' >-->
</li > <!-- {{config.currentPoll.stacks.length}}-->
<li > <!-- votes-->
<a href='#graph' > <!-- </a >-->
Graphique <!-- </li >-->
</a > <!-- <li >-->
</li > <!-- <a href='#graph' >-->
<li > <!-- Graphique-->
<a href='#comments' > <!-- </a >-->
<i class='fa fa-comments' ></i > <!-- </li >-->
<span <!-- <li >-->
*ngIf='config.currentPoll && config.currentPoll.comments' <!-- <a href='#comments' >-->
class='comments-count' > <!-- <i class='fa fa-comments' ></i >-->
{{config.currentPoll.comments.length}} <!-- <span-->
</span > <!-- *ngIf='config.currentPoll && config.currentPoll.comments'-->
commentaires <!-- class='comments-count' >-->
</a > <!-- {{config.currentPoll.comments.length}}-->
</li > <!-- </span >-->
</ul > <!-- commentaires-->
</nav > <!-- </a >-->
<!-- </li >-->
<!-- </ul >-->
<!-- </nav >-->
<div class='heading' > <div class='heading' >
<div class='col-xs-6' > <div class='col-xs-6' >
<h1 id='title' >{{config.currentPoll.poll.title}}</h1 > <h1 id='title' >{{config.currentPoll.poll.title}}</h1 >
@ -85,7 +88,7 @@
[ngClass]='{"btn--primary" : config.myTempVoteStack } ' [ngClass]='{"btn--primary" : config.myTempVoteStack } '
*ngIf='!config.myVoteStack || !config.myVoteStack.id' > *ngIf='!config.myVoteStack || !config.myVoteStack.id' >
<i class='fa fa-paper-plane' ></i > Envoyer <i class='fa fa-paper-plane' ></i > Envoyer
<!-- ( {{config.myTempVoteStack}} )-->
</button > </button >
<button <button
class='btn btn--primary btn-block submit-votestack update' class='btn btn--primary btn-block submit-votestack update'
@ -98,9 +101,7 @@
<!--<framadate-voting-graph ></framadate-voting-graph >--> <!--<framadate-voting-graph ></framadate-voting-graph >-->
</div > </div >
<div id='table' >
<!--<framadate-voting-summary ></framadate-voting-summary >-->
</div >
<div <div
class="comments" class="comments"
id='comments' > id='comments' >

View File

@ -6,23 +6,33 @@
{{preferred}} {{preferred}}
</span > </span >
</div > </div >
<div <table >
class='line vote-stack' <thead >
*ngFor='let voteStack of pollconfig.stacks' > <tr >
<td >
<div class='vs' > Pseudo
<div class='person' > </td >
<td *ngFor='let choice of config.currentPoll.choices' >
<!-- {{choice.id}})-->
{{choice.text}}
</td >
</tr >
</thead >
<tbody >
<tr
class='votes-of-the-person'
*ngFor='let voteStack of pollconfig.stacks'
>
<td >
{{voteStack.pseudo}} {{voteStack.pseudo}}
</div > </td >
<div class='votes-of-the-person' > <td *ngFor='let v of getKeys(voteStack.votes)' >
<div <!-- {{voteStack.votes[v].choice_id}}-->
class='vote' <span *ngIf='voteStack.votes[v].value' >
*ngFor='let v of voteStack.votes' >
<div class='id' > {{voteStack.votes[v].value}}
{{v.id}} </span >
{{v.answer}} </td >
</div > </tr >
</div > </tbody >
</div > </table >
</div >
</div >

View File

@ -6,3 +6,12 @@
font-weight: 700; font-weight: 700;
font-size: 1.5em; font-size: 1.5em;
} }
thead {
font-size: 1.25em;
font-weight: 700;
}
tbody {
text-align: right;
}

View File

@ -11,6 +11,8 @@ export class VotingSummaryComponent implements OnInit {
preferred: string = 'rien'; preferred: string = 'rien';
counters: any = {}; counters: any = {};
orderedListOfChoices: any = {};
enrichedStacks: any = []; // a list of vote stacks with the missing ids of what has not been voted
@Input() pollconfig = mockPoll3; @Input() pollconfig = mockPoll3;
@ -22,43 +24,18 @@ export class VotingSummaryComponent implements OnInit {
this.computePreferred(); this.computePreferred();
} }
getKeys(obj) {
return Object.keys(obj)
}
/** /**
* find the most "yes" * find the most "yes"
*/ */
computePreferred() { computePreferred() {
let maximumYesCount = 0;
let choice_id_max = 0;
let winners_id = [];
this.pollconfig.stacks.forEach(stack => { this.pollconfig.stacks.forEach(stack => {
stack.votes.map(vote => {
let choice_id = vote.choice_id;
let answer = vote.text;
if (!this.counters["choice_" + choice_id]) {
this.counters["choice_" + choice_id] = {
yes: 0,
maybe: 0,
no: 0,
}
}
this.counters["choice_" + choice_id][answer]++;
if (this.counters["choice_" + choice_id]['yes'] > maximumYesCount) {
choice_id_max = choice_id;
}
})
// find the favourite // find the favourite
}); });
console.log('choice_id_max', choice_id_max);
console.log(' this.pollconfig.choices', this.pollconfig.choices);
let choiceTitleFound = this.pollconfig.choices.find(elem => {
console.log('elem', elem);
return elem.id == choice_id_max
});
this.preferred = choiceTitleFound.text;
console.log('choiceTitleFound', choiceTitleFound)
} }