{% extends 'base.html.twig' %}
{% set titleName = "Home" %}
{% block title %} POWER DATA {% endblock %}
{% block page %}{{titleName}}{% endblock %}
{% block breadcrumb %} {% if titleName != "Home" %} {{titleName}} {% endif %} {% endblock %}


{% block css %}
    <style>
        #contentHeaderBase{
            display: none;
        }
    </style>
{% endblock %}

{% block content %}
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <h3>Jumia</h3>
            </div>
            <div class="row">

                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box  bg-gradient-purple">
                        <div class="inner">
                            <h3>{{ pending }}</h3>

                            <p>Jumia Orders PENDING </p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-ios-cart-outline"></i>
                        </div>
                        <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box  bg-navy">
                        <div class="inner">
                            <h3 id="coutBatchValid">{{ batch }}</h3>

                            <p>Batch VALID </p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-ios-box-outline" style="color: white"></i>
                        </div>
                        <a
                            {% if is_granted('ROLE_ADMIN') or  is_granted('ROLE_BATCH_MANAGER') or  is_granted('ROLE_BATCH_CONSULT') or  is_granted('ROLE_BATCH_CHECKER') %}
                            href="{{ path('app_admin_power_batches') }}"
                        {% endif %}

                        class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-gradient-maroon">
                        <div class="inner">
                            <h3>{{ orders }}</h3>
                            <p>Jumia Orders</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-android-cart"></i>
                        </div>
                        <a href="{{ path('app_jumia_orders_index') }}" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-info">
                        <div class="inner">
                            <h3>{{ dolibarrProducts }}</h3>

                            <p>Dolibarr Products</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-ios-pricetags-outline"></i>
                        </div>
                        <a href="{{ path('app_dolibarr_product') }}" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-gradient-cyan">
                        <div class="inner">
                            <h3>{{ jumiaProducts }}</h3>
                            <p>Jumia Products</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-ios-pricetags"></i>
                        </div>
                        <a href="{{ path('app_jumia_products_index') }}" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-warning">
                        <div class="inner">
                            <h3>{{ rapports }}</h3>

                            <p>Jumia Rapports</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-stats-bars"></i>
                        </div>
                        <a href="{{ path('app_jumia_rapport_products_index') }}" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box  bg-success">
                        <div class="inner">
                            <h3>{{ transactions }}</h3>

                            <p>Jumia Transactions </p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-android-checkbox-outline"></i>
                        </div>
                        <a href="{{ path('app_jumia_transaction_index') }}" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-gradient-olive">
                        <div class="inner">
                            <h3>{{ jumiaPayoutStatus }}</h3>

                            <p>Jumia Payout Status </p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-cash  ion-social-bitcoin "></i>
                        </div>
                        <a href="{{ path('app_jumia_payout_status') }}" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box  bg-gray-dark">
                        <div class="inner">
                            <h3>{{ jumiaPlaning }}</h3>

                            <p>Jumia CronTab </p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-ios-cog"></i>
                        </div>
                        <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box  bg-gray-dark">
                        <div class="inner">
                            <h3>{{ dolibarrPlaning }}</h3>

                            <p>Dolibarr CronTab </p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-ios-cog"></i>
                        </div>
                        <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </section>
{% endblock %}