ProjetRIOT/components/main-controller.riot

<main-controller>
    <div class="columns">
		<div class="column is-one-third">
            <div class="box p-3 m-2">
                <img class="mt-1 ml-5 mr-auto" style="margin: auto;" src="./resources/logo-parcoursup.svg"/>
            </div>
			<search updateCourse={updateCourse}></search>
		</div>

		<div class="column">
			<fili-info schoolList={state.schoolList} course={state.course} shouldShowInfos={state.shouldShowInfos}></fili-info>
			<school sortList={sortList} schoolList={state.filteredSchoolList} sortFields={state.sortFields} course={state.course} shouldShowInfos={state.shouldShowInfos}></school>
		</div>
	</div>

	<school-info></school-info>

    <script>

        import PAPI from '../javascript/parcoursup-link.js'

        const SORT_TABLE = [
            {name: "Nom", id: "g_ea_lib_vx"},
            {name: "Ville", id: "ville_etab"},
            {name: "Département", id: "dep"},
            {name: "Moyenne", id: "moyenne"},
            {name: "Sélectivité", id: "taux_acces_ens"}
        ]

        export default {
            sortList(sortBy) {
                //Si la liste est déjà triée par la bonne catégorie, on l'inverse
                if (sortBy == this.state.sortBy) {
                    this.state.filteredSchoolList.reverse()
                } 
                //Sinon on l'ordonne par la nouvelle catégorie (ascendant par défaut)
                else { 
                    this.state.sortBy = sortBy

                    switch (sortBy) {
                        case SORT_TABLE[3].id:
                        case SORT_TABLE[4].id: {
                            this.state.filteredSchoolList.sort((a, b) => {
                                if (a.fields[sortBy] > b.fields[sortBy]) return 1
                                else return -1
                            })
                            break
                        }

                        default: {
                            this.state.filteredSchoolList.sort((a, b) => {
                                return (a.fields[sortBy]).localeCompare(b.fields[sortBy])
                            })
                            break
                        }
                    }
                }

                this.update()
            },
            updateList(course) {
                course = course || this.state.course
                PAPI.fetchEtablissement(course.fili, course.sousfili, course.soussousfili).then((response) => {
                    response.forEach(etablissement => {
                        // calcul la moyenne
                        let pct_sansmention = etablissement.fields.pct_sansmention
                        let pct_AB = etablissement.fields.pct_ab
                        let pct_B = etablissement.fields.pct_b
                        let pct_TB = etablissement.fields.pct_tb
                        let pct_TBF = etablissement.fields.pct_tbf
                        
                        // On prend la moyenne des moyennes comprises dans la mention
                        // Exemple : Assez bien est entre 12 et 14 donc 13.
                        etablissement.fields.moyenne = ((pct_TBF*19)+(pct_TB*17)+(pct_B*15)+(pct_AB*13)+(pct_sansmention*11))/100
                    }) 

                    this.update({
                        schoolList: response
                    })    
                    this.filterSearch()              
                })
            },
            updateCourse(course){
                this.updateList(course)

                this.update({
                    course: course,
                    sortFields: SORT_TABLE,
					shouldShowInfos: course != null,
                })
            },

            onMounted(props, state) {
                this.update({
                    course: null,
                    sortBy: null,
                    schoolList: null,
                    sortFields: SORT_TABLE,
                    filteredSchoolList: null,
					shouldShowInfos: false
                })
            },
            filterSearch() {
                let input = this.$("input")
                if (!input) return

                let finalArray = []
                
                //On évite de trier avant d'avoir plus de 1 lettres.
                if (input.value.length > 1) { 
                    finalArray = this.state.schoolList.filter((item) => {
                        return item.name.toLowerCase().includes(input.value.toLowerCase())
                    })
                } else {
                    finalArray = this.state.schoolList
                }
                
                this.update({
                    filteredSchoolList: finalArray
                })
            }
        }
    </script>

</main-controller>