<?php
include "../../root.class.php";

$html = new html();
$html->add_styles_page();
$db = new db_safeguard();

$table_data = "";

$current_stock_res = $db->query("book_stock", "SELECT * FROM book_stock");

if ($current_stock_res->num_rows > 0) {
    while ($stock = $current_stock_res->fetch_assoc()) {

        $stock_type_res = $db->query(
            "stock_types",
            "SELECT * FROM stock_types WHERE record_id = {$stock['stock_type_id']}"
        );
        $stock_type = $stock_type_res->fetch_assoc();

        $team_assigned_res = $db->query(
            "teams",
            "SELECT * FROM teams WHERE record_id = {$stock['team_assigned_id']}"
        );
        $team_assigned = $team_assigned_res->fetch_assoc();

        $table_data .= "
            <tr>
                <td>{$stock['stock_no']}</td>
                <td>{$stock['item_name']}</td>
                <td>{$stock_type['name']}</td>
                <td>{$stock['quantity']}</td>
                <td>{$team_assigned['name']}</td>
            </tr>
        ";
    }
} else {
    $table_data .= "
        <tr>
            <td colspan='4' class='no-data'>NO STOCK BOOKED</td>
        </tr>
    ";
}
?>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Booked Stock</title>

    <style>
        :root {
            --blue: #1e3a8a;
            --light-blue: #eaf0ff;
            --orange: #f97316;
            --orange-soft: #fde7d6;
            --white: #ffffff;
            --border: #d1d5db;
            --text: #0f172a;
        }

        body {
            margin: 0;
            background: #f8fafc;
            font-family: "Segoe UI", Roboto, Arial, sans-serif;
            color: var(--text);
        }

        .form_down {
            width: 95%;
            margin: auto;
            padding-bottom: 3vw;
        }

        h1 {
            margin: 2.5vw 0 1.5vw;
            font-size: 3vw;
            color: var(--blue);
            /* border-left: 6px solid var(--orange); */
            padding-left: 1vw;
        }

        table {
            width: 100%;
            border-collapse: collapse;
            background: var(--white);
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        }

        thead th {
            background: var(--blue);
            color: var(--white);
            text-align: left;
            padding: 1vw;
            font-size: 1.5vw;
            letter-spacing: 0.05em;
        }

        tbody td {
            padding: 1vw;
            font-size: 1.3vw;
            border-bottom: 1px solid var(--border);
        }

        tbody tr:nth-child(even) {
            background-color: var(--light-blue);
        }

        tbody tr:hover {
            background-color: var(--orange-soft);
            transition: background 0.2s ease;
        }

        tbody tr:last-child td {
            border-bottom: none;
        }

        .no-data {
            text-align: center;
            padding: 2vw;
            font-weight: 600;
            color: var(--blue);
            background: var(--light-blue);
        }
    </style>
</head>

<body>

    <div class="form_down">
        <h1>Booked Stock</h1>

        <table>
            <thead>
                <tr>
                    <th>Stock No</th>
                    <th>Item Name</th>
                    <th>Stock Type</th>
                    <th>Quantity</th>
                    <th>Team Assigned</th>
                </tr>
            </thead>
            <tbody>
                <?php echo $table_data; ?>
            </tbody>
        </table>
    </div>

    <script>
        setInterval(function () {
            location.reload();
        }, 100000);
    </script>

</body>

</html>