From f90ee5d5e7f7e39f91579afb4d20e4c508ed8f19 Mon Sep 17 00:00:00 2001
From: Kseninia Mikhaylova <k.mikhailova@svs-tech.pro>
Date: Fri, 6 Sep 2024 12:41:32 +0300
Subject: [PATCH] cover

---
 front/src/components/Gallery/item.vue | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/front/src/components/Gallery/item.vue b/front/src/components/Gallery/item.vue
index da2e963..0223925 100644
--- a/front/src/components/Gallery/item.vue
+++ b/front/src/components/Gallery/item.vue
@@ -3,11 +3,15 @@ import * as d3 from "d3"
 import { onMounted } from "vue"
 
 import { IMAGE_URL } from '../../constants'
+import { getRandomIntInclusive } from "../../helpers";
 
 const props = defineProps(['files'])
+const cover = getRandomIntInclusive(0, props.files.length)
+const coverImg = props.files.length > 1 ? `url(${props.files[cover]})` : 'url(/src/assets/promo/map.png)'
 
 onMounted(async () => {
-    const files = props.files
+    const files = props.files.length > 1 ? props.files.splice(cover, 1) : props.files
+
     // const width = 1920
     // const height = 1080
     const width = window.innerWidth
@@ -90,5 +94,12 @@ onMounted(async () => {
 })
 </script>
 <template>
-    <div id="gallery" style="    width: 100vw;    height: 100vh;"></div>
-</template>
\ No newline at end of file
+    <div id="gallery"></div>
+</template>
+<style scoped lang="scss">
+#gallery {
+    width: 100vw;
+    height: 100vh;
+    background-image: v-bind(coverImg);
+}
+</style>
\ No newline at end of file