{% import "admin/Macros/Buttons/_button.html.twig" as button %}
<div class="form-group">
    <label>Title </label>
    <input type="text" name="laden[name]" class="form-control" value="{{ laden.title|default }}">
</div>
<div class="form-group">
    <label class="fs-7 fw-bold form-label">Text</label>
    <textarea name="laden[text]" id="laden_text" class="form-control text-editor"
              rows="3">{{ laden.text|default() }}</textarea>
    <div class="fv-plugins-message-container invalid-feedback"></div>
</div>
<div class="row">
    <div class="form-group col-6">
        <label class="fs-7 fw-bold form-label">Prufung</label>
        <select name="laden[prufung]" id="prufung" class="form-control">
            {% for index in prufung %}
                <option {% if laden.prufung.id|default == index.id %} selected {% endif %}
                        value="{{ index.id }}">{{ index.name }}</option>
            {% endfor %}
        </select>
    </div>
    <div class="form-group col-6">
        <label class="fs-7 fw-bold form-label">Stadt</label>
        <select name="laden[stadt]" id="stadt" class="form-control">
            {% for index in stadt %}
                <option value="{{ index.id }}">{{ index.name }}</option>
            {% endfor %}
        </select>
    </div>
</div>
<div class="row">
    <div class="form-group col-12">
        <label>Hohe </label>
        <input type="text" name="laden[hohe]" class="form-control" value="{{ laden.hohe|default }}">
    </div>
    {#<div class="form-group col-6">
        <label>Latex Code </label>
        <input type="text" name="laden[latex_code]" class="form-control" value="{{ laden.latexCode|default }}">
    </div>#}
</div>

{#
<div class="form-group col-12 p-0">
    <div class="latexcodeDrow mb-5">
        <label>Latex Code</label>
        <div class="row align-items-center">
            <div class="col d-flex">
                <input class="form-control col-md-12" name="laden_latexcodes[]" type="text">
            </div>
            <div class="col-auto">
                <button class="btn btn-success btn-icon add-row2" type="button">
                    <i class="fa fa-plus" style="font-size: 10px;"></i>
                </button>
            </div>
        </div>
    </div>
</div>
<div class="mt-5 col-12 p-0">
    <div class="card">
        <div class="card-content">
            <div class="card-body">
                <div class="row mb-3 text-left">
                    <div class="col-2 text-muted">Datum</div>
                    <div class="col-8 text-muted">Latex Code</div>
                    <div class="col-2 text-muted">Transaktionen</div>
                </div>
                <div id="bc">
                    {% for item in latexCodes|default %}
                        <div class="row align-items-center text-left py-1">
                            <div class="col-2">{{ item.createdAt|date('d.m.Y') }}</div>
                            <div class="col-8">{{ item.latexCode }}</div>
                            <div class="col-2 text-center">
                                <i class="feather icon-trash fs-22px text-danger prclclt3" style="cursor: pointer"
                                   data-id="{{ item.id }}"></i>
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>#}


<div class="row">
    <div class="fv-row mb-10 fv-plugins-icon-container col-3">
        <label class="fs-7 fw-bold form-label required">Preis A (CHF)</label>
        <input name="laden_prices" id="laden_prices" type="number" class="form-control"
               value="{{ laden.price|default()|number_format(2) }}">
        <div class="fv-plugins-message-container invalid-feedback"></div>
    </div>
    <div class="fv-row mb-10 fv-plugins-icon-container col-3">
        <label class="fs-7 fw-bold form-label">Preis A2 (CHF)</label>
        <input name="laden_pricesA2" id="laden_pricesA2" type="number" class="form-control"
               value="{{ laden.priceA2|default()|number_format(2) }}">
        <div class="fv-plugins-message-container invalid-feedback"></div>
    </div>
    <div class="fv-row mb-10 fv-plugins-icon-container col-3">
        <label class="fs-7 fw-bold form-label required">Preis B (CHF)</label>
        <input name="laden_pricesB" id="laden_pricesB" type="number" class="form-control"
               value="{{ laden.priceB|default()|number_format(2) }}">
        <div class="fv-plugins-message-container invalid-feedback"></div>
    </div>
    <div class="fv-row mb-10 fv-plugins-icon-container col-3">
        <label class="fs-7 fw-bold form-label required">Preis C (CHF)</label>
        <input name="laden_pricesC" id="laden_pricesC" type="number" class="form-control"
               value="{{ laden.priceC|default()|number_format(2) }}">
        <div class="fv-plugins-message-container invalid-feedback"></div>
    </div>
</div>


<div class="form-group col-12 p-0">
    <div class="pricesDrow mb-5">
        <label>Preis D</label>
        <div class="row align-items-center">
            <div class="col d-flex">
                <input class="form-control col-md-10" name="laden_pricesD[]" type="number">
                <select class="form-control col-md-2 mx-1" name="laden_pricesDname[]" id="laden_pricesDname">
                    {% for price in priceGroups %}
                        <option value="{{ price.id }}">{{ price.priceName }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="col-auto ps-0">
                <button class="btn btn-success btn-icon add-row" type="button">
                    <i class="fa fa-plus" style="font-size: 10px;"></i>
                </button>
            </div>
        </div>
    </div>
</div>
<div class="mt-5 col-12 p-0">
    <div class="card">
        <div class="card-content">
            <div class="card-body">
                <div class="row mb-3 text-center">
                    <div class="col-2 text-muted">Datum</div>
                    <div class="col-4 text-muted">Price</div>
                    <div class="col-4 text-muted">Price Group Name</div>
                    <div class="col-2 text-muted">Transaktionen</div>
                </div>
                <div id="bc">
                    {% for item in priceGroupsEntity %}
                        <div class="row align-items-center text-center py-1">
                            <div class="col-2">{{ item.createdAt|date('d.m.Y') }}</div>
                            <div class="col-4">{{ item.price|number_format(2) }}</div>
                            <div class="col-4">{{ item.pNAme }}</div>
                            <div class="col-2">
                                <i class="feather icon-trash fs-22px text-danger prcDlt3" style="cursor: pointer"
                                   data-id="{{ item.id }}"></i>
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="form-group col-4">
        <div class="custom-control custom-checkbox">
            <input type="checkbox" class="custom-control-input" id="is-enabled" name="laden[enabled]" value="1"
                    {% if laden.isEnabled|default == 1 %}
                        {{ laden.isEnabled|default ? 'checked' : '' }}
                    {% endif %}
            >
            <label class="custom-control-label" for="is-enabled">Aktiv ?</label>
        </div>
    </div>
    <div class="form-group col-4">
        <div class="custom-control custom-checkbox">
            <input type="checkbox" name="double_latex" class="custom-control-input" id="doubleLatex" value="1"
                    {% if laden.doubleLatex|default == 1 %}
                        {{ laden.doubleLatex|default ? 'checked' : '' }}
                    {% endif %}>
            <label class="custom-control-label" for="doubleLatex">Double Latex</label>
        </div>
    </div>
</div>
<hr>
<div class="form-group">
    <label class="fs-7 fw-bold form-label">Bild</label>
    <input style="padding: 6px;" id="laden_bild" type="file" class="form-control" name="bild" accept="image/*"/>
    <div class="fv-plugins-message-container invalid-feedback"></div>
    {% if laden.imageFile|default != '' %}
        <div class="fv-row mb-10 fv-plugins-icon-container col-6">
            {% set dir = getLadenImageDir() %}
            {% set imageFullPath = dir|default~laden.imageFile|default %}
            <img style="max-width: 50%;" src="{{ asset(imageFullPath) }}">
        </div>
    {% endif %}
</div>
<hr>
<div class="fv-row mb-10 fv-plugins-icon-container col-6 p-0">
    <label class="fs-7 fw-bold form-label">APP PDF</label>
    <input style="padding: 6px;" id="laden_pdf" type="file" class="form-control" name="pdf"
           accept="application/pdf"/>
    <div class="fv-plugins-message-container invalid-feedback"></div>
</div>
{% if laden.pdfFile|default != '' %}
    <div class="fv-row mb-10 fv-plugins-icon-container col-6 p-0">
        {# {% set dir = getLadenPdfDir() %}
        #}{# {% set imageFullPath = dir|default~'app/'~laden.pdfFile|default %} #}{#
        {% set pdfFullPath = dir|default~laden.pdfFile|default %}
        <iframe src="{{ asset(pdfFullPath) }}" width="180" height="250" style="border: none;"
                allowfullscreen
                webkitallowfullscreen></iframe> #}
    </div>
{% endif %}
<hr>


<div class="d-flex justify-content-end">
    {{ button.button_submit() }}
</div>
{% block javascripts %}
    <script src="{{ asset('assets/admin/app-assets/vendors/js/forms/ckeditor/ckeditor.js') }}"></script>
    <script type="text/javascript">
        $(".add-row").click(function () {
            if ($(this).hasClass("btn-success")) {
                let $clone = $(this).closest('.pricesDrow').clone(true);
                let $label = $clone.children("label");
                $label.remove();
                $clone
                    .find(".add-row").removeClass("btn-success").addClass("btn-danger")
                    .children(".fa").removeClass("fa-plus").addClass("fa-minus");
                $clone.find(".form-control").val("");
                $(this).closest(".form-group").append($clone);
            } else {
                $(this).closest(".pricesDrow").remove();
            }
        });

        $(".add-row2").click(function () {
            if ($(this).hasClass("btn-success")) {
                let $clone = $(this).closest('.latexcodeDrow').clone(true);
                let $label = $clone.children("label");
                $label.remove();
                $clone
                    .find(".add-row2").removeClass("btn-success").addClass("btn-danger")
                    .children(".fa").removeClass("fa-plus").addClass("fa-minus");
                $clone.find(".form-control").val("");
                $(this).closest(".form-group").append($clone);
            } else {
                $(this).closest(".latexcodeDrow").remove();
            }
        });

        $('.s3pdf-delete').click(function () {
            let id = $(this).data('id');
            let url = "{{ path('admin_ajax_shop3_pdf_delete',{'id':'_id'}) }}".replace("_id", id);

            $.ajax({
                url: url,
                data: {'id': id},
                method: 'POST',
                type: 'POST',
                success: function (data) {
                    $('#delete-' + id).remove();
                }
            });

        });

        $(".prcDlt3").click(function (event) {
            Panel.contentLoader_start();
            let id = $(this).data("id");
            let url = "{{ path('admin_ajax_laden_price_delete',{'id':'_id'}) }}".replace("_id", id);
            let el = event.currentTarget;

            $.ajax({
                type: 'POST',
                url: url,
                data: {id: id},
                success: function () {
                    $(el).closest('.row').remove();
                    Panel.contentLoader_close();
                }
            });
        });

        $(".prclclt3").click(function (event) {
            Panel.contentLoader_start();
            let id = $(this).data("id");
            let url = "{{ path('admin_ajax_laden_latexcode_delete',{'id':'_id'}) }}".replace("_id", id);
            let el = event.currentTarget;

            $.ajax({
                type: 'POST',
                url: url,
                data: {id: id},
                success: function () {
                    $(el).closest('.row').remove();
                    Panel.contentLoader_close();
                }
            });
        });

        $('#ajax-form').on('show.bs.modal', function () {
            $("#prufung").trigger('change');
        });

        $("#prufung").change(function (event) {
            Panel.contentLoader_start();
            let id = $(this).val();

            let url = "{{ path('admin_ajax_laden_stadt_control',{'id':'_id'}) }}".replace("_id", id);
            let el = event.currentTarget;

            $.ajax({
                type: 'POST',
                url: url,
                data: {id: id},
                success: function (data) {
                    if (data.length > 0) {
                        var select = document.getElementById('stadt');
                        select.innerHTML = '';
                        for (var i = 0; i < data.length; i++) {
                            var option = document.createElement('option');
                            option.text = data[i].name;
                            option.value = data[i].id;
                            select.add(option);
                        }
                    }
                    Panel.contentLoader_close();
                }
            });
        });

        $(document).ready(function () {
            var editor = CKEDITOR.replace('laden_text');
            editor.on("change", function (evt) {
                $('#laden_text').html(evt.editor.getData());
            });


        });
    </script>
{% endblock %}