modified: main_dc/BB/bbvue/src/views/Gallery.vue
change gallary and add photos from magnitogorsk
This commit is contained in:
@@ -7,11 +7,11 @@
|
||||
<p class="hero-subtitle">Запечатленные моменты тренировок, соревнований и дружеских встреч</p>
|
||||
<div class="hero-stats">
|
||||
<div class="stat">
|
||||
<div class="stat-number">24+</div>
|
||||
<div class="stat-number">32+</div>
|
||||
<div class="stat-label">Фотографий</div>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<div class="stat-number">12+</div>
|
||||
<div class="stat-number">15+</div>
|
||||
<div class="stat-label">Мероприятий</div>
|
||||
</div>
|
||||
<div class="stat">
|
||||
@@ -80,7 +80,6 @@
|
||||
<!-- Сетка фотографий -->
|
||||
<div class="gallery-grid">
|
||||
<div v-for="(image, index) in filteredImages" :key="index" class="gallery-item" @click="openLightbox(index)">
|
||||
<div>{{ getImageUrl(image.src) }}</div>
|
||||
<img :src="getImageUrl(image.src)" :alt="image.alt" class="gallery-image" loading="lazy">
|
||||
<div class="gallery-overlay">
|
||||
<div class="overlay-content">
|
||||
@@ -179,6 +178,13 @@ export default {
|
||||
description: 'Командное фото после успешного забега',
|
||||
date: 'Январь 2025'
|
||||
},
|
||||
{
|
||||
src: 'ivents/magnitogorsk_2025/bb1.jpg',
|
||||
alt: 'Беговой клуб Бегущий Башкир в Магнитогорске 2025',
|
||||
title: 'Магнитогорск 2025',
|
||||
description: 'Участие в забеге в Магнитогорске',
|
||||
date: 'Январь 2025'
|
||||
},
|
||||
{
|
||||
src: 'slider/slider1.jpg',
|
||||
alt: 'Беговой клуб, общее фото',
|
||||
@@ -199,43 +205,48 @@ export default {
|
||||
title: 'Групповая тренировка',
|
||||
description: 'Поддержка и мотивация в команде',
|
||||
date: 'Ноябрь 2024'
|
||||
},
|
||||
{
|
||||
src: 'slider/slider5.jpg',
|
||||
alt: 'Беговой клуб, общее фото',
|
||||
title: 'Соревнования',
|
||||
description: 'Участие в городских забегах',
|
||||
date: 'Ноябрь 2024'
|
||||
}
|
||||
],
|
||||
allImages: [
|
||||
// Первые 6 - это слайды, остальные - дополнительные фото
|
||||
{ src: 'slider/slider1.jpg', alt: 'Тренировка в парке', date: 'Декабрь 2024', category: 'training' },
|
||||
{ src: 'slider/slider2.jpg', alt: 'Техника бега', date: 'Декабрь 2024', category: 'training' },
|
||||
{ src: 'slider/slider4.jpg', alt: 'Групповая тренировка', date: 'Ноябрь 2024', category: 'training' },
|
||||
{ src: 'slider/slider5.jpg', alt: 'Соревнования', date: 'Ноябрь 2024', category: 'events' },
|
||||
{ src: 'slider/slider6.jpg', alt: 'Награждение', date: 'Ноябрь 2024', category: 'events' },
|
||||
{ src: 'slider/slider7.jpg', alt: 'Командный дух', date: 'Октябрь 2024', category: 'community' },
|
||||
{ src: 'slider/workout1.jpg', alt: 'Тренировка на набережной', date: 'Октябрь 2025', category: 'training' },
|
||||
{ src: 'slider/workout2.jpg', alt: 'Тренировка на набережной', date: 'Октябрь 2025', category: 'training' },
|
||||
{ src: 'slider/workout3.jpg', alt: 'Тренировка на набережной', date: 'Октябрь 2025', category: 'training' },
|
||||
{ src: 'slider/slider8.jpg', alt: 'Вечерняя пробежка', date: 'Октябрь 2024', category: 'training' },
|
||||
{ src: 'slider/slider9.jpg', alt: 'Растяжка после бега', date: 'Октябрь 2024', category: 'training' },
|
||||
{ src: 'slider/slider10.jpg', alt: 'Общение после тренировки', date: 'Сентябрь 2024', category: 'community' },
|
||||
{ src: 'slider/slider11.jpg', alt: 'Индивидуальные занятия', date: 'Сентябрь 2024', category: 'training' },
|
||||
{ src: 'slider/slider12.jpg', alt: 'Подготовка к старту', date: 'Сентябрь 2024', category: 'events' },
|
||||
{ src: 'slider/slider13.jpg', alt: 'Победа!', date: 'Август 2024', category: 'events' },
|
||||
{ src: 'slider/slider14.jpg', alt: 'Трейл раннинг', date: 'Август 2024', category: 'training' },
|
||||
{ src: 'slider/slider15.jpg', alt: 'Горные маршруты', date: 'Июль 2024', category: 'training' },
|
||||
{ src: 'slider/slider16.jpg', alt: 'Летние тренировки', date: 'Июль 2024', category: 'training' },
|
||||
{ src: 'slider/slider17.jpg', alt: 'Восстановление', date: 'Июнь 2024', category: 'training' },
|
||||
{ src: 'slider/slider18.jpg', alt: 'Мастер-класс', date: 'Июнь 2024', category: 'events' },
|
||||
{ src: 'slider/slider19.jpg', alt: 'Новички клуба', date: 'Май 2024', category: 'community' },
|
||||
{ src: 'slider/slider20.jpg', alt: 'Весенний забег', date: 'Май 2024', category: 'events' },
|
||||
{ src: 'slider/slider21.jpg', alt: 'Работа в группе', date: 'Апрель 2024', category: 'training' },
|
||||
{ src: 'slider/slider22.jpg', alt: 'Совместный отдых', date: 'Апрель 2024', category: 'community' },
|
||||
{ src: 'slider/slider23.png', alt: 'Уфимский марафон', date: 'Март 2024', category: 'events' },
|
||||
{ src: 'slider/slider24.jpg', alt: 'РосХим Стерлитамак', date: 'Январь 2025', category: 'events' }
|
||||
// Первые 6 - это слайды
|
||||
{ src: 'ivents/magnitogorsk_2025/bb1.jpg', alt: 'Беговой клуб Бегущий Башкир в Магнитогорске 2025', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Участие в забеге в Магнитогорске' },
|
||||
{ src: 'slider/slider24.jpg', alt: 'Беговой клуб Бегущий Башкир, РосХим Стерлитамак Забег 2025', date: 'Январь 2025', category: 'events', title: 'РосХим Стерлитамак 2025', description: 'Наши участники на крупном забеге' },
|
||||
{ src: 'slider/slider23.png', alt: 'Беговой клуб, общее фото УММ 2025', date: 'Январь 2025', category: 'events', title: 'Уфимский марафон 2025', description: 'Командное фото после успешного забега' },
|
||||
{ src: 'slider/slider1.jpg', alt: 'Тренировка в парке', date: 'Декабрь 2024', category: 'training', title: 'Тренировка в парке', description: 'Регулярные занятия на свежем воздухе' },
|
||||
{ src: 'slider/slider2.jpg', alt: 'Техника бега', date: 'Декабрь 2024', category: 'training', title: 'Техника бега', description: 'Работа над правильной техникой' },
|
||||
{ src: 'slider/slider4.jpg', alt: 'Групповая тренировка', date: 'Ноябрь 2024', category: 'training', title: 'Групповая тренировка', description: 'Поддержка и мотивация в команде' },
|
||||
|
||||
// Остальные фото из папки magnitogorsk_2025
|
||||
{ src: 'ivents/magnitogorsk_2025/bb2.jpg', alt: 'Беговой клуб на забеге в Магнитогорске 2025', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'На старте забега' },
|
||||
{ src: 'ivents/magnitogorsk_2025/bb3.jpg', alt: 'Участники бегового клуба в Магнитогорске', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Подготовка к старту' },
|
||||
{ src: 'ivents/magnitogorsk_2025/bb4.jpg', alt: 'Беговой клуб Магнитогорск 2025 забег', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Во время забега' },
|
||||
{ src: 'ivents/magnitogorsk_2025/bb5.jpg', alt: 'Участники забега Магнитогорск 2025', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Финишная прямая' },
|
||||
{ src: 'ivents/magnitogorsk_2025/bb6.jpg', alt: 'Бегущий Башкир в Магнитогорске 2025', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Командный дух' },
|
||||
{ src: 'ivents/magnitogorsk_2025/bb7.jpg', alt: 'Забег в Магнитогорске 2025', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Поздравления после финиша' },
|
||||
{ src: 'ivents/magnitogorsk_2025/bb8.jpg', alt: 'Беговой клуб на награждении Магнитогорск 2025', date: 'Январь 2025', category: 'events', title: 'Магнитогорск 2025', description: 'Церемония награждения' },
|
||||
|
||||
// Остальные существующие фото
|
||||
{ src: 'slider/slider5.jpg', alt: 'Соревнования', date: 'Ноябрь 2024', category: 'events', title: 'Соревнования', description: 'Участие в городских забегах' },
|
||||
{ src: 'slider/slider6.jpg', alt: 'Награждение', date: 'Ноябрь 2024', category: 'events', title: 'Награждение', description: 'Церемония награждения победителей' },
|
||||
{ src: 'slider/slider7.jpg', alt: 'Командный дух', date: 'Октябрь 2024', category: 'community', title: 'Командный дух', description: 'Поддержка и дружеская атмосфера' },
|
||||
{ src: 'slider/workout1.jpg', alt: 'Тренировка на набережной', date: 'Октябрь 2025', category: 'training', title: 'Тренировка на набережной', description: 'Занятия на свежем воздухе' },
|
||||
{ src: 'slider/workout2.jpg', alt: 'Тренировка на набережной', date: 'Октябрь 2025', category: 'training', title: 'Тренировка на набережной', description: 'Работа над выносливостью' },
|
||||
{ src: 'slider/workout3.jpg', alt: 'Тренировка на набережной', date: 'Октябрь 2025', category: 'training', title: 'Тренировка на набережной', description: 'Групповое занятие' },
|
||||
{ src: 'slider/slider8.jpg', alt: 'Вечерняя пробежка', date: 'Октябрь 2024', category: 'training', title: 'Вечерняя пробежка', description: 'Тренировка в вечернее время' },
|
||||
{ src: 'slider/slider9.jpg', alt: 'Растяжка после бега', date: 'Октябрь 2024', category: 'training', title: 'Растяжка после бега', description: 'Восстановительные упражнения' },
|
||||
{ src: 'slider/slider10.jpg', alt: 'Общение после тренировки', date: 'Сентябрь 2024', category: 'community', title: 'Общение после тренировки', description: 'Дружеские встречи участников' },
|
||||
{ src: 'slider/slider11.jpg', alt: 'Индивидуальные занятия', date: 'Сентябрь 2024', category: 'training', title: 'Индивидуальные занятия', description: 'Персональные тренировки с тренером' },
|
||||
{ src: 'slider/slider12.jpg', alt: 'Подготовка к старту', date: 'Сентябрь 2024', category: 'events', title: 'Подготовка к старту', description: 'Настрой перед соревнованиями' },
|
||||
{ src: 'slider/slider13.jpg', alt: 'Победа!', date: 'Август 2024', category: 'events', title: 'Победа!', description: 'Достижения наших участников' },
|
||||
{ src: 'slider/slider14.jpg', alt: 'Трейл раннинг', date: 'Август 2024', category: 'training', title: 'Трейл раннинг', description: 'Тренировки по пересеченной местности' },
|
||||
{ src: 'slider/slider15.jpg', alt: 'Горные маршруты', date: 'Июль 2024', category: 'training', title: 'Горные маршруты', description: 'Занятия в горной местности' },
|
||||
{ src: 'slider/slider16.jpg', alt: 'Летние тренировки', date: 'Июль 2024', category: 'training', title: 'Летние тренировки', description: 'Тренировки в летний период' },
|
||||
{ src: 'slider/slider17.jpg', alt: 'Восстановление', date: 'Июнь 2024', category: 'training', title: 'Восстановление', description: 'Процесс восстановления после нагрузок' },
|
||||
{ src: 'slider/slider18.jpg', alt: 'Мастер-класс', date: 'Июнь 2024', category: 'events', title: 'Мастер-класс', description: 'Специальные обучающие занятия' },
|
||||
{ src: 'slider/slider19.jpg', alt: 'Новички клуба', date: 'Май 2024', category: 'community', title: 'Новички клуба', description: 'Приветствие новых участников' },
|
||||
{ src: 'slider/slider20.jpg', alt: 'Весенний забег', date: 'Май 2024', category: 'events', title: 'Весенний забег', description: 'Сезонные соревнования' },
|
||||
{ src: 'slider/slider21.jpg', alt: 'Работа в группе', date: 'Апрель 2024', category: 'training', title: 'Работа в группе', description: 'Совместные тренировки' },
|
||||
{ src: 'slider/slider22.jpg', alt: 'Совместный отдых', date: 'Апрель 2024', category: 'community', title: 'Совместный отдых', description: 'Встречи и общение участников' }
|
||||
],
|
||||
filters: [
|
||||
{ value: 'all', label: 'Все фото' },
|
||||
@@ -243,7 +254,10 @@ export default {
|
||||
{ value: 'events', label: 'Соревнования' },
|
||||
{ value: 'community', label: 'Мероприятия' }
|
||||
],
|
||||
slideInterval: null
|
||||
slideInterval: null,
|
||||
hasInteracted: false,
|
||||
isContentVisible: false,
|
||||
autoShowTimeout: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -274,10 +288,7 @@ export default {
|
||||
this.$emit('show-header')
|
||||
},
|
||||
getImageUrl(path) {
|
||||
// В продакшене замените на правильный путь
|
||||
const baseUrl = import.meta.env.BASE_URL
|
||||
// Путь от корня public/
|
||||
console.log(`${baseUrl}images/${path}`)
|
||||
return `${baseUrl}images/${path}`
|
||||
},
|
||||
nextSlide() {
|
||||
|
||||
Reference in New Issue
Block a user