Squashed commit message

frontend/admin/src/components/MainPageConfigurator/Blocks/SliderBlock.vue

@@ -0,0 +1,46 @@
+<template>
+  <BaseBlock
+    :title="`Слайдер - ${value.title || 'Без заголовка'}`"
+    @onRemove="$emit('onRemove')"
+    @onShowSettings="$emit('onShowSettings')"
+  >
+    <div class="tw:mt-3 tw:text-sm tw:dark:text-slate-300 tw:space-y-1">
+      <div><span class="tw:font-bold tw:dark:text-slate-200">Статус:</span>
+        {{ value.is_enabled ? 'Включен' : 'Выключен' }}
+      </div>
+      <div><span class="tw:font-bold tw:dark:text-slate-200">Эффект:</span>
+        {{ sliderEffectOptions[value.data.effect] || value.data.effect }}
+      </div>
+      <div><span class="tw:font-bold tw:dark:text-slate-200">Авто:</span>
+        {{ value.data.autoplay ? 'Включен' : 'Выключен' }}
+      </div>
+      <div><span class="tw:font-bold tw:dark:text-slate-200">Цель Яндекс.Метрики:</span>
+        {{ value.goal_name || 'Не задана' }}
+      </div>
+    </div>
+
+    <div class="tw:mt-6 tw:flex tw:flex-wrap tw:gap-4">
+      <img
+        v-if="value.data.slides && value.data.slides.length > 0"
+        v-for="slide in value.data.slides"
+        :alt="slide.title"
+        class="tw:w-24 tw:h-24 tw:object-cover tw:rounded-md tw:border-2 tw:border-slate-200 dark:tw:border-slate-600"
+        :src="getThumb(slide.image)"
+      />
+    </div>
+  </BaseBlock>
+</template>
+
+<script setup>
+import {getThumb} from "@/utils/helpers.js";
+import {sliderEffectOptions} from "@/utils/constants..js";
+import BaseBlock from "@/components/MainPageConfigurator/Blocks/BaseBlock.vue";
+
+const emit = defineEmits(['onRemove', 'onShowSettings']);
+const props = defineProps({
+  value: {
+    type: Object,
+    required: true,
+  }
+});
+</script>