{% extends 'base.html.twig' %}

{% block title %} File list {% endblock %}

{% block stylesheets %}

    {{ parent() }}
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/icofont.css') }}">
    <style>
        select{min-width: 60px;}
    </style>
{% endblock stylesheets %}

{% block breadcrumbs %}
    <div class="container-fluid">
        <div class="page-title">
            <div class="row">
                <div class="col-xl-12 col-lg-12 col-sm-12">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item">
                            <a href="{{ path('home') }}">
                                <i data-feather="home"></i>
                            </a>
                        </li>
                        <li class="breadcrumb-item active">File list</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block body %}

    <div class="row">
        <div class="col-sm-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="text-primary">File list</h5>
                    <div class="card-header-right card-header-right-btn">
                        <span class="text-right"><button data-bs-toggle="modal" data-bs-target="#importFile" class="btn btn-primary"><i class="fas fa-plus"></i> Add file</button></span>
                    </div>
                </div>
                <div class="card-body">
                    <div class="omines-datatable mb-4 mt-4">
                        <div class="dropdown-basic"></div>
                        <div id="datatable" class="omni-datatable">Loading...</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block javascripts %}

    {{ parent() }}

    {% include 'global/modal/add_file.html.twig' %}
    {% include 'global/modal/List_wrong_fields_modal.html.twig' %}

<script>
    $(document).ready(function () {
        $('#datatable').initDataTables({{ datatable_settings(datatable) }}, initOminesDatatable()).then(function (dt) {
            datatable = dt;
        });
    });
    $(document).on('click','.import-file-validate-action',function(){
        let bool = verifyRequiredFieldsAlert();
        if (bool) {
            let formData = new FormData(document.getElementById('data_post_form'));
            $('#importFile').modal('hide');
            $.ajax({
                url: "{{ path('data_add_file') }}",
                method: 'POST',
                enctype: 'multipart/form-data',
                data: formData,
                processData: false,
                contentType: false,
                cache: false,
                success: function (response) {
                    if (response.status === 200) {
                        let arrayWrongFields = response.listWrongFields;
                        let file = response.file;
                        // console.log(arrayWrongFields.length);
                        if (arrayWrongFields.length > 0){
                            showNotify("Warning", "File data added but contains errors", 'warning');
                            setTimeout(function () {
                                let html = '';
                                if (file != null) {
                                    $('#file').append('<a href= "' + file + '"  class="btn-primary btn" title="Download"><i class="fas fa-download"> </i> Download result</a>');
                                }
                                $.each(arrayWrongFields, function (key, value) {
                                    let fields = value.fields;
                                    html += '<tr> <td>' + value.line + '</td><td>';
                                    $.each(fields, function (key, value) {
                                        html += ' - ' + value.field + '<br>'
                                    })
                                    html += '</td></tr>';
                                });
                                $('#listWrongFields').append(html);
                                $('#wrongFieldsModal').modal('show');
                            }, 2500);
                        }else{
                            showNotify("Success", response.message, 'info');
                            datatable.draw(true);
                            document.getElementById("data_post_form").reset();
                        }
			datatable.draw(true);
                    } else if (response.status === 500){
                        showNotify("Warning", response.message, 'warning');
                    } else {
                        showNotify("Error", 'Thank you for contacting the admin!', 'danger');
                    }
                }
            });
        }
    });

    $(document).on('click', '.btn-delete-action', function () {
        let id = $(this).attr("data-id");
        swal.fire({
            title: "Suppression",
            text: "Are you sure ?",
            type: 'danger',
            showCancelButton: true,
            confirmButtonClass: "btn btn-danger",
            cancelButtonClass: "btn btn-outline-danger",
            cancelButtonText: "Cancel",
            confirmButtonText: 'Validate'
        }).then(function (result) {
            if (result.value) {
                $('#load_screen').show();
                $.ajax({
                    url: "{{ path('data_file_delete_ajax') }}",
                    method: 'POST',
                    data: {
                        id: id,
                    },
                    success: function (response) {
                        if (response.status === 200) {
                            showNotify('Success', response.message, "info");
                            datatable.draw(true);
                        } else if (response.status === 500) {
                            showNotify("Warning", response.message, 'warning');
                        } else {
                            showNotify("Error", 'Thank you for contacting the admin!', 'danger');
                        }
                    }
                });
            }
        });
    });

    $('#importFile').on('hidden.bs.modal', function (){
        document.getElementById("data_post_form").reset();
    });
    $('#wrongFieldsModal').on('hidden.bs.modal', function (){
        $("#listWrongFields").empty();
        $("#file").empty();
    });
</script>
{% endblock %}