{% extends "baseAdmin.html.twig" %}

{% block body %}
    <div class="container">
        <!--First row-->
        <div class="row">
            <!--First column-->
            <div class="col-lg-12">
                <!-- Mögliche Hinweismeldungen anzeigen -->
                {% if app.session.flashbag.peekAll|length > 0 %}
                    {% for type, messages in app.session.flashbag.all %}
                        {% for message in messages %}
                            <div class="alert alert-{{ type ? type : '' }}">
                                <p>{{ message|trans({}, domain|default('messages')) }}</p>
                            </div>
                        {% endfor %}
                    {% endfor %}
                {% endif %}
            </div>
            <!--./First column-->

            <!--Second column-->
            <div class="col-lg-12">
                {% for orderState in orderStates %}
                    {% if orderState.id is defined and orderState.id == selectedState %}
                        <h4 class="mb-5">Übersicht aller Aufträge im Status "{{ orderState.name }}"</h4>
                    {% endif %}
                {% endfor %}
            </div>
            <!--./Second column-->
        </div>
        <!--./First row-->

        <!--Second row-->
        <div class="row">
            <!--First column-->
            <div class="col-lg-4">
                <!-- Form: Change order state -->
                <form method="post">
                    <div class="form-group">
                        <i class="fa fa-tag prefix grey-text"></i>
                        <label for="orderStateFilter">Nur Aufträge mit folgendem Status
                            anzeigen:</label>
                        <select name="orderStateFilter" id="orderStateFilter" class="form-control"
                                onchange="location.href=this.options[this.selectedIndex].value">
                            {% for orderState in orderStates %}
                                <option value="{{ path('showOrdersByState', {'state': orderState.id}) }}"
                                        {% if orderState.id is defined and orderState.id == selectedState %}selected{% endif %}>
                                    {{ orderState.name }}
                                </option>
                            {% endfor %}
                        </select>
                    </div>
                </form>
                <!-- Form: edit user -->
            </div>
            <!--./First column-->

            <!--Second column-->
            <div class="col-lg-12">
                <table id="dtBasicExample" class="table table-striped table-bordered">
                    <thead class="blue-grey lighten-4">
                    <tr>
                        <th><h6><strong>Interne Auftragsnummer</strong></h6></th>
                        <th><h6><strong>Auftragsnummer</strong></h6></th>
                        <th><h6><strong>Produktname</strong></h6></th>
                        <th><h6><strong>Kunde</strong></h6></th>
                        <th><h6><strong>Auftragsablauf</strong></h6></th>
                        <th><h6><strong>Status</strong></h6></th>
                        <th><h6><strong>Letzte Änderung</strong></h6></th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for order in orders %}
                        <!-- Nur Aufträge im Zustand "normal" anzeigen -->
                        {% if order.lockState == 0 %}
                            <tr onclick="window.location.href='{{ path('orderShow', {'id': order.id}) }}'">
                                <td>
                                    <a href="{{ path('orderShow', {'id': order.id}) }}">
                                        <u>{{ order.orderNumber }}</u></a></td>

                                <td>{{ order.generalOrderNumber }}</td>
                                <td>{{ order.name }}</td>
                                <td>{{ order.customer.name }} (Kundennr.: {{ order.customer.customerNumber }})</td>
                                <td>{{ order.sequence.name }}</td>
                                <td>
                                    {% if order.getCurrentState.status is defined %}
                                        {{ order.getCurrentState.status.name }}{% if order.deliveredQuantity is defined and order.deliveredQuantity != '' and order.deliveredQuantity != order.orderQuantity %} (Teilmenge){% endif %}
                                    {% endif %}
                                </td>
                                <td>{{ order.UpdatedAt|date('d.m.Y \\(H:i \\U\\h\\r\\)', "Europe/Berlin") }}</td>
                            </tr>
                        {% endif %}
                    {% else %}
                        <tr>
                            <td>Keine Einträge vorhanden.</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>

                <br>
                <p><strong>Hinweis:</strong> Diese Tabelle beinhaltet ausschließlich offene Aufträge, welche sich im
                    ausgewählten Auftragsstatus befinden (Aufträge im Zustand "abgeschlossen" oder "gesperrt" werden
                    nicht angezeigt). Dabei werden nur grundlegende Informationen zur schnellen
                    Übersicht dargestellt.</p>
            </div>
            <!--./Second column-->
        </div>
        <!--/.Second row-->
    </div>

    <!-- Nachfolgender Code wandelt die vorhandene Tabelle (ID: "dtBasicExample") in ein DataTable-Objekt um -->
    <script type="text/javascript">
        $(document).ready(function () {
            $('#dtBasicExample').dataTable({
                "language": {
                    "url": "https://cdn.datatables.net/plug-ins/1.10.20/i18n/German.json"
                }
            });
        });
    </script>
{% endblock %}