{%  extends "WebBackBundle::layout_lte.html.twig" %}

{% block title %} Factures N {% endblock %}
{% block bodytile %}La liste des factures N {% endblock %}
{% block body %}
    <!-- script data tabels -->

    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.13/js/dataTables.bootstrap.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/responsive/2.1.1/js/dataTables.responsive.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/responsive/2.1.1/js/responsive.bootstrap.min.js"></script>

    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.2.4/js/buttons.flash.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.2.4/js/buttons.html5.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.2.4/js/buttons.print.min.js"></script>


    <!-- DataTables -->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css">

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">

    <div class="container-fluid">



        <!-- DataTables Example -->
        <div class="card mb-3">

            <div class="card-body">
                <div class="table-responsive">
                    <table id="tablcommande" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                        <thead>
                        <tr>
                            <th>Ref</th>
                            <th>Total</th>
                            <th>Client</th>
                            <th>Paiement</th>
                            <th>Action</th>
                        </tr>
                        </thead>
                        <tfoot>
                        <tr>
                            <th>Ref</th>
                            <th>Total</th>
                            <th>Client</th>
                            <th>Paiement</th>
                            <th>Action</th>
                        </tr>
                        </tfoot>
                        <tbody>
                        {% for facture in factures %}
                            {% if facture.order.totalPrice != 0 %}
                                <tr>
                                    <td>{{facture.ref}}000{{ facture.id }}</td>
                                    <td>{{facture.order.totalPrice}}</td>
                                    <td>{{facture.order.user.nom}} {{facture.order.user.prenom}}</td>
                                    <td>{{ facture.order.paymentMethod }}</td>
                                    <td>
                                        <form action="{{ path('viewFacture') }}" method="POST">
                                            <input type="hidden" name="orderId" value="{{ facture.order.id }}">
                                            <input type="hidden" name="paymentMethod" value="{{ facture.order.paymentMethod }}">
                                            <button type="submit" class="btn btn-block btn-default btn-flat">
                                                <b style="color: #00cc66"><i class="fa fa-eye"></i> Voir </b>
                                            </button>
                                        </form>
                                    </td>

                                </tr>
                            {% endif %}
                        {% endfor %}
                        </tbody>
                    </table>

                    <script>
                        $(document).ready(function() {
                            $('#tablcommande').DataTable( {
                                "order": false,
                                responsive: true,
                                "iDisplayLength": 20,
                                "language": {
                                    "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/French.json",

                                },
                                dom: 'Bfrtip',
                                buttons: [
                                    'copy', 'csv', 'excel', 'pdf', 'print'
                                ],

                            } );
                        } );
                    </script>
                </div>
            </div>
        </div>



    </div>

{% endblock %}