Feat : breadcrumb to display deskRound captured

web/components/vote/votes.js

 // Imports
 import * as Auth from "/services/auth/auth.js";
+import * as ElectionModel from "/services/model/election-model.js";
+import * as RoundModel from "/services/model/round-model.js";
+import * as AreaModel from "/services/model/area-model.js";
+import * as SectionModel from "/services/model/section-model.js";
+import * as DeskModel from "/services/model/desk-model.js";
+import * as DeskRoundModel from "/services/model/deskRound-model.js";
 
 export async function mount(parent) {
   const voteComponent = new Vote(parent);
@@ -10,34 +16,84 @@ class Vote {
   constructor(parent) {
     this.method = null;
     this.parent = parent;
+    this.ElectionModel = ElectionModel.getElectionModel();
+    this.RoundModel = RoundModel.getRoundModel();
+    this.AreaModel = AreaModel.getAreaModel();
+    this.SectionModel = SectionModel.getSectionModel();
+    this.DeskModel = DeskModel.getDeskModel();
+    this.DeskRoundModel = DeskRoundModel.getDeskRoundModel();
   }
 
   async displayVotes(RoundID, AreaID, DeskRoundID) {
+    this.ElectionModel.current_user = await Auth.GetUser();
+    this.RoundModel.current_user = await Auth.GetUser();
+    this.AreaModel.current_user = await Auth.GetUser();
+    this.SectionModel.current_user = await Auth.GetUser();
+    this.DeskModel.current_user = await Auth.GetUser();
+    this.DeskRoundModel.current_user = await Auth.GetUser();
+
+    this.RoundID = RoundID;
+    this.AreaID = AreaID;
+    this.DeskRoundID = DeskRoundID;
+
     document.getElementById("vote-section").innerHTML = /* HTML */ `
       <header class="card-header">
-        <p class="card-header-title">
-          Votes
+      <p >
+        <nav class="breadcrumb card-header-title"  aria-label="breadcrumbs">
+          <ul id="vote-breadcrumb"></ul>
+        </nav>
         </p>
       </header>
       <div id="votes-tables" class="card-content"></div>
-        <nav class="level">
-          <div class="level-left"></div>
-          <div class="level-right">
-            <button id="votes-return" class="button is-danger level-item">
-              Retour
-            </button>
-            <button id="votes-cancel" class="button level-item">
-              Annuler
-            </button>
-            <button id="votes-save" class="button is-success level-item">
-              Sauvegarder
-            </button>
-          </div>
-        </nav>
+      <nav class="level">
+        <div class="level-left"></div>
+        <div class="level-right">
+          <button id="votes-return" class="button is-danger level-item">
+            Retour
+          </button>
+          <button id="votes-cancel" class="button level-item">
+            Annuler
+          </button>
+          <button id="votes-save" class="button is-success level-item">
+            Sauvegarder
+          </button>
+        </div>
+      </nav>
     `;
     this.handleDom();
-    await this.loadElection();
+
+    await this.refreshBreadCrumb();
   }
 
   handleDom() {}
+  async refreshBreadCrumb() {
+    let round = await this.RoundModel.getRound(this.RoundID);
+    let election = await this.ElectionModel.getElection(round.ElectionID);
+    let area = await this.AreaModel.getArea(this.AreaID);
+    let deskRound = await this.DeskRoundModel.getDeskRound(this.DeskRoundID);
+    let desk = await this.DeskModel.getDesk(deskRound.DeskID);
+    let section = await this.SectionModel.getSection(desk.SectionID);
+
+    let breadcrumb = document.getElementById("vote-breadcrumb");
+    let el = document.createElement("li");
+    el.innerHTML = "<a>" + election.Name + "</a>";
+    breadcrumb.appendChild(el);
+    el = document.createElement("li");
+    el.innerHTML =
+      "<a>tour : " +
+      round.Round +
+      ", date : " +
+      new Date(round.Date).toLocaleDateString() +
+      "</a>";
+    breadcrumb.appendChild(el);
+    el = document.createElement("li");
+    el.innerHTML = "<a>" + area.Name + "</a>";
+    breadcrumb.appendChild(el);
+    el = document.createElement("li");
+    el.innerHTML = "<a>" + section.Name + "</a>";
+    breadcrumb.appendChild(el);
+    el = document.createElement("li");
+    el.innerHTML = "<a>" + desk.Name + "</a>";
+    breadcrumb.appendChild(el);
+  }
 }

web/style.css

@@ -135,8 +135,13 @@ select {
 
 .upper-text {
   writing-mode: sideways-lr;
-  background-color: rgba(55,122,195,.95);
+  background-color: rgba(55, 122, 195, 0.95);
   text-orientation: sideways-right;
   text-align: center;
   cursor: pointer;
 }
+
+#vote-breadcrumb a {
+  color: #000;
+  cursor: default;
+}