test

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/21361147_au-commencement-du-college-chloe-avait-donc-fait-la-connaissance-dun-garcon.-il-etait-plus-vieux.pdf.txt

@@ -1,9 +0,0 @@
-Date: 2024-10-16 01:15
-
-----
-
-Uuid: fGa7zaC6S5zprMyo
-
-----
-
-Template: document

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/4034442471_bleu-divague.jpg.txt

@@ -0,0 +1,17 @@
+Date: 2024-10-16 02:10
+
+----
+
+Description: 
+
+----
+
+Tags: DA globale
+
+----
+
+Uuid: BvOqspCnL024Ar9u
+
+----
+
+Template: image

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/black-1984277_1280.jpg.txt

@@ -0,0 +1,17 @@
+Description: description
+
+----
+
+Tags: 
+
+----
+
+Sort: 7
+
+----
+
+Uuid: zIZTny7xOE28rckL
+
+----
+
+Template: image

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/client-brief.txt

@@ -6,7 +6,7 @@ Stepname: clientBrief
 
 ----
 
-Pdf: - file://fGa7zaC6S5zprMyo
+Pdf: 
 
 ----
 
@@ -16,6 +16,12 @@ Description:
 
 Moodboard:
 
+- file://YV7aUYle8hcLrzb6
+- file://zIZTny7xOE28rckL
+- file://Z5m6jEomcOt9bJqR
+- file://C2zFxRDOmD5PeXD6
+- file://BvOqspCnL024Ar9u
+
 ----
 
 Stepindex: 1

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/perfume-144546_1280.jpg.txt

@@ -0,0 +1,17 @@
+Description: 
+
+----
+
+Tags: 
+
+----
+
+Sort: 8
+
+----
+
+Uuid: Z5m6jEomcOt9bJqR
+
+----
+
+Template: image

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/perfume-2643349_1280.jpg.txt

@@ -0,0 +1,17 @@
+Description: 
+
+----
+
+Tags: 
+
+----
+
+Sort: 10
+
+----
+
+Uuid: C2zFxRDOmD5PeXD6
+
+----
+
+Template: image

public/content/projects/1_miss-dior-blooming-bouquet/1_client-brief/perfume-4718455_1280.jpg.txt

@@ -0,0 +1,17 @@
+Description: 
+
+----
+
+Tags: 
+
+----
+
+Sort: 12
+
+----
+
+Uuid: YV7aUYle8hcLrzb6
+
+----
+
+Template: image

public/site/models/project.php

@@ -5,12 +5,21 @@ class ProjectPage extends Page {
     $steps = [];
 
     foreach ($this->children() as $child) {
+      $files = [];
+
+      if ($child->stepName() == 'clientBrief') {
+        foreach ($child->moodboard()->toFiles() as $file) {
+          $files[] = getFileData($file);
+        }
+      }
+
       $steps[] = [
         'text' => $child->title()->value(),
         'value' => $child->stepName()->value(),
         'index' => $child->stepIndex()->value(),
         'modified' => $child->modified('Y-MM-dd'),
-        'uri' => $child->uri()
+        'uri' => $child->uri(),
+        'files' => $files
       ];
     }
 

public/site/plugins/helpers/index.php

@@ -0,0 +1,16 @@
+<?php
+
+function getFileData($file) {
+  $data = [
+    'url' => $file->url(),
+    'uuid' => (string) $file->uuid(),
+    'name' => $file->filename(),
+  ];
+
+  if ($file->description()->exists()) {
+    $data['description'] = $file->description();
+    $data['tags'] = $file->tags()->split();
+  };
+
+  return $data;
+}

public/site/plugins/kql/README.md

@@ -22,7 +22,7 @@ Given a POST request to: `/api/query`
         "title": true,
         "text": "page.text.markdown",
         "images": {
-      "query": "page.images",
+            "query": "page.moodboard",
             "select": {
                 "url": true
             }
@@ -124,7 +124,8 @@ const username = "apiuser";
 const password = "strong-secret-api-password";
 
 const headers = {
-  Authorization: "Basic " + Buffer.from(`${username}:${password}`).toString("base64"),
+    Authorization:
+        "Basic " + Buffer.from(`${username}:${password}`).toString("base64"),
     "Content-Type": "application/json",
     Accept: "application/json",
 };
@@ -509,7 +510,7 @@ const response = await fetch(api, {
         query: "page('photography').children",
         select: {
             title: "page.title",
-      images: "page.images",
+            images: "page.moodboard",
         },
     }),
     headers,
@@ -560,7 +561,7 @@ const response = await fetch(api, {
         select: {
             title: "page.title",
             images: {
-        query: "page.images",
+                query: "page.moodboard",
                 select: {
                     filename: true,
                 },
@@ -741,7 +742,7 @@ const response = await fetch(api, {
         select: {
             title: "page.title",
             images: {
-        query: "page.images",
+                query: "page.moodboard",
                 pagination: {
                     page: 2,
                     limit: 5,
@@ -784,7 +785,7 @@ const response = await fetch(api, {
                 select: {
                     title: true,
                     images: {
-            query: "page.images",
+                        query: "page.moodboard",
                         select: {
                             url: true,
                             alt: true,
@@ -970,6 +971,7 @@ KQL only offers access to data in your site. It does not support any mutations.
 -   [KQL + Nuxt](https://nuxt-kql.jhnn.dev)
 
 ## What's Kirby?
+
 -   **[getkirby.com](https://getkirby.com)** – Get to know the CMS.
 -   **[Try it](https://getkirby.com/try)** – Take a test ride with our online demo. Or download one of our kits to get started.
 -   **[Documentation](https://getkirby.com/docs/guide)** – Read the official guide, reference and cookbook recipes.

public/site/templates/client-brief.json.php

@@ -1,20 +1,14 @@
 <?php
 
-$images = [];
+$moodboard = [];
 
 foreach ($page->moodboard()->toFiles() as $image) {
-  $images[] = [
-    'url' => $image->url(),
-    'uuid' => (string) $image->uuid(),
-    'tags' => $image->tags()->split(),
-    'name' => $image->filename(),
-    'description' => $image->description()->value(),
-  ];
+  $moodboard[] = getFileData($image);
 }
 
 $specificData = [
   "tags" => $page->parent()->parent()->clientBriefImageTags()->split(),
-  "images" => $images
+  "moodboard" => $moodboard
 ];
 
 $data = array_merge($genericData, $specificData);

public/site/templates/project.json.php

@@ -1,13 +1,11 @@
 <?php
-
 $project = [
   'title' => $page->title()->value(),
   'url' => $page->url(),
   'modified' => $page->modified('Y-MM-d'),
   'status' => $page->status(),
   'logo' => $page->client()->toPage()->logo()->toFile()->url(),
-  'currentStep' => $page->currentStep()->value(),
-  'steps' => $page->getSteps()
+  'steps' => $page->getSteps(),
 ];
 
 $data = array_merge($genericData, $project);

src/components/project/ProjectStep.vue

@@ -4,6 +4,7 @@
     aria-labelledby="votre-brief-label"
     :data-status="status"
   >
+    <router-link :to="'/' + step.uri">
       <h2 id="votre-brief-label">
         <span data-icon="votre-brief">{{ step.text }}</span>
       </h2>
@@ -17,24 +18,20 @@
               dayjs(step.modified).format("DD MMMM YYYY")
             }}</time>
           </div>
-        <router-link :to="'/' + step.uri">
-          <figure class="card__images" data-count="13">
+
+          <template v-if="step.value === 'clientBrief'">
+            <figure class="card__images" :data-count="step.files.length - 3">
               <img
-              src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/6ed93d6950-1725442486/d82f18573c439d6edd434ffca62471a7.png"
-              alt=""
-            />
-            <img
-              src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/7b0fcc5012-1725442486/37a038883c87973036232aa0e43f6da2.png"
-              alt=""
-            />
-            <img
-              src="http://localhost:8888/media/pages/inspirations/shape-of-the-nature/1bbe051c5a-1725442486/0c41d3266e9ce2872f30608cceb28239.png"
-              alt=""
+                v-for="image in step.files.slice(0, 3)"
+                :key="image.uuid"
+                :src="image.url"
+                :alt="image.alt"
               />
             </figure>
-        </router-link>
+          </template>
         </article>
       </div>
+    </router-link>
   </section>
 </template>
 
@@ -51,14 +48,9 @@ dayjs.locale("fr");
 
 const { page } = usePageStore();
 
-const steps = [
-  "clientBrief",
-  "proposal",
-  "extended-brief",
-  "industrialIdeation",
-  "virtualSample",
-  "physicalSample",
-];
+const steps = page.steps.map((item) => {
+  return item.value;
+});
 
 const status = setStatus();
 

src/components/project/client-brief/Images.vue

@@ -12,7 +12,7 @@
       >
         Ajouter une ou plusieurs images
       </button>
-      <template v-for="image in page.images" :key="image.uri">
+      <template v-for="image in page.moodboard" :key="image.uri">
         <figure
           v-if="
             selectedTags.length === 0 ||
@@ -66,7 +66,7 @@ function changeSelectedTags(newTags) {
 
 function removeImage(target) {
   console.log("remove", target);
-  page.value.images = page.value.images.filter(
+  page.value.moodboard = page.value.moodboard.filter(
     (image) => image.uuid !== target.uuid
   );
 }

src/components/project/client-brief/add-images-modal/ImagesEditPanel.vue

@@ -198,7 +198,7 @@ function addImagesToBrief() {
     })
       .then((res) => res.json())
       .then((json) => {
-        page.value.images = json.images;
+        page.value.moodboard = json.images;
         console.log(json);
       })
       .catch((error) => console.error("Error:", error));

src/views/ClientBrief.vue

@@ -1,7 +1,11 @@
 <template>
   <main class="flex flex-col items-stretch | w-full" style="--row-gap: 2rem">
     <header class="flex | bg-white | rounded-2xl | p-8">
-      <router-link :to="'/' + page.parent" class="btn btn--white" data-icon="arrow-left">
+      <router-link
+        :to="'/' + page.parent"
+        class="btn btn--white"
+        data-icon="arrow-left"
+      >
         <span>Retour au projet</span>
       </router-link>
       <button class="btn | ml-auto">Valider et envoyer le brief</button>