@extends('templates.default')
@section('css')
<style type="text/css">
	#map-canvas{
		width:100%;
		height:500px;
	}
</style>
@endsection

@section('nav')
    <li><a href="{{ URL::to('/') }}">Home</a></li>
    <li><a href="{{ URL::route('consultar_personas') }}">Personas</a></li>
    <li>Consultar</li>
@endsection

@section('content')
	<div class="clearfix"></div>
    <div class="col-sm-4">
        <h4>
            <small>Cédula:</small><br />
            {{ $persona->cedula }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>RUC:</small><br />
            {{ $persona->ruc }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>Tipo:</small><br />
            {{ $persona->getTipoDisplay() }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>Razón Social:</small><br />
            {{ $persona->razon_social }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>Nombre Comercial:</small><br />
            {{ $persona->nombre_comercial }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>Email:</small><br />
            {{ $persona->email }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>Teléfonos:</small><br />
            {{ $persona->telefonos }}
        </h4>
    </div>

    <div class="col-sm-4">
        <h4>
            <small>Estado:</small><br />
            {{ $persona->getEstadoDisplay() }}
        </h4>
    </div>

    <div class="col-sm-12">
        <h4>
            <small>Dirección:</small><br />
            {{ $persona->direccion }}
        </h4>
    </div>
    
    <div class="col-md-12 col-sm-12"><hr /></div>
	
	<div class="col-sm-12" role="tabpanel">
		<!-- Nav tabs -->
		<ul class="nav nav-tabs" style="background-color: #fafafa;" role="tablist">
			<li role="presentation" class="active"><a href="#general" aria-controls="general" role="tab" data-toggle="tab">Datos Generales</a></li>
			<li role="presentation"><a href="#contacto" aria-controls="contacto" role="tab" data-toggle="tab">Personas de Contacto</a></li>
			<li role="presentation"><a href="#destino" aria-controls="destino" role="tab" data-toggle="tab">Destinos</a></li>
		</ul>
		<div class="tab-content">
			<div role="tabpanel" class="tab-pane active" id="general">
		        <label class="col-sm-12">
		            @if($persona->es_cliente)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es Cliente
		        </label>
		        <label class="col-sm-12">
		            @if($persona->es_empleado)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es Empleado
		        </label>
		        <label class="col-sm-12">
		        	@if($persona->es_agencia_naviera)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es L&iacute;nea Naviera
		        </label>
		        <label class="col-sm-12">
		        	@if($persona->es_agencia_carga)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es Agencia de Carga/Consolidadora
		        </label>
		        <label class="col-sm-12">
		        	@if($persona->es_transportista)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es Transportista
		        </label>
		        <label class="col-sm-12">
		            <!--input type="checkbox" name="es_funcionario_aduana"  value="{{ isset($persona)?$persona->es_funcionario_aduana:Input::old('es_funcionario_aduana') }}" /-->
		            @if($persona->es_funcionario_aduana)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es Funcionario de Aduana
		        </label>
		        <label class="col-sm-12">
		        	@if($persona->es_aseguradora)
		            <span class="glyphicon glyphicon-ok"></span>&nbsp;
		            @else
		            <span class="glyphicon glyphicon-minus"></span>&nbsp;
		            @endif
		            Es Aseguradora
		        </label>
		    </div>
		    <div role="tabpanel" class="tab-pane table-responsive" id="contacto">
		    	<table class="table table-bordered table-condensed">
		    		<thead>
		    			<tr>
		    				<th>Sufijo</th>
		    				<th>Cargo</th>
		    				<th>Area</th>
		    				<th>Nombres</th>
		    				<th>Email</th>
		    				<th>Convencional</th>
		    				<th>Celular</th>
		    				<th>Trabajo</th>
		    				{{--<th>Notificar</th>--}}
		    			</tr>
		    		</thead>
		    		<tbody id="contenedor-tr">
		    			@foreach($contactos as $contacto)
		    			<tr>
		    				<td width="70">
		    					{{ $contacto->sufijo }}
		    				</td>
		    				<td>
		    					{{ $contacto->cargo }}
		    				</td>
		    				<td>
		    					{{ $contacto->area }}
		    				</td>
		    				<td width="300">
		    					{{ $contacto->nombres }}
		    				</td>
		    				<td width="200">
		    					{{ $contacto->email }}
	    					</td>
		    				<td>
		    					{{ $contacto->convencional }}
		    				</td>
		    				<td>
		    					{{ $contacto->celular }}
		    				</td>
		    				<td>
		    					{{ $contacto->trabajo }}
		    				</td>
		    				{{--<td>
		    					@if($contacto->notificar)
		    						<span class="glyphicon glyphicon-ok"></span>
		    					@endif
		    				</td>--}}
		    			</tr>
		    			@endforeach
		    		</tbody>
		    	</table>
		    </div>
			<!-- destinos -->
		    <div role="tabpanel" class="tab-pane table-responsive" id="destino">
		    	<table class="table table-bordered table-condensed">
		    		<thead>
		    			<tr>
		    				<th width="300">Nombre</th>
		    				<th width="200">Email</th>
		    				<th>Convencional</th>
		    				<th>Celular</th>
		    				<th>Trabajo</th>
		    				<th>Direcci&oacute;n</th>
		    				<th>Ubicaci&oacute;n</th>
		    			</tr>
		    		</thead>
		    		<tbody id="contenedor-tr">
		    			@foreach($destinos as $destino)
		    			<tr>
		    				<td width="300">
		    					{{ $destino->nombre }}
		    				</td>
		    				<td width="200">
		    					{{ $destino->email }}
	    					</td>
		    				<td>
		    					{{ $destino->convencional }}
		    				</td>
		    				<td>
		    					{{ $destino->celular }}
		    				</td>
		    				<td>
		    					{{ $destino->trabajo }}
		    				</td>
		    				<td>
		    					{{ $destino->direccion }}
		    				</td>
		    				<td class="text-center">
		    					<a class="btn btn-link btn-xs btn-agregar-ubicacion" href="javascript:;" onclick="mostrarDestinoMapa(this);" data-tr="" data-latitud="{{ $destino->latitud }}" data-longitud="{{ $destino->longitud }}"><img src="/images/icons/map_marker.png" width="28" /></a>
		    				</td>
		    			</tr>
		    			@endforeach
		    		</tbody>
		    	</table>
		    </div>
	    </div>
	</div>
    

    <div class="col-md-12">
        <hr />
        <a href="{{ URL::route('modificar_persona', $persona->id) }}" class="btn btn-default modificar-object"><span class="glyphicon glyphicon-edit"></span>&nbsp;Modificar</a>
        <a href="{{ URL::route('eliminar_persona', $persona->id) }}" data-persona="{{ $persona->razon_social }}" class="btn btn-danger eliminar-object"><span class="glyphicon glyphicon-trash"></span>&nbsp;Eliminar</a>
    </div>
    <div class="clearfix"></div>
    <div class="col-md-12"><hr/></div>
<div id="modalMapa" class="modal fade">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <div class="cell text-center">
                    <button type="button" class="close" data-dismiss="modal">×</button>
                    <h4 class="semibold text-primary">Click para agregar ubicacion</h4>
                </div>
            </div>
            <div class="modal-body" style="padding: 0px;">
                <div id="map-canvas"></div>
            </div>
            <div class="modal-footer" style="margin-top:0;">
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
@endsection

@section('js-footer')
{{ HTML::script('https://maps.googleapis.com/maps/api/js?key=AIzaSyBS53fWEJGaH9ZaAzzZRjDXyyQMbgQWOUw') }}
{{ HTML::script('js/mapa.js') }}
    <script type="text/javascript">
        $(function(){
            $('.eliminar-object').click(function($e){
                $e.preventDefault();
                var $url = $(this).attr('href');
                var $persona = $(this).attr('data-persona');
                bootbox.confirm("Está seguro de eliminar la persona: "+$persona+"?", function(result) {
                    if(result){
                        location.href = $url;
                    }
                });
            });

          //se muestra el modal del mapa
            $('#modalMapa').on('shown.bs.modal', function(e){
        	  	ubicacionInicial();
        	});
    		//se oculta el modal del mapa
            $('#modalMapa').on('hidden.bs.modal', function(e){
        	  	ubicacionInicial();
        	  	deleteMarker();
        	});
        });
    </script>
@endsection