<?php

$pageTitle =
    'Danh mục sản phẩm - PET SPA';

$pageStyles = [
    'owner.css'
];

$activeOwnerPage =
    'categories';


$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="owner-area">

    <div class="container-fluid">

        <div class="row g-4">

            <div class="col-xl-2 col-lg-3">

                <?php require BASE_PATH
                    . '/app/views/layouts/owner-sidebar.php';
                ?>

            </div>


            <div class="col-xl-10 col-lg-9">

                <div class="owner-page-header">

                    <div>

                        <h1>
                            Danh mục sản phẩm
                        </h1>

                        <p>
                            Quản lý nhóm sản phẩm của cửa hàng.
                        </p>

                    </div>


                    <button
                        class="btn btn-primary"
                        data-bs-toggle="modal"
                        data-bs-target="#addCategoryModal"
                    >
                        + Thêm danh mục
                    </button>

                </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; ?>


                <section class="owner-card">

                    <div class="table-responsive">

                        <table class="table align-middle owner-table">

                            <thead>

                                <tr>

                                    <th>Tên danh mục</th>
                                    <th>Slug</th>
                                    <th>Sản phẩm</th>
                                    <th>Thứ tự</th>
                                    <th>Trạng thái</th>
                                    <th></th>

                                </tr>

                            </thead>


                            <tbody>

                                <?php foreach (
                                    $categories
                                    as $category
                                ): ?>

                                    <tr>

                                        <td>

                                            <strong>

                                                <?= htmlspecialchars(
                                                    $category['name']
                                                ) ?>

                                            </strong>

                                        </td>


                                        <td>

                                            <code>

                                                <?= htmlspecialchars(
                                                    $category['slug']
                                                ) ?>

                                            </code>

                                        </td>


                                        <td>

                                            <?= (int)
                                                $category['product_count']
                                            ?>

                                        </td>


                                        <td>

                                            <?= (int)
                                                $category['sort_order']
                                            ?>

                                        </td>


                                        <td>

                                            <?php if (
                                                (int)
                                                $category['is_active']
                                                === 1
                                            ): ?>

                                                <span
                                                    class="badge bg-success"
                                                >
                                                    Hoạt động
                                                </span>

                                            <?php else: ?>

                                                <span
                                                    class="badge bg-secondary"
                                                >
                                                    Đã ẩn
                                                </span>

                                            <?php endif; ?>

                                        </td>


                                        <td>

                                            <form
                                                action="<?= BASE_URL ?>/?url=owner/product-category/toggle"
                                                method="POST"
                                            >

                                                <input
                                                    type="hidden"
                                                    name="_token"
                                                    value="<?= htmlspecialchars(
                                                        $_SESSION['csrf_token']
                                                    ) ?>"
                                                >

                                                <input
                                                    type="hidden"
                                                    name="category_id"
                                                    value="<?= (int)
                                                        $category['id']
                                                    ?>"
                                                >

                                                <button
                                                    class="btn btn-sm btn-light"
                                                    type="submit"
                                                >

                                                    <?= (int)
                                                        $category['is_active']
                                                        === 1
                                                        ? 'Ẩn'
                                                        : 'Hiện'
                                                    ?>

                                                </button>

                                            </form>

                                        </td>

                                    </tr>

                                <?php endforeach; ?>

                            </tbody>

                        </table>

                    </div>

                </section>

            </div>

        </div>

    </div>

</main>


<!-- ADD CATEGORY MODAL -->

<div
    class="modal fade"
    id="addCategoryModal"
    tabindex="-1"
>

    <div class="modal-dialog">

        <div class="modal-content">

            <form
                action="<?= BASE_URL ?>/?url=owner/product-category/store"
                method="POST"
            >

                <input
                    type="hidden"
                    name="_token"
                    value="<?= htmlspecialchars(
                        $_SESSION['csrf_token']
                    ) ?>"
                >


                <div class="modal-header">

                    <h5 class="modal-title">
                        Thêm danh mục
                    </h5>

                    <button
                        type="button"
                        class="btn-close"
                        data-bs-dismiss="modal"
                    ></button>

                </div>


                <div class="modal-body">

                    <div class="mb-3">

                        <label class="form-label">
                            Tên danh mục *
                        </label>

                        <input
                            type="text"
                            name="name"
                            class="form-control"
                            required
                        >

                    </div>


                    <div class="mb-3">

                        <label class="form-label">
                            Danh mục cha
                        </label>

                        <select
                            name="parent_id"
                            class="form-select"
                        >

                            <option value="0">
                                Không có
                            </option>


                            <?php foreach (
                                $categories
                                as $category
                            ): ?>

                                <option
                                    value="<?= (int)
                                        $category['id']
                                    ?>"
                                >

                                    <?= htmlspecialchars(
                                        $category['name']
                                    ) ?>

                                </option>

                            <?php endforeach; ?>

                        </select>

                    </div>


                    <div class="mb-3">

                        <label class="form-label">
                            Mô tả
                        </label>

                        <textarea
                            name="description"
                            class="form-control"
                            rows="3"
                        ></textarea>

                    </div>


                    <div class="mb-3">

                        <label class="form-label">
                            Thứ tự hiển thị
                        </label>

                        <input
                            type="number"
                            name="sort_order"
                            class="form-control"
                            value="0"
                        >

                    </div>


                    <div class="form-check">

                        <input
                            type="checkbox"
                            name="is_active"
                            class="form-check-input"
                            id="categoryActive"
                            checked
                        >

                        <label
                            class="form-check-label"
                            for="categoryActive"
                        >
                            Hiển thị danh mục
                        </label>

                    </div>

                </div>


                <div class="modal-footer">

                    <button
                        type="button"
                        class="btn btn-light"
                        data-bs-dismiss="modal"
                    >
                        Hủy
                    </button>

                    <button
                        type="submit"
                        class="btn btn-primary"
                    >
                        Thêm danh mục
                    </button>

                </div>

            </form>

        </div>

    </div>

</div>


<?php

require BASE_PATH
    . '/app/views/layouts/footer.php';

?>