ProjetRIOT/components/school-info.riot

127 lines
5.2 KiB
Plaintext

<school-info>
<div if={props.popupEnabled} class="modal is-active">
<div class="modal-background"></div>
<div class="modal-content">
<div class="box p-2">
<p>
<h1 class="title is-4 m-2" style="color: #485FC7;">{props.school.fields.g_ea_lib_vx}</h1>
</p>
<div class="columns m-2">
<div class="column">
<p>Ville : {props.school.fields.ville_etab}</p>
<p>Département : {props.school.fields.dep} {props.school.fields.dep_lib}</p>
<p>Académie : {props.school.fields.acad_mies}</p>
<p>{props.school.fields.contrat_etab}</p>
<p>Capacité : {props.school.fields.capa_fin}</p>
<p>Nombre de voeux : {props.school.fields.voe_tot}</p>
<p>Rang dernier appelé : </p>
<ul>
<li if={props.school.fields.lib_grp1}>{props.school.fields.lib_grp1} : {props.school.fields.ran_grp1}</li>
<li if={props.school.fields.lib_grp2}>{props.school.fields.lib_grp2} : {props.school.fields.ran_grp2}</li>
<li if={props.school.fields.lib_grp3}>{props.school.fields.lib_grp3} : {props.school.fields.ran_grp3}</li>
</ul>
<p>Admis hors académie : {100-props.school.fields.pct_aca_orig}%</p>
</div>
<div class="column">
<p>Vitesse de remplissage :</p>
</div>
</div>
<div class="m-4">
<line-graph title="Répartition par genre" data={state.genreStats} style="height: 6rem;"></line-graph>
</div>
<div class="m-4">
<line-graph title="Répartition par bac" data={state.bacStats} style="height: 6rem;"></line-graph>
</div>
<div class="m-4">
<line-graph title="Répartition par mention au bac" data={state.mentionStats} style="height: 6rem;"></line-graph>
</div>
</div>
</div>
<button class="modal-close is-medium" onclick={props.closeWindow}></button>
</div>
<script>
export default {
onBeforeMount(props, state) {
this.state={
bacStats: [],
genreStats: [],
mentionStats: []
}
},
onBeforeUpdate(props, state) {
if (!this.props.school) return
let school=this.props.school.fields
state.genreStats = [
{
name: "Hommes",
short: "H",
value: (100 - school.pct_f)
},
{
name: "Femmes",
short: "F",
value: school.pct_f
},
]
state.bacStats = [
{
name: "Général",
short: "Gen.",
value: Math.round(school.part_acces_gen)
},
{
name: "Technologique",
short: "Tech.",
value: Math.round(school.part_acces_tec)
},
{
name: "Professionnel",
short: "Pro.",
value: Math.round(school.part_acces_pro)
},
{
name: "Autre",
short: "Au.",
value: 100 - (school.part_acces_gen + school.part_acces_tec + school.part_acces_pro)
}
]
state.mentionStats = [
{
name: "Sans Mention",
short: "SM",
value: Math.round(school.pct_sansmention)
},
{
name: "Assez Bien",
short: "AB",
value: Math.round(school.pct_ab)
},
{
name: "Bien",
short: "B",
value: Math.round(school.pct_b)
},
{
name: "Très Bien",
short: "TB",
value: Math.round(school.pct_tb)
},
{
name: "Très Bien + Félicitations",
short: "TBF",
value: Math.round(school.pct_tbf)
},
{
name: "Non Spécifié",
short: "NS",
value: 100 - (school.pct_sansmention + school.pct_ab + school.pct_b + school.pct_tb + school.pct_tbf)
}
]
}
}
</script>
</school-info>