diff --git a/data/test.db b/data/test.db index 04150ffcc3b3ba1f7d353fbfafed5b5e9bf1005a..e9c2917732374424b4ed0679bdf3eb24f951af23 100644 Binary files a/data/test.db and b/data/test.db differ diff --git a/web/components/management/candidate-lists.js b/web/components/management/candidate-lists.js index 1b0dd463de2604316a16ec10f9bfd09603c26821..81fbfd7521a0f410a567ce1f06d043a2f6c14928 100644 --- a/web/components/management/candidate-lists.js +++ b/web/components/management/candidate-lists.js @@ -34,7 +34,7 @@ class CandidateList { const mountpoint = where; document.getElementById(mountpoint).innerHTML = /* HTML */ ` <header class="card-header"> - <p class="card-header-title"> + <p id="candidate-list-title" class="card-header-title"> Liste des candidats par circonscription </p> <button id="candidate-list-new" class="button is-success" disabled> @@ -359,10 +359,13 @@ class CandidateList { document .getElementById(`areas-area-${area.ID}`) .addEventListener("click", async function () { + candidateListHandler.emptyCandidateList(); await candidateListHandler.activateArea(area); await candidateListHandler.displayCandidateLists(); }); }); + + this.emptyCandidateList(); } async updateAreas() { @@ -396,8 +399,11 @@ class CandidateList { .classList.remove("active-card"); }); document - .getElementById(`candidateLists-candidateList-${candidateListToActivate.ID}`) + .getElementById( + `candidateLists-candidateList-${candidateListToActivate.ID}` + ) .classList.add("active-card"); + this.displayCandidates(); } async displayCandidateLists() { @@ -440,7 +446,10 @@ class CandidateList { let candidateListHandler = this; let candidateLists = await this.CandidateListModel.getCandidateLists(); return candidateLists.filter(function (candidateList) { - return candidateList.AreaID == candidateListHandler.area.ID; + return ( + candidateList.AreaID == candidateListHandler.area.ID && + candidateList.RoundID == candidateListHandler.round.ID + ); }); } @@ -539,4 +548,11 @@ class CandidateList { await this.CandidateModel.deleteCandidate(candidate.ID); await this.displayCandidates(); } + + emptyCandidateList() { + this.area = null; + document.getElementById("candidate-lists-list").innerHTML = ""; + this.candidateList = null; + document.getElementById("candidate-list").innerHTML = ""; + } } diff --git a/web/components/management/round-desks.js b/web/components/management/round-desks.js index cf36d2b021f9c2afe3bd59510c8323e957400f05..b365d73c35ebcd520ec5c91d152ed53919d03de7 100644 --- a/web/components/management/round-desks.js +++ b/web/components/management/round-desks.js @@ -29,7 +29,7 @@ class RoundDesk { const mountpoint = where; document.getElementById(mountpoint).innerHTML = /* HTML */ ` <header class="card-header"> - <p class="card-header-title"> + <p id="desk-round-title" class="card-header-title"> Bureaux de votes </p> </header> @@ -40,11 +40,8 @@ class RoundDesk { <div class="column"> <div id="desk-round-details"></div> </div> - <div class="column"> - <div id="active-capturer" class="card"></div> - </div> - <div class="column"> - <div id="available-capturer" class="card"></div> + <div class="column is-half"> + <div id="vote-list" class="card"></div> </div> </div> `; @@ -54,8 +51,9 @@ class RoundDesk { handleDom() { let roundHandler = this; - document.getElementById(`round-new`).addEventListener("click", function () { - }); + document + .getElementById(`round-new`) + .addEventListener("click", function () {}); document .getElementById(`capturers-modal-close`) @@ -202,6 +200,7 @@ class RoundDesk { document.getElementById("desk-rounds").innerHTML = markup; let deskRoundHandler = this; + deskRoundHandler.emptyDesksDetails(); deskRounds.map(async (deskRound) => { let desk = await this.DeskModel.getDesk(deskRound.DeskID); document.getElementById( @@ -325,4 +324,10 @@ class RoundDesk { }); }); } + + emptyDesksDetails() { + this.desk = null; + document.getElementById("desk-round-details").innerHTML = ""; + document.getElementById("vote-list").innerHTML = ""; + } } diff --git a/web/components/management/round.js b/web/components/management/round.js index ce7429d06880102d7a7fd7898a641341151f12a9..d6941c26f9bf913bffa16ee60bd1b2bd481a6e14 100644 --- a/web/components/management/round.js +++ b/web/components/management/round.js @@ -18,16 +18,16 @@ class Round { const mountpoint = where; document.getElementById(mountpoint).innerHTML = /* HTML */ ` <div class="columns"> - <div class="column is-one-quarter"> + <div class="column is-full"> <div id="rounds-list" class="card"> Liste des tours </div> </div> - <div class="column"> + <div class="column" style="padding-right:40px;"> <div id="round-desks" class="card card-list"> Liste des bureaux d'un tour </div> - <div id="candidate-lists" class="card card-list"> + <div id="candidate-lists" class="card card-list" "> Liste des listes de candidats d'un tour </div> </div> diff --git a/web/components/management/rounds-card.js b/web/components/management/rounds-card.js index 7793ccac54a7fe5a6b50eb1f380fa850abdbfc95..35b07cf92f2a0e536fb0b744eb2219d3b7653af0 100644 --- a/web/components/management/rounds-card.js +++ b/web/components/management/rounds-card.js @@ -169,10 +169,6 @@ class Round { .getElementById(`rounds-round-${round.ID}`) .addEventListener("click", async function () { roundHandler.activateRound(round); - roundHandler.parent.deskRoundsHandler.round = round; - await roundHandler.parent.deskRoundsHandler.displayDesks(); - roundHandler.parent.candidateListHandler.round = round; - roundHandler.parent.candidateListHandler.displayAreas(); }); }); } @@ -213,23 +209,30 @@ class Round { } async activateRound(roundToActivate) { - document - .getElementById("candidate-list-new") - .setAttribute("disabled", "true"); - let rounds = await this.RoundModel.getRounds(); - rounds.forEach((round) => { - document - .getElementById(`rounds-round-${round.ID}`) - .classList.remove("active-card"); - }); - document - .getElementById(`rounds-round-${roundToActivate.ID}`) - .classList.add("active-card"); - // TODO unselect candidateLists - document.getElementById("rounds-list").setAttribute("hidden", "true"); - document.getElementById("rounds-list").parentElement.className = "column"; - document.getElementById("candidate-lists").parentElement.className = - "column is-full"; + let election = await this.ElectionModel.getElection( + roundToActivate.ElectionID + ); + document.getElementById("candidate-list-title").innerHTML = + "Liste des candidats par circonscription (" + + election.Name + + ", tour : " + + roundToActivate.Round + + ", date : " + + new Date(roundToActivate.Date).toLocaleDateString() + + ")"; + document.getElementById("desk-round-title").innerHTML = + "Bureaux de votes (" + + election.Name + + ", tour : " + + roundToActivate.Round + + ", date : " + + new Date(roundToActivate.Date).toLocaleDateString() + + ")"; + this.parent.deskRoundsHandler.round = roundToActivate; + await this.parent.deskRoundsHandler.displayDesks(); + this.parent.candidateListHandler.round = roundToActivate; + await this.parent.candidateListHandler.displayAreas(); + this.hideRounds(); } async newRound() { @@ -281,4 +284,25 @@ class Round { .getElementById("candidate-list-new") .setAttribute("disabled", "true"); } + + hideRounds() { + let roundsHandler = this; + document.getElementById("rounds-list").innerHTML = + '<p id="display-rounds">Afficher la liste des tours</p>'; + document.getElementById("rounds-list").className = "upper-text"; + document.getElementById("rounds-list").parentElement.className = + "column upper-text"; + document.getElementById("candidate-lists").parentElement.className = + "column is-full"; + document + .getElementById("display-rounds") + .addEventListener("click", async function () { + await roundsHandler.mount("rounds-list"); + document.getElementById("rounds-list").className = "card"; + document.getElementById("rounds-list").parentElement.className = + "column is-full"; + document.getElementById("candidate-lists").parentElement.className = + "column"; + }); + } } diff --git a/web/style.css b/web/style.css index 4637e916fd8157c49a34cb3904ed49e3f262b344..19ec053d72a4c272b0bf91348e241ab49ee47488 100644 --- a/web/style.css +++ b/web/style.css @@ -110,22 +110,32 @@ select { flex-basis: 70%; } -#round-desks, #candidate-lists { +#round-desks, +#candidate-lists { height: 35vh; } -#round-desks .column, #candidate-lists .column { +#round-desks .column, +#candidate-lists .column { overflow-y: auto; } -#round-desks .columns, #candidate-lists .columns { +#round-desks .columns, +#candidate-lists .columns { max-height: 90%; } -.card-header-success{ - background-color: rgba(127,186,0,.95); +.card-header-success { + background-color: rgba(127, 186, 0, 0.95); } -.card-header-danger{ - background-color: rgba(242,80,34,.95); -} \ No newline at end of file +.card-header-danger { + background-color: rgba(242, 80, 34, 0.95); +} + +.upper-text { + writing-mode: sideways-lr; + background-color: rgba(55,122,195,.95); + text-orientation: sideways-right; + text-align: center; +}