$
This commit is contained in:
pro.boooooo
parent
a6321f54f5
commit
704825fac6
@ -88,6 +88,8 @@ export default class Controller {
|
||||
this.view.renderStat(await data)
|
||||
this.view.renderEtab(await data, `${ this.model.getPath()[1] } - ${ this.model.getPath()[2] }`)
|
||||
this.view.renderPath(this.model.getPath())
|
||||
|
||||
this.model.getMapLink().then((res) => this.view.renderMap(res))
|
||||
} else {
|
||||
log("Selector->Controller", "Numero de page inconnue")
|
||||
}
|
||||
|
||||
@ -2,9 +2,12 @@ import log from "./log"
|
||||
|
||||
export default class Model {
|
||||
constructor() {
|
||||
localStorage.clear()
|
||||
|
||||
this.state = {
|
||||
api: {
|
||||
link: "https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&lang=fr&sort=tri",
|
||||
maplink: "https://data.enseignementsup-recherche.gouv.fr/explore/embed/dataset/fr-esr-parcoursup/map/?timezone=Europe%2FBerlin&sort=tri",
|
||||
facet: {
|
||||
filiaire: "fili",
|
||||
formation: "form_lib_voe_acc",
|
||||
@ -122,6 +125,10 @@ export default class Model {
|
||||
.then((res) => res.json())
|
||||
.then((data) => {
|
||||
if(data) {
|
||||
data.facet_groups[0].facets.forEach((e) => {
|
||||
e.canDisplay = true
|
||||
})
|
||||
|
||||
localStorage.setItem(`sec0`, JSON.stringify(data.facet_groups[0].facets))
|
||||
return data.facet_groups[0].facets
|
||||
} else {
|
||||
@ -151,6 +158,10 @@ export default class Model {
|
||||
.then((res) => res.json())
|
||||
.then((data) => {
|
||||
if(data) {
|
||||
data.facet_groups[1].facets.forEach((e) => {
|
||||
e.canDisplay = true
|
||||
})
|
||||
|
||||
localStorage.setItem(`sec1-${this.state.page.cat}`, JSON.stringify(data.facet_groups[1].facets))
|
||||
return data.facet_groups[1].facets
|
||||
} else {
|
||||
@ -171,18 +182,33 @@ export default class Model {
|
||||
* */
|
||||
getModelData2() {
|
||||
if(!localStorage.getItem(`sec2-${this.state.page.cat}-${this.state.page.scat}`)) {
|
||||
const link = `${this.state.api.link}&rows=0` +
|
||||
let link = `${this.state.api.link}&rows=0` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.filiaire)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.formation)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.spec)}` +
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.filiaire)}=${encodeURIComponent(this.state.page.cat)}` +
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.formation)}=${encodeURIComponent(this.state.page.scat)}`
|
||||
|
||||
/**
|
||||
* TODO: (Bilal prends la responsabilite de ce massacre)
|
||||
* */
|
||||
if(this.state.page.scat === "Formations des écoles d'ingénieurs") {
|
||||
link = `${this.state.api.link}&rows=0` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.filiaire)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.formation)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.spec)}` +
|
||||
`&refine.fili=Ecole%20d%27Ingénieur&refine.form_lib_voe_acc=Formations%20%20des%20écoles%20d%27ingénieurs`
|
||||
}
|
||||
|
||||
return fetch(link)
|
||||
.then((res) => res.json())
|
||||
.then((data) => {
|
||||
try {
|
||||
if(data) {
|
||||
data.facet_groups[2].facets.forEach((e) => {
|
||||
e.canDisplay = true
|
||||
})
|
||||
|
||||
localStorage.setItem(`sec2-${this.state.page.cat}-${this.state.page.scat}`, JSON.stringify(data.facet_groups[2].facets))
|
||||
return data.facet_groups[2].facets
|
||||
}
|
||||
@ -204,7 +230,7 @@ export default class Model {
|
||||
if(!localStorage.getItem(`sec-etab-${this.state.page.cat}-${this.state.page.scat}-${this.state.page.tcat}`) ||
|
||||
localStorage.getItem(`sec-etab-${this.state.page.cat}-${this.state.page.scat}-${this.state.page.tcat}`) === "[]"
|
||||
) {
|
||||
const link = `${this.state.api.link}&rows=10000` +
|
||||
let link = `${this.state.api.link}&rows=10000` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.filiaire)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.formation)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.spec)}` +
|
||||
@ -212,6 +238,15 @@ export default class Model {
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.formation)}=${encodeURIComponent(this.state.page.scat)}` +
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.spec)}=${encodeURIComponent(this.state.page.tcat)}`
|
||||
|
||||
/**
|
||||
* TODO: (Bilal prends la responsabilite de ce massacre)
|
||||
* */
|
||||
if(this.state.page.tcat === "Formation d'ingénieur Bac + 5") {
|
||||
link = `https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&lang=fr&sort=tri&rows=10000&facet=fili&facet=form_lib_voe_acc&facet=fil_lib_voe_acc&refine.fili=Ecole%20d%27Ing%C3%A9nieur&refine.form_lib_voe_acc=Formations%20%20des%20%C3%A9coles%20d%27ing%C3%A9nieurs&refine.fil_lib_voe_acc=Formation%20d%27ing%C3%A9nieur%20Bac%20%2B%205`
|
||||
} else if(this.state.page.tcat === "Formation Bac + 3") {
|
||||
link = `https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&lang=fr&sort=tri&rows=10000&facet=fili&facet=form_lib_voe_acc&facet=fil_lib_voe_acc&refine.fili=Ecole%20d%27Ing%C3%A9nieur&refine.form_lib_voe_acc=Formations%20%20des%20%C3%A9coles%20d%27ing%C3%A9nieurs&refine.fil_lib_voe_acc=Formation%20Bac%20%2B%203`
|
||||
}
|
||||
|
||||
return fetch(link)
|
||||
.then((res) => {
|
||||
return res.json()
|
||||
@ -219,11 +254,14 @@ export default class Model {
|
||||
.then((data) => {
|
||||
try {
|
||||
if(data) {
|
||||
data.records.forEach((e) => {
|
||||
e.canDisplay = true
|
||||
})
|
||||
|
||||
if(this.state.page.tcat) {
|
||||
localStorage.setItem(`sec-etab-${this.state.page.cat}-${this.state.page.scat}-${this.state.page.tcat}`, JSON.stringify(data.records))
|
||||
}
|
||||
|
||||
this.state.page.tcat = null
|
||||
return data.records
|
||||
}
|
||||
} catch(donothing) {}
|
||||
@ -237,4 +275,23 @@ export default class Model {
|
||||
console.error(e)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Recuperer le lien vers la map
|
||||
* @return { promise } Le lien de la map
|
||||
* */
|
||||
getMapLink() {
|
||||
const link = `${this.state.api.maplink}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.filiaire)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.formation)}` +
|
||||
`&facet=${encodeURIComponent(this.state.api.facet.spec)}` +
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.filiaire)}=${encodeURIComponent(this.state.page.cat)}` +
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.formation)}=${encodeURIComponent(this.state.page.scat)}` +
|
||||
`&refine.${encodeURIComponent(this.state.api.facet.spec)}=${encodeURIComponent(this.state.page.tcat)}` +
|
||||
`&location=6,48.04137,1.74683&basemap=e69ab1`
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
resolve(link)
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -12,10 +12,23 @@ export default class View {
|
||||
this.home = document.getElementById("home")
|
||||
this.left = document.getElementById("left")
|
||||
this.right = document.getElementById("right")
|
||||
this.input = document.getElementById("selector-list-input-search")
|
||||
this.inputEtab = document.getElementById("etablanalytics-search")
|
||||
this.map = document.getElementById("etablanalytics-map-container")
|
||||
|
||||
this.titleStorage = null
|
||||
this.dataStorage = null
|
||||
this.antispam = null
|
||||
this.inAction = false
|
||||
|
||||
this.input.addEventListener("input", (e) => {
|
||||
this.filterMenu(e.target.value)
|
||||
})
|
||||
|
||||
this.inputEtab.addEventListener("input", (e) => {
|
||||
this.filterEtab(e.target.value)
|
||||
})
|
||||
|
||||
this.btn.onclick = () => {
|
||||
this.updateMenu(" ", "previous")
|
||||
}
|
||||
@ -23,6 +36,29 @@ export default class View {
|
||||
log("Selector", "View 1/3")
|
||||
}
|
||||
|
||||
/**
|
||||
* Utile pour filtrer le tableau de resultat qui concerne le menu
|
||||
* @param { string } filter La saisie dans le input
|
||||
* */
|
||||
filterMenu(filter) {
|
||||
this.dataStorage.forEach((e) => {
|
||||
e.canDisplay = e.name.toLowerCase().includes(filter.toLowerCase());
|
||||
})
|
||||
|
||||
this.renderMenu(this.titleStorage, this.dataStorage)
|
||||
}
|
||||
|
||||
/**
|
||||
* Utile pour filtrer le tableau de resultat qui concerne les etablissements
|
||||
* */
|
||||
filterEtab(filter) {
|
||||
this.dataStorage.forEach((e) => {
|
||||
e.canDisplay = e.fields.g_ea_lib_vx.toLowerCase().includes(filter.toLowerCase());
|
||||
})
|
||||
|
||||
this.renderEtab(this.dataStorage, this.formStorage)
|
||||
}
|
||||
|
||||
/**
|
||||
* Contruction de la balise <li> qui vas se loger dans le menu.
|
||||
* Si l'utilisateur spam clique, ca annule l'action (ce qui peut empecher les crashs)
|
||||
@ -33,9 +69,13 @@ export default class View {
|
||||
this.title.innerText = title
|
||||
this.zone.innerHTML = ""
|
||||
|
||||
this.dataStorage = data
|
||||
this.titleStorage = title
|
||||
|
||||
if(title || data) {
|
||||
data.forEach((e) => {
|
||||
let elem = document.createElement("selectorfragment")
|
||||
|
||||
elem.onclick = () => {
|
||||
if(this.antispam === null) {
|
||||
this.antispam = setTimeout(() => {
|
||||
@ -52,7 +92,8 @@ export default class View {
|
||||
riot.mount(elem, {
|
||||
name: e.name,
|
||||
count: e.count,
|
||||
idd: `menu0-${e.name}`
|
||||
idd: `menu0-${e.name}`,
|
||||
display: e.canDisplay
|
||||
}, "selectorfragment")
|
||||
|
||||
this.zone.appendChild(elem)
|
||||
@ -87,6 +128,9 @@ export default class View {
|
||||
* @param { string } form
|
||||
* */
|
||||
renderEtab(data, form) {
|
||||
this.formStorage = form
|
||||
this.dataStorage = data
|
||||
|
||||
this.etab.innerHTML =
|
||||
"<tbody>" +
|
||||
" <th>Nom</th>" +
|
||||
@ -97,123 +141,141 @@ export default class View {
|
||||
"</tbody>"
|
||||
|
||||
data.forEach((e) => {
|
||||
let etab = e.fields.g_ea_lib_vx
|
||||
let dept = `${e.fields.dep_lib} (${e.fields.dep})`
|
||||
let city = e.fields.ville_etab
|
||||
let moy = "?"
|
||||
let selection = e.fields.taux_acces_ens
|
||||
let acad = e.fields.acad_mies
|
||||
let type = e.fields.contrat_etab
|
||||
let capacity = e.fields.capa_fin
|
||||
let admishorsacad = e.fields.pct_aca_orig
|
||||
let voeuxtotal = e.fields.voe_tot
|
||||
if(e.canDisplay) {
|
||||
let etab = e.fields.g_ea_lib_vx
|
||||
let dept = `${e.fields.dep_lib} (${e.fields.dep})`
|
||||
let city = e.fields.ville_etab
|
||||
let moy = "?"
|
||||
let selection = e.fields.taux_acces_ens
|
||||
let acad = e.fields.acad_mies
|
||||
let type = e.fields.contrat_etab
|
||||
let capacity = e.fields.capa_fin
|
||||
let admishorsacad = e.fields.pct_aca_orig
|
||||
let voeuxtotal = e.fields.voe_tot
|
||||
|
||||
let woman = `${ Math.round(100 * e.fields.acc_tot_f / e.fields.acc_tot) }%`
|
||||
let man = `${ Math.round(100 * (e.fields.acc_tot - e.fields.acc_tot_f) / e.fields.acc_tot) }%`
|
||||
let woman = `${ Math.round(100 * e.fields.acc_tot_f / e.fields.acc_tot) }%`
|
||||
let man = `${ Math.round(100 * (e.fields.acc_tot - e.fields.acc_tot_f) / e.fields.acc_tot) }%`
|
||||
|
||||
let totbac = Math.round(e.fields.acc_bg + e.fields.acc_bp + e.fields.acc_bt + e.fields.acc_at)
|
||||
let gen = `${ Math.round(100 * e.fields.acc_bg / totbac) }%`
|
||||
let pro = `${ Math.round(100 * e.fields.acc_bp / totbac) }%`
|
||||
let tech = `${ Math.round(100 * e.fields.acc_bt / totbac) }%`
|
||||
let autre = `${ Math.round(100 * e.fields.acc_at / totbac) }%`
|
||||
let totbac = Math.round(e.fields.acc_bg + e.fields.acc_bp + e.fields.acc_bt + e.fields.acc_at)
|
||||
let gen = `${ Math.round(100 * e.fields.acc_bg / totbac) }%`
|
||||
let pro = `${ Math.round(100 * e.fields.acc_bp / totbac) }%`
|
||||
let tech = `${ Math.round(100 * e.fields.acc_bt / totbac) }%`
|
||||
let autre = `${ Math.round(100 * e.fields.acc_at / totbac) }%`
|
||||
|
||||
let tot = e.fields.acc_sansmention + e.fields.acc_ab + e.fields.acc_b + e.fields.acc_tb + e.fields.acc_tbf
|
||||
let p = `${ Math.round(100 * e.fields.acc_sansmention / tot) }%`
|
||||
let ab = `${ Math.round(100 * e.fields.acc_ab / tot) }%`
|
||||
let b = `${ Math.round(100 * e.fields.acc_b / tot) }%`
|
||||
let tb = `${ Math.round(100 * e.fields.acc_tb / tot) }%`
|
||||
let tbf = `${ Math.round(100 * e.fields.acc_tbf / tot) }%`
|
||||
let tot = e.fields.acc_sansmention + e.fields.acc_ab + e.fields.acc_b + e.fields.acc_tb + e.fields.acc_tbf
|
||||
let p = `${ Math.round(100 * e.fields.acc_sansmention / tot) }%`
|
||||
let ab = `${ Math.round(100 * e.fields.acc_ab / tot) }%`
|
||||
let b = `${ Math.round(100 * e.fields.acc_b / tot) }%`
|
||||
let tb = `${ Math.round(100 * e.fields.acc_tb / tot) }%`
|
||||
let tbf = `${ Math.round(100 * e.fields.acc_tbf / tot) }%`
|
||||
|
||||
/**
|
||||
* TODO: Transformer ca en composant riot (GALERE MAX pour faire des <tr><etablanalyticsfragment/></tr>)
|
||||
* */
|
||||
let tr = document.createElement("tr")
|
||||
/**
|
||||
* TODO: Transformer ca en composant riot (GALERE MAX pour faire des <tr><etablanalyticsfragment/></tr>)
|
||||
* */
|
||||
let tr = document.createElement("tr")
|
||||
|
||||
let td1 = document.createElement("td")
|
||||
td1.innerText = etab
|
||||
let td1 = document.createElement("td")
|
||||
td1.innerText = etab
|
||||
|
||||
let td2 = document.createElement("td")
|
||||
td2.innerText = city
|
||||
let td2 = document.createElement("td")
|
||||
td2.innerText = city
|
||||
|
||||
let td3 = document.createElement("td")
|
||||
td3.innerText = dept
|
||||
let td3 = document.createElement("td")
|
||||
td3.innerText = dept
|
||||
|
||||
let td4 = document.createElement("td")
|
||||
td4.innerText = moy
|
||||
let td4 = document.createElement("td")
|
||||
td4.innerText = moy
|
||||
|
||||
let td5 = document.createElement("td")
|
||||
td5.innerText = `(${selection}%)`
|
||||
td5.style.display = "flex"
|
||||
td5.style.gap = "1vw"
|
||||
let td5 = document.createElement("td")
|
||||
td5.innerText = `(${selection}%)`
|
||||
td5.style.display = "flex"
|
||||
td5.style.gap = "1vw"
|
||||
|
||||
let progresstd5 = document.createElement("progress")
|
||||
progresstd5.setAttribute("max", "100")
|
||||
progresstd5.setAttribute("value", `${selection}`)
|
||||
td5.appendChild(progresstd5)
|
||||
let progresstd5 = document.createElement("progress")
|
||||
progresstd5.setAttribute("max", "100")
|
||||
progresstd5.setAttribute("value", `${selection}`)
|
||||
td5.appendChild(progresstd5)
|
||||
|
||||
tr.appendChild(td1)
|
||||
tr.appendChild(td2)
|
||||
tr.appendChild(td3)
|
||||
tr.appendChild(td4)
|
||||
tr.appendChild(td5)
|
||||
tr.appendChild(td1)
|
||||
tr.appendChild(td2)
|
||||
tr.appendChild(td3)
|
||||
tr.appendChild(td4)
|
||||
tr.appendChild(td5)
|
||||
|
||||
tr.onclick = () => {
|
||||
this.left.style.filter = "blur(15px)"
|
||||
this.right.style.filter = "blur(15px)"
|
||||
tr.onclick = () => {
|
||||
this.left.style.filter = "blur(15px)"
|
||||
this.right.style.filter = "blur(15px)"
|
||||
|
||||
let modal = document.createElement("modal")
|
||||
let modal = document.createElement("modal")
|
||||
|
||||
const close = () => {
|
||||
riot.unmount(modal, false)
|
||||
this.left.style.filter = "none"
|
||||
this.right.style.filter = "none"
|
||||
const close = () => {
|
||||
riot.unmount(modal, false)
|
||||
this.left.style.filter = "none"
|
||||
this.right.style.filter = "none"
|
||||
}
|
||||
|
||||
riot.mount(modal, {
|
||||
close : close,
|
||||
etabname: etab,
|
||||
formation: form,
|
||||
city: city,
|
||||
acad: acad,
|
||||
type: type,
|
||||
capacity: capacity,
|
||||
wish: voeuxtotal,
|
||||
nhacad: Math.round(100 - admishorsacad),
|
||||
|
||||
manPercent: man,
|
||||
womanPercent: woman,
|
||||
hstyle: `width: ${parseInt(man.split("%")[0]) > 10 ? man : `23%`};`,
|
||||
fstyle: `width: ${parseInt(woman.split("%")[0]) > 10 ? woman : `23%`};`,
|
||||
|
||||
nbacgen: gen,
|
||||
genstyle: `width: ${parseInt(gen.split("%")[0]) > 10 ? gen : `23%`};`,
|
||||
nbacpro: pro,
|
||||
prostyle: `width: ${parseInt(pro.split("%")[0]) > 10 ? pro : `23%`};`,
|
||||
nbactech: tech,
|
||||
techstyle: `width: ${parseInt(tech.split("%")[0]) > 10 ? tech : `23%`};`,
|
||||
nbacautre: autre,
|
||||
autrestyle: `width: ${parseInt(autre.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
|
||||
nmentionp: p,
|
||||
pstyle: `width: ${parseInt(p.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentionab: ab,
|
||||
abstyle: `width: ${parseInt(ab.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentionb: b,
|
||||
bstyle: `width: ${parseInt(b.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentiontb: tb,
|
||||
tbstyle: `width: ${parseInt(tb.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentiontbf: tbf,
|
||||
tbfstyle: `width: ${parseInt(tbf.split("%")[0]) > 10 ? autre : `23%`};`
|
||||
}, "modal")
|
||||
|
||||
this.home.appendChild(modal)
|
||||
}
|
||||
|
||||
riot.mount(modal, {
|
||||
close : close,
|
||||
|
||||
etabname: etab,
|
||||
formation: form,
|
||||
city: city,
|
||||
acad: acad,
|
||||
type: type,
|
||||
capacity: capacity,
|
||||
wish: voeuxtotal,
|
||||
nhacad: Math.round(100 - admishorsacad),
|
||||
|
||||
manPercent: man,
|
||||
womanPercent: woman,
|
||||
hstyle: `width: ${parseInt(man.split("%")[0]) > 10 ? man : `23%`};`,
|
||||
fstyle: `width: ${parseInt(woman.split("%")[0]) > 10 ? woman : `23%`};`,
|
||||
|
||||
nbacgen: gen,
|
||||
genstyle: `width: ${parseInt(gen.split("%")[0]) > 10 ? gen : `23%`};`,
|
||||
nbacpro: pro,
|
||||
prostyle: `width: ${parseInt(pro.split("%")[0]) > 10 ? pro : `23%`};`,
|
||||
nbactech: tech,
|
||||
techstyle: `width: ${parseInt(tech.split("%")[0]) > 10 ? tech : `23%`};`,
|
||||
nbacautre: autre,
|
||||
autrestyle: `width: ${parseInt(autre.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
|
||||
nmentionp: p,
|
||||
pstyle: `width: ${parseInt(p.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentionab: ab,
|
||||
abstyle: `width: ${parseInt(ab.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentionb: b,
|
||||
bstyle: `width: ${parseInt(b.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentiontb: tb,
|
||||
tbstyle: `width: ${parseInt(tb.split("%")[0]) > 10 ? autre : `23%`};`,
|
||||
nmentiontbf: tbf,
|
||||
tbfstyle: `width: ${parseInt(tbf.split("%")[0]) > 10 ? autre : `23%`};`
|
||||
}, "modal")
|
||||
|
||||
this.home.appendChild(modal)
|
||||
this.etab.appendChild(tr)
|
||||
}
|
||||
|
||||
this.etab.appendChild(tr)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Envoyer dans l'encadrer avec les etablissements la map tout en haut
|
||||
* */
|
||||
renderMap(link) {
|
||||
this.map.innerHTML = ""
|
||||
|
||||
const nmap = document.createElement("map")
|
||||
|
||||
console.log(link)
|
||||
|
||||
riot.mount(nmap, {
|
||||
link: link
|
||||
}, "map")
|
||||
|
||||
this.map.appendChild(nmap)
|
||||
}
|
||||
|
||||
/**
|
||||
* Envoyer dans l'encadrer avec les stats les graphiques
|
||||
* @param { array[json] } data Les donnees pour calcule
|
||||
@ -398,6 +460,8 @@ export default class View {
|
||||
* */
|
||||
updateMenu(selection, direction) {
|
||||
if(direction) {
|
||||
this.inputEtab.value = ""
|
||||
this.input.value = ""
|
||||
window.updateModel(selection, direction)
|
||||
} else {
|
||||
log("Selector->View", "Mince, le menu ne veut pas se remplir :(")
|
||||
|
||||
@ -2,10 +2,11 @@
|
||||
<style>
|
||||
#etablanalytics {
|
||||
width: 65vw;
|
||||
height: 28vh;
|
||||
max-height: 28vh;
|
||||
height: 50vh;
|
||||
max-height: 50vh;
|
||||
font-weight: bold;
|
||||
overflow: auto;
|
||||
margin-bottom: 2vw;
|
||||
}
|
||||
|
||||
#etablanalytics
|
||||
@ -39,9 +40,32 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
#etablanalytics
|
||||
#etablanalytics-search-container {
|
||||
background: #344D59;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
padding: 0.3vw;
|
||||
}
|
||||
|
||||
#etablanalytics
|
||||
#etablanalytics-search-container
|
||||
#etablanalytics-search {
|
||||
width: 30%;
|
||||
background: white;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="etablanalytics">
|
||||
<div id="etablanalytics-map-container"></div>
|
||||
|
||||
<div id="etablanalytics-search-container">
|
||||
<input type="text" id="etablanalytics-search" />
|
||||
</div>
|
||||
|
||||
<table id="etablanalytics-list">
|
||||
<tr>
|
||||
<th>Nom</th>
|
||||
|
||||
@ -1,8 +1,26 @@
|
||||
<map>
|
||||
<style>
|
||||
span {
|
||||
color: green;
|
||||
#map-container {
|
||||
padding: 1vw;
|
||||
background: #344D59;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#map-container
|
||||
#map-map {
|
||||
width: 100%;
|
||||
height: 25vw;
|
||||
}
|
||||
</style>
|
||||
<span>tg</span>
|
||||
|
||||
<div id="map-container">
|
||||
<iframe id="map-map" src={this.props.link}></iframe>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ["link"]
|
||||
}
|
||||
</script>
|
||||
</map>
|
||||
@ -20,6 +20,12 @@
|
||||
gap: 3%;
|
||||
}
|
||||
|
||||
#selector
|
||||
#selector-list-container
|
||||
#selector-list-input-search {
|
||||
background: white;
|
||||
}
|
||||
|
||||
#selector
|
||||
#selector-top-container
|
||||
#selector-top-btn {
|
||||
@ -57,7 +63,7 @@
|
||||
|
||||
<div id="selector">
|
||||
<div id="selector-top-container">
|
||||
<span id="selector-top-title"> </span>
|
||||
<span id="selector-top-title"> </span>
|
||||
|
||||
<button
|
||||
id="selector-top-btn">
|
||||
@ -66,6 +72,8 @@
|
||||
</div>
|
||||
|
||||
<div id="selector-list-container">
|
||||
<input type="text" id="selector-list-input-search" />
|
||||
|
||||
<ul id="selector-list-zone"> </ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
}
|
||||
</style>
|
||||
|
||||
<li id="selectorfragment-container">
|
||||
<li id="selectorfragment-container" if={ this.props.display } >
|
||||
<a id={ this.props.idd } class="selectorfragment-name">{ this.props.name }</a>
|
||||
<span id="selectorfragment-count">{ this.props.count }</span>
|
||||
</li>
|
||||
@ -54,7 +54,8 @@
|
||||
props: [
|
||||
"name",
|
||||
"count",
|
||||
"idd"
|
||||
"idd",
|
||||
"display"
|
||||
]
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user