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

{% set page_title = "Bewertungen" %}
{% 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 body %}
    <div class="card">
        <div class="card-content">
            <div class="card-body">
                <div class="row">
                    <div class="col-lg-4">
                        <div class="row mb-4">
                            <div class="col-lg-3">
                                <span class="label">Benutzername:</span>
                            </div>
                            <div class="col-lg-9">
                                <div class="form-row">
                                    <div class="col-lg-auto"><input type="text" name="benutzername"
                                                                    class="form-control form-control-sm font-small-3 inp-submit"
                                                                    data-type="benutzername"></div>
                                    <div class="col-lg-auto">
                                        <button class="btn btn-sm btn-success font-small-3 btn-filter"
                                                data-type="submit">suchen
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {#<div class="row mb-4">
                            <div class="col-lg-3">
                                <span class="label">Website:</span>
                            </div>
                            <div class="col-lg-9">
                                <div class="form-row">
                                    {% for st in site %}
                                        <div class="col-lg-auto mb-2">
                                            <button class="btn btn-sm btn-outline-secondary font-small-3 btn-filter"
                                                    data-type="website">{{ st.title }}</button>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>#}
                        <div class="row mb-4">
                            <div class="col-lg-3">
                                <span class="label">Sterne:</span>
                            </div>
                            <div class="col-lg-9">
                                <div class="form-row">
                                    <div class="col-lg-auto mb-2">
                                        <button class="btn btn-sm btn-outline-secondary font-small-3 btn-filter"
                                                data-type="sterne">1
                                        </button>
                                    </div>
                                    <div class="col-lg-auto mb-2">
                                        <button class="btn btn-sm btn-outline-secondary font-small-3 btn-filter"
                                                data-type="sterne">2
                                        </button>
                                    </div>
                                    <div class="col-lg-auto mb-2">
                                        <button class="btn btn-sm btn-outline-secondary font-small-3 btn-filter"
                                                data-type="sterne">3
                                        </button>
                                    </div>
                                    <div class="col-lg-auto mb-2">
                                        <button class="btn btn-sm btn-outline-secondary font-small-3 btn-filter"
                                                data-type="sterne">4
                                        </button>
                                    </div>
                                    <div class="col-lg-auto mb-2">
                                        <button class="btn btn-sm btn-outline-secondary font-small-3 btn-filter"
                                                data-type="sterne">5
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-7">
                        <table class="table table-bordered border-transparent">
                            <tr>
                                <th class="w-1px border-0"></th>
                                <th>Titel</th>
                                <th>Text</th>
                            </tr>


                            {% for items in kommentar %}
                                {% if items.id == 2 %}
                                    <tr>
                                        <td class="border-top-0 border-bottom-0 border-left-0">
                                            <a href="javascript:"
                                               class="btn btn-sm ajax-modal btn-icon btn-success"
                                               data-ajax-modal
                                               data-href="{{ path('admin_kommentar_edit',{'id':items.id}) }}"
                                            >
                                                <i class="fa fa-flip-horizontal fa-undo"></i>
                                            </a>
                                        </td>
                                        <td>{{ items.title }}</td>
                                        <td>{{ items.text }}</td>
                                    </tr>
                                {% endif %}
                            {% endfor %}


                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="card mt-5">
        <div class="card-content">
            <div class="card-body">
                <table class="table table-nowrap" id="bewertungTable">
                    <thead>
                    <tr>
                        <th>Website</th>
                        <th>Sterne</th>
                        <th>Benutzer</th>
                        <th>Text</th>
                        <th>Datum</th>
                        <th>Enabled</th>
                        <th class="text-center">Transaktionen</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% include 'admin/Main/Bewertungen/_bewer.html.twig' %}
                    </tbody>
                </table>

            </div>
        </div>
    </div>
    <script>
        $(".btn-filter").click(function () {
            Panel.contentLoader_start();
            let type = $(this).data("type");
            let filter = $(this).text();

            if (type === "sterne") {
                if ($(this).hasClass("current")) {
                    $(this).removeClass("current");
                    filter = '';
                } else {
                    $(this).addClass("current");
                }
            }

            if (type === "submit") {
                type = [];
                filter = [];
                $(".inp-submit").each(function (i) {
                    type.push(this.dataset.type);
                    filter.push(this.value);
                });

            }
            $.ajax({
                type: 'POST',
                url: '{{ path('admin_ajax_bewer_filter') }}',
                data: {type: type, filter: filter},
                success: function (data) {
                    Panel.contentLoader_close();
                    $("#bewertungTable > tbody").html(data);
                }
            });
        });
    </script>
{% endblock %}
{% block head_javascripts %}
    <script src="{{ asset('assets/admin/app-assets/vendors/js/extensions/moment.min.js') }}"></script>
    {% include 'admin/Common/_datatable_all_js.html.twig' %}
{% endblock %}