<template>
  <AnchoredSection id="functionalities">
    <LayoutContainer>
      <CommonCarouselFonctionnalite :cards="cards" />
    </LayoutContainer>
  </AnchoredSection>
</template>

<script setup lang="ts">
import 'vue3-carousel/dist/carousel.css'
import AnchoredSection from '~/components/Layout/AnchoredSection.vue'
import type { Functionality } from '~/types/interface'

const cards: Array<Functionality> = [
  {
    logo: '/images/components/fonctionnalites/Icone_espaces_dedies.svg',
    logoAlt: 'Icône smartphone avec cadenas verrouillé',
    title: 'ESPACES DÉDIÉS *',
    list: ['Administration', 'Professeurs', 'Élèves / Familles'],
    options: ['* Disponible sur tout support'],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_repertoire.svg',
    logoAlt: 'Icône carnet annuaire',
    title: 'RÉPERTOIRE',
    list: [
      'Élèves et responsables légaux',
      'Personnel administratif et professeurs',
      'Contacts extérieurs, partenaires & donateurs',
    ],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_preinscription_en_ligne.svg',
    logoAlt: "Icône d'un fichier devant un écran d'ordinateur",
    title: 'PRÉINSCRIPTION EN LIGNE *',
    list: [
      'Paramétrage personnalisé des formulaires & mails automatiques',
      'Gestion des réinscriptions et des nouvelles inscriptions',
      'Gestion des quotas et du suivi des préinscriptions en ligne',
    ],
    options: ['* En option'],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_agenda.svg',
    logoAlt: 'Icône calendrier',
    title: 'AGENDA',
    list: [
      'Création et gestion des cours, examens, événements et prestations pédagogiques',
      'Planning interactif avec un contrôle de cohérence',
      'Gestion des présences, absences et retards',
    ],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_parc_materiel.svg',
    logoAlt: 'Icône carton avec stylos et cahier à l’intérieur',
    title: 'PARC MATÉRIEL ',
    list: [
      'Gestion de votre parc matériel (instruments, costumes, accessoires..)',
      'Locations et prêts de matériel',
      'Planification de la maintenance et entretien de matériel',
    ],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_suivi_pedagogique.svg',
    logoAlt: 'Chapeau de diplômé américain',
    title: 'SUIVI PÉDAGOGIQUE',
    list: [
      'Gestion du cursus pédagogique (critères personnalisables)',
      'Création des examens et envoi des convocations',
      'Édition des bulletins de notes',
    ],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_facturation_et_reglement.svg',
    logoAlt:
      "Fichier arborant un symbole monétaire devant un écran d'ordinateur",
    title: 'FACTURATION',
    list: [
      'Facturation automatisée selon différents critères',
      'Suivi des règlements et gestion des relances',
      'En option : de nombreux moyens de paiement',
    ],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_communication.svg',
    logoAlt: 'Icône enveloppe, téléphone et bulle SMS',
    title: 'COMMUNICATION',
    list: [
      'Édition et envoi de courriers, de mails ou de SMS*',
      'Création de modèles de courriers, mails ou SMS*',
      'Outil de publipostage intégré pour un envoi personnalisé',
    ],
    options: ['* En option'],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_site_internet.svg',
    logoAlt: 'Icône site internet',
    title: 'SITE INTERNET ',
    list: [
      'Gestion intégrée au logiciel',
      'Mise à jour automatique des membres et événements sur votre site',
      'Possibilité de personnalisé votre template',
    ],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_statistiques.svg',
    logoAlt: 'Icône graphique à barre avec ligne ascendante',
    title: 'STATISTIQUES',
    list: [
      "Rapport d'activité complet en fonction de vos activités",
      "Personnalisation du rapport d'activité grâce aux différents formats proposés lors du téléchargement",
      'Export des données du logiciel pour une analyse complète',
    ],
  },
  {
    logo: '/images/logos/cmf/Icone_CMF_reseau_BLACK.png',
    logoAlt: 'Logo CMF',
    title: 'RÉSEAU CMF *',
    list: [
      'Accès au répertoire du réseau',
      'Renouvellement de votre adhésion fédérale',
      "Gestion de l'assurance CMF",
    ],
    options: ['* Uniquement dédié aux adhérents CMF'],
  },
  {
    logo: '/images/components/fonctionnalites/Icone_promotion.svg',
    logoAlt: 'Icône mégaphone',
    title: 'PROMOTION DE VOTRE STRUCTURE & VOS ÉVÉNEMENTS ',
    list: [
      'Sur votre site internet intégré',
      "Sur l'agenda de la CMF",
      "Sur l'agenda culturel Opentalent",
    ],
  },
]
</script>
