{% extends 'base.html.twig' %}

{% block title %} AdminController {% endblock %}

{% block body %}

    <!-- Page Loader -->
    <div class="page-loader-wrapper">
        <div class="loader">
            <div class="m-t-30"><img src="../assets/images/icon-50.png" width="48" height="48" alt="Lucid"></div>
            <p>Chargement...</p>
        </div>
    </div>
    <!-- Overlay For Sidebars -->

    <div id="wrapper">

        <nav class="navbar navbar-fixed-top">
            <div class="container-fluid">
                <div class="navbar-btn">
                    <button type="button" class="btn-toggle-offcanvas"><i class="lnr lnr-menu fa fa-bars"></i></button>
                </div>

                <div class="navbar-brand">
                    <a href="{{ path('get_dashboard') }}"><img src="../assets/images/gardoxy.png" alt="Lucid Logo" class="img-responsive logo"></a>
                </div>

                <div class="navbar-right">


                    <div id="navbar-menu">
                        <ul class="nav navbar-nav">



                            <li>
                                <a href="{{ path('app_logout') }}" class="icon-menu"><i class="icon-login"></i></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </nav>

        <div id="left-sidebar" class="sidebar">
            <div class="sidebar-scroll">
                <div class="user-account">
                    <img style="margin-top: 16px;" src="http://firststepgabes.com/wp-content/uploads/2020/02/cropped-FirsStep-1.png" class="rounded-circle user-photo" alt="User Profile Picture">
                    <div class="dropdown">
                        <span>Bonjour,</span>
                        <a href="javascript:void(0);" class="user-name"><strong>FIRST STEP GABES</strong></a>
                    </div>
                    <hr>

                </div>
                <!-- Nav tabs -->
                <ul class="nav nav-tabs">
                    <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#menu">Menu</a></li>
                    <li class="nav-item"><button id="toDispaly" class="nav-link" data-toggle="tab" href="#Chat"><i class="icon-book-open"></i></button></li>
                </ul>

                <!-- Tab panes -->
                <div class="tab-content p-l-0 p-r-0">
                    <div class="tab-pane active" id="menu">
                        <nav id="left-sidebar-nav" class="sidebar-nav">
                            <ul id="main-menu" class="metismenu">
                                <li class="active">
                                    <a href="{{ path('get_dashboard') }}"><i class="icon-home"></i> <span>Dashboard</span></a>
                                </li>
                                <li class="active">
                                    <a href="{{ path('depense_index') }}"  aria-expanded="true"><i class="fa fa-money"></i> <span>Depenses</span></a>
                                </li>

                                <li class="active">
                                    <a href="{{ path('classe_index') }}"  aria-expanded="true"><i class="fa fa-mortar-board"></i> <span>Classes</span></a>

                                </li>
                                <li class="active">
                                    <a href="{{ path('event_index') }}" aria-expanded="true"><i class="fa fa-bullhorn"></i> <span>Evenements</span></a>

                                </li>
                                <li class="active">
                                    <a href="{{ path('emploi_index') }}"  aria-expanded="true"><i class="fa fa-calendar"></i> <span>Emplois</span></a>

                                </li>
                                <li class="active">
                                    <a href="{{ path('user_index') }}"  aria-expanded="true"><i class="fa fa-user"></i> <span>Parents</span></a>

                                </li>
                                <li class="active">
                                    <a href="{{ path('enfant_index') }}"  aria-expanded="true"><i class="fa fa-child"></i> <span>Enfants</span></a>

                                </li>
                                <li class="active">
                                    <a href="{{ path('rapport_index') }}" aria-expanded="true"><i class="icon-note"></i> <span>Rapports</span></a>

                                </li>

                                <li class="active">
                                    <a href="{{ path('get_admin_messaging') }}"  aria-expanded="true"><i class="icon-note"></i> <span>Discussions</span></a>

                                </li>
                            </ul>
                        </nav>
                    </div>
                    <div class="tab-pane p-l-15 p-r-15" id="Chat">
                        <ul id="listOfKids" class="right_chat list-unstyled">

                        </ul>
                    </div>
                    <div class="tab-pane p-l-15 p-r-15" id="setting">
                        <h6>Choose Skin</h6>
                        <ul class="choose-skin list-unstyled">
                            <li data-theme="purple">
                                <div class="purple"></div>
                                <span>Purple</span>
                            </li>
                            <li data-theme="blue">
                                <div class="blue"></div>
                                <span>Blue</span>
                            </li>
                            <li data-theme="cyan" class="active">
                                <div class="cyan"></div>
                                <span>Cyan</span>
                            </li>
                            <li data-theme="green">
                                <div class="green"></div>
                                <span>Green</span>
                            </li>
                            <li data-theme="orange">
                                <div class="orange"></div>
                                <span>Orange</span>
                            </li>
                            <li data-theme="blush">
                                <div class="blush"></div>
                                <span>Blush</span>
                            </li>
                        </ul>
                        <hr>
                        <h6>General Settings</h6>
                        <ul class="setting-list list-unstyled">
                            <li>
                                <label class="fancy-checkbox">
                                    <input type="checkbox" name="checkbox">
                                    <span>Report Panel Usag</span>
                                </label>
                            </li>
                            <li>
                                <label class="fancy-checkbox">
                                    <input type="checkbox" name="checkbox" checked>
                                    <span>Email Redirect</span>
                                </label>
                            </li>
                            <li>
                                <label class="fancy-checkbox">
                                    <input type="checkbox" name="checkbox" checked>
                                    <span>Notifications</span>
                                </label>
                            </li>
                            <li>
                                <label class="fancy-checkbox">
                                    <input type="checkbox" name="checkbox">
                                    <span>Auto Updates</span>
                                </label>
                            </li>
                            <li>
                                <label class="fancy-checkbox">
                                    <input type="checkbox" name="checkbox">
                                    <span>Offline</span>
                                </label>
                            </li>
                            <li>
                                <label class="fancy-checkbox">
                                    <input type="checkbox" name="checkbox">
                                    <span>Location Permission</span>
                                </label>
                            </li>
                        </ul>
                    </div>
                    <div class="tab-pane p-l-15 p-r-15" id="question">
                        <form>
                            <div class="input-group">
                                <div class="input-group-prepend">
                                    <span class="input-group-text"><i class="icon-magnifier"></i></span>
                                </div>
                                <input type="text" class="form-control" placeholder="Search...">
                            </div>
                        </form>
                        <ul class="list-unstyled question">
                            <li class="menu-heading">HOW-TO</li>
                            <li><a href="javascript:void(0);">How to Create Campaign</a></li>
                            <li><a href="javascript:void(0);">Boost Your Sales</a></li>
                            <li><a href="javascript:void(0);">Website Analytics</a></li>
                            <li class="menu-heading">ACCOUNT</li>
                            <li><a href="javascript:void(0);">Cearet New Account</a></li>
                            <li><a href="javascript:void(0);">Change Password?</a></li>
                            <li><a href="javascript:void(0);">Privacy &amp; Policy</a></li>
                            <li class="menu-heading">BILLING</li>
                            <li><a href="javascript:void(0);">Payment info</a></li>
                            <li><a href="javascript:void(0);">Auto-Renewal</a></li>
                            <li class="menu-button m-t-30">
                                <a href="javascript:void(0);" class="btn btn-primary"><i class="icon-question"></i> Need Help?</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <div id="main-content">

            <div class="container-fluid">
                {% block conteneur %}
                <div class="block-header">
                    <div class="row">
                        <div class="col-lg-5 col-md-8 col-sm-12">
                            <h2><a href="javascript:void(0);" class="btn btn-xs btn-link btn-toggle-fullwidth"><i class="fa fa-arrow-left"></i></a>GARDOXY</h2>
                            <ul class="breadcrumb">
                                <li class="breadcrumb-item"><a href="index.html"><i class="icon-home"></i></a></li>
                                <li class="breadcrumb-item active">Gardory - School</li>
                            </ul>
                        </div>

                    </div>
                </div>

                <div class="row clearfix">
                    <div class="col-lg-4 col-md-6">
                        <div class="card top_counter">
                            <div class="body">
                                <div class="icon text-info"><i class="fa fa-user"></i> </div>
                                <div class="content">
                                    <div class="text">Nombre d'Enfants</div>
                                    <h5 class="number">{{enfants}}</h5>
                                </div>
                                <hr>
                                <div class="icon text-info"><i class="fa fa-user"></i> </div>
                                <div class="content">
                                    <div class="text">Enfants Payés</div>
                                    <h5 class="number">{{payes}}</h5>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6">
                        <div class="card top_counter">
                            <div class="body">
                                <div class="icon text-warning"><i class="fa fa-tags"></i> </div>
                                <div class="content">
                                    <div class="text">Evenements</div>
                                    <h5 class="number">{{ events }}</h5>
                                </div>
                                <hr>
                                <div class="icon"><i class="fa fa-graduation-cap"></i> </div>
                                <div class="content">
                                    <div class="text">Classes</div>
                                    <h5 class="number">{{ classes }}</h5>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6">
                        <div class="card top_counter">
                            <div class="body">
                                <div class="icon text-danger"><i class="fa fa-credit-card"></i> </div>
                                <div class="content">
                                    <div class="text">Depenses</div>
                                    <h5 class="number">{{ depenses }} DT</h5>
                                </div>
                                <hr>
                                <div class="icon text-success"><i class="fa fa-university"></i> </div>
                                <div class="content">
                                    <div class="text">Revenue</div>
                                    <h5 class="number">{{ revenus }} DT</h5>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

                <div class="row clearfix">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <div class="card">
                            <div class="header">
                                <h2>University Survey</h2>
                                <ul class="header-dropdown">
                                    <li class="dropdown">
                                        <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"></a>
                                        <ul class="dropdown-menu dropdown-menu-right">
                                            <li><a href="javascript:void(0);">Action</a></li>
                                            <li><a href="javascript:void(0);">Another Action</a></li>
                                            <li><a href="javascript:void(0);">Something else</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                            <div class="body">
                                <div class="row text-center">
                                    <div class="col-sm-3 col-6">
                                        <h4 class="margin-0">$231</h4>
                                        <p class="text-muted margin-0"> Today's</p>
                                    </div>
                                    <div class="col-sm-3 col-6">
                                        <h4 class="margin-0">$1,254</h4>
                                        <p class="text-muted margin-0">This Week's</p>
                                    </div>
                                    <div class="col-sm-3 col-6">
                                        <h4 class="margin-0">$3,298</h4>
                                        <p class="text-muted margin-0">This Month's</p>
                                    </div>
                                    <div class="col-sm-3 col-6">
                                        <h4 class="margin-0">$9,208</h4>
                                        <p class="text-muted margin-0">This Year's</p>
                                    </div>
                                </div>
                                <div id="m_bar_chart" class="graph m-t-20"></div>
                            </div>
                        </div>
                    </div>
                </div>



                </div>

                <div class="row clearfix">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="header">
                                <h2>New Admission List</h2>
                                <ul class="header-dropdown">
                                    <li class="dropdown">
                                        <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"></a>
                                        <ul class="dropdown-menu dropdown-menu-right">
                                            <li><a href="javascript:void(0);">Action</a></li>
                                            <li><a href="javascript:void(0);">Another Action</a></li>
                                            <li><a href="javascript:void(0);">Something else</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                            <div class="body">
                                <div class="table-responsive">
                                    <table class="table table-hover m-b-0">
                                        <thead class="thead-dark">
                                        <tr>
                                            <th>ID</th>
                                            <th>Name</th>
                                            <th>Age</th>
                                            <th>Address</th>
                                            <th>Number</th>
                                            <th>Department</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr>
                                            <td><span class="list-name">OU 00456</span></td>
                                            <td>Joseph</td>
                                            <td>25</td>
                                            <td>70 Bowman St. South Windsor, CT 06074</td>
                                            <td>404-447-6013</td>
                                            <td><span class="badge badge-primary">MCA</span></td>
                                        </tr>
                                        <tr>
                                            <td><span class="list-name">KU 00789</span></td>
                                            <td>Cameron</td>
                                            <td>27</td>
                                            <td>123 6th St. Melbourne, FL 32904</td>
                                            <td>404-447-4569</td>
                                            <td><span class="badge badge-warning">Medical</span></td>
                                        </tr>
                                        <tr>
                                            <td><span class="list-name">KU 00987</span></td>
                                            <td>Alex</td>
                                            <td>23</td>
                                            <td>123 6th St. Melbourne, FL 32904</td>
                                            <td>404-447-7412</td>
                                            <td><span class="badge badge-info">M.COM</span></td>
                                        </tr>
                                        <tr>
                                            <td><span class="list-name">OU 00951</span></td>
                                            <td>James</td>
                                            <td>23</td>
                                            <td>44 Shirley Ave. West Chicago, IL 60185</td>
                                            <td>404-447-2589</td>
                                            <td><span class="badge badge-default">MBA</span></td>
                                        </tr>
                                        <tr>
                                            <td><span class="list-name">OU 00456</span></td>
                                            <td>Joseph</td>
                                            <td>25</td>
                                            <td>70 Bowman St. South Windsor, CT 06074</td>
                                            <td>404-447-6013</td>
                                            <td><span class="badge badge-primary">MCA</span></td>
                                        </tr>
                                        <tr>
                                            <td><span class="list-name">OU 00953</span></td>
                                            <td>charlie</td>
                                            <td>21</td>
                                            <td>123 6th St. Melbourne, FL 32904</td>
                                            <td>404-447-9632</td>
                                            <td><span class="badge badge-success">BBA</span></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>



                <div class="row clearfix">

                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <div class="card">
                            <div class="header">
                                <h2>Timeline</h2>
                                <ul class="header-dropdown">
                                    <li class="remove">
                                        <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                                    </li>
                                </ul>
                            </div>
                            <div class="body">
                                <div class="new_timeline">
                                    <div class="header">
                                        <div class="color-overlay">
                                            <div class="day-number">8</div>
                                            <div class="date-right">
                                                <div class="day-name">Monday</div>
                                                <div class="month">February 2018</div>
                                            </div>
                                        </div>
                                    </div>
                                    <ul>
                                        <li>
                                            <div class="bullet pink"></div>
                                            <div class="time">11am</div>
                                            <div class="desc">
                                                <h3>Attendance</h3>
                                                <h4>Computer Class</h4>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="bullet green"></div>
                                            <div class="time">12pm</div>
                                            <div class="desc">
                                                <h3>Design Team</h3>
                                                <h4>Hangouts</h4>
                                                <ul class="list-unstyled team-info margin-0 p-t-5">
                                                    <li><img src="http://via.placeholder.com/35x35" alt="Avatar"></li>
                                                    <li><img src="http://via.placeholder.com/35x35" alt="Avatar"></li>
                                                    <li><img src="http://via.placeholder.com/35x35" alt="Avatar"></li>
                                                    <li><img src="http://via.placeholder.com/35x35" alt="Avatar"></li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="bullet orange"></div>
                                            <div class="time">1:30pm</div>
                                            <div class="desc">
                                                <h3>Lunch Break</h3>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="bullet green"></div>
                                            <div class="time">2pm</div>
                                            <div class="desc">
                                                <h3>Finish</h3>
                                                <h4>Go to Home</h4>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
{% endblock %}
    </div>
{% endblock %}