Download and remove images through Ajax

download_and_remove_img_ajax.md

Exemplo de download imagens no Laravel + Blade e Ajax

View Blade (front-end):

Template: adminlte

@extends('layouts.adminlte')
@section('css')
    <!-- Pace style -->
    <link rel="stylesheet" href="/bower_components/AdminLTE/plugins/pace/pace.min.css">
@endsection            
@section('header')
	<meta name="_token" content="{!! csrf_token() !!}" />
@endsection            
@section('content')

	<a class="btn btn-success  pull-right downloadImages" href="javascript:void(0);"><i class="glyphicon glyphicon-download-alt"></i>  Baixar fotos</a>

@endsection            

@section('scripts2')
    <!-- Pace page -->
    <script src="/bower_components/AdminLTE/plugins/pace/pace.min.js"></script>			
			
	<script>
	
	    $(document).on('click','.downloadImages', function(e){
                e.preventDefault();
                if($('.downloadImages').attr("disabled")){
                    return false;
                }
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    }
                }),
                jQuery.ajax({
                    type: 'POST',
                    url: '{{route("occurrence.images.download",["occurrence_id"=>$occurrence->id])}}',
                    beforeSend:function(){
                        jQuery(".downloadImages").attr('disabled',true);
                        jQuery(".downloadImages").html('<i class="glyphicon glyphicon-refresh fa-spin"></i> Aguarde...');
                    },
                    success: function( data ){
                        jQuery(".downloadImages").attr('disabled',false);
                        jQuery(".downloadImages").html('<i class="glyphicon glyphicon-download-alt"></i> Baixar fotos');
                        if(data.retorno == 2){
                            alert(data.mensagem);
                        }else{
                            location.href = "/export_images.zip";
                        }
                    },
                    error: function (){
                        jQuery(".downloadImages").attr('disabled',false);
                        jQuery(".downloadImages").html('<i class="glyphicon glyphicon-download-alt"></i> Baixar fotos');
                        alert("Ocorreu um erro inesperado durante o processamento!\n Recarrege a página e tente novamente.");
                    }
                });
            });

            $(document).on("click",".removeImage",function(e){
                e.preventDefault();
                var status = confirm("Deseja realmente remover essa Imagem?");
                if(status == false){
                    return false;
                }
                var id = $(this).data("id");
                var url = $(this).data("url");
                var this2 = $(this);
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    }
                }),
                    jQuery.ajax({
                        type: 'POST',
                        url: '{{route("occurrence.remove_file")}}',
                        data: "id="+id+"&url="+url,

                        success: function( data ){
                            if(data.retorno == 2){
                                alert(data.mensagem);
                            }else{
                                alert(data.mensagem);
                                $(this2).parent().remove();
                            }
                        },
                        error: function (){
                            alert("Ocorreu um erro inesperado durante o processamento!\n Recarrege a página e tente novamente.");
                        }
                    });
                return false;
            });

	<script>       
@endsection	

Método PHP (back-end):

public function downloadImages(Request $request) {
	$data = $request->all();

	if(!isset($data["property_id"]) || empty($data["property_id"])){
		return response()->json([
			'retorno' => 2,
			'mensagem' => 'Parâmetros inválidos'
		]);
	}
	$property_id = $data["property_id"];

	$path  = "storage/imports/properties/" . $property_id . "/";
	$files = scandir($path);

	if(count($files) > 0){

		$zip = new ZipArchive();
		$zipFile = public_path("export_images.zip");

		// delete existing zip file
		if(file_exists($zipFile)) {
			unlink($zipFile);
		}

		// Create new zip file
		if ($zip->open($zipFile, ZipArchive::CREATE) === TRUE) {

			foreach ($files as $file) {
				if (is_file($path . $file)) {
					$zip->addFile($path . $file, $file);
				}
			}

			$zip->close();
		}

		if(file_exists($zipFile)){
			return 1;
		} else {
			return response()->json([
				'retorno' => 2,
				'mensagem' => 'Falha ao criar arquivo'
			]);
		}

	}else{
		return response()->json([
			'retorno' => 2,
			'mensagem' => 'Não há imagens para baixar'
		]);
	}
}