diff --git a/web/components/visualization/results-section.js b/web/components/visualization/results-section.js index cbe67306df5580fb0b4b93ac6203dc032177fd69..d11babdc97edbcc72c6f04c9bac0e588390c085f 100644 --- a/web/components/visualization/results-section.js +++ b/web/components/visualization/results-section.js @@ -3,6 +3,7 @@ import * as Auth from "/services/auth/auth.js"; import * as results from "/services/election/calculate-election-generic.js"; import * as PartyModel from "/services/model/party-model.js"; import * as CandidateListModel from "/services/model/candidateList-model.js"; +import * as AreaModel from "/services/model/area-model.js"; import * as Scroller from "/services/common/scroller.js"; export async function mount(where, round) { @@ -15,11 +16,13 @@ class ResultComponent { this.round = round; this.PartyModel = PartyModel.getPartyModel(); this.CandidateListModel = CandidateListModel.getCandidateListModel(); + this.AreaModel = AreaModel.getAreaModel(); } async mount(where) { this.PartyModel.current_user = await Auth.GetUser(); this.CandidateListModel.current_user = await Auth.GetUser(); + this.AreaModel.current_user = await Auth.GetUser(); const mountpoint = where; document.getElementById(mountpoint).innerHTML = /* HTML */ ` <div class="tabs is-boxed is-toggle is-fullwidth"> @@ -120,13 +123,27 @@ class ResultComponent { } resultFlowTemplate(zone) { - return /* HTML */ `<div class="card-list card-no-hover"> + let html = document.createElement("div"); + html.classList = "card-list card-no-hover"; + html.innerHTML = /* HTML */ ` <div class="card-content"> <div id="flow-content-${zone.ID}" class="content"> <h5 class="title is-5">${zone.Name}</h5> </div> </div> - </div>`; + `; + html.addEventListener("click", async () => { + if (this.zone == "sections") { + let area = await this.AreaModel.getArea(zone.AreaID); + this.refreshSections(area); + document.getElementById("select-sections").value = zone.ID; + document.getElementById("select-areas").value = zone.AreaID; + } else { + document.getElementById("select-areas").value = zone.ID; + } + this.displayZoneResults(zone); + }); + return html; } progressBarTemplate(candidateList, color, electedsNumber) { @@ -312,9 +329,9 @@ class ResultComponent { for (let j in this.results.areasResults) { let area = this.results.areasResults[j]; if (area.status === this.filter) { - document.getElementById( - "news-flow" - ).innerHTML += this.resultFlowTemplate(area); + document + .getElementById("news-flow") + .appendChild(this.resultFlowTemplate(area)); for (let i in area.candidateLists) { let party = await this.PartyModel.getParty( @@ -344,9 +361,9 @@ class ResultComponent { for (let j in sections) { let section = sections[j]; if (section.status === this.filter) { - document.getElementById( - "news-flow" - ).innerHTML += this.resultFlowTemplate(section); + document + .getElementById("news-flow") + .appendChild(this.resultFlowTemplate(section)); for (let i in section.candidateLists) { let party = await this.PartyModel.getParty(