virtual sample : show static vue files

public/content/projects/1_miss-dior-blooming-bouquet/4_virtual-sample/1_1_wright-victor-orientation-122023.pdf.txt

@@ -0,0 +1 @@
+Uuid: inTVYmCtOtEsv5eV

public/content/projects/1_miss-dior-blooming-bouquet/4_virtual-sample/virtual-sample.txt

@@ -2,6 +2,18 @@ Title: Échantillon virtuel
 
 ----
 
+Rawglass: - file://inTVYmCtOtEsv5eV
+
+----
+
+Finishedglass: 
+
+----
+
+Stepname: virtualSample
+
+----
+
 Views:
 
 - file://4J0jWX6DWA86y0Er
@@ -77,10 +89,6 @@ Views:
 
 ----
 
-Stepname: virtualSample
-
-----
-
 Stepindex: 5
 
 ----

src/components/project/virtual-sample/StaticView.vue

@@ -1,6 +1,7 @@
 <template>
   <header role="tablist" aria-labelledby="tablist">
     <button
+      v-if="step.files.static.rawGlass"
       id="verre-brut-label"
       type="button"
       role="tab"
@@ -11,6 +12,7 @@
       <span class="label">Verre brut</span>
     </button>
     <button
+      v-if="step.files.static.finishedGlass"
       id="verre-paracheve-label"
       type="button"
       role="tab"
@@ -21,10 +23,26 @@
     </button>
   </header>
   <div class="dialog__inner" id="verre-brut">
-    <!-- PdvViewer -->
+    <VPdfViewer
+      :darkMode="true"
+      :initialThumbnailsVisible="true"
+      :src="openedFile.url"
+      local="fr_FR"
+      @loaded="onPdfLoaded"
+    />
   </div>
 </template>
 
+<script setup>
+import { ref } from "vue";
+import { useVirtualSampleStore } from "../../../stores/virtualSample";
+import { VPdfViewer, useLicense } from "@vue-pdf-viewer/viewer";
+
+const { step } = useVirtualSampleStore();
+const activeTab = ref(Object.keys(step.files.static)[0]);
+const openedFile = ref(step.files.static[activeTab.value]);
+</script>
+
 <style scoped>
 .dialog__inner {
   background-color: inherit;

src/components/project/virtual-sample/VirtualSample.vue

@@ -12,6 +12,7 @@
     <template #header>
       <div class="dialog__tabs">
         <button
+          v-if="step.files.dynamic"
           class="btn btn--transparent | font-serif"
           data-icon="cursor"
           :aria-pressed="activeTab === 'dynamic' ? true : false"
@@ -20,6 +21,7 @@
           <span>Vue Dynamique</span>
         </button>
         <button
+          v-if="step.files.static"
           @click="activeTab = 'static'"
           class="btn btn--transparent | font-serif"
           data-icon="image"
@@ -82,13 +84,15 @@ import StaticView from "./StaticView.vue";
 import { ref } from "vue";
 import { useDialogStore } from "../../../stores/dialog";
 import { useVirtualSampleStore } from "../../../stores/virtualSample";
+import { usePageStore } from "../../../stores/page";
 
 const { file } = defineProps({
   file: Object,
 });
 
+const { page } = usePageStore();
 const { comments } = storeToRefs(useDialogStore());
-const { activeTab, currentFile } = storeToRefs(useVirtualSampleStore());
+const { activeTab, currentFile, step } = storeToRefs(useVirtualSampleStore());
 
 // Variables
 const isOpen = ref(true);

src/stores/virtualSample.js

@@ -1,11 +1,15 @@
 import { defineStore } from "pinia";
 import { ref, watch } from "vue";
+import { usePageStore } from "./page";
 
 export const useVirtualSampleStore = defineStore("virtual-sample", () => {
   const activeTab = ref("dynamic");
   const currentFile = ref(null);
 
+  const { page } = usePageStore();
+  const step = page.steps.find((step) => step.id === "virtualSample");
+
   watch(activeTab, () => (currentFile.value = null));
 
-  return { activeTab, currentFile };
+  return { activeTab, currentFile, step };
 });