<?php
require_once 'auth.php';
require_once '../config/database.php';
check_admin_login();

$id = isset($_GET['id']) ? (int)$_GET['id'] : 0;

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $content = $_POST['content'] ?? '';
    $title = $_POST['title'] ?? '';

    $stmt = $pdo->prepare("UPDATE pages SET title = :title, content = :content WHERE id = :id");
    $stmt->execute(['title' => $title, 'content' => $content, 'id' => $id]);
    
    header('Location: pages.php');
    exit;
}

$stmt = $pdo->prepare("SELECT * FROM pages WHERE id = :id");
$stmt->execute(['id' => $id]);
$page = $stmt->fetch();

if (!$page) {
    header('Location: pages.php');
    exit;
}
?>
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Éditer <?php echo htmlspecialchars($page['title']); ?> - Admin Kutzenhausen</title>
    <script src="../js/tailwind.min.js"></script>
    <script src="../js/lucide.min.js"></script>
    <link rel="stylesheet" href="../css/trumbowyg.min.css">
    <script src="../js/jquery.min.js"></script>
    <script src="../js/trumbowyg.min.js"></script>
</head>
<body class="bg-gray-50 flex h-screen font-sans text-gray-800">

    <?php include 'includes/sidebar.php'; ?>

    <!-- Main Content -->
    <main class="flex-1 flex flex-col h-screen overflow-hidden">
        
        <header class="h-20 bg-white shadow-sm flex items-center justify-between px-8 flex-shrink-0">
            <div class="flex items-center space-x-4">
                <i data-lucide="edit" class="w-8 h-8 text-[#7b2c2d]"></i>
                <h1 class="text-2xl font-bold text-gray-800">Éditer: <?php echo htmlspecialchars($page['title']); ?></h1>
            </div>
            <a href="pages.php" class="text-gray-500 hover:text-[#7b2c2d] px-4 py-2 text-sm font-medium transition flex items-center">
                <i data-lucide="arrow-left" class="w-4 h-4 mr-2"></i> Retour aux pages
            </a>
        </header>
        
        <div class="flex-1 overflow-auto p-8">
            <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden max-w-5xl mx-auto p-6">
                <form action="pages-edit.php?id=<?php echo $id; ?>" method="POST">
                    <div class="mb-4">
                        <label for="title" class="block text-sm font-medium text-gray-700 mb-1">Titre de la page</label>
                        <input type="text" id="title" name="title" value="<?php echo htmlspecialchars($page['title']); ?>" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-[#7b2c2d] focus:border-[#7b2c2d] outline-none">
                    </div>
                    
                    <div class="mb-4">
                        <label for="content" class="block text-sm font-medium text-gray-700 mb-1">Contenu</label>
                        <textarea id="content" name="content" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-[#7b2c2d] focus:border-[#7b2c2d] outline-none" rows="15"><?php echo htmlspecialchars($page['content']); ?></textarea>
                    </div>

                    <div class="flex justify-end space-x-3">
                        <a href="pages.php" class="px-6 py-2 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 transition">Annuler</a>
                        <button type="submit" class="px-6 py-2 bg-[#7b2c2d] text-white rounded-lg hover:bg-[#5c1a1b] transition shadow-sm font-medium">Enregistrer les modifications</button>
                    </div>
                </form>
            </div>
        </div>
    </main>

    <script>
        lucide.createIcons();
        $('#content').trumbowyg({
            lang: 'fr',
            svgPath: '../css/trumbowyg-icons.svg'
        });
    </script>
</body>
</html>
