{# templates/client_v2/client_mes_demandes.html.twig #}
{% extends 'client_v2/client.html.twig' %}

{% block title %}Mes demandes de devis - {{ parent() }}{% endblock %}
{% block description %}{% endblock %}

{% block body %}
    {{ include('client_v2/layout/client_mon_identifiant.html.twig') }}

    <section class="au-breadcrumb m-t-0">
        <div class="section__content section__content--p30">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12" style="padding-left:0;">
                        <div class="au-breadcrumb-content">
                            <div class="au-breadcrumb-left">
                                <ul class="list-unstyled list-inline au-breadcrumb__list">
                                    <li class="list-inline-item">Mes demandes de devis</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div class="section__content section__content--p30">
        <div class="alert alert-info" role="alert">
            Bonjour {{ app.user.nom }},<br>
            Vous trouvez ci-dessous la liste de vos demandes.<br>
            En cliquant sur le bouton « Clôturer »,  vous ne recevrez plus de proposition de devis.
        </div>

        {{ include('client_v2/layout/client_debug.html.twig') }}

        {{ include('client_v2/layout/client_alert.html.twig') }}

        <div class="container-fluid" id="list_mes_demandes_p">
            <div class="row" id="list_mes_demandes_c">
                {{ include('client_v2/layout/client_paginator.html.twig') }}

                <div class="table-responsive table--no-card m-b-30">
                    {% if nb_pages >= page %}
                    <table class="table table-borderless table-striped table-earning">
                        <thead>
                            <tr>
                                <th class="mw-300">Mes demandes de devis</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for key,row in listing %}
                            <tr id="row-{{ row.id }}">
                                <td style="padding-top:8px;padding-bottom:8px;">
                                    <i class="zmdi zmdi-calendar zmdi-hc-lg"></i>&nbsp; <b>Date d'envoi :</b> {{ row.creationDate|date('d-m-Y H:i') }}<br>
                                    <i class="zmdi zmdi-pin zmdi-hc-lg"></i>&nbsp; <b>Adresse :</b> {{ row.adresse }}, <b>{{ row.cp }} {{ row.ville }}</b><br><br>

                                    <i class="zmdi zmdi-flag zmdi-hc-lg"></i>&nbsp; <b>Service :</b> {# { getServiceByKey(row.service) } #}
                                    {% if row.solution == 'nettoyage' %}
                                        <span>Nettoyage</span>
                                    {% elseif row.solution == 'depannage' %}
                                        <span>Dépannage</span>
                                    {% elseif row.solution == 'nuisible' %}
                                        <span>Nuisible</span>
                                    {% else %}
                                        {{ row.solution }}
                                    {% endif %} / {{ row.service }}
                                    {% if row.detail_service|length > 0 %} ({{ row.detail_service }}){% endif %}
                                    <br>
                                    {% if isNumeric(row.surface) and row.surface > 0 %}
                                      {% if row.id > 13937 %}
                                        <i class="zmdi zmdi-n-5-square zmdi-hc-lg"></i>&nbsp; <b>{{ row.surface_lab }}{% if row.surface_unite|length > 0 %} ({{ row.surface_unite }}){% endif %} :</b> {{ row.surface }}<br>
                                      {% else %}
                                          {% if row.service_key == 'assainissement_vidange_curage' %}
                                            <i class="zmdi zmdi-n-5-square zmdi-hc-lg"></i>&nbsp; <b>Volume :</b> {{ row.surface }} &#13221;<br>
                                          {% elseif row.service_key == 'vitres' and row.creationDate|date('Y-m-d') > '2021-11-16' %}
                                            <i class="zmdi zmdi-n-5-square zmdi-hc-lg"></i>&nbsp; <b>Nombre de fenêtres :</b> {{ row.surface }}<br>
                                          {% elseif row.service_key == 'merule' and row.id > 9827 %}
                                            <i class="zmdi zmdi-n-5-square zmdi-hc-lg"></i>&nbsp; <b>Longueur (mètre courant) :</b> {{ row.surface }}<br>
                                          {% else %}
                                            <i class="zmdi zmdi-n-5-square zmdi-hc-lg"></i>&nbsp; <b>Surface :</b> {{ row.surface }} m²<br>
                                          {% endif %}
									  {% endif %}
									{% endif %}
                                    {% if row.frequence|length > 0 %}<i class="zmdi zmdi-repeat zmdi-hc-lg"></i>&nbsp; <b>{% if row.id > 14617 %}{{ row.frequence_lab }}{% else %}Fréquence des interventions{% endif %} :</b> {{ getFrequenceByKey(row.frequence) }}<br>{% endif %}

                                    <br>
                                    <i class="zmdi zmdi-alert-triangle zmdi-hc-lg"></i>&nbsp; <b>Description :</b> {{ getNl2Br(row.description)|raw }}

                                    <div class="row" style="margin:10px 0 2px;text-align:left;">{{ getImagesDevisToClient(row.id)|raw }}</div>
                                    <div class="row">
										<div class="offset-md-4 col-md-4 col-sm-12">
											<button type="button" onclick="uploadPhotosVideos({{ row.id }});" class="btn btn-success btn-sm btn-block btn-app" data-toggle="modal" data-target="#app_modal">
												<i class="fa fa-upload"></i>&nbsp; Ajouter photos / vidéos / Pdf
											</button><br>
										</div>
									</div>

                                    {% if row.nbr_prospections > 0 %}
                                    <i class="zmdi zmdi-plus-1 zmdi-hc-lg" style="color:red;"></i>&nbsp; <b style="color:red;">Annonce vue par :</b> <span style="color:red;">{{ row.nbr_prospections }} partenaires</span><br>
                                    {% endif %}
                                    <i class="zmdi zmdi-plus-1 zmdi-hc-lg"></i>&nbsp; <b>Nombre de Devis :</b> {{ row.nbr_reponses }}

                                    <div class="row">
										<div class="offset-md-1 col-md-2 col-sm-12">
                                            {% if row.nbr_reponses > 0 %}
                                            <button type="button" class="btn btn-info btn-sm btn-block btn-app" onclick="visualiserDevis({{ row.id }});" data-toggle="modal" data-target="#app_modal">
                                                <i class="zmdi zmdi-comment-more"></i>&nbsp; Visualiser les devis
                                            </button>
                                            {% endif %}
										</div><div class="col-md-1 col-sm-12"></div>

										<div class="offset-md-1 col-md-2 col-sm-12">
                                            {% if row.relanceeA == 0 and date('-24hours') > date(row.creationDate) %}
                                            <button type="button" class="btn btn-primary btn-sm btn-block btn-app" onclick="redeposer({{ row.id }});" data-toggle="modal" data-target="#app_modal">
                                                <i class="zmdi zmdi-mail-reply"></i>&nbsp; Relancer ma demande
                                            </button>
                                            {% endif %}
										</div><div class="col-md-1 col-sm-12"></div>

										<div class="offset-md-1 col-md-2 col-sm-12" id="classified_{{ row.id }}">
                                          {% if row.classified == 0 %}
                                            {% if row.published == 1 and (row.nbr_reponses > 3 or date('-24hours') > date(row.creationDate)) %}
                                            <button type="button" class="btn btn-danger btn-sm btn-block btn-app" onclick="cloturer({{ row.id }});">
                                                <i class="zmdi zmdi-close-circle"></i>&nbsp; Clôturer
                                            </button>
                                            {% endif %}
                                          {% elseif row.classified == 1 %}
                                            <button type="button" class="btn btn-success btn-sm btn-block btn-app" onclick="reactiver({{ row.id }});">
                                                <i class="zmdi zmdi-mail-reply"></i>&nbsp; Réactiver
                                            </button>
                                          {% endif %}
										</div><div class="col-md-1 col-sm-12"></div>
									</div>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                    {% endif %}
                </div>

                {% if nb_pages >= page %}{{ include('client_v2/layout/client_paginator.html.twig') }}{% endif %}
            </div>

            {{ render(controller('App\\Controller\\ClientController::footer')) }}
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
    // <![CDATA[
    $(document).ready(function(){
        setInterval( function(){
            loadListMesDemandes();
        }, 60000);

        $(document).on('click', 'form#client_redeposer_demande_form #client_redeposer_demande_submit', function(){
            var ckeck = 0;

            if ($('form#client_redeposer_demande_form textarea#description').val().length == 0) {	
                ckeck += 1;
                $('form#client_redeposer_demande_form textarea#description').addClass('is-invalid');
                $('div#description-error').html("Veuillez insérer la description");
                $('form#ge_artisans_edit_form textarea#description').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#description-error').html('');
                });            
            }

            if (ckeck == 0) {
				if (confirm("Êtes-vous sûr de relancer la demande ?")) {
					$('form#client_redeposer_demande_form').submit();
					return true;
				} else {
					return false;
				}
            } else {
                return false;
            }
		});

        $(document).on('click', 'button#photos_videos_devis_submit', function(){
            var ckeck = 0;

            if ($('form#photos_videos_devis_form #filename_photos_videos').val().length == 0) {	
                ckeck += 1;
                $('form#photos_videos_devis_form #filename_photos_videos').addClass('is-invalid');
                $('div#error-photo-video').html("Veuillez insérer une photo ou une vidéo");
                $('form#photos_videos_devis_form #filename_photos_videos').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#error-photo-video').html('');
                });            
            }

            if (ckeck == 0) {
                $('form#photos_videos_devis_form').submit();
                return true;
            } else {
                return false;
            }
        });
    });
    // ]]>

    function uploadPhotosVideos(id){
        $('#app_modal').html('<div class="modal-dialog modal-lg" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
        $.ajax({
            url : "{{ path('client_mes_devis') }}/"+ id +"/upload-photos-videos",
            type : 'POST',
            data : {id:id},
            dataType : 'json',
            success : function(response){
				if (response.code == 200) {
                    if (response.message == 'success') {
                        $('#app_modal').html(response.html);
                    } else {
                        $('#app_modal').html('Erreur');
                    }
                }
            },
            error : function(e){
            }
        });
    }
	
    function savePhotoVideo(id){
		$('#display-photo-video').html('<img src="/public/img/spinning-loading.gif">');
		
		var inputFile = document.getElementById('filePhotoVideo');
        var file = inputFile.files[0];
        var data = new FormData();
        data.append('doc', file, file.name);
        $.ajax({
            url: "{{ path('client_mes_devis') }}/" + id + "/save-photos-videos",
            type: "POST",
            data: data,
            processData: false,
            contentType: false,
            cache: false,
            success : function(response){
				if (response.error != '') {
					$('#error-photo-video').html(response.error);
					$('#display-photo-video').html('');
				} else {
                    $('input#filename_photos_videos').val(response.name);
					$('#display-photo-video').html(response.html);
					$('#photos_videos_devis_reset').html(response.reset);
                    $('#photo_video_btn').hide();
                    $('#photos_videos_devis_submit').show();
				}
            },
            error : function(e){
            }
        });
    }

    function resetPhotoVideo(tmp_file){
        if (confirm("Êtes-vous sûr ?")) {
            $.ajax({
            url: "{{ path('client_mes_demandes_reset_photos_videos') }}",
                type : 'POST',
                data : {tmp_file:tmp_file},
                dataType : 'json',
                success : function(response){
                    if (response.result) {
                        $('input#filename_photos_videos').val('');
                        $('#display-photo-video').html('');
                        $('#photos_videos_devis_reset').html('');
                        $('#photo_video_btn').show();
                        $('#photos_videos_devis_submit').hide();
                    }
                },
                error : function(e){
                }
            });
        }
	}

    function popupPhotoVideo(id){
		$('#app_modal').html('<div class="modal-dialog modal-lg" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
        $.ajax({
            url : "{{ path('client_mes_devis') }}/"+ id +"/popup-photo-video",
            dataType : 'json',
            success : function(response){
                if (response.code == 200) {
                    $('#app_modal').html(response.html);
                }
            },
            error : function(e){
            }
        });
    }

    function deletePhotoVideo(id){
        if (confirm("Êtes-vous sûr ?")) {
            $.ajax({
            url: "{{ path('client_mes_demandes_delete_photos_videos') }}",
                type : 'POST',
                data : {id:id},
                dataType : 'json',
                success : function(response){
                        window.location.href="{{ app.request.uri|raw }}";
                },
                error : function(e){
                }
            });
        }
	}

    function visualiserDevis(id){
        $('#app_modal').html('<div class="modal-dialog modal-xl" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
        $.ajax({
            url : "{{ path('client_mes_devis') }}/"+ id +"/visualiser-devis",
            type : 'POST',
            data : {id:id},
            dataType : 'json',
            success : function(response){
                if (response.code == 200) {
                    if (response.message == 'success') {
                        $('#app_modal').html(response.html).modal('show');
                    } else {
                        $('#app_modal').html('Erreur');
                    }
                }
            },
            error : function(e){
            }
        });
    }

    function cloturer(id){
        if (confirm("Êtes-vous sûr de clôturer la demande ?")) {
            $.ajax({
                url : "{{ path('client_mes_devis') }}/" + id + "/cloturer",
                dataType : 'json',
                success : function(response){
                    if (response.message === 'classified') {
                        $('#classified_' + id).html('<button type="button" class="btn btn-success btn-sm btn-block btn-app" onclick="reactiver(' + id + ');"><i class="zmdi zmdi-mail-reply"></i>&nbsp; Réactiver</button>');
                    }
                },
                error : function(e){
                }
            });
        }
    }

    function reactiver(id){
        if (confirm("Êtes-vous sûr de clôturer la demande ?")) {
            $.ajax({
                url : "{{ path('client_mes_devis') }}/" + id + "/reactiver",
                dataType : 'json',
                success : function(response){
                    if (response.message === 'reactivated') {
                        $('#classified_' + id).html('<button type="button" class="btn btn-danger btn-sm btn-block btn-app" onclick="cloturer(' + id + ');"><i class="zmdi zmdi-close-circle"></i>&nbsp; Clôturer</button>');
                    }
                },
                error : function(e){
                }
            });
        }
    }

    function redeposer(id){
        $('#app_modal').html('<div class="modal-dialog modal-xl" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
        /* var url_form_redeposer = Routing.generate('client_mes_demandes_form_redeposer', {
			'id': 5
		});
		console.log(url_form_redeposer); */
		$.ajax({
            url : "{{ path('client_mes_devis') }}/" + id + "/form-redeposer",
            type : 'POST',
            data : {id:id},
            dataType : 'json',
            success : function(response){
                if (response.code == 200) {
                    if (response.message == 'success') {
                        $('#app_modal').html(response.html).modal('show');
                    } else {
                        $('#app_modal').html('Erreur');
                    }
                }
            },
            error : function(e){
            }
        });
    }

    function sendToArtisan(id){
        if (confirm("Êtes-vous sûr ?")) {
            $.ajax({
                url : "{{ path('client_mes_devis') }}/reponses/" + id + "/send-to-client",
                dataType : 'json',
                success : function(response){
                    if (response.message === 'answered') {
                        $('#answered_' + id).html('<span style="font-weight:bold;color:#31708f;">Réponse envoyée au artisan</span>');
                    }
                },
                error : function(e){
                }
            });
        }
    }
    
    function archiver(id){
        if (confirm("Êtes-vous sûr ?")) {
            $.ajax({
                url : "{{ path('client_mes_devis') }}/reponses/" + id + "/archiver",
                dataType : 'json',
                success : function(response){
                    if (response.message === 'archived') {
                        $('#archived_' + id).html('<span style="color:red;font-weight:bold;">Archivé</span>');
                        $('#answered_' + id).html('');
                    }
                },
                error : function(e){
                }
            });
        }
    }

    function loadListMesDemandes(){
        {% if page == 1 %}
			$("#list_mes_demandes_p").load('{{ path("client_mes_devis") }} #list_mes_demandes_c');
        {% endif %}
    }
    </script>
{% endblock %}