correction du composant principal et ajout du comparateur

parcoursup/app.riot

@@ -21,12 +21,48 @@
       </div>
 
       <div class="detail-card" if={ state.selectedFormations.length > 0 }>
+        <h3>Comparateur</h3>
+
+        <p>Choisis ton profil pour comparer les formations sélectionnées.</p>
+
+        <div class="compare-controls">
+          <div>
+            <label for="note"><b>Note moyenne :</b></label><br />
+            <input
+              id="note"
+              type="number"
+              min="0"
+              max="20"
+              step="0.1"
+              value={ state.note }
+              oninput={ updateNote }
+            />
+          </div>
+
+          <div>
+            <label for="serie"><b>Série :</b></label><br />
+            <select id="serie" onchange={ updateSerie }>
+              <option value="general" selected={ state.serie === 'general' }>Général</option>
+              <option value="techno" selected={ state.serie === 'techno' }>Technologique</option>
+              <option value="pro" selected={ state.serie === 'pro' }>Professionnel</option>
+            </select>
+          </div>
+        </div>
+
+        <hr />
+
         <h3>Formations sélectionnées</h3>
 
-        <div each={ f in state.selectedFormations }>
+        <div each={ f in state.selectedFormations } key={ f.id } class="card">
+          <h4>{ f.nom }</h4>
+          <p><b>Ville :</b> { f.ville }</p>
+          <p><b>Filière :</b> { f.filiere }</p>
+          <p><b>Taux d'accès :</b> { f.tauxAcces }%</p>
           <p>
-            <b>{ f.nom }</b> — { f.ville } — taux : { f.tauxAcces }%
+            <b>Profil admis :</b>
+            Général { f.pctGeneral }% / Techno { f.pctTechno }% / Pro { f.pctPro }%
           </p>
+          <p><b>Estimation :</b> { estimateFormation(f) }</p>
         </div>
       </div>
     </div>
@@ -46,7 +82,9 @@
         hasSearched: false,
         results: [],
         selected: null,
-        selectedFormations: []
+        selectedFormations: [],
+        note: 12,
+        serie: 'general'
       },
 
       async launchSearch(query) {
@@ -109,6 +147,56 @@
         this.update({
           selected: null
         })
+      },
+
+      updateNote(event) {
+        this.update({
+          note: Number(event.target.value)
+        })
+      },
+
+      updateSerie(event) {
+        this.update({
+          serie: event.target.value
+        })
+      },
+
+      estimateFormation(formation) {
+        let score = 0
+
+        if (formation.tauxAcces >= 50) {
+          score += 2
+        } else if (formation.tauxAcces >= 20) {
+          score += 1
+        }
+
+        if (this.state.note >= 15) {
+          score += 2
+        } else if (this.state.note >= 12) {
+          score += 1
+        }
+
+        if (this.state.serie === 'general' && formation.pctGeneral >= 50) {
+          score += 2
+        }
+
+        if (this.state.serie === 'techno' && formation.pctTechno >= 20) {
+          score += 2
+        }
+
+        if (this.state.serie === 'pro' && formation.pctPro >= 15) {
+          score += 2
+        }
+
+        if (score >= 5) {
+          return 'Favorable'
+        }
+
+        if (score >= 3) {
+          return 'Possible'
+        }
+
+        return 'Difficile'
       }
     }
   </script>