refactor du système de routing (EXPORTS DES SETTINGS DRUPAL)

This commit is contained in:
Valentin
2024-10-17 02:50:39 +02:00
parent 74f099ebdd
commit d5c5d81841
20 changed files with 613 additions and 712 deletions

View File

@@ -4,8 +4,8 @@
<div class="pattern"></div>
</div>
<div v-if="content.previous || content.next" class="related-etape-links">
<div v-if="content.previous" class="card previous" @click="store.fetchEtapeData(content.previous.nid, map)">
<div v-if="contentType === 'etape' && (content.previous || content.next)" class="related-etape-links">
<div v-if="content.previous" class="card previous" @click="displayRelatedElement(content.previous.url)">
<div class="icon">
<div :style="{ backgroundColor: content.previous.couleur }"></div>
<div :style="{ backgroundColor: content.previous.couleur }"></div>
@@ -21,7 +21,7 @@
</div>
</div>
</div>
<div v-if="content.next" class="card next" @click="store.fetchEtapeData(content.next.nid, map)">
<div v-if="content.next" class="card next" @click="displayRelatedElement(content.next.url)">
<div class="icon">
<div :style="{ backgroundColor: content.next.couleur }"></div>
<div :style="{ backgroundColor: content.next.couleur }"></div>
@@ -42,14 +42,25 @@
</template>
<script setup>
import router from '../../router/router.js';
import { useContentStore } from '../../stores/content';
const brandColor = "#80c8bf";
const store = useContentStore();
const props = defineProps({
contentType: String,
content: Object,
couleur: String,
map: Object,
});
async function displayRelatedElement(href) {
const baseUrl = window.location.protocol + "//" + window.location.host;
if (href.startsWith(baseUrl)) href = href.replace(baseUrl, '');
router.push(href);
await store.fetchContentData(baseUrl + href);
document.title = store.pageTitle;
}
</script>

View File

@@ -1,9 +1,9 @@
<template>
<header :style="content.vignette ? '' : { marginTop: '20vh' }">
<div class="cover">
<img v-if="content.vignette" :src="content.vignette.url" :alt="content.vignette.alt">
<img v-if="content.vignette" :src="content.vignette.url" :alt="content.vignette.alt">
</div>
<div v-if="content.dates" class="cartouche" :style="{ backgroundColor: couleur }">
<div v-if="contentType === 'etape' && content.dates" class="cartouche" :style="{ backgroundColor: couleur }">
<p>Étape n°{{content.etape_number}}</p>
<p>Du {{content.dates.start.d}} {{content.dates.start.m}} au {{ content.dates.end.d }} {{ content.dates.end.m }} {{ content.dates.end.y }}</p>
</div>
@@ -13,7 +13,7 @@
<div class="locality">
<div class="top-triangle"></div>
<div class="locality-title">
<h1>{{content.title}} <em v-if="content.adresse">({{ content.adresse.postal_code.slice(0, 2) }})</em></h1>
<h1>{{content.contentTitle}} <em v-if="content.adresse">({{ content.adresse.postal_code.slice(0, 2) }})</em></h1>
</div>
</div>
</header>
@@ -21,6 +21,7 @@
<script setup>
const props = defineProps({
contentType: String,
content: Object,
couleur: String,
});