{extends file="views/layout.tpl"}

{block name="content"}

    <section class="sb-nav-fixed">
        <nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark">

            <a class="navbar-brand ps-3" href="index.php?ctrl=project&action=home"><img src="assests/img/Logo-Wordmark.svg" alt="Logo du site" width="150px"></a>
            <button class="btn btn-link btn-sm order-1 order-lg-0 me-4 me-lg-0" id="sidebarToggle" href="#!"><i class="fas fa-bars"></i></button>
            <form class="d-none d-md-inline-block form-inline ms-auto me-0 me-md-3 my-2 my-md-0">
                <div class="input-group">
                    <input class="form-control" type="text" placeholder="Recherche par pseudo..." aria-label="Recherche pseudo" aria-describedby="btnNavbarSearch" />
                    <button class="btn btn-primary" id="btnNavbarSearch" type="button"><i class="fas fa-search"></i></button>
                </div>
            </form>

            <!-- Navbar - User-->
            <ul class="navbar-nav ms-auto ms-md-0 me-3 me-lg-4">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" id="navbarDropdown" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false"><i class="fas fa-user fa-fw"></i></a>
                    <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
                        <li><a class="dropdown-item" href="/option.php">Paramètre</a></li>
                        <li><hr class="dropdown-divider" /></li>
                        <li><a class="dropdown-item" href="/deconnexion.php">Déconnexion</a></li>
                    </ul>
                </li>
            </ul>
        </nav>
        
        <!-- SideNav Infos -->
        <div id="layoutSidenav">
            <div id="layoutSidenav_nav">
                <nav class="sb-sidenav accordion sb-sidenav-dark" id="sidenavAccordion">
                    <div class="sb-sidenav-menu">
                        <div class="nav">
                            <div class="sb-sidenav-menu-heading"></div>
                            <a class="nav-link" href="index.html">
                                <div class="sb-nav-link-icon"><i class="fas fa-tachometer-alt"></i></div>
                                Rafraichir la page
                            </a>
                                <div class="sb-sidenav-menu-heading"></div>
                                <div class="collapse" id="collapseLayouts" aria-labelledby="headingOne" data-bs-parent="#sidenavAccordion">
                            </div>
                        
                            <form action="post">
                                <div class="container-fluid ps-2">
                                    <div class="row">
                                        <div class="col-6">
                                            <label for="checkbox1">Par date</label>
                                        </div>
                                        <div class="col-6 text-center">
                                            <input type="checkbox" name="search_date" id="">
                                        </div>
                                        <div class="col-6">
                                            <label for="checkbox2">Par date de creation de compte</label>
                                        </div>
                                        <div class="col-6 text-center">
                                            <input type="checkbox" name="search_creationdate" id="">
                                        </div>
                                        <div class="col-6">
                                            <label for="checkbox3">Recherche par date</label>
                                        </div>
                                        <div class="col-6 text-center">
                                            <input type="checkbox" name="search_date" id="">
                                        </div>
                                        <div class="col-12 text-center">
                                            <button type="submit" class="btn mt-3 bg-primary text-light">Recherche</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="sb-sidenav-footer">
                        <div class="small">Connecté avec le compte :</div>
                        {$smarty.session.user.user_name}
                    </div>
                </nav>
            </div>

            <div id="layoutSidenav_content">
                <main>
                    <div class="container-fluid px-4">
                        <h1 class="mt-4">Dashboard</h1>
                    <div class="container-fluid px-4">
                        <!-- USER MODIF -->
                        <div class="p-3 mt-2 text-primary-emphasis bg-primary-subtle border border-primary-subtle rounded-3">
                            <div class="container-fluid pt-2">
                                <div class="row">
                                    <div class="col-4">
                                        <img src="./assests/img/Logo-Wordmark.svg" alt="" width="100"> 
                                    </div>
                                    <div class="col-4">
                                        <select class="form-select" aria-label="Default select example">
                                            <option value="0" selected>Modifier le statut de  l'Utilisateur...</option>
                                            {foreach from=$arrStatusToDisplay item=arrDetStatus}
                                            <option value="{$arrDetStatus->getId()}">{$arrDetStatus->getStatusName()}</option>
                                            {/foreach}
                                        </select>
                                    </div>
                                    <div class="col-4">
                                        <button class="btn bg-danger text-light rounded-circle">X</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- catégorie modif --> 
                        <div class="p-3 mt-2 text-primary-emphasis bg-primary-subtle border border-primary-subtle rounded-3">
                            <form method="post">
                                <div class="container-fluid pt-2">
                                    <div class="row">
                                        <div class="col-6">
                                            <select class="form-select" aria-label="Default select example">
                                                <option value="0" selected >Modifier un catégorie existante</option>
                            
                                                {foreach from=$arrCategoryToDisplay item=arrDetCategory}
                                                    <option value="{$arrDetCategory->getId()}" >
                                                        {$arrDetCategory->getName()} 
                                                    </option>
                                                {/foreach}
                                            </select>
                                            <br>
                                            <input type="text" class="form-control" id="floatingInput" name="edit_category">
                                        </div>
                                            <div class="col-2">
                                                <button type="submit" class="btn bg-success text-light rounded-circle"> ✓</button>
                                            </div>
                                        <div class="col-2">
                                            <button class="btn bg-danger text-light rounded-circle">X</button>
                                        </div>
                                    </div>
                                    <br>
                                    <br>
                                    <br>
                                    <div class="row">
                                            <!-- creation cat-->
                                        <div class="col-6">
                                            <label>Créer une nouvelle catégorie</label>
                                            <div class="form-floating mb-3">
                                                <input type="text" class="form-control" id="floatingInput" name="new_category">
                                                <label for="floatingInput">Créer une nouvelle catégorie</label>
                                            </div>
                                        </div>
                                        <div class="col-2">
                                            <button type="submit" class="btn bg-success text-light rounded-circle"> ✓</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </main>
            </div>
    </section>
{/block}