ajout de strapi

app/pages/agenda.vue

@@ -0,0 +1,68 @@
+<template>
+  <div>
+    <h1>Page Agenda</h1>
+
+
+    <div>
+      <p>Lien interne</p>
+      <div>
+        <button_link to="/">Voir l'accueil</button_link>
+      </div>
+      <div>
+        <button_link to="/" variant="primary">Voir l'accueil</button_link>
+      </div>
+      <div>
+        <button_link to="/" variant="secondary">Voir l'accueil</button_link>
+      </div>
+      <div>
+        <button_link to="/" variant="outline">Voir l'accueil</button_link>
+      </div>
+    </div>
+
+    <div v-if="errorApi1">Erreur : {{ errorApi1.message }}</div>
+    <div v-else-if="!api1">Chargement en cours...</div>
+    <div v-else>
+      <h2 v-if="api1">{{ api1.message }}</h2>
+      <h2 v-if="api1">api1 = {{ api1 }}</h2>
+    </div>
+
+    
+    <testcomponentpage />
+
+    <div v-if="errorTotos">Erreur : {{ errorTotos.message }}</div>
+    <div v-else-if="!totos">Chargement en cours...</div>
+    <div v-else>
+      <pre v-if="totos">
+        {{ totos }}
+      </pre>
+      <div v-if="totos">
+        <article v-for="toto in totos" :key="toto.id">
+            <h2>{{ toto.title }}</h2>
+            <p>{{ toto.body.slice(0, 1000) }}</p>
+            <p>
+              <NuxtLink :to="`/concerts/concert-${toto.id}`">Lire la suite</NuxtLink>
+            </p>
+        </article>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script setup>
+
+  import button_link from '~/components/button_link.vue'
+
+  const {data: totos, error: errorTotos} = await useFetch(() => 'https://jsonplaceholder.typicode.com/posts?_limit=20')
+  const {data: api1, error: errorApi1} = await useFetch('/api/hello')
+  const config = useAppConfig()
+  useSeoMeta({
+    title: config.title
+  })
+  const appConfig = useAppConfig()
+  console.log("test 4 : ",appConfig.title) // "Mon site Nuxt"
+</script>
+
+<style>
+
+</style>

app/pages/concerts/concert-[id].vue

@@ -0,0 +1,24 @@
+<template>
+  <div>
+    <div v-if="toto">
+      <h1>#{{route.params.id }} / {{ toto.title }}</h1>
+      <p>{{ toto.body }}</p>
+    </div>
+    <div v-else>
+      <p>Chargement...</p>
+    </div>
+
+  </div>
+</template>
+
+<script setup>
+  const route = useRoute()
+  const {data: toto} = await useFetch(() => 'https://jsonplaceholder.typicode.com/posts/' + route.params.id, { lazy: true })
+  useSeoMeta({
+    title: () => toto.value?.title
+  })
+</script>
+
+<style>
+
+</style>

app/pages/index.vue

@@ -0,0 +1,59 @@
+<template>
+  <div>
+    <Header_full></Header_full>
+    <main>
+      <div>
+        <div>IMAGE TEST</div>
+        <NuxtImg :src="imageUrl" width="1300" height="600" sizes="100vw sm:50vw md:400px" densities="x1 x2" :modifiers="{ roundCorner: '0:100' }" />
+        <!-- <img :src="imageUrl" alt="" style="max-width: 100%; height: auto;"> -->
+      </div>
+    </main>
+  </div>
+    
+</template>
+
+<script setup>
+  const runtimeConfig = useRuntimeConfig()
+  const STRAPI_URL = "http://localhost:1337"
+  //const STRAPI_URL = runtimeConfig.public.strapiUrl
+  console.log("STRAPI_URL : ",STRAPI_URL) // "Mon site Nuxt"
+
+  // Config app (pour ton SEO)
+  const config = useAppConfig()
+  useSeoMeta({
+    title: config.title
+  })
+
+  // On récupère le fichier le plus récent de la Media Library Strapi
+  const { data: files, error } = await useFetch(
+    () => `${STRAPI_URL}/api/upload/files?pagination[pageSize]=1&sort=createdAt:desc`
+  )
+
+  const imageUrl = computed(() => {
+    const file = files.value?.[0]
+    console.log("file : ",file)
+    if (!file) return null
+
+    // Si Strapi renvoie une URL absolue (S3/OVH)
+    if (file.url?.startsWith('http')) {
+      return file.url
+    }
+
+    // Si jamais c'était une URL relative
+    return `${STRAPI_URL}${file.url}`
+  })
+  console.log("imageUrl : ",imageUrl)
+
+
+  if (error.value) {
+    console.error('Erreur en récupérant les fichiers Strapi :', error.value)
+  }
+
+  const appConfig = useAppConfig()
+  console.log("test 3 : ",appConfig.title) // "Mon site Nuxt"
+</script>
+
+<style>
+
+
+</style>

app/pages/test_header_2.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="header_full_2">
+
+    <header_content img-src="@/assets/img/logos/logo_orchestre_red.svg" img-agenda-src="@/assets/img/icones/agenda_rouge.svg"/>
+    
+    <div class="obscur"></div>
+
+    <div class="header-img_cont">
+        <NuxtImg
+            src="@/assets/img/photos/orchestre_header.jpg"
+            placeholder
+            preset="full"
+            alt="L'orchestre National d'Île-de-france en concert - vue d'ensemble"
+            class="header-img"
+        />
+    </div>
+
+    <div class="header-img_text">
+        <div class="header-img_titre">ZAHO DE SAGAZAN</div>
+        <div class="header-img_description">Accompagnée par l’Orchestre national d’Île-de-France dirigé par Dylan Corlay, Zaho de Sagazan revisite les chansons de son premier album pour les plonger dans une toute nouvelle dimension !</div>
+        <div class="decouvrir"><div class="decouvrir_icone"><img src="@/assets/img/icones/fleche_gris_blanc.svg" alt="icone flèche"></div><div class="decouvrir_texte">Découvrir</div></div>
+    </div>
+
+  </div>
+</template>
+
+<script setup>
+
+  const config = useAppConfig()
+  useSeoMeta({
+    title: config.title
+  })
+  const appConfig = useAppConfig()
+  console.log("test 3 : ",appConfig.title) // "Mon site Nuxt"
+</script>
+
+<style>
+
+
+</style>