<?php
require_once 'config/database.php';

// Test the order saving functionality
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['save_order'])) {
    $orders = $_POST['order'] ?? [];
    echo "<h3>Received Order Data:</h3>";
    echo "<pre>";
    print_r($orders);
    echo "</pre>";
    
    try {
        $pdo->beginTransaction();
        $stmt = $pdo->prepare('UPDATE management_board_members SET order_no = ? WHERE id = ?');
        foreach ($orders as $id => $ord) {
            $id = (int)$id; 
            $ord = (int)$ord;
            echo "Updating ID: $id with order: $ord<br>";
            $stmt->execute([$ord, $id]);
        }
        $pdo->commit();
        echo "<div class='alert alert-success'>Orders updated successfully!</div>";
    } catch (Exception $e) {
        $pdo->rollBack();
        echo "<div class='alert alert-danger'>Error: " . $e->getMessage() . "</div>";
    }
    
    echo "<hr>";
}

// Display current data
$stmt = $pdo->query('SELECT id, name, order_no FROM management_board_members ORDER BY order_no ASC, id ASC');
$members = $stmt->fetchAll(PDO::FETCH_ASSOC);

echo "<!DOCTYPE html>
<html>
<head>
    <title>Order Save Test</title>
    <link href='https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css' rel='stylesheet'>
</head>
<body>
<div class='container mt-4'>
    <h2>Management Board Order Test</h2>
    
    <div class='card mb-4'>
        <div class='card-header'>
            <h4>Current Members and Order</h4>
        </div>
        <div class='card-body'>
            <table class='table table-striped'>
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Name</th>
                        <th>Current Order</th>
                    </tr>
                </thead>
                <tbody>";

foreach ($members as $member) {
    echo "<tr>
            <td>{$member['id']}</td>
            <td>" . htmlspecialchars($member['name']) . "</td>
            <td>{$member['order_no']}</td>
          </tr>";
}

echo "        </tbody>
            </table>
        </div>
    </div>
    
    <div class='card'>
        <div class='card-header'>
            <h4>Test Order Saving</h4>
        </div>
        <div class='card-body'>
            <form method='post' id='testForm'>
                <p>Change the order numbers below and click Save:</p>";

foreach ($members as $member) {
    echo "<div class='mb-2'>
            <label>" . htmlspecialchars($member['name']) . " (ID: {$member['id']}):</label>
            <input type='number' class='form-control' name='order[{$member['id']}]' value='{$member['order_no']}' style='width: 100px;'>
          </div>";
}

echo "        <button type='submit' name='save_order' class='btn btn-primary'>Save Orders</button>
            </form>
        </div>
    </div>
</div>

<script>
document.getElementById('testForm').addEventListener('submit', function(e) {
    console.log('Form submitted');
    const formData = new FormData(this);
    for (let [key, value] of formData.entries()) {
        console.log(key, value);
    }
});
</script>
</body>
</html>";
?>