@extends('layouts.app',[
    'class' => '',
    'folderActive' => 'demandes',
    'elementActive' => isset($_GET['status']) ? 'demande-'.$_GET['status'] : 'demandes'
])

@section('content')
    <div class="app-page-title">
        <div class="page-title-wrapper">
            <div class="page-title-heading">
                <div class="page-title-icon">
                    <i class="fa fa-calendar icon-gradient bg-arielle-smile"> </i>
                </div>
                <div>
                    DEMANDES D'INSPECTIONS
                    <div class="page-title-subheading">
                        Liste des demandes
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="outside_buttons"></div>
    <div class="row">
        <div class="col-md-12 col-xl-12">
            <div class="col-md-12">
                <div class="main-card mb-3 card">
                    <div class="table-responsive">
                        <table id="liste_demandes" data-page-length="10"
                               class="align-middle mb-0 table table-borderless table-striped table-hover datatable">
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <input type="hidden" name="client_id" id="client_id" value="{{ Auth::user()->client_id }}">
    <input id="filters" value="0" type="hidden">

    <script src="{{ asset('js/datatables.js') }}"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"
            integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ=="
            crossorigin="anonymous"></script>
    <script type="text/javascript">
        document.addEventListener('DOMContentLoaded', function () {

            const queryString = window.location.search;
            const urlParams = new URLSearchParams(queryString);

            const type_rapport = [
                'Pré-Visite',
                'BAR-EN-101',
                'BAT-EN-101',
                'BAR-EN-102 ITE',
                'BAT-EN-102 ITE',
                'BAR-EN-102 Murs Intérieurs',
                'BAT-EN-102 Murs Intérieurs',
                'BAR-EN-103',
                'BAT-EN-103',
                'BAR-EN-160',
                'BAT-TH-146',
                'BAR-EN-161 Points singuliers Secteur tertiaire',
                'BAR-EN-155 Points singuliers Secteur Industriel',
                'BAR-TH-164',
                'PAC',
                'BAR-EN-106',
                'BAT-EN-106',
                'PAC',
                'VMC',
            ]

            let table = $('#liste_demandes').DataTable({
                "language": {
                    "sProcessing": "Traitement en cours...",
                    "sSearch": "Rechercher&nbsp;:",
                    "sLengthMenu": "Afficher _MENU_ &eacute;l&eacute;ments",
                    "sInfo": "Affichage de l'&eacute;l&eacute;ment _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
                    "sInfoEmpty": "Affichage de l'&eacute;l&eacute;ment 0 &agrave; 0 sur 0 &eacute;l&eacute;ment",
                    "sInfoFiltered": "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                    "sInfoPostFix": "",
                    "sLoadingRecords": "Chargement en cours...",
                    "sZeroRecords": "Aucun &eacute;l&eacute;ment &agrave; afficher",
                    "zeroRecords": "Aucun rapport à afficher, veuillez appliquer 1 ou plusieurs filtres",
                    "sEmptyTable": "Aucune donn&eacute;e disponible dans le tableau",
                    "oPaginate": {
                        "sFirst": "Premier",
                        "sPrevious": "Pr&eacute;c&eacute;dent",
                        "sNext": "Suivant",
                        "sLast": "Dernier"
                    }
                },
                "searching": true,
                "ordering": true,
                "sortable": true,
                "order": [2, "desc"],
                // "pageLength": 50,
                "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "Tout"]],
                "ajax": {
                    "url": "/api/demandes",
                    beforeSend: function (xhr) {
                        loader.show();
                        xhr.setRequestHeader('Authorization', `Bearer ${token}`);
                    },
                    data: function (d) {
                        d.filters = $('#filters').val();
                        d.status = urlParams.get('status');
                        d.client_id = $('#client_id').val();
                        d.search_field = $('#nom_filter').val();
                    },

                    "type": "GET",

                    error: function () {
                    },

                },

                "initComplete": function (settings, json) {
                },

                drawCallback: function (json) {
                    loader.hide();
                },

                "columns": [
                    {
                        "data": "date_demande", 'title': 'Date de la demande',
                        "render": function (data, type, row, meta) {
                            return row.date_demande +
                                "<br> par " + row.demande_firstname + " " + row.demande_lastname;
                        }
                    },
                    {
                        "data": "client_title", title: 'Client'
                    },
                    {
                        "data": "proprietaire_name", 'title': 'Propriétaire',
                        "render": function (data, type, row, meta) {
                            return "<strong>" + row.proprietaire_name + "</strong>";
                        }
                    },
                    {
                        "data": "proprietaire_adresse", 'title': 'Adresse',
                        "render": function (data, type, row, meta) {
                            return row.proprietaire_adresse;
                        }
                    },
                    {
                        "data": "cp", 'title': 'Code postal',
                        "render": function (data, type, row, meta) {
                            return row.proprietaire_cp;
                        }
                    },
                    {
                        "data": "ville", 'title': 'Ville',
                        "render": function (data, type, row, meta) {
                            return row.proprietaire_ville;
                        }
                    },
                    {
                        "data": "type_demande",
                        'title': 'Type d\'inspection',
                        'render': function (data, type, row, meta) {

                            let string = '';
                            if(row.type_demande!=false) {
                            row.type_demande.forEach((index) => {
                                if (type_rapport[index - 1] !== undefined) {
                                    string += type_rapport[index - 1] + '<br/>';
                                    }

                                })
                             }

                            return string;
                        }
                    },
                    {"data": "tel_contact", title: 'Téléphone du contact'},
                    {"data": "debut_chantier", title: 'Date de début de chantier'},
                    {"data": "date_souhaitee", title: 'Date de visite souhaitée'},
                    {
                        "data": "date_rdv",
                        'title': 'Date du RDV planifié',
                        'render': function (data, type, row, meta) {
                            if (row.rdv_annule === 1) {
                                return `<button class="btn btn-danger">RDV annulé</button>`
                            } else if ((row.statut_demande === 3 || row.statut_demande === 2) && (row.date_rdv !== '')) {
                                return row.date_rdv +
                                    " par " +
                                    row.rdv_firstname + ' ' + row.rdv_lastname
                            }
                            return '';
                        }
                    },
                        @if(auth()->user()->client_id === 0 || !isset(auth()->user()->client_id))
                    {
                        "data": "documentCheck",
                        'title': 'Vérification documentaire',
                        'render': function (data, type, row, meta) {
                            if (row.documentCheck == 1) {
                                return 'Effectuée';
                            }

                            return 'Non effectuée';
                        }
                    },
                        @endif
                    {
                        "data": "action", 'title': 'Action', 'render': function (data, type, row, meta) {
                            if (row.rapport_id == undefined || row.rapport_id == '') {
                                if (row.statut_demande == 0) {
                                    return '<a href="/demandes/' + row.demande_id + '"' +
                                        'class="btn btn-danger">En attente d\'acceptation</a>'
                                } else if (row.statut_demande == 1) {
                                    return '<a href="/demandes/' + row.demande_id + '"' +
                                        'class="btn btn-warning">Demande acceptée</a>'
                                } else if (row.statut_demande == 2) {
                                    return '<a href="/demandes/' + row.demande_id + '"' +
                                        'class="btn btn-success">Inspection planifiée</a>'
                                } else if (row.statut_demande == 3) {
                                    return '<a href="/demandes/' + row.demande_id + '"' +
                                        'class="btn btn-warning">Demande refusée</a>'
                                } else if (row.statut_demande == 4) {
                                    return '<a href="/demandes/' + row.demande_id + '"' +
                                        'class="btn btn-secondary">Retour de demande</a>'
                                }
                            } else {
                                if (row.rapport_statut < 4) {
                                    return '<a class="btn btn-info">Rapport effectué</a>';
                                } else {
                                    return '<a href="/storage/rapports/rapport_' + row.rapport_id + '/' + row.nom_rapport + '.pdf?time=' + Date.now() + '' +
                                        'target="_blank" class="btn btn-primary">Rapport validé</a>'
                                }
                            }
                        }
                    },
                    {
                        "data": "date_rdv", 'title': 'Statut', 'render': function (data, type, row, meta) {
                            return '<a href="/demandes/' + row.demande_id + '" class="btn btn-primary">Voir la demande</a>'
                        }
                    },
                ]
            });

            new $.fn.dataTable.Buttons(table, {
                buttons: [

                    {
                        extend: 'copy',
                        text: '<i class="fa fa-files-o"></i> Copier',
                        titleAttr: 'Copy',
                        className: 'btn btn-primary btn-sm',
                        exportOptions: {
                            columns: ':visible'
                        }
                    },
                    {
                        extend: 'csv',
                        text: '<i class="fa fa-files-o"></i> CSV',
                        titleAttr: 'CSV',
                        className: 'btn btn-primary btn-sm',
                        exportOptions: {
                            columns: ':visible'
                        }
                    },
                    {
                        extend: 'excel',
                        text: '<i class="fa fa-files-o"></i> Excel',
                        titleAttr: 'Excel',
                        className: 'btn btn-primary btn-sm',
                        exportOptions: {
                            columns: ':visible'
                        }
                    },
                    {
                        extend: 'pdf',
                        text: '<i class="fa fa-file-pdf-o"></i> PDF',
                        titleAttr: 'PDF',
                        className: 'btn btn-primary btn-sm',
                        exportOptions: {
                            columns: ':visible'
                        }
                    },
                    {
                        extend: 'print',
                        text: '<i class="fa fa-print"></i> Imprimer',
                        titleAttr: 'Print',
                        className: 'btn btn-primary btn-sm',
                        exportOptions: {
                            columns: ':visible'
                        }
                    },
                ]
            });

            table.buttons().container().appendTo('.outside_buttons');

            $('.input_filter').on('keyup', function () {
                if ($(this).val() != '' && $(this).val().length > 4) {
                    // loader.show();
                    $('#filters').val(1);
                    table
                        .clear()
                        .draw();
                    table.ajax.reload();

                    // loader.show();

                } else {
                    table
                        .clear()
                        .draw();
                    table.ajax.reload();
                }

            });

        });
    </script>
@endsection