<?php

$pageTitle = 'Thông báo - PET SPA';
$pageStyles = ['customer.css'];
$activeCustomerPage = 'notifications';
$successMessage = $_SESSION['flash_success'] ?? null;
$errorMessage = $_SESSION['flash_error'] ?? null;
unset($_SESSION['flash_success'], $_SESSION['flash_error']);

require BASE_PATH . '/app/views/layouts/header.php';
require BASE_PATH . '/app/views/layouts/navbar.php';
?>

<main class="customer-area">
    <div class="container"><div class="row g-4">
        <div class="col-lg-3"><?php require BASE_PATH . '/app/views/layouts/customer-sidebar.php'; ?></div>
        <div class="col-lg-9">
            <div class="customer-page-header"><div><h1>Thông báo</h1><p><?= number_format($unreadCount) ?> thông báo chưa đọc.</p></div></div>
            <?php if ($successMessage): ?><div class="alert alert-success"><?= htmlspecialchars($successMessage) ?></div><?php endif; ?>
            <?php if ($errorMessage): ?><div class="alert alert-danger"><?= htmlspecialchars($errorMessage) ?></div><?php endif; ?>

            <div class="d-flex flex-wrap gap-2 mb-3">
                <a class="btn btn-sm <?= $state === '' ? 'btn-dark' : 'btn-outline-dark' ?>" href="<?= BASE_URL ?>/?url=customer/notifications">Tất cả</a>
                <a class="btn btn-sm <?= $state === 'unread' ? 'btn-dark' : 'btn-outline-dark' ?>" href="<?= BASE_URL ?>/?url=customer/notifications&state=unread">Chưa đọc</a>
                <a class="btn btn-sm <?= $state === 'read' ? 'btn-dark' : 'btn-outline-dark' ?>" href="<?= BASE_URL ?>/?url=customer/notifications&state=read">Đã đọc</a>
                <?php if ($unreadCount > 0): ?>
                    <form action="<?= BASE_URL ?>/?url=customer/notifications/read-all" method="POST" class="ms-sm-auto">
                        <input type="hidden" name="_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
                        <button class="btn btn-sm btn-outline-primary">Đánh dấu tất cả đã đọc</button>
                    </form>
                <?php endif; ?>
            </div>

            <section class="customer-card">
                <?php if ($notifications === []): ?>
                    <p class="text-muted mb-0">Chưa có thông báo.</p>
                <?php endif; ?>
                <?php foreach ($notifications as $notification): ?>
                    <article class="border-bottom py-3 <?= (int) $notification['is_read'] === 0 ? 'fw-semibold' : '' ?>">
                        <div class="d-flex flex-column flex-md-row gap-2 justify-content-between">
                            <div>
                                <div><?= htmlspecialchars($notification['title']) ?></div>
                                <div class="small <?= (int) $notification['is_read'] === 0 ? '' : 'text-muted' ?> fw-normal"><?= htmlspecialchars($notification['message']) ?></div>
                                <small class="text-muted fw-normal"><?= htmlspecialchars($notification['created_at']) ?></small>
                            </div>
                            <div class="d-flex gap-2 align-items-start">
                                <?php if (!empty($notification['link']) && preg_match('/^\?url=customer\/order&id=[1-9][0-9]*$/', $notification['link'])): ?>
                                    <a class="btn btn-sm btn-outline-secondary" href="<?= BASE_URL ?>/<?= htmlspecialchars($notification['link']) ?>">Xem đơn</a>
                                <?php endif; ?>
                                <?php if ((int) $notification['is_read'] === 0): ?>
                                    <form action="<?= BASE_URL ?>/?url=customer/notification/read" method="POST">
                                        <input type="hidden" name="_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
                                        <input type="hidden" name="notification_id" value="<?= (int) $notification['id'] ?>">
                                        <button class="btn btn-sm btn-primary">Đã đọc</button>
                                    </form>
                                <?php endif; ?>
                            </div>
                        </div>
                    </article>
                <?php endforeach; ?>
            </section>

            <?php if ($totalPages > 1): ?><nav class="mt-3"><ul class="pagination"><?php for ($number = 1; $number <= $totalPages; $number++): ?><li class="page-item <?= $number === $page ? 'active' : '' ?>"><a class="page-link" href="<?= BASE_URL ?>/?url=customer/notifications&<?= htmlspecialchars(http_build_query(['state' => $state, 'page' => $number])) ?>"><?= $number ?></a></li><?php endfor; ?></ul></nav><?php endif; ?>
        </div>
    </div></div>
</main>

<?php require BASE_PATH . '/app/views/layouts/footer.php'; ?>
