From 4b6827a967bbb28921d9cb37b4f66d1c560f6a7c Mon Sep 17 00:00:00 2001
From: Alexis POYEN <apoyen@grandlyon.com>
Date: Tue, 9 Jun 2020 17:06:37 +0200
Subject: [PATCH] Resolve "Display the list of areas"
---
web/components/management/candidate-lists.js | 69 ++++++++++++++++++--
web/components/management/round-desks.js | 1 -
web/components/management/rounds-card.js | 7 +-
web/services/model/round-model.js | 5 +-
web/style.css | 6 +-
5 files changed, 75 insertions(+), 13 deletions(-)
diff --git a/web/components/management/candidate-lists.js b/web/components/management/candidate-lists.js
index 533831d..5c9bab1 100644
--- a/web/components/management/candidate-lists.js
+++ b/web/components/management/candidate-lists.js
@@ -1,5 +1,6 @@
// Imports
import * as Auth from "/services/auth/auth.js";
+import * as AreaModel from "/services/model/area-model.js";
// DOM elements
@@ -16,14 +17,16 @@ class CandidateList {
constructor(parent) {
this.method = null;
this.parent = parent;
+ this.AreaModel = AreaModel.getAreaModel();
}
async mount(where) {
+ this.AreaModel.current_user = await Auth.GetUser();
const mountpoint = where;
document.getElementById(mountpoint).innerHTML = /* HTML */ `
<header class="card-header">
<p class="card-header-title">
- Liste des candidats
+ Liste des candidats par circonscription
</p>
<button id="candidate-list-new" class="button is-success" disabled>
<span class="icon is-small">
@@ -31,12 +34,68 @@ class CandidateList {
</span>
</button>
</header>
- <div class="card-content">
- <div id="candidate-lists-list" class="content">
- Liste des listes de candidats
+ <div class="columns card-content">
+ <div class="column">
+ <div id="areas-round"></div>
+ </div>
+ <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>
</div>
- </div>
`;
current_user = await Auth.GetUser();
}
+
+ areaTemplate(area) {
+ return /* HTML */ `<div class="card card-list">
+ <div id="areas-area-${area.ID}" class="card-content">
+ <div class="content">
+ <nav class="level">
+ <div class="level-left">
+ ${area.Name} (Nombre de siège : ${area.SeatNumber})
+ </div>
+ </nav>
+ </div>
+ </div>
+ </div>`;
+ }
+
+ async displayAreas() {
+ let candidateListHandler = this;
+ let areas = await this.updateAreas();
+ const markup = areas.map((area) => this.areaTemplate(area)).join("");
+ document.getElementById("areas-round").innerHTML = markup;
+
+ areas.map((area) => {
+ document
+ .getElementById(`areas-area-${area.ID}`)
+ .addEventListener("click", async function () {
+ await candidateListHandler.activateArea(area);
+ candidateListHandler.area = area;
+ await candidateListHandler.displayCandidateLists();
+ });
+ });
+ }
+
+ async updateAreas() {
+ let candidateListHandler = this;
+ let areas = await this.AreaModel.getAreas();
+ return areas.filter(function (area) {
+ return area.ElectionID == candidateListHandler.round.ElectionID;
+ });
+ }
+
+ async activateArea(){
+
+ }
+
+ async displayCandidateLists(){
+
+ }
}
diff --git a/web/components/management/round-desks.js b/web/components/management/round-desks.js
index 17d2ae6..cf36d2b 100644
--- a/web/components/management/round-desks.js
+++ b/web/components/management/round-desks.js
@@ -55,7 +55,6 @@ class RoundDesk {
handleDom() {
let roundHandler = this;
document.getElementById(`round-new`).addEventListener("click", function () {
- roundHandler.newRound();
});
document
diff --git a/web/components/management/rounds-card.js b/web/components/management/rounds-card.js
index e3a1c4c..06d2b9a 100644
--- a/web/components/management/rounds-card.js
+++ b/web/components/management/rounds-card.js
@@ -177,6 +177,8 @@ class Round {
.getElementById("candidate-list-new")
.setAttribute("disabled", "true");
// TODO open candidate list
+ roundHandler.parent.candidateListHandler.round = round;
+ roundHandler.parent.candidateListHandler.displayAreas();
});
});
}
@@ -252,9 +254,10 @@ class Round {
if (this.method == "POST")
document.getElementById("round-modal-id").value = null;
- let round = this.RoundModel.saveRound(
+ let round = await this.RoundModel.saveRound(
this.method,
parseInt(document.getElementById("round-modal-id").value),
+ parseInt(document.getElementById("round-modal-election-id").value),
document.getElementById("round-modal-date").value,
parseInt(document.getElementById("round-modal-round").value)
);
@@ -267,7 +270,7 @@ class Round {
}
async deleteRound(round) {
- await this.RoundModel.deleteRound(round.ID)
+ await this.RoundModel.deleteRound(round.ID);
await this.displayRounds();
// TODO empty desks
// TODO empty candidateLists
diff --git a/web/services/model/round-model.js b/web/services/model/round-model.js
index c82872c..295b1bc 100644
--- a/web/services/model/round-model.js
+++ b/web/services/model/round-model.js
@@ -51,7 +51,7 @@ class RoundModel {
{
method: method,
headers: new Headers({
- "XSRF-Token": current_user.xsrftoken,
+ "XSRF-Token": this.current_user.xsrftoken,
}),
body: JSON.stringify({
ID: ID,
@@ -75,7 +75,7 @@ class RoundModel {
}
}
- async deleteRounds(ID) {
+ async deleteRound(ID) {
try {
const response = await fetch("/api/Round/" + ID, {
method: "delete",
@@ -92,6 +92,7 @@ class RoundModel {
Messages.Show("is-warning", e.message);
console.error(e);
}
+ this.refreshRounds();
}
async refreshRounds() {
diff --git a/web/style.css b/web/style.css
index b75e094..4637e91 100644
--- a/web/style.css
+++ b/web/style.css
@@ -110,15 +110,15 @@ select {
flex-basis: 70%;
}
-#round-desks {
+#round-desks, #candidate-lists {
height: 35vh;
}
-#round-desks .column {
+#round-desks .column, #candidate-lists .column {
overflow-y: auto;
}
-#round-desks .columns {
+#round-desks .columns, #candidate-lists .columns {
max-height: 90%;
}
--
GitLab