public-html2/parcoursup/components/result-list.riot

<result-list>
  <div class="results">

    <div class="message" if={ props.results.length === 0 && props.hasSearched && !props.loading }>
      Aucun résultat trouvé
    </div>

    <div class="message" if={ props.loading }>
      Chargement...
    </div>

    <div each={ (formation, index) in props.results } key={ formation.id } class="card">
      <h3>{ formation.nom }</h3>
      <p><b>Établissement :</b> { formation.etablissement }</p>
      <p><b>Ville :</b> { formation.ville } ({ formation.departement })</p>
      <p><b>Filière :</b> { formation.filiere }</p>
      <p><b>Taux d'accès :</b> { formation.tauxAcces }%</p>

      <button onclick={ afficherDetail.bind(this, index) }>Voir détail</button>
      <button onclick={ ajouterALaSelection.bind(this, index) }>Ajouter à la sélection</button>
      <button onclick={ localiserSurCarte.bind(this, formation) } if={ formation.latitude != null }>Localiser</button>
    </div>

  </div>

  <script>
    export default {

      // Déclencher l'affichage du détail d'une formation
      afficherDetail(index) {
        this.props.ondetail(index)
      },

      // Ajouter une formation à la sélection
      ajouterALaSelection(index) {
        this.props.onselect(index)
      },

      // Centrer la carte sur la formation
      localiserSurCarte(formation) {
        if (window.mapFocus) {
          window.mapFocus(formation.id)
        }
      }

    }
  </script>

</result-list>