Learn by Directing AI
All materials

orders.html

htmlorders.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Kabylie Gold - Orders</title>
    <link rel="stylesheet" href="/static/style.css">
</head>
<body>
    <nav class="top-nav">
        <span class="nav-brand">Kabylie Gold</span>
        <span class="nav-links">
            <a href="/inventory">Inventory</a>
            <a href="/orders" class="active">Orders</a>
            <a href="/shipments">Shipments</a>
        </span>
        <span class="nav-user">{{ company }} | <a href="/logout">Sign Out</a></span>
    </nav>
    <div class="content">
        <h2>Your Orders</h2>
        {% if orders %}
        <table class="data-table">
            <thead>
                <tr>
                    <th>Order #</th>
                    <th>Product</th>
                    <th>Quantity (L)</th>
                    <th>Price (DZD/L)</th>
                    <th>Status</th>
                    <th>Date</th>
                </tr>
            </thead>
            <tbody>
                {% for order in orders %}
                <tr>
                    <td>{{ order[0] }}</td>
                    <td>{{ order[1] }}</td>
                    <td>{{ order[2] }}</td>
                    <td>{{ order[3] }}</td>
                    <td><span class="status-{{ order[4] }}">{{ order[4] }}</span></td>
                    <td>{{ order[5] }}</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
        {% else %}
        <p>No orders yet. Browse the <a href="/inventory">inventory</a> to place your first order.</p>
        {% endif %}
    </div>
</body>
</html>