✨ Компактные hero секции и улучшенная инициализация БД
🎨 UI улучшения: - Уменьшена высота синих панелей с 100vh до 70vh на главной - Добавлен класс .compact (25vh) для всех остальных страниц - Улучшена адаптивность для мобильных устройств - Обновлены все шаблоны с hero секциями 🚀 Инфраструктура: - Автоматическая инициализация базы данных при деплое - Улучшены мокапные данные (больше отзывов, бронирований, сообщений) - Добавлены настройки сайта в базу данных - Создан скрипт автоматического деплоя deploy.sh 📦 Система сборки: - Обновлен .gitignore с полным покрытием файлов - Добавлена папка для загрузок с .gitkeep - Улучшен README с инструкциями по запуску - ES модули для инициализации базы данных 🐛 Исправления: - Совместимость с ES модулями в Node.js - Правильная обработка ошибок инициализации БД - Корректные SQL запросы для PostgreSQL
This commit is contained in:
@@ -1,12 +1,8 @@
|
||||
<!-- Hero Section -->
|
||||
<section class="hero-section bg-primary text-white text-center py-5">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8 mx-auto">
|
||||
<h1 class="display-4 fw-bold mb-4">Наши гиды</h1>
|
||||
<p class="lead">Профессиональные и опытные гиды сделают ваше путешествие незабываемым</p>
|
||||
</div>
|
||||
</div>
|
||||
<section class="hero-section compact bg-gradient-primary text-white py-5">
|
||||
<div class="container text-center">
|
||||
<h1 class="display-4 fw-bold mb-3">Наши профессиональные гиды</h1>
|
||||
<p class="lead">Опытные гиды для незабываемых путешествий по Корее</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -15,15 +11,15 @@
|
||||
<div class="container">
|
||||
<% if (guides.length === 0) { %>
|
||||
<div class="text-center py-5">
|
||||
<i class="fas fa-user-tie text-muted" style="font-size: 4rem;"></i>
|
||||
<h3 class="mt-3 text-muted">Гиды не найдены</h3>
|
||||
<i class="fas fa-user-tie fa-3x text-muted mb-3"></i>
|
||||
<h3>Гиды не найдены</h3>
|
||||
<p class="text-muted">В данный момент нет доступных гидов.</p>
|
||||
</div>
|
||||
<% } else { %>
|
||||
<div class="row">
|
||||
<% guides.forEach(guide => { %>
|
||||
<% guides.forEach(function(guide) { %>
|
||||
<div class="col-lg-4 col-md-6 mb-4">
|
||||
<div class="card h-100 shadow-sm">
|
||||
<div class="card h-100 shadow-sm guide-card" data-guide-id="<%= guide.id %>" style="cursor: pointer; transition: transform 0.2s;">
|
||||
<% if (guide.image_url && guide.image_url.trim()) { %>
|
||||
<img src="<%= guide.image_url %>" class="card-img-top" alt="<%= guide.name %>" style="height: 250px; object-fit: cover;">
|
||||
<% } else { %>
|
||||
@@ -31,11 +27,39 @@
|
||||
<% } %>
|
||||
|
||||
<div class="card-body d-flex flex-column">
|
||||
<h5 class="card-title"><%= guide.name %></h5>
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<h5 class="card-title mb-0"><%= guide.name %></h5>
|
||||
<div class="rating-display" data-target-type="guide" data-target-id="<%= guide.id %>">
|
||||
<div class="d-flex align-items-center">
|
||||
<span class="rating-percentage text-warning fw-bold">
|
||||
<%
|
||||
let percentage = parseFloat(guide.rating_percentage || 0);
|
||||
%>
|
||||
<%= Math.round(percentage) %>%
|
||||
</span>
|
||||
<small class="text-muted ms-1">
|
||||
<%
|
||||
let likes = parseInt(guide.likes || 0);
|
||||
let dislikes = parseInt(guide.dislikes || 0);
|
||||
let total = likes + dislikes;
|
||||
%>
|
||||
(<%= likes %>/<%= total %>)
|
||||
</small>
|
||||
</div>
|
||||
<div class="rating-buttons mt-1">
|
||||
<button class="btn btn-sm btn-outline-success like-btn" data-rating="1">
|
||||
<i class="fas fa-thumbs-up"></i>
|
||||
</button>
|
||||
<button class="btn btn-sm btn-outline-danger dislike-btn" data-rating="-1">
|
||||
<i class="fas fa-thumbs-down"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<div class="mb-2">
|
||||
<% if (guide.specialization === 'city') { %>
|
||||
<span class="badge bg-info">
|
||||
<span class="badge bg-primary">
|
||||
<i class="fas fa-city me-1"></i>Городские туры
|
||||
</span>
|
||||
<% } else if (guide.specialization === 'mountain') { %>
|
||||
@@ -43,14 +67,21 @@
|
||||
<i class="fas fa-mountain me-1"></i>Горные походы
|
||||
</span>
|
||||
<% } else if (guide.specialization === 'fishing') { %>
|
||||
<span class="badge bg-primary">
|
||||
<i class="fas fa-fish me-1"></i>Рыбалка
|
||||
<span class="badge bg-info">
|
||||
<i class="fas fa-fish me-1"></i>Морская рыбалка
|
||||
</span>
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<div class="mb-2">
|
||||
<small class="text-muted">
|
||||
<i class="fas fa-briefcase me-1"></i>
|
||||
Опыт: <%= guide.experience || 0 %> лет
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<% if (guide.bio) { %>
|
||||
<p class="card-text text-muted flex-grow-1"><%= truncateText(guide.bio, 120) %></p>
|
||||
<p class="card-text text-muted flex-grow-1"><%= guide.bio.length > 100 ? guide.bio.substring(0, 100) + '...' : guide.bio %></p>
|
||||
<% } %>
|
||||
|
||||
<div class="mt-auto">
|
||||
@@ -63,29 +94,19 @@
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (guide.avg_rating) { %>
|
||||
<div class="mb-2">
|
||||
<%- generateStars(guide.avg_rating) %>
|
||||
<small class="text-muted ms-2">(<%= parseFloat(guide.avg_rating).toFixed(1) %>)</small>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div>
|
||||
<small class="text-muted">
|
||||
<i class="fas fa-calendar me-1"></i><%= guide.experience %> лет опыта
|
||||
</small>
|
||||
</div>
|
||||
<div>
|
||||
<small class="text-muted">
|
||||
<i class="fas fa-route me-1"></i><%= guide.route_count || 0 %> туров
|
||||
</small>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="text-muted small">
|
||||
<i class="fas fa-calendar-check me-1"></i>
|
||||
<%= guide.booking_count || 0 %> туров проведено
|
||||
</div>
|
||||
<% if (guide.hourly_rate) { %>
|
||||
<div class="text-end">
|
||||
<strong class="text-success">
|
||||
₩<%= parseInt(guide.hourly_rate || 0).toLocaleString('ko-KR') %>/час
|
||||
</strong>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<a href="/guides/<%= guide.id %>" class="btn btn-primary w-100">
|
||||
<i class="fas fa-user me-1"></i>Подробнее
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -96,13 +117,85 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- CTA Section -->
|
||||
<section class="bg-light py-5">
|
||||
<div class="container text-center">
|
||||
<h2 class="mb-4">Нужен индивидуальный подход?</h2>
|
||||
<p class="lead text-muted mb-4">Наши гиды готовы создать уникальный маршрут специально для вас!</p>
|
||||
<a href="/contact" class="btn btn-primary btn-lg">
|
||||
<i class="fas fa-envelope me-1"></i>Связаться с нами
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
// Guide card click handler and rating system
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const guideCards = document.querySelectorAll('.guide-card');
|
||||
|
||||
guideCards.forEach(card => {
|
||||
card.addEventListener('click', function(e) {
|
||||
// Don't trigger card click if clicking on rating buttons
|
||||
if (!e.target.closest('.rating-buttons')) {
|
||||
const guideId = this.dataset.guideId;
|
||||
// Redirect to guide details or show modal
|
||||
window.location.href = `/guides/${guideId}`;
|
||||
}
|
||||
});
|
||||
|
||||
// Add hover effect
|
||||
card.addEventListener('mouseenter', function() {
|
||||
this.style.transform = 'translateY(-5px)';
|
||||
});
|
||||
|
||||
card.addEventListener('mouseleave', function() {
|
||||
this.style.transform = 'translateY(0)';
|
||||
});
|
||||
});
|
||||
|
||||
// Rating system
|
||||
document.addEventListener('click', function(e) {
|
||||
if (e.target.closest('.like-btn') || e.target.closest('.dislike-btn')) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
const button = e.target.closest('.like-btn') || e.target.closest('.dislike-btn');
|
||||
const ratingDisplay = button.closest('.rating-display');
|
||||
const targetType = ratingDisplay.dataset.targetType;
|
||||
const targetId = ratingDisplay.dataset.targetId;
|
||||
const rating = parseInt(button.dataset.rating);
|
||||
|
||||
// Send rating to server
|
||||
fetch('/api/rating/' + targetType + '/' + targetId, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ rating: rating })
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
// Update rating display
|
||||
const percentageSpan = ratingDisplay.querySelector('.rating-percentage');
|
||||
const countSpan = ratingDisplay.querySelector('small');
|
||||
|
||||
const percentage = data.percentage || 0;
|
||||
const likes = data.likes || 0;
|
||||
const total = data.total || 0;
|
||||
|
||||
percentageSpan.textContent = Math.round(percentage) + '%';
|
||||
countSpan.textContent = `(${likes}/${total})`;
|
||||
|
||||
// Update button states
|
||||
ratingDisplay.querySelectorAll('.rating-buttons button').forEach(btn => {
|
||||
btn.classList.remove('btn-success', 'btn-danger');
|
||||
btn.classList.add(btn.classList.contains('like-btn') ? 'btn-outline-success' : 'btn-outline-danger');
|
||||
});
|
||||
|
||||
// Highlight selected button
|
||||
if (rating === 1) {
|
||||
button.classList.remove('btn-outline-success');
|
||||
button.classList.add('btn-success');
|
||||
} else if (rating === -1) {
|
||||
button.classList.remove('btn-outline-danger');
|
||||
button.classList.add('btn-danger');
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Ошибка при отправке рейтинга:', error);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user