Nikita Kiselev
f329bfa9d9
Some checks failed
Telegram Mini App Shop Builder / Compute version metadata (push) Has been cancelled
Telegram Mini App Shop Builder / Run Frontend tests (push) Has been cancelled
Telegram Mini App Shop Builder / Run Backend tests (push) Has been cancelled
Telegram Mini App Shop Builder / Run PHP_CodeSniffer (push) Has been cancelled
Telegram Mini App Shop Builder / Build module. (push) Has been cancelled
Telegram Mini App Shop Builder / release (push) Has been cancelled
47 lines
1.7 KiB
Vue
47 lines
1.7 KiB
Vue
<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>
|