{% extends 'App/_include/_layout.main.html.twig' %}
{% block page_content %}
    <div class="cell small-12">
        <div class="grid-x header_title_and_action">
            <div class="cell small-12  medium-auto header_title">
                <h1><i class="fa fa-tag"></i>{{ 'etiquette_colis.title.label'|trans }}</h1>
            </div>
            <div class="cell small-12  medium-shrink header_action">
                <button type="button" class="button save small" data-open="modalAddEtiquette" ><i class="fa fa-plus"></i> {{ 'etiquette_colis.button.add'|trans }}</button>
            </div>
        </div>
    </div>
    <div class="cell small-12">
        <div id="dtEtiquetteColis" class="grid-x"></div>
        {% if (dt_settings_customer.data.data_set|length < 1 and userOrCustomer == 1) or (dt_settings_user.data.data_set|length < 1 and userOrCustomer == 0) %}
            <p class="mt-2 text-center">{{ 'emptyData'|trans }}</p>
        {% endif %}
    </div>
    <div class="reveal" id="modalAddEtiquette" data-reveal>
        <div class="reveal-title">{{ 'etiquette.title.add'|trans }}</div>
        <div class="reveal-body">
            {{ form_start(formAddEtiquetteColis, {'attr': {'id': 'formAddEtiquetteColis'}}) }}
            <div class="grid-x grid-margin-x">
                <div class="cell small-12">
                    <div class=" underlined text_primary_light">{{ 'etiquette.modal.filter'|trans }}</div>
                </div>
                <div class="cell small-6">
                    {{ form_row(formAddEtiquetteColis.section)}}
                </div>
                <div class="cell small-6">
                    {{ form_row(formAddEtiquetteColis.type)}}
                </div>
                <div class="cell small-12">
                    <div class=" underlined text_primary_light">{{ 'etiquette.modal.select'|trans }}</div>
                </div>
                <div class="cell small-12">
                    {{ form_label(formAddEtiquetteColis.kanban)}}
                    {{ form_widget(formAddEtiquetteColis.kanban)}}
                    {# TODO translate #}
                    <div id="helper_add_etiquette_colis_kanban" class="help-text" style="display:none">{{ 'etiquette.modal.no_kanban'|trans }}</div>
                </div>
            </div>
            {{ form_end(formAddEtiquetteColis) }}
        </div>
        <div class="reveal-footer">
            <button data-close class="button small cancel">{{ 'cancel'|trans }}</button>
            <button id="btn_submit_add_etiquette_colis" class="button small save">{{ 'save'|trans }}</button>
        </div>
        <button class="close-button"  data-close aria-label="Close modal" type="button">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>

    <div class="reveal" id="btnOpenModalDeleteEtiquetteColis" data-reveal>
        <div class="reveal-title">{{ 'etiquette_colis.modal.delete.title'|trans }}</div>
        <div class="reveal-body">
            {{ 'etiquette_colis.modal.delete.body'|trans }}
        </div>
        <div class="reveal-footer">
            <button data-close class="button small cancel">{{ 'cancel'|trans }}</button>
            <button id="btn_confirm_delete_etiquette_colis" class="button small save">{{ 'delete'|trans }}</button>
        </div>
        <button class="close-button"  data-close aria-label="Close modal" type="button">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>

    <div class="reveal" id="btnOpenModalDuplicateEtiquetteColis" data-reveal>
        <div class="reveal-title">{{ 'etiquette_colis.modal.clone.title'|trans }}</div>
        <div class="reveal-body">
            {{ 'etiquette_colis.clone.body.text'|trans }}
        </div>
        <div class="reveal-footer">
            <button data-close class="button small cancel">{{ 'cancel'|trans }}</button>
            <button class="button small save" id="btn_submit_clone_etiquette_colis">{{ 'clone'|trans }}</button>
        </div>
        <button class="close-button"  data-close aria-label="Close modal" type="button">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>

    {# MODAL RAPPORTS #}
    {% include 'App/_include/_rapport/rapport.html.twig' with {'kanban_type':constant('App\\Entity\\Kanban\\KanbanType::APPRO')} %}
    {% include 'App/_include/_export/_modal.export.html.twig' with {'title': 'export_kb_appro.modal.title'|trans } %}
    {# Modal Import #}
    {% import 'App/_include/_import/_modal.import.html.twig' as macro_import_html %}
    {% if is_granted('ROLE_APP_SUB_IMPORT_KB_APPRO') %}
        {{ macro_import_html.html_import(formImport, 'kanban.title.import'|trans, 0) }}
    {% else %}
        {{ macro_import_html.html_import_not_allowed('modal.title.import_not_allowed'|trans, 0) }}
    {% endif %}
    {% if is_granted('ROLE_APP_SUB_IMPORT_CMJ') %}
        {{ macro_import_html.html_import(formImport2, 'cmj.title.import'|trans, 1) }}
    {% else %}
        {{ macro_import_html.html_import_not_allowed('modal.title.import_not_allowed'|trans, 1) }}
    {% endif %}

{% endblock %}


{% block userOrCustomer %}
    {# TODO remplacer ça par un fichier twig.html #}
    <input type="radio" name="UserOrCustomer" value="Client" id="customer" required><label for="customer">Client</label>
    <input type="radio" name="UserOrCustomer" value="Utilisateur" id="user"><label for="user">Utilisateur</label>
{% endblock %}

{% block javascript_footer %}
    {{ parent() }}
    <script>
        $(document).ready(function() {
            {% import 'App/_include/_new_array_event.js.twig' as array_event %}
            {{ array_event.js_import_general_functions }}
            {% import 'App/_include/_table_resizer.js.twig' as resiser %}
            {{ resiser.js_import_general_functions }}
            {% if is_granted('ROLE_APP_SUB_IMPORT_KB_APPRO') or is_granted('ROLE_APP_SUB_IMPORT_CMJ') %}
            {% import 'App/_include/_import/_modal.import.js.twig'  as macro_import_js %}
            {% endif %}
            {% if is_granted('ROLE_APP_SUB_IMPORT_KB_APPRO') %}
            {{ macro_import_js.js_import('kanban', 0, 'import_kanban',constant('App\\Entity\\Kanban\\KanbanType::APPRO')) }}
            {% endif %}
            {% if is_granted('ROLE_APP_SUB_IMPORT_CMJ') %}
            {{ macro_import_js.js_import('kanban', 1, 'import_cmj',constant('App\\Entity\\Kanban\\KanbanType::APPRO')) }}
            {% endif %}
            {% include 'App/_include/_export/_modal.export.js.twig'  %}
{#            {% if dt_settings.data.data_set|length > 0 %}#}

            let userOrCustomer = {{ userOrCustomer|json_encode|raw }};
            let dtToolbar_test;
            let data_user = {{ dt_settings_user|json_encode|raw }};
            let data_customer = {{ dt_settings_customer|json_encode|raw }};

            if(userOrCustomer === true){ // CUSTOMER
                $('#customer').prop('checked', true);
                dtToolbar_test = new dtToolbar(document.getElementById('dtEtiquetteColis'),  {{ dt_settings_customer|json_encode|raw }}, [{'type':'button','title':'{{ "datatable.custom_button.report"|trans }}', 'id':'btn_generate_rapports','icon':'fa-book'}, {'type':'button','title': '{{ "datatable.custom_button.export" | trans }}', 'id':'btn_call_export','icon':'fa-cloud-upload'}, {'type':'button','title': '{{ "datatable.custom_button.import" | trans }}', 'id':{% if is_granted('ROLE_APP_SUB_IMPORT_KB_APPRO') %}'btn_call_import'{% else %}'btn_call_import_not_allowed'{% endif %},'icon':'fa-cloud-download'},{'type':'button','title': '{{ "datatable.custom_button.import_cmj" | trans }}', 'id':{% if is_granted('ROLE_APP_SUB_IMPORT_CMJ') %}'btn_call_import_cmj'{% else %}'btn_call_import_cmj_not_allowed'{% endif %},'icon':'fa-download'}]);
                {#checkIsNewEvent({{ dt_settings_customer|json_encode|raw }},dataTable );#}
            }else{ //USER
                $('#user').prop('checked', true);
                dtToolbar_test = new dtToolbar(document.getElementById('dtEtiquetteColis'),  {{ dt_settings_user|json_encode|raw }}, [{'type':'button','title':'{{ "datatable.custom_button.report"|trans }}', 'id':'btn_generate_rapports','icon':'fa-book'}, {'type':'button','title': '{{ "datatable.custom_button.export" | trans }}', 'id':'btn_call_export','icon':'fa-cloud-upload'}, {'type':'button','title': '{{ "datatable.custom_button.import" | trans }}', 'id':{% if is_granted('ROLE_APP_SUB_IMPORT_KB_APPRO') %}'btn_call_import'{% else %}'btn_call_import_not_allowed'{% endif %},'icon':'fa-cloud-download'},{'type':'button','title': '{{ "datatable.custom_button.import_cmj" | trans }}', 'id':{% if is_granted('ROLE_APP_SUB_IMPORT_CMJ') %}'btn_call_import_cmj'{% else %}'btn_call_import_cmj_not_allowed'{% endif %},'icon':'fa-download'}]);
                {#checkIsNewEvent({{ dt_settings_user|json_encode|raw }},dataTable );#}

            }

            $('#customer').click(function(event){
                let dataTable = $('#etiquettes_kanban_list').DataTable();
                dataTable.clear().draw();
                dataTable.rows.add(data_customer["data"]["data_set"]);
                dataTable.columns.adjust().draw();
                checkIsNewEvent({{ dt_settings_customer|json_encode|raw }},dataTable );
            });

            $('#user').click(function(event){
                let dataTable = $('#etiquettes_kanban_list').DataTable();
                dataTable.clear().draw();
                dataTable.rows.add(data_user["data"]["data_set"]);
                dataTable.columns.adjust().draw();
                checkIsNewEvent({{ dt_settings_user|json_encode|raw }},dataTable );
            });


            $(dtToolbar_test).on('row.click', function(e, id){
                let url = "{{ url('app_kanban_etiquette_colis_edit',{'etiquette':'__00__'}) }}";
                window.location = url.replace('__00__', id);
            });
            $(dtToolbar_test).on('row.click_action', function(e, data){
                let item_id = data.id;
                if(data.target.classList.contains('btnOpenModalDuplicateEtiquetteColis')){
                    $('#btnOpenModalDuplicateEtiquetteColis').foundation('open');
                    $('#btn_submit_clone_etiquette_colis').click(function () {
                        let url = "{{ url('app_kanban_etiquette_colis_clone', {'etiquette': '__00__'}) }}";
                        url = url.replace('__00__', item_id);
                        window.location = url
                    });
                }
                else if(data.target.classList.contains('btnOpenModalDeleteEtiquetteColis')){
                    $('#btnOpenModalDeleteEtiquetteColis').foundation('open');
                    $('#btn_confirm_delete_etiquette_colis').click(function () {
                        $(this).html(btn_spin);
                        let url = "{{ url('app_kanban_etiquette_colis_delete', {'etiquette':'__00__'}) }}";
                        let url_delete_etiquette_colis = url.replace('__00__', item_id);
                        $.ajax({
                            url: url_delete_etiquette_colis,
                            method: "POST",
                            data: {token : "{{ csrf_token('app_kanban_etiquette_colis_delete') }}"},
                            success: function (response) {
                                if (response.hasOwnProperty('result')){
                                    if (response.result){
                                        window.location = "{{ url('app_kanban_etiquette_colis_list') }}";
                                    }
                                }
                            },
                            error: function () {
                                console.log("error")
                            }
                        })
                    });
                }
            });
            $(dtToolbar_test).on('btn_custom.click', function(e, data){
                if(data.id === 'btn_generate_rapports') {
                    if (data.data.length > 0) {
                        openModalRapport(data.data, "{{ constant('App\\Entity\\Kanban\\KanbanType::APPRO') }}");
                    }
                }

                else if(data.id === 'btn_call_export'){
                    selected_ids = data.data;
                    $('#modalExportFile').foundation('open');
                }
                        {% if is_granted('ROLE_APP_SUB_IMPORT_KB_APPRO') %}
                else if(data.id === 'btn_call_import'){
                    $('#modalStepFile_0').foundation('open');
                }
                        {% else %}
                else if(data.id === 'btn_call_import_not_allowed'){
                    $('#modalImportNotAllowed_0').foundation('open');
                }
                        {% endif %}
                        {% if is_granted('ROLE_APP_SUB_IMPORT_CMJ')%}
                else if(data.id === 'btn_call_import_cmj'){
                    $('#modalStepFile_1').foundation('open');
                }
                        {% else %}
                else if(data.id === 'btn_call_import_cmj_not_allowed'){
                    $('#modalImportNotAllowed_1').foundation('open');
                }
                {% endif %}

            });
            {# MODAL RAPPORTS #}
            {% include 'App/_include/_rapport/rapport.js.twig' %}
{#            {% endif %}#}


            $('#btn_submit_add_etiquette_colis').click(function () {
                $(this).html(btn_spin);
                $('#formAddEtiquetteColis').submit();
            });

            let input_kanban_type = $('#add_etiquette_colis_type'),
                input_section = $('#add_etiquette_colis_section'),
                select_kanban = $('#add_etiquette_colis_kanban'),
                helper_kanban = $('#helper_add_etiquette_colis_kanban');
            let type_selected = $(input_kanban_type).val();
            let section_selected = parseInt($(input_section).val());
            let kanban_customer = {{ array_kanbans_customer|json_encode|raw }};
            let kanban_user = {{ array_kanbans_user|json_encode|raw }};


            function buildSelectKanban(){

                let option_kanbans = $('#add_etiquette_colis_kanban > option');
                $(option_kanbans).each(function(key,option){
                    if($(option).prop('value')){
                        $(option).remove();
                    }
                });
                let collection = [];

                if(userOrCustomer === true){
                    kanban_customer.map(function (item) {
                        if ((!type_selected || type_selected === item.code_type) && (!section_selected || section_selected === item.id_section)){
                            collection.push({
                                "value": item.k_id,
                                "text": item.code_section + ' ' + item.code_article
                            });
                        }
                    });
                }
                else {
                    kanban_user.map(function (item) {
                        if ((!type_selected || type_selected === item.code_type) && (!section_selected || section_selected === item.id_section)){
                            collection.push({
                                "value": item.k_id,
                                "text": item.code_section + ' ' + item.code_article
                            });
                        }
                    });
                }
                if(collection.length > 0){
                    $(helper_kanban).hide();
                    collection.map(function(item){
                        let option = document.createElement('option');
                        option.value = item.value;
                        option.innerText = item.text;
                        $(select_kanban).append(option);
                    });
                }else{
                    $(helper_kanban).show();
                }

            }

            $(input_kanban_type).change(function () {
                //let value_type = input_kanban_type.value;
                type_selected = $(this).val();
                buildSelectKanban();
            });

            $(input_section).change(function(){
                section_selected = parseInt($(input_section).val());
                buildSelectKanban();
            })







            buildSelectKanban()

        });

    </script>
{% endblock %}