{% extends'@admin/base.html.twig' %}
{% block stylesheets %}
    {{ parent() }}
    <style type="text/css">
        .m-widget24 .m-widget24__item .m-widget24__stats {
            margin-top: -2.7rem;
        }
    </style>
{% endblock %}
{% block subheader %}
    <h3 class="m-subheader__title m-subheader__title--separator">
        {% if category == 'client' %}VENTES :{% else %}ACHATS : {% endif %}
        {% if type == 'commande' %}  LISTE DES BONS COMMANDE
        {% elseif type == 'echange' %}  LISTE DES BONS D'ECHANGE
        {% elseif type == 'facture' %}  LISTE DES FACTURES
        {% elseif type == 'achat' %}  LISTE DES <span class="m--font-success">DEMANDES D'ACHAT</span>
        {% elseif type == 'reception' %}  LISTE DES <span class="m--font-danger">BONS DE RÉCEPTION</span>
        {% elseif type == 'retour' %}  LISTE DES <span class="m--font-warning">BONS DE RETOUR</span>
        {% endif %}
        <input type="hidden" name="type" value="{{ type  }}">
    </h3>
    <ul class="m-subheader__breadcrumbs m-nav m-nav--inline">
        <li class="m-nav__item m-nav__item--home">
            <a href="{{ path('index') }}" class="m-nav__link m-nav__link--icon">
                <i class="m-nav__link-icon fa fa-home"></i>
            </a>
        </li>
        <li class="m-nav__separator">-</li>
        <li class="m-nav__item">
            {% if category == 'client' %}VENTES {% else %} ACHATS{% endif %}
        </li>
        <li class="m-nav__separator">-</li>
        <li class="m-nav__item">
            <a href="#" class="m-nav__link">
                {% if type == 'commande' %} BONS COMMANDE
                {% elseif type == 'echange' %}  BONS D'ECHANGE
                {% elseif type == 'facture' %}   FACTURES
                {% elseif type == 'achat' %}   DEMANDES D'ACHAT
                {% elseif type == 'reception' %}   BONS DE RÉCEPTION
                {% elseif type == 'retour' %}   BONS DE RETOUR
                {% endif %}
            </a>
        </li>
    </ul>
{% endblock %}
{% block breadcrumb %}{% endblock %}
{% block stat %}
    <div  class="flex-right">
        <ul  class="action-nav">
            <li>
                <span  class="el-tooltip wrapper" aria-describedby="el-tooltip-1218" tabindex="0">
                    <a class="el-button el-button--primary m--font-success" data-bs-toggle="modal" data-bs-target="{% if category == 'client' %}#m_modal_7{% else %}#m_modal_8{% endif %}">Créer {% if type == 'commande' %} BONS COMMANDE
                        {% elseif type == 'echange' %}  un BON D'ECHANGE
                        {% elseif type == 'facture' %}  une FACTURE
                        {% elseif type == 'achat' %}   une DEMANDE D'ACHAT
                        {% elseif type == 'reception' %}  un BON DE RÉCEPTION
                        {% elseif type == 'retour' %}  un BONS DE RETOUR
                        {% endif %}</a>
                </span>
            </li>
        </ul>
    </div>
{% endblock %}
{% block bodycontent %}
    <div class="row">
        <div class="col-lg-12">
            <div class="contentMargin">
                <div id="legacy-container">
                    <div  class="role" data-role="{% if is_granted('ROLE_SUPER_ADMIN') %}ROLE_SUPER_ADMIN{% elseif is_granted('ROLE_ADMIN') %}ROLE_ADMIN{% else %}{% endif %}"></div>
                    <div  class="listing-layout flex-column hp-10">
                        <div  class="listing prelative flex-column ov-reset mh-0 flex">
                            {% if is_granted('ROLE_SUPER_ADMIN') %}
                            <div  class="listing-tools flex-level flex-top no-shrink mb-2">
                                <div  id="totalContent" class="row gutters1 thirdStats">
                                    <div  class="span_12">
                                        <div  class="well ovx-auto">
                                            <ul  class="kpi-list list-inline acenter bs_1 list-statistic">
                                                <li  id="block_avgSell" class="kpi">
                                                    <div  class="kpi-label">Nombre total</div>
                                                    <div  class="kpi-value amount nbrTotal">0</div>
                                                </li>
                                                {% if is_granted('ROLE_SUPER_ADMIN') %}
                                                    <li  id="block_sumSell" class="kpi">
                                                        <div  class="kpi-label">Montant Total</div>
                                                        <div  class="kpi-value amount amountTotal">0.00 <sup>TND</sup></div>
                                                    </li>
                                                    <li  id="block_sumQt" class="kpi border-right">
                                                        <div  class="kpi-label">Moyenne</div>
                                                        <div  class="kpi-value amount moyenne">0</div>
                                                    </li>
                                                    <li  id="block_sumQt" class="kpi border-right">
                                                        <div  class="kpi-label">Bénéfice</div>
                                                        <div  class="kpi-value amount profit">0</div>
                                                    </li>
                                                {% endif %}
                                                {% if type in ['commande','echange'] %}
                                                <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                    <div  class="kpi-label">En attente</div>
                                                    <div  class="kpi-value amount nbreStatutAttente">0</div>
                                                </li>
                                                <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                    <div  class="kpi-label">Accepté</div>
                                                    <div  class="kpi-value amount nbreStatutAccepte">0</div>
                                                </li>
                                                <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                    <div  class="kpi-label">Expédié</div>
                                                    <div  class="kpi-value amount nbreStatutExpediee">0</div>
                                                </li>
                                                <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                    <div  class="kpi-label">Payé</div>
                                                    <div  class="kpi-value amount nbreStatutFacture">0</div>
                                                </li>
                                                <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                    <div  class="kpi-label">Annulé</div>
                                                    <div  class="kpi-value amount nbreStatutAnnule">0</div>
                                                </li>
                                                <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                    <div  class="kpi-label">Echange reçu</div>
                                                    <div  class="kpi-value amount nbreStatutEchange">0</div>
                                                </li>
                                                <li  id="block_avgQtSell" class="kpi nbrCondition">
                                                    <div  class="kpi-label">Retourné</div>
                                                    <div  class="kpi-value amount nbreStatutRetourne">0</div>
                                                </li>
                                                {% endif %}
                                                {% if type in ['facture'] %}
                                                    <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                        <div  class="kpi-label">Payé</div>
                                                        <div  class="kpi-value amount nbreStatutFacture">0</div>
                                                    </li>
                                                {% endif %}
                                                {% if type in ['echange'] %}

                                                {% endif %}
                                                {% if type in ['achat'] %}
                                                    <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                        <div  class="kpi-label">En attente</div>
                                                        <div  class="kpi-value amount nbreStatutAttente">0</div>
                                                    </li>
                                                    <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                        <div  class="kpi-label">Transformé</div>
                                                        <div  class="kpi-value ">0</div>
                                                    </li>
                                                {% endif %}
                                                {% if type in ['reception'] %}
                                                    <li  id="block_avgQtSell" class="kpi nbrCondition">
                                                        <div  class="kpi-label">Brouillon</div>
                                                        <div  class="kpi-value amount nbreStatutBrouillon">0</div>
                                                    </li>
                                                    <li  id="block_avgQtSell" class="kpi nbrCondition">
                                                        <div  class="kpi-label">Validé</div>
                                                        <div  class="kpi-value amount nbreStatutBrouillon">0</div>
                                                    </li>
                                                    <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                        <div  class="kpi-label">Payé</div>
                                                        <div  class="kpi-value amount nbreStatutFacture">0</div>
                                                    </li>
                                                {% endif %}
                                                {% if type in ['retour'] %}
                                                    <li  id="block_avgQtSell" class="kpi nbrCondition">
                                                        <div  class="kpi-label">Brouillon</div>
                                                        <div  class="kpi-value amount nbreStatutBrouillon">0</div>
                                                    </li>
                                                    <li  id="block_avgQtSell" class="kpi nbreStatut">
                                                        <div  class="kpi-label">Expédié</div>
                                                        <div  class="kpi-value amount nbreStatutExpediee">0</div>
                                                    </li>
                                                {% endif %}
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {% endif %}
                            <div  class="flex-row mh-0 flex">
                                <div  class="leftpane well well-no-shadow me-4 col-2 flex-column" style="display: {% if is_granted('ROLE_SUPER_ADMIN')  %}block{% else %}none{% endif %};">
                                    <div  class="flex-column flex ff-fix ov-reset">
                                        <div  class="pb-2 bb-1">
                                            <div  class="flex-level no-shrink">
                                                <h3  class="flex my-0 title-h3">
                                                    <span  class="">Filtrer</span>
                                                </h3>
                                                <a id="close_filter" href="#" class="close-btn">×</a>
                                            </div>
                                        </div>
                                        <div  class="flex-level mt-3 pb-1 no-shrink h-3">
                                            <span  class="flex fs-3 semibold grey">Favoris</span>
                                            <a id='clear_filter'  href="#" class="btn btn-no-background btn-small fs-3 semibold pe-0">Voir tous</a>
                                        </div>
                                        <div  class="row">
                                            <div  class="form-input wp-10">
                                                {{ form_start(form, { 'attr' : { 'class': 'm-form m-form--fit' } }) }}
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Date</label>
                                                    {{ form_widget(form.date, {'attr': {'class': 'form-control m-input', 'placeholder':'Date'},'value': app.request.query.get('date')|trim}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <div class="date">
                                                        {% if app.request.query.get('date') == 'All' %}
                                                            {{ form_widget(form.dateBefore, {'attr': {'class': 'datetimepicker-width  form-control m-input hide', 'autocomplete':'off' }}) }}
                                                        {% else %}
                                                            {{ form_widget(form.dateBefore, {'attr': {'class': 'datetimepicker-width  form-control m-input hide', 'autocomplete':'off', 'value':  "now"|date("Y-m-d") }}) }}
                                                        {% endif %}
                                                    </div>
                                                    <label class="dateAfter" style="display: none;">au</label>
                                                    <div class="date">
                                                        {{ form_widget(form.dateAfter, {'attr': {'class': 'datetimepicker-width  form-control m-input hide', 'autocomplete':'off'}}) }}
                                                    </div>
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Statut</label>
                                                    {{ form_widget(form.status, {'attr': {'class': 'form-control m-input', 'placeholder':'Statut'},'value': app.request.query.get('statut')|trim}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Source</label>
                                                    {{ form_widget(form.source, {'attr': {'class': 'form-control m-input', 'placeholder':'Source'}}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Créer par</label>
                                                    {{ form_widget(form.user, {'attr': {'class': 'form-control m-input', 'placeholder':'Utilisateur'}}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Date expédition</label>
                                                    {{ form_widget(form.promisedAt, {'attr': {'class': 'form-control m-input', 'placeholder':'Date expédition'}}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Société de livraison</label>
                                                    {{ form_widget(form.delivery, {'attr': {'class': 'form-control m-input', 'placeholder':'Société de livraison'}}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>N° externe</label>
                                                    {{ form_widget(form.internalNbr, {'attr': {'class': 'form-control m-input', 'placeholder':'N° externe'}}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>N° Suivi</label>
                                                    {{ form_widget(form.parcelTrackingNbr, {'attr': {'class': 'form-control m-input', 'placeholder':'N° suivi'}}) }}
                                                </div >
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Gouvernorat</label>
                                                    {{ form_widget(form.region, {'attr': {'class': 'form-control m-input select2', 'placeholder':'ALl'}}) }}
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label class="col-form-label">
                                                        Montant (en TND)
                                                    </label>
                                                    <div class="row">
                                                        <div class="col-6">
                                                            {{ form_widget(form.totalAmountTtcMin, {'attr': {'class': 'form-control m-input', 'placeholder':'Min'}}) }}
                                                        </div>
                                                        <div class="col-6">
                                                            {{ form_widget(form.totalAmountTtcMax, {'attr': {'class': 'form-control m-input', 'placeholder':'Max'}}) }}
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2">
                                                    <label>Référence</label>
                                                    {{ form_widget(form.reference, {'attr': {'class': 'form-control m-input', 'placeholder':'Référence'}}) }}
                                                    {{ form_widget(form.typeElement, {'attr': {'class': 'form-control m-input', 'placeholder':'Référence'}}) }}
                                                    <input type="text" id="add_reference_produit" class="form-control m-input" placeholder="Référence">
                                                    <div class="result-search-reference-produit" style="display: none; min-width: 194px;">
                                                        <ul class="m-menu__subnav padding-5" id="content-result-reference-produit">
                                                        </ul>
                                                    </div>
                                                </div>

                                                <div class="mb-3 {{ (category != 'fournisseur')?"hide":""}} m-form__group px-3 pb-0 pt-2">
                                                    <label>Fournisseur</label>
                                                    {{ form_widget(form.supplier, {'attr': {'class': 'form-control m-input select2', 'placeholder':'Fournisseur'}}) }}
                                                </div>

                                                {{ form_widget(form.type, {'attr': {'class': 'form-control m-input', 'value': type }}) }}
                                                {{ form_widget(form.category, {'attr': {'class': 'form-control m-input', 'value': category }}) }}

                                                <div class="mb-3 m-form__group px-3 pb-0 pt-2 mt-3">
                                                    {{ form_widget(form.save, {'attr': {'class': 'btn btn-block  btn-success  fs-3 btn-dark'}, 'label': 'Rechercher'}) }}
                                                </div>
                                                {{ form_errors(form) }}
                                                {{ form_rest(form) }}
                                                {{ form_end(form) }}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <input  type="hidden" id="list_document_category" name="list_document_category" value="{{ category }}">
                                <div  class="listingContainer br flex flex-column m-portlet m-portlet--mobile width-100">
                                    <div class="m-portlet__body px-2 py-2">
                                        <div class="m_datatable" id="documentsListTable"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>
{% endblock %}