<template>
  <AnchoredSection id="comparative">
    <LayoutContainer>
      <v-row class="center-90">
        <LayoutUISubTitle> Comparatif de nos solutions </LayoutUISubTitle>

        <LayoutUITitle>
          Choisissez la version qui vous convient !
        </LayoutUITitle>

        <CommonTableComparatif
          standard-price="36,10€"
          premium-price="50,60€"
          :items="comparisonItems"
          :show-from="true"
        />

        <div class="asterisk">
          <span>** Uniquement dédié aux structures adhérentes CMF</span>
        </div>
      </v-row>
    </LayoutContainer>
  </AnchoredSection>
</template>

<script setup lang="ts">
import AnchoredSection from '~/components/Layout/AnchoredSection.vue'
import type { ComparisonItem } from '~/types/interface'

const comparisonItems: Array<ComparisonItem> = [
  {
    label: 'GESTION DU RÉPERTOIRE',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'SUIVI PÉDAGOGIQUE',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'AGENDA',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'FACTURATION AUTOMATISÉE',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'GESTION DES RÈGLEMENTS',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'GESTION DU PARC MATÉRIEL',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'COMMUNICATION',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'SITE INTERNET',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'STATISTIQUES',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'EXPORT DES DONNÉES',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'FONCTIONNALITÉ DU RÉSEAU CMF **',
    includedInStandard: true,
    includedInPremium: true,
  },
  {
    label: 'EXTRANET UTILISATEURS',
    includedInStandard: false,
    includedInPremium: true,
  },
  {
    label: 'PRÉINSCRIPTION EN LIGNE',
    includedInStandard: false,
    includedInPremium: 'Option',
  },
  {
    label: "GRILLES D'ÉVALUATION",
    includedInStandard: false,
    includedInPremium: 'Option',
  },
  {
    label: 'GESTION DES RÈGLEMENTS',
    includedInStandard: false,
    includedInPremium: 'Option',
  },
  {
    label: 'EXPORT DE FACTURATION',
    includedInStandard: false,
    includedInPremium: 'Option',
  },
  {
    label: 'SMS',
    includedInStandard: 'Option',
    includedInPremium: 'Option',
  },
  {
    label: 'NOM DE DOMAINE',
    includedInStandard: 'Option',
    includedInPremium: 'Option',
  },
  {
    label: 'ESPACE DE STOCKAGE',
    includedInStandard: '500 Mo',
    includedInPremium: '1 Go',
  },
  {
    label: 'PAGES DU SITE INTERNET',
    includedInStandard: 'Restreint',
    includedInPremium: 'Illimité',
  },
]
</script>
<style scoped>
.asterisk {
  display: flex;
  margin: 4px auto 0 auto;
  width: 63%;
  justify-content: flex-end;
  font-style: italic;
}
</style>
