Merge branch '48-validate-a-vote-with-votes-displayed' into 'master'

Feat : display the votes in admin and allow to update

Closes #48

See merge request apoyen/elections!46

web/components/management/round-desks.js

@@ -2,11 +2,11 @@
 import * as Auth from "/services/auth/auth.js";
 import * as Common from "/services/common/common.js";
 import * as DeskModel from "/services/model/desk-model.js";
+import * as SectionModel from "/services/model/section-model.js";
 import * as DeskRoundModel from "/services/model/deskRound-model.js";
 import * as CapturerModel from "/services/model/capturer-model.js";
 import * as Messages from "/services/messages/messages.js";
-
-// DOM elements
+import * as Votes from "/components/vote/votes.js";
 
 export async function mount(where, parent) {
   const roundDesksComponent = new RoundDesk(parent);
@@ -20,12 +20,14 @@ class RoundDesk {
     this.DeskModel = DeskModel.getDeskModel();
     this.DeskRoundModel = DeskRoundModel.getDeskRoundModel();
     this.CapturerModel = CapturerModel.getCapturerModel();
+    this.SectionModel = SectionModel.getSectionModel();
   }
 
   async mount(where) {
     this.DeskModel.current_user = await Auth.GetUser();
     this.DeskRoundModel.current_user = await Auth.GetUser();
     this.CapturerModel.current_user = await Auth.GetUser();
+    this.SectionModel.current_user = await Auth.GetUser();
     const mountpoint = where;
     document.getElementById(mountpoint).innerHTML = /* HTML */ `
       <header class="card-header">
@@ -41,11 +43,12 @@ class RoundDesk {
           <div id="desk-round-details"></div>
         </div>
         <div class="column is-half">
-          <div id="vote-list" class="card"></div>
+          <div id="vote-section" class="card"></div>
         </div>
       </div>
     `;
     this.mountModal("capturers-modal");
+    this.votesHandler = await Votes.mount(this);
     this.handleDom();
   }
 
@@ -214,6 +217,7 @@ class RoundDesk {
             deskRound.ID
           );
           deskRoundHandler.displayDeskRoundsDetails();
+          deskRoundHandler.displayVotes(deskRound);
         });
       document
         .getElementById(`deskrounds-deskround-capturers-${deskRound.ID}`)
@@ -327,13 +331,31 @@ class RoundDesk {
 
   emptyDesks() {
     this.round = null;
-    document.getElementById("desk-round").innerHTML = ""
+    document.getElementById("desk-round").innerHTML = "";
     this.emptyDesksDetails();
   }
 
   emptyDesksDetails() {
     this.desk = null;
     document.getElementById("desk-round-details").innerHTML = "";
-    document.getElementById("vote-list").innerHTML = "";
+    document.getElementById("vote-section").innerHTML = "";
+  }
+
+  async displayVotes(deskRound) {
+    let desk = await this.DeskModel.getDesk(this.deskRound.DeskID);
+    let section = await this.SectionModel.getSection(desk.SectionID);
+    await this.votesHandler.displayVotes(
+      deskRound.RoundID,
+      section.AreaID,
+      deskRound.ID
+    );
+    document.getElementById("votes-breadcrumb").innerHTML = "";
+    document.getElementById("votes-return").remove();
+  }
+
+  async refreshVotes() {
+    this.DeskRoundModel.refreshDeskRounds();
+    this.deskRound = await this.DeskRoundModel.getDeskRound(this.deskRound.ID);
+    this.displayDeskRoundsDetails();
   }
 }

web/components/vote/vote-page.js

@@ -25,4 +25,7 @@ class VotePage {
   }
 
   handleDom() {}
+  async refreshVotes(){
+    this.voteHandler = await Vote.mount(this);
+  }
 }

web/components/vote/votes.js

@@ -43,14 +43,14 @@ class Vote {
     this.DeskRoundID = DeskRoundID;
 
     document.getElementById("vote-section").innerHTML = /* HTML */ `
-      <header class="card-header">
+      <header id="votes-breadcrumb" class="card-header">
       <p >
         <nav class="breadcrumb card-header-title"  aria-label="breadcrumbs">
           <ul id="vote-breadcrumb"></ul>
         </nav>
         </p>
       </header>
-      <div id="votes-table" class="card-content"></div>
+      <div id="votes-table"></div>
       <nav class="level">
         <div class="level-left"><p id="total-votes"></p>,&nbsp;<p id="votes-expressed"></p></div>
         <div class="level-right">
@@ -219,7 +219,7 @@ class Vote {
     if (votes.length == 0) method = "POST";
     else method = "PUT";
 
-    for (candidateList of candidateLists) {
+    for (let candidateList of candidateLists) {
       await voteHandler.VoteModel.saveVote(
         method,
         voteHandler.DeskRoundID,
@@ -248,8 +248,7 @@ class Vote {
       false,
       true
     );
-    await this.VoteModel.refreshVotes();
-    await this.loadVotes();
+    this.refreshParent();
   }
 
   async updatesVotes() {
@@ -274,10 +273,16 @@ class Vote {
   async deleteVotes() {
     let voteHandler = this;
     let votes = await this.updatesVotes();
-    for (vote of votes) {
+    for (let vote of votes) {
       await voteHandler.VoteModel.deleteVote(vote.ID);
     }
-    await voteHandler.VoteModel.refreshVotes();
-    await voteHandler.loadVotes();
+    this.refreshParent();
+  }
+
+  async refreshParent() {
+    await this.VoteModel.refreshVotes();
+    await this.loadVotes();
+    await this.DeskRoundModel.refreshDeskRounds();
+    await this.parent.refreshVotes();
   }
 }

web/style.css

@@ -110,6 +110,10 @@ select {
   flex-basis: 70%;
 }
 
+#vote-section .level-left {
+  flex-basis: content;
+}
+
 #round-desks,
 #candidate-lists {
   height: 35vh;