374 lines
25 KiB
PHP

<?php
// Ottieni l'istanza del DBHandlerSelect
$dbHandler = DBHandlerSelect::getInstance();
$pdo = $dbHandler->getConnection();
// Inizializza il carrello se non esiste
if (!isset($_SESSION['cart'])) {
$_SESSION['cart'] = [];
}
// Recupera i prodotti nel carrello
$cart_items = [];
$total_price = 0;
if (!empty($_SESSION['cart'])) {
foreach ($_SESSION['cart'] as $cart_key => $item) {
$product_id = $item['product_id'];
$variation_id = $item['variation_id'];
$class_type_id = $item['class_type_id'];
$quantity = $item['quantity'];
// Query per ottenere i dettagli del prodotto, variazione e classe
$stmt = $pdo->prepare("
SELECT p.name AS product_name, pv.name AS variation_name, pv.price, c.name AS class_name, c.photo AS class_photo,
ct.level, ct.day_of_week
FROM products p
JOIN product_variations pv ON pv.id = ?
LEFT JOIN product_class_types pct ON p.id = pct.product_id AND pct.variation_id IS NULL
LEFT JOIN class_types ct ON ct.id = ?
LEFT JOIN classes c ON ct.class_id = c.id
WHERE p.id = ?
");
$stmt->execute([$variation_id, $class_type_id, $product_id]);
$cart_item = $stmt->fetch(PDO::FETCH_ASSOC);
if ($cart_item) {
$cart_items[$cart_key] = [
'product_name' => $cart_item['product_name'],
'variation_name' => $cart_item['variation_name'],
'class_name' => $cart_item['class_name'],
'level' => $cart_item['level'],
'day_of_week' => $cart_item['day_of_week'],
'photo' => $cart_item['class_photo'] ?: 'default_class_image.jpg',
'price' => $cart_item['price'],
'quantity' => $quantity,
'subtotal' => $cart_item['price'] * $quantity
];
$total_price += $cart_item['price'] * $quantity;
}
}
}
// Calcola il numero totale di elementi nel carrello
$cart_count = array_sum(array_column($_SESSION['cart'], 'quantity'));
?>
<header>
<div class="topbar d-flex align-items-center">
<nav class="navbar navbar-expand gap-3">
<div class="mobile-toggle-menu"><i class='bx bx-menu'></i></div>
<div class="search-bar d-lg-block d-none" data-bs-toggle="modal" data-bs-target="#SearchModal">
<a href="javascript:;" class="btn d-flex align-items-center"><i class='bx bx-search'></i>Search</a>
</div>
<div class="top-menu ms-auto">
<ul class="navbar-nav align-items-center gap-1">
<li class="nav-item mobile-search-icon d-flex d-lg-none" data-bs-toggle="modal" data-bs-target="#SearchModal">
<a class="nav-link" href="javascript:;"><i class='bx bx-search'></i></a>
</li>
<li class="nav-item dropdown dropdown-laungauge d-none d-sm-flex">
<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;" data-bs-toggle="dropdown"><img src="assets/images/county/02.png" width="22" alt=""></a>
<ul class="dropdown-menu dropdown-menu-end">
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/01.png" width="20" alt=""><span class="ms-2">English</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/02.png" width="20" alt=""><span class="ms-2">Catalan</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/03.png" width="20" alt=""><span class="ms-2">French</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/04.png" width="20" alt=""><span class="ms-2">Belize</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/05.png" width="20" alt=""><span class="ms-2">Colombia</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/06.png" width="20" alt=""><span class="ms-2">Spanish</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/07.png" width="20" alt=""><span class="ms-2">Georgian</span></a></li>
<li><a class="dropdown-item d-flex align-items-center py-2" href="javascript:;"><img src="assets/images/county/08.png" width="20" alt=""><span class="ms-2">Hindi</span></a></li>
</ul>
</li>
<li class="nav-item dark-mode d-none d-sm-flex">
<a class="nav-link dark-mode-icon" href="javascript:;"><i class='bx bx-moon'></i></a>
</li>
<li class="nav-item dropdown dropdown-app">
<a class="nav-link dropdown-toggle dropdown-toggle-nocaret" data-bs-toggle="dropdown" href="javascript:;"><i class='bx bx-grid-alt'></i></a>
<div class="dropdown-menu dropdown-menu-end p-0">
<div class="app-container p-2 my-2">
<div class="row gx-0 gy-2 row-cols-3 justify-content-center p-2">
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/slack.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Slack</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/behance.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Behance</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/google-drive.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Dribble</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/outlook.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Outlook</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/github.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">GitHub</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/stack-overflow.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Stack</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/figma.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Stack</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/twitter.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Twitter</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/google-calendar.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Calendar</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/spotify.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Spotify</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/google-photos.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Photos</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/pinterest.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Photos</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/linkedin.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">linkedin</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/dribble.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Dribble</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/youtube.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">YouTube</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/google.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">News</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/envato.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Envato</p>
</div>
</div>
</a></div>
<div class="col"><a href="javascript:;">
<div class="app-box text-center">
<div class="app-icon"><img src="assets/images/app/safari.png" width="30" alt=""></div>
<div class="app-name">
<p class="mb-0 mt-1">Safari</p>
</div>
</div>
</a></div>
</div>
</div>
</div>
</li>
<li class="nav-item dropdown dropdown-large">
<a class="nav-link dropdown-toggle dropdown-toggle-nocaret position-relative" href="#" data-bs-toggle="dropdown"><span class="alert-count cart-count"><?php echo $cart_count; ?></span>
<i class='bx bx-bell'></i>
</a>
<div class="dropdown-menu dropdown-menu-end">
<a href="javascript:;">
<div class="msg-header">
<p class="msg-header-title">Notifications</p>
<p class="msg-header-badge">8 New</p>
</div>
</a>
<div class="header-notifications-list">
<a class="dropdown-item" href="javascript:;">
<div class="d-flex align-items-center">
<div class="user-online">
<img src="assets/images/avatars/avatar-1.png" class="msg-avatar" alt="user avatar">
</div>
<div class="flex-grow-1">
<h6 class="msg-name">Daisy Anderson<span class="msg-time float-end">5 sec ago</span></h6>
<p class="msg-info">The standard chunk of lorem</p>
</div>
</div>
</a>
<!-- Altre notifiche... -->
</div>
<a href="javascript:;">
<div class="text-center msg-footer">
<button class="btn btn-primary w-100">View All Notifications</button>
</div>
</a>
</div>
</li>
<li class="nav-item dropdown dropdown-large">
<a class="nav-link dropdown-toggle dropdown-toggle-nocaret position-relative" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<span class="alert-count cart-count"><?php echo $cart_count; ?></span>
<i class='bx bx-shopping-bag'></i>
</a>
<div class="dropdown-menu dropdown-menu-end">
<a href="javascript:;">
<div class="msg-header">
<p class="msg-header-title">My Cart</p>
<p class="msg-header-badge"><?php echo $cart_count; ?> Items</p>
</div>
</a>
<div class="header-message-list">
<?php if (empty($cart_items)): ?>
<p class="text-center text-muted p-3">Il carrello è vuoto.</p>
<?php else: ?>
<?php foreach ($cart_items as $cart_key => $item): ?>
<a class="dropdown-item" href="javascript:;">
<div class="d-flex align-items-center gap-3">
<div class="position-relative">
<div class="cart-product rounded-circle bg-light">
<img src="<?php echo htmlspecialchars($item['photo']); ?>" class="rounded-circle" width="50" alt="product image">
</div>
</div>
<div class="flex-grow-1">
<h6 class="cart-product-title mb-0"><?php echo htmlspecialchars($item['product_name']); ?></h6>
<p class="cart-product-price mb-0"><?php echo htmlspecialchars($item['variation_name']); ?></p>
<p class="cart-product-price mb-0"><?php echo htmlspecialchars($item['class_name'] . ' - ' . $item['level'] . ' (' . $item['day_of_week'] . ')'); ?></p>
<p class="cart-product-price mb-0"><?php echo $item['quantity']; ?> x €<?php echo number_format($item['price'], 2); ?></p>
</div>
<div class="">
<p class="cart-price mb-0">€<?php echo number_format($item['subtotal'], 2); ?></p>
</div>
<div class="cart-product-cancel">
<a href="javascript:;" class="remove-cart-item" data-key="<?php echo $cart_key; ?>"><i class="bx bx-x"></i></a>
</div>
</div>
</a>
<?php endforeach; ?>
<?php endif; ?>
</div>
<a href="javascript:;">
<div class="text-center msg-footer">
<div class="d-flex align-items-center justify-content-between mb-3">
<h5 class="mb-0">Total</h5>
<h5 class="mb-0 ms-auto">€<?php echo number_format($total_price, 2); ?></h5>
</div>
<a href="checkout.php" class="btn btn-primary w-100">Checkout</a>
</div>
</a>
</div>
</li>
</ul>
</div>
<div class="user-box dropdown px-3">
<a class="d-flex align-items-center nav-link dropdown-toggle gap-3 dropdown-toggle-nocaret" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<img src="<?php echo htmlspecialchars('../upload/users/' . basename($_SESSION['photouser'])); ?>" class="user-img" alt="user avatar">
<div class="user-info">
<p class="user-name mb-0"><?php echo htmlspecialchars($_SESSION['nameuser'] . ' ' . $_SESSION['surnameuser']); ?></p>
<p class="designattion mb-0"><?php echo htmlspecialchars($_SESSION['emailuser']); ?></p>
</div>
</a>
<ul class="dropdown-menu dropdown-menu-end">
<li><a class="dropdown-item d-flex align-items-center" href="student_profile.php"><i class="bx bx-user fs-5"></i><span>Profilo Utente</span></a></li>
<li><a class="dropdown-item d-flex align-items-center" href="javascript:;"><i class="bx bx-cog fs-5"></i><span>Settings</span></a></li>
<li><a class="dropdown-item d-flex align-items-center" href="javascript:;"><i class="bx bx-home-circle fs-5"></i><span>Dashboard</span></a></li>
<li><a class="dropdown-item d-flex align-items-center" href="javascript:;"><i class="bx bx-dollar-circle fs-5"></i><span>Earnings</span></a></li>
<li><a class="dropdown-item d-flex align-items-center" href="javascript:;"><i class="bx bx-download fs-5"></i><span>Downloads</span></a></li>
<li>
<div class="dropdown-divider mb-0"></div>
</li>
<li><a class="dropdown-item d-flex align-items-center" href="javascript:;"><i class="bx bx-log-out-circle"></i><span>Logout</span></a></li>
</ul>
</div>
</nav>
</div>
</header>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
// Rimuovi un elemento dal carrello
$('.remove-cart-item').on('click', function(e) {
e.preventDefault();
const cartKey = $(this).data('key');
$.ajax({
url: 'remove_from_cart.php',
method: 'POST',
data: {
cart_key: cartKey
},
success: function(response) {
const result = JSON.parse(response);
if (result.success) {
location.reload(); // Ricarica la pagina per aggiornare il carrello
} else {
alert('Errore durante la rimozione del prodotto dal carrello.');
}
},
error: function() {
alert('Errore di connessione.');
}
});
});
});
</script>