Comparatif.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. <template>
  2. <AnchoredSection id="comparative">
  3. <LayoutContainer>
  4. <v-row class="center-90">
  5. <LayoutUISubTitle> Comparatif de nos solutions </LayoutUISubTitle>
  6. <LayoutUITitle>
  7. Choisissez la version qui vous convient !
  8. </LayoutUITitle>
  9. <CommonTableComparatif
  10. standard-price="34,90€"
  11. premium-price="49€"
  12. :items="comparisonItems"
  13. :show-from="true"
  14. />
  15. <div class="asterisk">
  16. <span>** Uniquement dédié aux structures adhérentes CMF</span>
  17. </div>
  18. </v-row>
  19. </LayoutContainer>
  20. </AnchoredSection>
  21. </template>
  22. <script setup lang="ts">
  23. import AnchoredSection from '~/components/Layout/AnchoredSection.vue'
  24. import type { ComparisonItem } from '~/types/interface'
  25. const comparisonItems: Array<ComparisonItem> = [
  26. {
  27. label: 'GESTION DU RÉPERTOIRE',
  28. includedInStandard: true,
  29. includedInPremium: true,
  30. },
  31. {
  32. label: 'SUIVI PÉDAGOGIQUE',
  33. includedInStandard: true,
  34. includedInPremium: true,
  35. },
  36. {
  37. label: 'AGENDA',
  38. includedInStandard: true,
  39. includedInPremium: true,
  40. },
  41. {
  42. label: 'FACTURATION AUTOMATISÉE',
  43. includedInStandard: true,
  44. includedInPremium: true,
  45. },
  46. {
  47. label: 'GESTION DES RÈGLEMENTS',
  48. includedInStandard: true,
  49. includedInPremium: true,
  50. },
  51. {
  52. label: 'GESTION DU PARC MATÉRIEL',
  53. includedInStandard: true,
  54. includedInPremium: true,
  55. },
  56. {
  57. label: 'COMMUNICATION',
  58. includedInStandard: true,
  59. includedInPremium: true,
  60. },
  61. {
  62. label: 'SITE INTERNET',
  63. includedInStandard: true,
  64. includedInPremium: true,
  65. },
  66. {
  67. label: 'STATISTIQUES',
  68. includedInStandard: true,
  69. includedInPremium: true,
  70. },
  71. {
  72. label: 'EXPORT DES DONNÉES',
  73. includedInStandard: true,
  74. includedInPremium: true,
  75. },
  76. {
  77. label: 'FONCTIONNALITÉ DU RÉSEAU CMF **',
  78. includedInStandard: true,
  79. includedInPremium: true,
  80. },
  81. {
  82. label: 'EXTRANET UTILISATEURS',
  83. includedInStandard: false,
  84. includedInPremium: true,
  85. },
  86. {
  87. label: 'PRÉINSCRIPTION EN LIGNE',
  88. includedInStandard: false,
  89. includedInPremium: 'Option',
  90. },
  91. {
  92. label: "GRILLES D'ÉVALUATION",
  93. includedInStandard: false,
  94. includedInPremium: 'Option',
  95. },
  96. {
  97. label: 'GESTION DES RÈGLEMENTS',
  98. includedInStandard: false,
  99. includedInPremium: 'Option',
  100. },
  101. {
  102. label: 'EXPORT DE FACTURATION',
  103. includedInStandard: false,
  104. includedInPremium: 'Option',
  105. },
  106. {
  107. label: 'SMS',
  108. includedInStandard: 'Option',
  109. includedInPremium: 'Option',
  110. },
  111. {
  112. label: 'NOM DE DOMAINE',
  113. includedInStandard: 'Option',
  114. includedInPremium: 'Option',
  115. },
  116. {
  117. label: 'ESPACE DE STOCKAGE',
  118. includedInStandard: '500 Mo',
  119. includedInPremium: '1 Go',
  120. },
  121. {
  122. label: 'PAGES DU SITE INTERNET',
  123. includedInStandard: 'Restreint',
  124. includedInPremium: 'Illimité',
  125. },
  126. ]
  127. </script>
  128. <style scoped>
  129. .asterisk {
  130. display: flex;
  131. margin: 4px auto 0 auto;
  132. width: 63%;
  133. justify-content: flex-end;
  134. font-style: italic;
  135. }
  136. </style>