{% extends 'admin/admin_base.html.twig' %}
{% import "admin/Macros/Buttons/_button.html.twig" as button %}

{% set page_title = "Laden" %}
{% block title %}{{ page_title }}{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" type="text/css"
          href="{{ asset('assets/admin/app-assets/vendors/css/tables/datatable/datatables.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/admin/app-assets/css/style.bundle.css') }}">
{% endblock %}
{% block breadcrumb %}
    {# {% set fields = [  { 'name': page_title }] %}
     {% include 'admin/Common/_breadcrumb.html.twig' %} #}
{% endblock %}
{% block page_buttons %}

    {{ button.button_new({
        'text':'Stadt',
        'href':''~path('admin_stadt')~'',
        'class':'my-1',
    }) }}

    {{ button.button_new({
        'text':'Prüfung',
        'href':''~path('admin_prufung')~'',
        'class':'my-1',
    }) }}
    {{ button.button_new({
        'text':'Laden hinzufügen',
        'href':'javascript:',
        'class':'my-1 btn-success',
        'attr':'data-ajax-modal data-href='~path('admin_laden_new')~''
    }) }}
    {{ button.button_new({
        'text':'Laden Modul',
        'href':'javascript:',
        'class':'my-1 btn-success',
        'attr':'data-ajax-modal data-href='~path('admin_laden_modul_new')~''
    }) }}
    <button class="btn btn-warning" id="btn-rightdescmenu">
        <i class="feather icon-chevrons-right fw-bolder"></i>
    </button>
{% endblock %}
{% block body %}
    <div class="bg-rightdescmenu"></div>
    <div class="rightdescmenu" tabindex="-1">
        <div class="rightdescmenu-header">
            <h4 class="mb-0">Laden</h4>
            <button type="button" class="rightdescmenu-close">
                <span aria-hidden="true">×</span>
            </button>
        </div>
        <hr>
        <div class="rightdescmenu-body mt-10">
            <div class="section">
                <label for="a" class="fw-bolder mb-2">Aktionsbutton</label>
                <textarea name="a"
                          data-link="{{ path('admin_ajax_aktion_buttons_edit',{'id':aktionsButton[0].id}) }}"
                          id="actionsButton" class="form-control actionsButton"
                          rows="4">{{ aktionsButton[0].text }}</textarea>
            </div>
        </div>
    </div>

    {% for laden in laden %}
        <div class="card mt-4 shadow-sm rounded-3 p-3">
            <div class="card-body">
                <div class="row align-items-center mb-3">
                    <div class="col-1 text-center">
                        {% if laden.imageFile|default != '' %}
                            {% set dir = getLadenImageDir() %}
                            {% set imageFullPath = dir|default~laden.imageFile|default %}
                            <img src="{{ asset(imageFullPath) }}"
                                 class="img-fluid rounded-circle border"
                                 style="width: 80px; height: 80px; object-fit: cover;">
                        {% endif %}
                    </div>
                    <div class="col-5 fw-semibold fs-6">
                        {{ laden.title }}
                    </div>
                    <div class="col-4 text-muted">
                        {{ laden.prufung.name }} – {{ laden.stadt.name }}
                    </div>
                    <div class="col-1 text-center">
                        {% if laden.isEnabled == 1 %}
                            <span class="badge bg-success py-2 px-3 fs-7">Aktiv</span>
                        {% else %}
                            <span class="badge bg-danger py-2 px-3 fs-7">Passiv</span>
                        {% endif %}
                    </div>
                    <div class="col-1 text-end">
                        <a href="javascript:" data-ajax-modal=""
                           data-href="{{ path('admin_laden_edit', {'id': laden.id}) }}"
                           class="text-warning me-2">
                            <i class="feather icon-edit fs-3"></i>
                        </a>
                        <a href="{{ path('admin_laden_delete', {'id': laden.id}) }}"
                           onclick="Panel.globalConfirm(event)"
                           class="text-danger">
                            <i class="feather icon-trash fs-3"></i>
                        </a>
                    </div>
                </div>

                <hr class="my-3">

                <h6 class="fw-bold text-secondary mb-3 border-start border-3 ps-2">Laden Modul</h6>
                {% set ladenModulEntity = getLadenModul(laden.id) %}
                {% if ladenModulEntity is empty %}
                    <div class="text-muted small ms-2">Modul nicht gefunden.</div>
                {% else %}
                    {% for val in ladenModulEntity %}
                        <div class="row align-items-center mb-2 ps-2 pe-2 py-2 rounded bg-light">
                            <div class="col-1 text-center">
                                {% if val.imageFile|default != '' %}
                                    {% set dir = getLadenModulImageDir() %}
                                    {% set imageFullPath = dir|default~val.imageFile|default %}
                                    <img src="{{ asset(imageFullPath) }}"
                                         class="img-fluid rounded-circle border"
                                         style="width: 60px; height: 60px; object-fit: cover;">
                                {% endif %}
                            </div>
                            <div class="col-9 fs-6">
                                {{ val.title }}
                            </div>
                            <div class="col-1 text-center">
                                {% if val.isEnabled == 1 %}
                                    <span class="badge bg-success py-2 px-3 fs-7">Aktiv</span>
                                {% else %}
                                    <span class="badge bg-danger py-2 px-3 fs-7">Passiv</span>
                                {% endif %}
                            </div>
                            <div class="col-1 text-end">
                                <a href="javascript:" data-ajax-modal=""
                                   data-href="{{ path('admin_laden_modul_edit', {'id': val.id}) }}"
                                   class="text-warning me-2">
                                    <i class="feather icon-edit fs-3"></i>
                                </a>
                                <a href="{{ path('admin_laden_modul_delete', {'id': val.id}) }}"
                                   onclick="Panel.globalConfirm(event)"
                                   class="text-danger">
                                    <i class="feather icon-trash fs-3"></i>
                                </a>
                            </div>
                        </div>
                    {% endfor %}
                {% endif %}
            </div>
        </div>
    {% endfor %}

{% endblock %}
{% block head_javascripts %}
    <script>
        $(document).ready(function () {
            $('#btn-rightdescmenu').click(function () {
                $('.rightdescmenu').addClass('show');
                $('.bg-rightdescmenu').addClass('show');
                $('body').css("overflow", "hidden");
            });
            $('.rightdescmenu-close, .bg-rightdescmenu').click(function () {
                $('.rightdescmenu').removeClass('show');
                $('.bg-rightdescmenu').removeClass('show');
                $('body').css("overflow", "unset");
            });
            $('.actionsButton').on('change', function () {
                Panel.contentLoader_start();
                let ab = $(this).val();
                let url = $(this).data('link');
                $.ajax({
                    url: url,
                    data: {'ab': ab},
                    method: 'POST',
                    type: 'POST',
                    success: function (data) {
                        $('.actionsButton').html(data.text);
                        Panel.contentLoader_close();
                    }
                });
            });
        });
    </script>
    <script src="{{ asset('assets/admin/app-assets/vendors/js/extensions/moment.min.js') }}"></script>
    {% include 'admin/Common/_datatable_all_js.html.twig' %}
{% endblock %}