bachir/drupal-caravane
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

modifs backoffice : contenu page 'gouvernance' passe sur la page 'contact' / rework du st

Browse Source 
ore 'content'
This commit is contained in:
Valentin Le Moign
2025-01-20 18:34:00 +01:00
parent c4d5cf6c9e
commit f575ae894f
84 changed files with 732 additions and 686 deletions
Download Patch File Download Diff File Expand all files Collapse all files

250
web/themes/custom/caravane/assets/js/stores/content.js
View File

@@ -18,6 +18,10 @@ export const useContentStore = defineStore('content', {
next: {},
vignette: {},
parties: [],
intro: '',
partenaires: [],
gouvernances: [],
},
loading: false,
error: null,
@@ -25,48 +29,49 @@ export const useContentStore = defineStore('content', {
actions: {
async fetchContentData(path) {
this.resetStore(false);
const contentTypes = [ 'etape', 'static', 'equipe', 'partenaires' ];
const contentTypes = [ 'etape', 'static', 'gouvernance', 'partenaire' ];
try {
let rawContent,
contentType,
response;
contentTypesLoop:
const findContentByPath = async (contentTypes, path) => {
for (let type of contentTypes) {
if (type !== 'partenaires') {
response = await REST.get(`/jsonapi/node/${type}/`);
for (let content of response.data.data) {
for (let tag of content.attributes.metatag) {
if (tag.tag === "link" && tag.attributes.href === path) {
this.contentType = type;
rawContent = content;
contentType = type;
break contentTypesLoop;
}
}
// pour les pages équipes
if (!rawContent) {
const baseUrl = window.location.protocol + "//" + window.location.host;
if (path.startsWith(baseUrl)) {
const shortenPath = path.slice(baseUrl.length + 1);
if (content.attributes.title.toLowerCase() === shortenPath) {
this.contentType = type;
rawContent = content;
contentType = type;
break contentTypesLoop;
}
}
}
const response = await REST.get(`/jsonapi/node/${type}/`);
const content = response.data.data.find(content =>
content.attributes.metatag.some(tag =>
tag.tag === "link" && tag.attributes.href === path
)
);
if (content) {
return {
contentType: type,
rawContent: content,
};
}
// Handle special case for governance/partners (multiple items per page)
const pageRequested = window.location.href.split('/').pop().replace(/s?$/, '');
if (type === pageRequested
|| (type === 'gouvernance' && pageRequested === 'contact')
) {
return {
contentType: type,
rawContent: response.data.data,
};
}
} else {
// pour les pages partenaires
rawContent = await REST.get('/rest/partenaires/');
contentType = type;
this.contentType = type;
}
}
return null;
};
if (this.contentType !== 'equipe' && this.contentType !== 'partenaires') {
// pageTitle
const { contentType, rawContent } = await findContentByPath(contentTypes, path);
this.contentType = contentType;
// console.log(`current type: ${contentType}`);
if (this.contentType !== 'gouvernance' && this.contentType !== 'partenaire') {
// pageTitle
for (let tag of rawContent.attributes.metatag) {
if (tag.tag === "meta") {
this.pageTitle = tag.attributes.content;
@@ -77,7 +82,7 @@ export const useContentStore = defineStore('content', {
this.content.contentTitle = rawContent.attributes.title;
// vignette
const vignetteFetch = await this.fetchFromRelationships('field_vignette', rawContent.relationships);
const vignetteFetch = await this.fetchFromRelationships('field_vignette', rawContent.relationships);
if (vignetteFetch) {
this.content.vignette = {
url: vignetteFetch.attributes.uri.url,
@@ -103,8 +108,8 @@ export const useContentStore = defineStore('content', {
end: this.getCleanDate(rawContent.attributes.field_dates.end_value),
}
// previous / next
await this.getRelatedEtape('previous', response.data.data, path);
await this.getRelatedEtape('next', response.data.data, path);
await this.getRelatedEtape('previous', path);
await this.getRelatedEtape('next', path);
}
// parties
@@ -197,52 +202,59 @@ export const useContentStore = defineStore('content', {
this.content.parties.push(partieContent);
}
}
} else if (this.contentType === 'equipe') {
// pour les pages équipe
for (let tag of rawContent.attributes.metatag) {
if (tag.tag === "meta") {
this.pageTitle = tag.attributes.content;
break;
}
}
this.content.contentTitle = rawContent.attributes.title;
this.content.textIntro = rawContent.attributes.body.value;
const personnesArray = [];
const personnes = await this.fetchFromRelationships('field_personne_s', rawContent.relationships);
for (let personne of personnes) {
const fetchPortrait = await this.fetchFromRelationships('field_portrait', personne.relationships);
personnesArray.push({
nom: personne.attributes.field_nom,
prenom: personne.attributes.field_prenom,
description: personne.attributes.field_description,
portrait_alt: personne.relationships.field_portrait.data.meta.alt,
portrait_url: fetchPortrait.attributes.uri.url,
});
} else {
// pages gouvernance (contact) et partenaire
// ont plusieurs items par pages
const intro = await REST.get(`/jsonapi/config_pages/intro_${this.contentType}/`);
const introContent = intro.data.data[0];
this.pageTitle =
`${introContent.attributes.field_titre} ${introContent.attributes.metatag.find(tag => tag.tag === "meta")?.attributes.content}`;
this.content.contentTitle = introContent.attributes.field_titre;
this.content.intro = introContent.attributes.field_intro.value;
const multiItemPageArray = [];
if (this.contentType === 'partenaire') {
for (let item of rawContent) {
const logoFetch = await REST.get(item.relationships.field_logo.links.related.href);
multiItemPageArray.push({
title: item.attributes.title,
description: item.attributes.body.value,
weight: item.attributes.field_poid,
link_url: item.attributes.field_lien.uri ,
logo_alt: item.relationships.field_logo.data.meta.alt,
logo_url: logoFetch.data.data.attributes.uri.url,
});
}
} else if (this.contentType === 'gouvernance') {
for (let item of rawContent) {
const personnesFetch = await REST.get(item.relationships.field_personne_s.links.related.href);
let personnes = [];
for (let personne of personnesFetch.data.data) {
const portraitFetch = await REST.get(personne.relationships.field_portrait.links.related.href);
personnes.push({
nom: personne.attributes.field_nom,
prenom: personne.attributes.field_prenom,
description: personne.attributes.field_description,
photo_meta: personne.relationships.field_portrait.data?.meta.alt,
photo_url: portraitFetch.data.data?.attributes.uri.url,
});
}
multiItemPageArray.push({
title: item.attributes.title,
weight: item.attributes.field_poid,
personnes: personnes,
});
}
}
this.content.personnes = personnesArray;
// await this.fetchFromId(bundle, id);
// est peut-être plus lisible que fetchFromRelationships
} else if (this.contentType === 'partenaires') {
this.content.contentTitle = "Partenaires";
const partenairesArray = [];
for (let partenaire of rawContent.data) {
partenairesArray.push({
title: partenaire.title[0].value,
description: partenaire.body[0].value,
link_url: partenaire.field_lien[0].uri,
link_text: partenaire.field_lien[0].title,
logo_url: partenaire.field_logo[0].url,
logo_alt: partenaire.field_logo[0].alt,
weight: partenaire.field_poid[0].value,
})
}
this.content.partenaires = partenairesArray;
}
this.content[`${this.contentType}s`] = multiItemPageArray;
console.log(this.content);
}
} catch (error) {
this.error = 'Failed to fetch data';
console.error('Issue with getNodeData', error);
@@ -257,59 +269,45 @@ export const useContentStore = defineStore('content', {
y: date.split('-')[0],
}
},
async getRelatedEtape(direction, allEtapesData, path) {
const getRelatedEtapeContent = async (relatedPath, allEtapesData) => {
const baseUrl = window.location.protocol + "//" + window.location.host;
for (let etape of allEtapesData) {
for (let tag of etape.attributes.metatag) {
if (tag.tag === "link" && tag.attributes.href === baseUrl + relatedPath) {
const vignetteFetch = await REST.get(etape.relationships.field_vignette.links.related.href);
this.content[direction] = {
url: tag.attributes.href,
couleur: etape.attributes.field_couleur,
title: etape.attributes.title,
postalCode: etape.attributes.field_adresse.postal_code,
dates: {
start: this.getCleanDate(etape.attributes.field_dates.value),
end: this.getCleanDate(etape.attributes.field_dates.end_value),
},
vignette: {
url: vignetteFetch.data.data.attributes.uri.url,
alt: etape.relationships.field_vignette.data.meta.alt,
},
}
async getRelatedEtape(direction, path) {
const getRelatedEtapeContent = async (relatedEtapeData) => {
if (relatedEtapeData) {
const vignetteFetch = await REST.get(relatedEtapeData.relationships.field_vignette.links.related.href);
if (vignetteFetch.data.data) {
this.content[direction] = {
url: relatedEtapeData.attributes.metatag.find(tag => tag.tag === "link")?.attributes.href,
couleur: relatedEtapeData.attributes.field_couleur,
title: relatedEtapeData.attributes.title,
postalCode: relatedEtapeData.attributes.field_adresse.postal_code,
dates: {
start: this.getCleanDate(relatedEtapeData.attributes.field_dates.value),
end: this.getCleanDate(relatedEtapeData.attributes.field_dates.end_value),
},
vignette: {
url: vignetteFetch.data.data.attributes.uri.url,
alt: relatedEtapeData.relationships.field_vignette.data.meta.alt,
},
}
}
}
}
// TODO :
// get the ordered view from here
// /jsonapi/views/etapes/block_1?views-argument%5B0%5D=all&views-argument%5B1%5D=all
const orderedEtapesList = document.querySelectorAll('#etapes-liste li');
if (orderedEtapesList) {
for (let li of orderedEtapesList) {
const liHref = li.querySelector('a').getAttribute('href');
if (path.endsWith(liHref)) {
const previousEtapeItemPath = li.previousElementSibling?.querySelector('a').getAttribute('href');
const nextEtapeItemPath = li.nextElementSibling?.querySelector('a').getAttribute('href');
if (previousEtapeItemPath && direction === 'previous') {
let prevContent = await getRelatedEtapeContent(previousEtapeItemPath, allEtapesData);
return prevContent;
}
if (nextEtapeItemPath && direction === 'next') {
let nextContent = await getRelatedEtapeContent(nextEtapeItemPath, allEtapesData);
return nextContent;
}
}
const allEtapesData = await REST.get('/jsonapi/views/etapes/block_1/');
for (let [index, etape] of allEtapesData.data.data.entries()) {
if (etape.attributes.metatag.some(tag =>
tag.tag === "link" && tag.attributes.href === path
)) {
const relatedEtapeIndex = direction === 'next' ? index + 1 : index - 1;
await getRelatedEtapeContent(allEtapesData.data.data[relatedEtapeIndex]);
}
}
},
async fetchFromRelationships(field, relationships) {
if (relationships[field].data) {
if (relationships[field].links) {
try {
const contentLink = relationships[field].links.related.href;
const contentFetch = await REST.get(contentLink);
const contentFetch = await REST.get(contentLink);
return contentFetch.data.data;
} catch (error) {
this.error = 'Failed to fetch data';