From a38f5ad12c7c11f1beb019601c160d595563999c Mon Sep 17 00:00:00 2001
From: Kseninia Mikhaylova <k.mikhailova@svs-tech.pro>
Date: Thu, 18 Jul 2024 17:11:49 +0300
Subject: [PATCH] images store part

---
 front/app.config.ts           |  2 +-
 front/app.vue                 |  6 +++---
 front/assets/main.scss        |  9 ++++-----
 front/components/getImage.vue | 21 ++++++++++-----------
 front/components/sidebar.vue  |  2 +-
 front/store/images.ts         |  5 ++---
 6 files changed, 21 insertions(+), 24 deletions(-)

diff --git a/front/app.config.ts b/front/app.config.ts
index e335bba..36077ae 100644
--- a/front/app.config.ts
+++ b/front/app.config.ts
@@ -1,6 +1,6 @@
 export default defineAppConfig({
     ui: {
         primary: 'pink',
-        gray: 'cool'
+        gray: 'stone'
     }
 })
\ No newline at end of file
diff --git a/front/app.vue b/front/app.vue
index 462f1d5..cde5749 100644
--- a/front/app.vue
+++ b/front/app.vue
@@ -5,10 +5,10 @@ import Logo from 'assets/logo.svg'
 <template>
   <div class="container">
     <div class="header">
-      <div class="logo">
+      <NuxtLink to="/" class="logo">
         <Logo />
-      </div>
-      <NuxtLink to="/">Инвентаризация</NuxtLink>
+        Инвентаризация
+      </NuxtLink>
     </div>
     <div class="sidebar">
       <Sidebar />
diff --git a/front/assets/main.scss b/front/assets/main.scss
index b169770..0571e86 100644
--- a/front/assets/main.scss
+++ b/front/assets/main.scss
@@ -15,10 +15,6 @@
         @apply text-lg;
     }
 
-    a[href]:not([class*=text]) {
-        // @apply text-primary-500 hover:text-primary-600
-    }
-
     .container {
         @apply grid grid-cols-12 mx-auto gap-4
     }
@@ -27,6 +23,9 @@
         @apply col-span-12 flex gap-2 p-2.5 border-b border-primary-700 bg-gradient-to-l from-primary-700;
         .logo {
             @apply text-2xl;
+            svg {
+                @apply text-3xl inline-block;
+            }
         }
     }
 
@@ -39,7 +38,7 @@
     }
 
     .page-header {
-        @apply border-b border-primary-200 dark:border-primary-950 py-4 bg-gradient-to-l from-primary-200 dark:from-primary-950;
+        @apply border-b border-primary-200 dark:border-primary-950 py-2.5 bg-gradient-to-l from-primary-200 dark:from-primary-950;
     }
 
     dl {
diff --git a/front/components/getImage.vue b/front/components/getImage.vue
index a278396..f4f15f5 100644
--- a/front/components/getImage.vue
+++ b/front/components/getImage.vue
@@ -1,28 +1,27 @@
 <script setup lang="ts">
+import { useImagesStore } from '~/store/images';
+
 const props = defineProps(['file_id'])
+const imagesStore = useImagesStore()
 
-import { apiBase } from '~/helpers';
-const headers = new Headers();
-headers.append("Content-Type", "application/json");
-
+const img = ref(imagesStore.getImage(props.file_id))
 const isOpen = ref(false)
-const file_url = ref()
 
-const file_url_data = await $fetch(`${apiBase}/tgbot/items/get_image/${props.file_id}/`, { headers })
-if ((file_url_data as string[]).length > 0) {
-    file_url.value = (file_url_data as string[])[0]
-}
 const openImage = () => {
     isOpen.value = !isOpen.value
 }
+console.log(imagesStore.getImage(props.file_id))
+watch(imagesStore, () => {
+    img.value = imagesStore.getImage(props.file_id)
+}, { deep: true })
 </script>
 <template>
-    <template v-if="file_url">
+    <template v-if="img.result">
         <a href="#">
             <Icon name="i-mdi-image" @click="openImage" />
         </a>
         <UModal v-model="isOpen">
-            <img :src="file_url" />
+            <img :src="img.result" />
         </UModal>
     </template>
 </template>
\ No newline at end of file
diff --git a/front/components/sidebar.vue b/front/components/sidebar.vue
index 1989676..51d66f0 100644
--- a/front/components/sidebar.vue
+++ b/front/components/sidebar.vue
@@ -20,5 +20,5 @@ const links = [
 ]
 </script>
 <template>
-    <UVerticalNavigation :links="links" />
+    <UVerticalNavigation :links="links"  />
 </template>
\ No newline at end of file
diff --git a/front/store/images.ts b/front/store/images.ts
index 8372b9c..5e0687d 100644
--- a/front/store/images.ts
+++ b/front/store/images.ts
@@ -8,14 +8,13 @@ export const useImagesStore = defineStore('images', {
     state: () => ({ list: {} as imagesList }),
     actions: {
         getImage(name: string) {
-            if (this.list[name]) {
-                return this.list[name].result
-            } else {
+            if (!this.list[name]) {
                 this.list[name] = {
                     status: 'idle',
                     result: 'https://media.istockphoto.com/id/1490517357/photo/scientists-are-researching-and-analyzing-harmful-contaminants-in-the-laboratory.webp?s=170667a&w=0&k=20&c=Fh4t-P_b-a1QxwyBUzUa0AuLp8FLNyLy4hl4HUm82Ao='
                 }
             }
+            return this.list[name]
         },
     },
 })
\ No newline at end of file