feat(bouquet): crée un bouquet avec thématique, chantier, et datasets

src/config.js

@@ -1,3 +1,72 @@
 import config from '@siteConfig/config.yaml'
 
 export default config
+
+export const selectedThemeDefault = 'Produire'
+export const selectedSubThemeDefault = 'Nucléaire'
+
+export const thematiques = [
+  'Produire',
+  'Se nourrir',
+  'Se loger',
+  'Se déplacer',
+  'Préserver',
+  'Consommer',
+  'Chantiers transverses'
+]
+
+export const subThemes = {
+  Produire: [
+    'Nucléaire',
+    'Tertiaire (incluant les bâtiments publics de l\'État et des collectivités, hors logement)',
+    'Production d\'électricité décarbonée (hors nucléaire)',
+    'Production d\'énergie décarbonnée (hors éléctricité)',
+    'Prévention, gestion et valorisation des déchets',
+    'Transport de marchandises, logistique, e-commerce',
+    'Verdissement du secteur et des instruments financiers',
+    'Décarbonation de l’industrie'
+  ],
+  'Se nourrir': [
+    'Alimentation',
+    'Agriculture et pêche'
+  ],
+  'Se loger': [
+    'Construction et rénovation des logements',
+    'Aménagements des villes'
+  ],
+  'Se déplacer': [
+    'Voitures et infrastructures routières',
+    'Mobilité courte distance (hors voiture)',
+    'Mobilité longue distance (avion, train)'
+  ],
+  'Préserver': [
+    'Eau',
+    'Sols',
+    'Océans et mers',
+    'Forêt'
+  ],
+  'Consommer': [
+    'Consommation plus durable (ménages)',
+    'Numérique responsable',
+    'Achats durables (de l’État, des collectivités et des entreprises)'
+  ],
+  'Chantiers transverses': [
+    'Le financement qui permet de définir des trajectoires d’investissement crédibles et cohérentes',
+    'La planification et la différenciation territoriale selon les caractéristiques et les spécificités de chaque territoire, incluant les territoires ultra-marins',
+    'La transition des filières avec la gestion des emplois, des formations et des compétences',
+    'Les données environnementales',
+    'Les services publics exemplaires',
+    'La transition juste et les mesures d’accompagnement, pour ne laisser personne au bord du chemin',
+    'La sobriété des usages et des ressources'
+  ]
+}
+
+export const defaultOptions = {
+  'Produire': 'Nucléaire',
+  'Se nourrir': 'Alimentation',
+  'Se loger': 'Construction et rénovation des logements',
+  'Se déplacer': 'Voitures et infrastructures routières',
+  'Préserver': 'Eau',
+  'Consommer': 'Consommation plus durable (ménages)',
+  'Chantiers transverses': 'Le financement qui permet de définir des trajectoires d’investissement crédibles et cohérentes'
+}

src/constants/BouquetDataStep2.js

@@ -0,0 +1,87 @@
+export const thematiques = [
+  'Produire',
+  'Se nourrir',
+  'Se loger',
+  'Se déplacer',
+  'Préserver',
+  'Consommer',
+  'Chantiers transverses'
+]
+
+export const getOptions = (selectSubtheme) => {
+ switch (selectSubtheme) {
+   case 'Produire':
+     return [
+       'Nucléaire',
+       'Tertiaire (incluant les bâtiments publics de l\'État et des collectivités, hors logement)',
+       'Production d\'électricité décarbonée (hors nucléaire)',
+       'Production d\'énergie décarbonnée (hors éléctricité)',
+       'Prévention, gestion et valorisation des déchets',
+       'Transport de marchandises, logistique, e-commerce',
+       'Verdissement du secteur et des instruments financiers',
+       'Décarbonation de l’industrie',
+     ];
+   case 'Se nourrir':
+     return [
+       'Alimentation',
+       'Agriculture et pêche'
+     ];
+   case 'Se loger':
+     return [
+       'Construction et rénovation des logements',
+       'Aménagements des villes'
+     ];
+   case 'Se déplacer':
+     return [
+       'Voitures et infrastructures routières',
+       'Mobilité courte distance (hors voiture)',
+       'Mobilité longue distance (avion, train)'
+     ];
+   case 'Préserver':
+     return [
+       'Eau',
+       'Sols',
+       'Océans et mers',
+       'Forêt'
+     ];
+   case 'Consommer':
+     return [
+       'Consommation plus durable (ménages)',
+       'Numérique responsable',
+       'Achats durables (de l’État, des collectivités et des entreprises)'
+     ];
+   case 'Chantiers transverses':
+     return [
+       'Le financement qui permet de définir des trajectoires d’investissement crédibles et cohérentes',
+       'La planification et la différenciation territoriale selon les caractéristiques et les spécificités de chaque territoire, incluant les territoires ultra-marins',
+       'La transition des filières avec la gestion des emplois, des formations et des compétences',
+       'Les données environnementales',
+       'Les services publics exemplaires',
+       'La transition juste et les mesures d’accompagnement, pour ne laisser personne au bord du chemin',
+       'La sobriété des usages et des ressources'
+     ];
+   default:
+     return [];
+ }
+}
+
+export const getOptionDefault = (theme) => {
+ switch (theme) {
+   case 'Produire':
+     return 'Nucléaire'
+   case 'Se nourrir':
+     return 'Alimentation'
+   case 'Se loger':
+     return 'Construction et rénovation des logements'
+   case 'Se déplacer':
+     return 'Voitures et infrastructures routières'
+   case 'Préserver':
+     return 'Eau'
+   case 'Consommer':
+     return 'Consommation plus durable (ménages)'
+   case 'Chantiers transverses':
+     return 'Le financement qui permet de définir des trajectoires d’investissement crédibles et cohérentes'
+   default:
+     return null
+ }
+}

src/utils/index.js

@@ -1,5 +1,6 @@
 import { marked } from 'marked'
 import { stripHtml } from 'string-strip-html'
+import { subThemes } from '@/config'
 
 /**
  * Parse description from markdown to HTML
@@ -22,3 +23,13 @@ export const stripFromMarkdown = (value) => {
   const html = marked.parse(value, { mangle: false, headerIds: false })
   return stripHtml(html).result
 }
+
+/**
+ * Get sub-themes for a given main theme.
+ *
+ * @param {string} Subtheme
+ * @returns {Array}
+ */
+export function getSubThemes(Subtheme) {
+  return subThemes[Subtheme] || []
+}

src/views/bouquets/BouquetDetailView.vue

@@ -40,12 +40,21 @@ onMounted(() => {
       .then((ds) => (datasets.value = ds))
   })
 })
+
 </script>
 
 <template>
   <div class="fr-container--fluid fr-mt-4w fr-mb-4w">
     <h1>{{ bouquet.name }}</h1>
     <div v-html="description"></div>
+    <div v-if="bouquet.extras?.informations">
+      <div v-for="info in bouquet.extras.informations">
+        <h5>Thématique</h5>
+        <p>{{ info.theme }}</p>
+        <h5>Chantier</h5>
+        <p>{{ info['sub-theme'] }}</p>
+      </div>
+    </div>
 
     <h2 class="fr-mt-2w">Jeux de données</h2>
     <div v-if="!datasets.length">Pas de jeu de données dans ce bouquet.</div>