martins/S4WEB
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

ajout % femme et selectivité et moyenne

Browse Source
This commit is contained in:
martins 2023-03-29 11:50:35 +02:00
parent 6d1b878b96
commit 140f80154d
4 changed files with 181 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@ -9,7 +9,6 @@
<script src="./riot/choixformation.riot" type="riot"></script>
<script src="./riot/app.riot" type="riot"></script>
<script src="./riot/statistiqueFormation.riot" type="riot"></script>
<script src="./js/model.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/riot/7.1.0/riot+compiler.min.js" integrity="sha512-sSGKGR9MvL0bUx3CScaBb56crXwspwDkL/JnB0IrLFQfw3uvSUlITQtsTtDZctshhv5wdwIt+qZeN8zThRF4Dw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<title>S4WEB</title>
</head>
@ -18,11 +17,12 @@
<app></app>
<script>
localStorage.clear()
riot.compile().then(() => {
riot.mount('app', {})
})
localStorage.clear()
</script>
</body>
</html>

141
riot/app.riot
View File

@ -1,11 +1,11 @@
<app>
<div class="columns">
<div class="column is-one-third">
<choixformation isSelected={isSelected}></choixformation>
<div class="column is-two-fifths">
<choixformation isSelected={isSelected} reset={reset}></choixformation>
</div>
<div class="column">
<statistiqueFormation formation={state.filiere} choix={state.choix}> </statistiqueFormation>
<statistiqueFormation statistique={state.statistique} moyenne={state.moyenne} selectivite={state.selectivite} pct_femme={state.pct_femme}> </statistiqueFormation>
</div>
</div>
@ -15,16 +15,141 @@
onBeforeMount(props, state) {
// initial state
this.state = {
choix: '',
filiere: ''
statistique: '',
selectivite: '',
moyenne: '',
pct_femme: ''
};
},
isSelected(formation, fili){
async isSelected(detail, type){
this.getData(detail, type)
},
reset(){
this.update({
choix: formation,
filiere: fili
statistique: '',
selectivite: '',
moyenne: '',
pct_femme: ''
})
},
async getData(detail, type){
if(!localStorage.getItem(`${type}+${detail}`)){
let rep = await fetch(`https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=session&facet=contrat_etab&facet=cod_uai&facet=g_ea_lib_vx&facet=dep_lib&facet=region_etab_aff&facet=acad_mies&facet=ville_etab&facet=lib_for_voe_ins&facet=select_form&facet=fili&facet=form_lib_voe_acc&facet=fil_lib_voe_acc&facet=detail_forma&facet=tri&facet=cod_aff_form&facet=etablissement_id_paysage&facet=composante_id_paysage&refine.form_lib_voe_acc=${encodeURIComponent(type)}&refine.fil_lib_voe_acc=${encodeURIComponent(detail)}&timezone=Europe%2FBerlin&rows=352&refine.sexe=F`);
rep = await rep.json();
localStorage.setItem(`${type}+${detail}`, JSON.stringify(rep))
this.update({
statistique: rep
})
}else{
this.update({
statistique: JSON.parse(localStorage.getItem(`${type}+${detail}`))
})
}
this.calcule()
},
getSelectivite(records){
let total = records.length
let gen = records.reduce(function (accumulateur, valeurCourante) {
if(valeurCourante.fields.taux_acces_ens){
return accumulateur + (valeurCourante.fields.taux_acces_ens)
}else{
return accumulateur
}
}, 0);
this.update({
selectivite: Math.round(gen/total)-1
})
},
getMoyenne(records){
let gen = records.reduce(function (accumulateur, valeurCourante) {
if(valeurCourante.fields.acc_tb){
accumulateur += (valeurCourante.fields.acc_tb*16)
}
if(valeurCourante.fields.acc_ab){
accumulateur += (valeurCourante.fields.acc_ab*12)
}
if(valeurCourante.fields.acc_b){
accumulateur += (valeurCourante.fields.acc_b*14)
}
if(valeurCourante.fields.acc_tbf){
accumulateur += (valeurCourante.fields.acc_tbf*18)
}
if(valeurCourante.fields.sansmention){
accumulateur += (valeurCourante.fields.sansmention*10)
}
if(valeurCourante.fields.acc_mention_nonrenseigne){
accumulateur += (valeurCourante.fields.acc_mention_nonrenseigne*10)
}
return accumulateur;
}, 0);
let total = records.reduce(function (accumulateur, valeurCourante) {
if(valeurCourante.fields.acc_tb){
accumulateur += (valeurCourante.fields.acc_tb)
}
if(valeurCourante.fields.acc_ab){
accumulateur += (valeurCourante.fields.acc_ab)
}
if(valeurCourante.fields.acc_b){
accumulateur += (valeurCourante.fields.acc_b)
}
if(valeurCourante.fields.acc_tbf){
accumulateur += (valeurCourante.fields.acc_tbf)
}
if(valeurCourante.fields.sansmention){
accumulateur += (valeurCourante.fields.sansmention)
}
if(valeurCourante.fields.acc_mention_nonrenseigne){
accumulateur += (valeurCourante.fields.acc_mention_nonrenseigne)
}
return accumulateur;
}, 0);
this.update({
moyenne: (Math.round(gen/total*100))/100
})
},
getPctFemme(records){
let femme=records.reduce(function (accumulateur, valeurCourante) {
if(valeurCourante.fields.acc_tot_f){
//nombre de femme
accumulateur += (valeurCourante.fields.acc_tot_f)
}
return accumulateur;
}, 0);
let total=records.reduce(function (accumulateur, valeurCourante) {
if(valeurCourante.fields.acc_tot_f){
//nombre d'admis
accumulateur += (valeurCourante.fields.acc_tot)
}
return accumulateur;
}, 0);
this.update({
pct_femme: Math.round(femme/total*100)
})
},
calcule(){
this.getSelectivite(this.state.statistique.records)
this.getMoyenne(this.state.statistique.records)
this.getPctFemme(this.state.statistique.records)
},
}
}

6
riot/choixformation.riot
View File

@ -166,10 +166,13 @@
},
changeDetail(e){
if(e.target.id != this.state.detail){
this.update({
detail: e.target.id
})
this.props.reset()
this.props.isSelected(this.state.detail, this.state.type)
}
},
search(e){
@ -185,6 +188,7 @@
type: '',
detail: ''
})
this.props.reset()
this.getFili();
},
@ -194,6 +198,7 @@
detail: '',
type: ''
})
this.props.reset()
this.getType()
},
@ -202,6 +207,7 @@
recherche: '',
detail: ''
})
this.props.reset()
}
};

62
riot/statistiqueFormation.riot
View File

@ -1,20 +1,23 @@
<statistiqueFormation>
<div class="box p-5 my-5" if={isPossible(props.formation, props.choix)}>
<div class="box p-5 my-5" if={props.statistique} onload={load()} unload={reset()}>
<div class="recap box has-background-light has-text-weight-normal">
<p>Moyenne des admis : <span class="is-pulled-right">13.1</span></p>
<p>Nombre de formations : <span class="is-pulled-right">80</span></p>
<p>Capacité : <span class="is-pulled-right">122</span></p>
<p>Moyenne des admis : <span class="is-pulled-right" if={props.moyenne}>{props.moyenne}</span></p>
<p>Nombre de formations : <span class="is-pulled-right">{props.statistique.nhits}</span></p>
<p>Capacité : <span class="is-pulled-right"></span></p>
<div class="is-flex m-0">
<p class="column is-5 p-0">Sélectivité :</p>
<div class="column p-0">
<progress-bar select="46">
<progress-bar select={props.getSelectivite} if={props.selectivite}>
<div class="columns is-mobile is-vcentered">
<div class="column is-narrow pr-1">
<p class="has-text-right has-text-weight-bold">(46%)</p>
<p class="has-text-right has-text-weight-bold">{props.selectivite}</p>
</div>
<div class="column pl-0">
<progress max="100" class="progress is-warning" value="54"></progress>
<progress class="progress is-info" value="{props.selectivite}" max="100" if={props.selectivite <= 25}>{props.selectivite}%</progress>
<progress class="progress is-success" value="{props.selectivite}" max="100" if={props.selectivite > 25 && props.selectivite < 50}>{props.selectivite}%</progress>
<progress class="progress is-warning" value="{props.selectivite}" max="100" if={props.selectivite > 50 && props.selectivite < 75}>{props.selectivite}%</progress>
<progress class="progress is-danger" value="{props.selectivite}" max="100" if={props.selectivite >= 75}>{props.selectivite}%</progress>
</div>
</div>
</progress-bar>
@ -23,18 +26,18 @@
</div>
<bar-chart label="Répartition par genre">
<bar-chart label="Répartition par genre" if={props.pct_femme}>
<div class="bar-chart block m-5">
<div class="has-text-centered block is-size-5">
<h2 class="is-unselectable">Répartition par genre</h2>
</div>
<div class="is-size-7">
<div class="columns is-mobile is-vcentered">
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:52%;background-color:#003f5c;">
<p class="has-text-centered m-1 has-text-white is-unselectable">52%</p>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:{props.pct_femme}%;background-color:#003f5c;">
<p class="has-text-centered m-1 has-text-white is-unselectable">{props.pct_femme}%</p>
</div>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:48%;background-color:#f95d6a;">
<p class="has-text-centered m-1 has-text-white is-unselectable">48%</p>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:{100-props.pct_femme}%;background-color:#f95d6a;">
<p class="has-text-centered m-1 has-text-white is-unselectable">{100-props.pct_femme}%</p>
</div>
</div>
<div class="columns is-mobile is-justify-content-center">
@ -63,14 +66,17 @@
</div>
<div class="is-size-7">
<div class="columns is-mobile is-vcentered">
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:51%;background-color:#003f5c;">
<p class="has-text-centered m-1 has-text-white is-unselectable">51%</p>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:{}%;background-color:#003f5c;">
<p class="has-text-centered m-1 has-text-white is-unselectable">%</p>
</div>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:49%;background-color:#2f4b7c;">
<p class="has-text-centered m-1 has-text-white is-unselectable">49%</p>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:{}%;background-color:#2f4b7c;">
<p class="has-text-centered m-1 has-text-white is-unselectable">%</p>
</div>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:1%;background-color:#665191;">
<p class="has-text-centered m-1 is-unselectable">1%</p>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:{}%;background-color:#665191;">
<p class="has-text-centered m-1 is-unselectable">%</p>
</div>
<div class="column is-narrow ml-1 mr-1 p-0 is-flex-shrink-1" style="width:{}%;background-color:#a05195;">
<p class="has-text-centered m-1 is-unselectable">%</p>
</div>
</div>
<div class="columns is-mobile is-justify-content-center">
@ -166,24 +172,20 @@ export default function todos() {
onBeforeMount(props, state) {
// initial state
this.state = {
statistique: ''
pct_femme: ''
};
},
isPossible(fili, formation){
if(fili && formation){
this.getStatistique(fili, formation)
return true
}else{
return false;
}
load(){
},
async getStatistique(fili, formation){
let rep=await fetch(`https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=session&facet=contrat_etab&facet=cod_uai&facet=g_ea_lib_vx&facet=dep_lib&facet=region_etab_aff&facet=acad_mies&facet=ville_etab&facet=lib_for_voe_ins&facet=select_form&facet=fili&facet=form_lib_voe_acc&facet=fil_lib_voe_acc&facet=detail_forma&facet=tri&facet=cod_aff_form&facet=etablissement_id_paysage&facet=composante_id_paysage&refine.form_lib_voe_acc=${encodeURIComponent(fili)}&refine.fil_lib_voe_acc=${encodeURIComponent(formation)}&timezone=Europe%2FBerlin`)
rep=await rep.json();
console.log(JSON.stringify(rep))
reset(){
}
}
}
</script>
</statistiqueFormation>