115 lines
3.8 KiB
HTML
115 lines
3.8 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block styles %}
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/cart.css') }}">
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="cart-container">
|
|
<h1>Your Shopping Cart</h1>
|
|
|
|
{% if items %}
|
|
<div class="cart-items">
|
|
<table class="cart-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Product</th>
|
|
<th>Price</th>
|
|
<th>Quantity</th>
|
|
<th>Subtotal</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for item in items %}
|
|
<tr>
|
|
<td class="product-info">
|
|
<div class="product-image">
|
|
<img src="{{ item.product.get_image_url() }}" alt="{{ item.product.name }}">
|
|
</div>
|
|
<div class="product-details">
|
|
<h4>{{ item.product.name }}</h4>
|
|
<p class="product-description">{{ item.product.description[:80] }}...</p>
|
|
<div class="stock-info">
|
|
{% if item.product.stock > 10 %}
|
|
<span class="in-stock">✓ In Stock</span>
|
|
{% elif item.product.stock > 0 %}
|
|
<span class="low-stock">⚠ Low Stock ({{ item.product.stock }} left)</span>
|
|
{% else %}
|
|
<span class="out-of-stock">✗ Out of Stock</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="price">${{ "%.2f"|format(item.product.price) }}</td>
|
|
<td class="quantity">
|
|
<form method="POST" action="{{ url_for('cart.update_cart', item_id=item.id) }}" class="quantity-form">
|
|
<input type="number" name="quantity" value="{{ item.quantity }}" min="1" max="{{ item.max_quantity }}"
|
|
class="quantity-input">
|
|
<button type="submit" class="btn-update">Update</button>
|
|
<div class="max-quantity">
|
|
Max: {{ item.max_quantity }}
|
|
</div>
|
|
</form>
|
|
</td>
|
|
<td class="subtotal">${{ "%.2f"|format(item.subtotal) }}</td>
|
|
<td class="actions">
|
|
<form method="POST" action="{{ url_for('cart.remove_from_cart', item_id=item.id) }}"
|
|
onsubmit="return confirm('Remove {{ item.product.name }} from cart?')">
|
|
<button type="submit" class="btn-remove">
|
|
Remove
|
|
</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
|
|
<div class="cart-summary">
|
|
<div class="summary-card">
|
|
<h3>Order Summary</h3>
|
|
<div class="summary-row">
|
|
<span>Subtotal:</span>
|
|
<span>${{ "%.2f"|format(total) }}</span>
|
|
</div>
|
|
<div class="summary-row">
|
|
<span>Shipping:</span>
|
|
<span>Free</span>
|
|
</div>
|
|
<div class="summary-row total">
|
|
<span>Total:</span>
|
|
<span>${{ "%.2f"|format(total) }}</span>
|
|
</div>
|
|
|
|
<div class="cart-actions">
|
|
<a href="{{ url_for('main.products') }}" class="btn-continue">
|
|
← Continue Shopping
|
|
</a>
|
|
|
|
<form method="POST" action="{{ url_for('cart.clear_cart') }}" style="display: inline;">
|
|
<button type="submit" class="btn-clear" onclick="return confirm('Clear entire cart?')">
|
|
Clear Cart
|
|
</button>
|
|
</form>
|
|
|
|
<a href="{{ url_for('cart.checkout') }}" class="btn-checkout">
|
|
Proceed to Checkout →
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="empty-cart">
|
|
<div class="empty-icon">🛒</div>
|
|
<h3>Your cart is empty</h3>
|
|
<p>Add some products to your cart and they will appear here.</p>
|
|
<a href="{{ url_for('main.products') }}" class="btn-shop">
|
|
Browse Products
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|