@extends('BaseSistemaWeb')

@section('CSS')
{{ HTML::style('DataTables/dataTables.bootstrap.min.css') }}
{{ HTML::style('DataTables/responsive.dataTables.min.css') }}
{{ HTML::style('bootstrap-select/css/bootstrap-select.min.css') }}
<style type="text/css">
	/*@media (max-width: 450px) { .ModalEliminar .modal-dialog { width: auto; } }
	@media (min-width: 451px) { .ModalEliminar .modal-dialog { width: 450px; } }*/
	.mdAvatar .modal-dialog .modal-content .modal-header{ background-color: #363B3F; }
	@media (max-width: 1500px){
		.div-groupinput{
			width: 200px !important;
		}
		select[name="tblConfEnvios_length"]{
			width: auto !important;
			padding: 7px !important;
		}
		.dataTables_length label{
			font-size: 12.5px !important;
		}
	}
	@media (max-width: 1400px){
		.col-paginacion{
			padding: 0 !important;
		}
	}
	@media (max-width: 1380px){
		.dataTables_filter .btn-default{
			display: none !important;
		}
		select[name="tblConfEnvios_length"]{
			width: auto !important;
			padding: 0px !important;
		}
		.dataTables_length label{
			font-size: 12.5px !important;
		}
		.col-busqueda{
			padding: 0 !important;
		}
	}
	@media (max-width: 1100px){
		.div-groupinput{
			width: 180px !important;
		}
	}
	@media (max-width: 1060px){
		.div-groupinput{
			width: 160px !important;
		}
	}
</style>
@stop

@section('Contenido')
<div class="row">
	<div class="col-md-12">
		<h2><i class="fa fa-shopping-cart"></i> Gestión de ventas en línea </h2>
	</div><!--/col-md-12-->
</div><!--/row-->

<div class="row">
	<div class="col-md-12">
		@if (Session::has('message'))
		<div class="alert alert-info">{{ Session::get('message') }}</div>
		@endif
	</div>
</div>

<div class="row">

	<div class="col-md-3">
		<div class="block-web">
			<div class="header"> <h3 class="content-header"> Agregar país de envío de artículos </h3> </div>
			<div class="porlets-content">
				{{ Form::open(array('route' => 'SysWebVentasConfEnviosAgregar', 'method' => 'post', 'class' => 'form-horizontal row-border', 'id' => 'frmAgregar', 'files' => true, 'target' => 'upload_iframe')) }}
					<div class="form-group">
						<label class="col-sm-3 control-label"> País </label>
						<div class="col-sm-9">
							<!--select class="form-control crs-country selectpicker" id="pais" name="pais" data-region-id="estado" data-default-value="{{ $Cliente->pais }}" data-default-option="Seleccione un país" data-whitelist="US,MX,CU,DM,DO,PR,BZ,GT,SV,HN,NI,CR,PA,VE,EC,CO,PE,BO,CL,PY,UY,AR,ES,GQ" data-value="shortcode" @if($Paises != '') data-blacklist="{{ $Paises }}" @endif></select-->
							<select class="form-control selectpicker" id="pais" name="pais" data-region-id="estado" data-default-value="{{ $Cliente->pais }}" data-default-option="Seleccione un país" data-live-search="true" data-value="shortcode" @if($Paises != '') data-blacklist="{{ $Paises }}" @endif></select>
							<span class="text-danger" id="errpais"> </span>
						</div>
					</div>
					<div class="bottom">
						{{ Form::button('Guardar', array('class' => 'btn btn-primary', 'id' => 'btnAgregar', 'type' => 'submit')) }}
						<!-- {{ HTML::linkRoute('SysWebVentasConfEnvios', 'Cancelar', array(), array('class' => 'btn btn-default')) }} -->
					</div>
				{{ Form::close() }}
			</div>
		</div>
	</div>

	<div class="col-md-9">
		<div class="block-web">
			<div class="header"> <h3 class="content-header"> Listado de paises a los que se envían </h3> </div>
			<div class="porlets-content">
				<div class="table-responsive">
					<table class="table table-striped table-bordered table-hover" id="tblConfEnvios">
						<thead>
							<tr>
								<th class=""> País de envío </th>
								<th class=""> Proveedores </th>
								<th style="" class=""> Acciones </th>
							</tr>
						</thead>
						</table>
				</div>
			</div>
			<!--<div class="bottom">
				<a href="{{ URL::route('SysWebVentasConfEnviosAgregar') }}" class="btn btn-primary"> Agregar </a>
			</div>-->
		</div>
	</div>
</div><!--/row end-->
@stop

@section('JS')
{{ HTML::script('DataTables/jquery.dataTables.min.js') }}
{{ HTML::script('DataTables/dataTables.bootstrap.min.js') }}
{{ HTML::script('DataTables/dataTables.responsive.min.js') }}
{{ HTML::script('bootstrap-select/js/bootstrap-select.min.js') }}
{{ HTML::script('country-region-selector/crs.min.js') }}
<script type="text/javascript">
	function Eliminar(id){
		var id = id;
		var mensaje = "<div class='row'> \
							<div class='col-xs-12'> \
								<form id='frmEliminar'> \
									<h2> ¿Seguro que desea eliminar? </h2> \
									<input type='hidden' name='idP' value='"+id+"'> \
								</form> \
							</div> \
						</div>";
		BootstrapDialog.show({
			title: "Eliminar registro",
			type: BootstrapDialog.TYPE_DANGER,
			message: mensaje,
			draggable: true,
			closeByBackdrop: false,
			cssClass: "ModalEliminar mdAvatar",
			onshown: function(dialogItself){
				$("body").addClass("modal-open");
			},
			buttons: [{
				id: "btnEliminar",
				label: "Eliminar",
				cssClass: "btn-danger btn-block btn-lg",
				action: function(dialogItself){
					$.isLoading({ text: "Cargando..." }); NProgress.start();
					$("#btnEliminar").prop("disabled", true).html('<i class="fa fa-spinner fa-spin"></i> Eliminando');
					$.post(
						"{{ URL::route('SysWebVentasConfEnviosEliminar', array()) }}",
						{idP: id},
						function(data){
							$.isLoading("hide"); NProgress.done();
							$("#btnEliminar").html("Guardar").prop("disabled", false);
							if(data.success){
								dialogItself.close();
								var table = $("#tblConfEnvios").DataTable();
								table.ajax.reload(null, false);
								new PNotify({ title: "Realizado", text: data.mensaje, type: "success" });
							}
							else{
								if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
								$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
							}
						},
						"json"
					);
				}
			}],
			onhidden: function(dialogItself){
				$("body").removeClass("modal-open");
			}
		});
	}
</script>
<script type="text/javascript">
	$(window).on("load", function(){
		var shippingCountrySelector = $("#frmAgregar").find('[name="pais"]');
		var shippingCountryList = shippingCountrySelector.attr("data-whitelist") ? Array.from(shippingCountrySelector.attr("data-whitelist").split(",")) : [];
		var shippingCountryUsedList = shippingCountrySelector.attr("data-blacklist") ? Array.from(shippingCountrySelector.attr("data-blacklist").split(",")) : [];
		console.log("shippingCountryList", shippingCountryList);
		console.log("shippingCountryUsedList", shippingCountryUsedList);
		getCountryStateCity().then(function(data){
			data.forEach(function(country){
				if(!shippingCountryUsedList.includes(country.iso2)){
					shippingCountrySelector.append($('<option>', {
						value: country.iso2,
						text: country.name
					}));
				}
			});
			shippingCountrySelector.selectpicker("refresh");
		})
		.catch(function(error){
			console.error("Error al obtener la lista de países: ", error);
		});
	});
</script>
@stop

@section('JSOr')
$("a[data-toggle=\"tab\"]").on("shown.bs.tab", function(e){ $.fn.dataTable.tables({visible: true, api: true}).columns.adjust(); });
$("#tblConfEnvios").DataTable({
	"processing": true,
	"serverSide": true,
	"ajax": "{{ URL::route('SysWebVentasConfEnvios') }}",
	columns: [
		{data: "pais", name: "pais"},
		{data: "proveedores", name: "proveedores"},
		{data: "acciones", name: "acciones", "searchable": false, "orderable": false, "class": "text-center"}
	],
	"language": {
		"url": "{{ asset('DataTables/Spanish.json') }}"
	},
	"fnDrawCallback": function(oSettings){
		$(".tooltips").tooltip();
	},
	autoWidth: false,
	responsive: true
});
$("#frmAgregar").submit(function(e){
	$.isLoading({ text: "Cargando..." }); NProgress.start();
	$("#btnAgregar").html('<i class="fa fa-spinner fa-spin"></i> Cargando').prop("disabled", true);
	e.preventDefault();
	var frmAgregar = new FormData(document.getElementById("frmAgregar"));
	$.ajax({
		type: "POST",
		url: "{{ URL::route('SysWebVentasConfEnviosAgregar', array()) }}",
		data: frmAgregar,
		cache: false,
		contentType: false,
		processData: false,
		dataType: "json",
		success: function(data){
			$.isLoading("hide"); NProgress.done();
			$("#btnAgregar").html("Guardar").prop("disabled", false);
			if(data.success){
				new PNotify({ title: "Realizado", text: data.mensaje, type: "success" });
				//setTimeout( function(){ window.location.href = "{{ URL::route('SysWebVentasConfEnvios') }}"; }, 3000 );
				setTimeout( function(){ window.location.reload(); }, 3000 );
			}
			else{
				if(data.mensaje != ''){ new PNotify({ title: "Error", text: data.mensaje, type: "error" }); }
				$.each(data.errMensajes, function(key, value){ if(value != ''){ $("#err"+key).html(value); } else{ $("#err"+key).html(""); } });
			}
		},
		error: function(jqXHR, textStatus, errorThrown){
			new PNotify({ title: "Error", text: textStatus + " " + errorThrown, type: "error" });
		}
	});
});
$(window).on("load", function(){
	/*if( $(".crs-country")[0].hasAttribute("data-blacklist") ){
		var blacklist = $(".crs-country").attr("data-blacklist").split(",");
		$.each(blacklist, function(i, e){
			$(".crs-country").find('option[value="'+e+'"]').remove();
		});
	}*/
});
@if(Session::has('EliminarMensajeS'))
new PNotify({ title: "Realizado", text: "{{ Session::get('EliminarMensajeS') }}", type: "success" });
@endif
@if(Session::has('EliminarMensajeE'))
new PNotify({ title: "Realizado", text: "{{ Session::get('EliminarMensajeE') }}", type: "error" });
@endif
@stop