maj config : création view pages static, modale réactive contenu soit static soit etape

This commit is contained in:
Valentin
2024-07-31 00:33:21 +02:00
parent c9ff3e45d7
commit 35ec4a8388
55 changed files with 1179 additions and 221 deletions

View File

@@ -0,0 +1,109 @@
import { defineStore } from 'pinia';
import REST from '../api/rest-axios';
export const useContentStore = defineStore('content', {
state: () => ({
etape: {
href: '',
title: '',
adresse: {},
etape_number: '',
dates: {},
geofield: {},
galeries: [],
parties: [],
saison: {},
thematiques: [],
vignette: {},
},
page: {
href: '',
title: '',
text: '',
},
loading: false,
error: null,
}),
actions: {
async fetchEtapeData(nid) {
this.loading = true;
this.error = null;
this.page = {};
try {
const response = await REST.get(`/jsonapi/node/etape/`);
for (let etape of response.data.data) {
if (etape.attributes.drupal_internal__nid == nid) {
for (let metatag of etape.attributes.metatag) {
if (metatag.tag === "link") {
this.etape.href = metatag.attributes.href;
}
}
this.etape.title = etape.attributes.title;
this.etape.adresse = etape.attributes.field_adresse;
this.etape.etape_number = etape.attributes.field_arret_numero;
this.etape.dates = etape.attributes.field_dates;
this.etape.geofield = etape.attributes.field_geofield;
this.etape.galeries = await fetchEtapeContent('field_galleries', etape.relationships);
const partiesFetch = await fetchEtapeContent('field_parties', etape.relationships);
let partiesArray = []
for (let partie of partiesFetch) {
partiesArray.push({ title: partie.attributes.field_titre, text: partie.attributes.field_texte.value });
}
this.etape.parties = partiesArray;
this.etape.saison = await fetchEtapeContent('field_saison', etape.relationships);
this.etape.saison = await fetchEtapeContent('field_saison', etape.relationships);
this.etape.thematiques = await fetchEtapeContent('field_thematiques', etape.relationships);
const vignetteFetch = await fetchEtapeContent('field_vignette', etape.relationships);
this.etape.vignette = { url: vignetteFetch.attributes.uri.url, alt: etape.attributes.field_vignette_alt };
break;
}
}
} catch (error) {
this.error = 'Failed to fetch data';
console.error('Issue with getNodeData', error);
} finally {
this.loading = false;
}
},
async fetchStaticData(nid) {
this.loading = true;
this.error = null;
this.etape = {};
try {
const response = await REST.get(`/jsonapi/node/static/`);
for (let staticContent of response.data.data) {
if (staticContent.attributes.drupal_internal__nid == nid) {
staticContent.attributes.metatag.forEach(item => {
if (item.tag === 'meta') {
this.page.title = item.attributes.content;
}
if (item.tag === 'link') {
this.page.href = item.attributes.href;
}
})
this.page.text = staticContent.attributes.field_texte.value;
console.log(this.page.title, this.page.href, this.page.text);
}
}
} catch (error) {
this.error = 'Failed to fetch data';
console.error('Issue with getNodeData', error);
} finally {
this.loading = false;
}
},
},
});
async function fetchEtapeContent(field, relationships) {
if (relationships[field].data) {
try {
const contentLink = relationships[field].links.related.href;
const contentFetch = await REST.get(contentLink);
return contentFetch.data.data;
} catch (error) {
this.error = 'Failed to fetch data';
console.error('Issue with getNodeData', error);
}
}
}

View File

@@ -1,75 +0,0 @@
import { defineStore } from 'pinia';
import REST from '../api/rest-axios';
export const useEtapeStore = defineStore('etape', {
state: () => ({
href: '',
title: '',
adresse: {},
etape_number: '',
dates: {},
geofield: {},
galeries: [],
parties: [],
saison: {},
thematiques: [],
vignette: {},
loading: false,
error: null,
}),
actions: {
async fetchEtapeData(nid) {
this.loading = true;
this.error = null;
try {
// const response = await REST.get(`/node/${nid}?_format=json`);
const response = await REST.get(`/jsonapi/node/etape/`);
for (let etape of response.data.data) {
if (etape.attributes.drupal_internal__nid == nid) {
for (let metatag of etape.attributes.metatag) {
if (metatag.tag === "link") {
this.href = metatag.attributes.href;
}
}
this.title = etape.attributes.title;
this.adresse = etape.attributes.field_adresse;
this.etape_number = etape.attributes.field_arret_numero;
this.dates = etape.attributes.field_dates;
this.geofield = etape.attributes.field_geofield;
this.galeries = await fetchEtapeContent('field_galleries', etape.relationships);
const partiesFetch = await fetchEtapeContent('field_parties', etape.relationships);
let partiesArray = []
for (let partie of partiesFetch) {
partiesArray.push({ title: partie.attributes.field_titre, text: partie.attributes.field_texte.value });
}
this.parties = partiesArray;
this.saison = await fetchEtapeContent('field_saison', etape.relationships);
this.saison = await fetchEtapeContent('field_saison', etape.relationships);
this.thematiques = await fetchEtapeContent('field_thematiques', etape.relationships);
const vignetteFetch = await fetchEtapeContent('field_vignette', etape.relationships);
this.vignette = { url: vignetteFetch.attributes.uri.url, alt: etape.attributes.field_vignette_alt };
break;
}
}
} catch (error) {
this.error = 'Failed to fetch data';
console.error('Issue with getNodeData', error);
} finally {
this.loading = false;
}
},
},
});
async function fetchEtapeContent(field, relationships) {
if (relationships[field].data) {
try {
const contentLink = relationships[field].links.related.href;
const contentFetch = await REST.get(contentLink);
return contentFetch.data.data;
} catch (error) {
this.error = 'Failed to fetch data';
console.error('Issue with getNodeData', error);
}
}
}