{% extends "base/templates/base.html" %}

{% block breadcumb %}
	<ul class="breadcrumb">
		<li><a href="/"><i class="icon-home2 position-left"></i>Principal</a></li>
		<li class="active">Registrar Orden Entrega</li>
	</ul>
{% endblock %}

{% block content %}

	<form method="post" name="registrarOrdenEntregaForm" action="" enctype="multipart/form-data">
		{% csrf_token %}
		{{form.id}}{{form.errors.id}}
		{{ form.non_field_errors }}

		<div class="tab-content">
			<!-- informacion general -->
			<div class="tab-pane active" id="informacion_general">
				{% if orden_entrega.generada == True %}
					{% if request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
					<div class="row">
						<div class="col-sm-10">
							<div class="form-group">
								<label>Solo pase puerta:</label>
								{{ form.solo_pase_puerta }}{{ form.errors.solo_pase_puerta }}
							</div>
						</div>
						{% if orden_entrega %}<!-- solo sale cuando es generada. ojo! -->
						<div class="col-sm-2">
							<div class="form-group">
								<label>Anular:</label>
								{{ form.anular }}{{ form.errors.anular }}
							</div>
						</div>
						{% endif %}
					</div>
					{% endif %}
				{% endif %}
				<div class="row">
					<div class="col-sm-4">
						<div class="form-group">
							<label>Cliente:</label>
							{% if not orden_entrega %}
								{{ form.cliente_id }}{{ form.errors.cliente_id }}
							{% else %}
								{% if orden_entrega.generada == True %}
									<br>{{ orden_entrega.cliente }}
									<div class="hide" >{{ form.cliente_id }}{{ form.errors.cliente_id }}</div>
								{% else %}
									{{ form.cliente_id }}{{ form.errors.cliente_id }}
								{% endif %}
							{% endif %}
						</div>
					</div>
				</div>
				<div class="row solo_pase_puerta">
					<div class="col-sm-4">
						<div class="form-group">
							<label>Vehículo:</label>
							{% if request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
								{{ form.vehiculo_id }}{{ form.errors.vehiculo_id }}
							{% else %}
								<br>{{ orden_entrega.vehiculo|default:'Sin definir' }}
								<div class="hide">{{ form.vehiculo_id }}{{ form.errors.vehiculo_id }}</div>
							{% endif %}
						</div>
					</div>
				</div>
				<div class="row solo_pase_puerta">
					<div class="col-sm-4">
						<div class="form-group">
							<label>Chofer:</label>
							{% if request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
								{{ form.chofer_id }}{{ form.errors.chofer_id }}
							{% else %}
								<br>{{ orden_entrega.chofer|default:'Sin definir' }}
								<div class="hide">{{ form.chofer_id }}{{ form.errors.chofer_id }}</div>
							{% endif %}
						</div>
					</div>
				</div>
			</div>
			<!-- fin informacion general -->
		</div>

		
		{% if orden_entrega %}
			<div class="info_pase_puerta"><hr/></div>
			<div class="tab-content info_pase_puerta">
				<div class="tab-pane active">
					<div class="row">
						<div class="col-sm-4">
							<div class="form-group">
								<label>Pase de Puerta:</label>
								{% if request.dusuario.rol == request.dusuario.INSPECTOR or request.dusuario.rol == request.dusuario.TRANSPORTISTA  or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
									{{ form.pase_puerta }}{{ form.errors.pase_puerta }}
								{% else %}
									<br>{{ orden_entrega.pase_puerta }}
								{% endif %}
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-4">
							<div class="form-group">
								<label>Factura:</label>
								{% if request.dusuario.rol == request.dusuario.INSPECTOR or request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
									{{ form.pago_factura }}{{ form.errors.pago_factura }}
								{% else %}
									<br>{{ orden_entrega.pago_factura }}
								{% endif %}
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-4">
							<div class="form-group">
								<label>Horario de Entrada:</label>
								{% if request.dusuario.rol == request.dusuario.INSPECTOR or request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
									{{ form.horario_entrada }}{{ form.errors.horario_entrada }}
								{% else %}
									<br>{{ orden_entrega.horario_entrada|default:'Sin definir' }}
								{% endif %}
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-4">
							<div class="form-group">
								<label>Horario de Salida:</label>
								{% if request.dusuario.rol == request.dusuario.INSPECTOR or request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
									{{ form.horario_salida }}{{ form.errors.horario_salida }}
								{% else %}
									<br>{{ orden_entrega.horario_salida|default:'Sin definir' }}
								{% endif %}
							</div>
						</div>
					</div>
				</div>
			</div>
		{% endif %}
		
		<div class="solo_pase_puerta"><hr/></div>
		
		<div class="tabbable tab-content-bordered solo_pase_puerta">
			<ul class="nav nav-tabs nav-tabs-highlight">
				<li class="active"><a href="#destinos" data-toggle="tab">Destinos</a></li>
			</ul>
			<div class="tab-content">
				<!-- destinos -->
				<div class="tab-pane active" id="destino">
					<div class="table-responsive">
						<table class="table table-togglable table-hover tabla-menos-padding">
							<thead>
								<tr class="bg-slate">
									<th class="text-center">#</th>
									<th style="width:400px;" class="text-center">Destino</th>
									<th class="text-center">Dirección</th>
									<th class="text-center">Celular</th>
									<th></th>
								</tr>
							</thead>
							<tbody id="tdetalle_destino">
								<tr id="dtemplate_destino" class="hide">
									<td>
										<div class="text-center numeracion"></div>
									</td>
									<td>{{ form.template_detalle_destino.personadestino_id }}</td>
									<td>
										<div id="{{ form.template_detalle_destino.prefix }}-labeldireccion" class="label-direccion" style="margin-top:3px;">
										</div>
									</td>
									<td>
										<div id="{{ form.template_detalle_destino.prefix }}-labelcelular" class="label-celular" style="margin-top:3px;">
										</div>
									</td>
									<td class="text-center"><a class="text-danger" href="javascript:;" onclick="orden_entrega.detalles_destinos.eliminarDetalle(this); return false;"><span class="icon-trash"></span></a></td>
								</tr>
								
								{% if request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
									{% for dest in form.detalles_destinos %}
										<tr>
											<td>
												<div class="text-center numeracion"></div>
											</td>
											<td>{{ dest.id }}{{ dest.personadestino_id }}{{ dest.errors.personadestino_id }}</td>
											<td>
												<div id="{{ dest.prefix }}-labeldireccion" class="label-direccion" style="margin-top:3px;">
												</div>
											</td>
											<td>
												<div id="{{ dest.prefix }}-labelcelular" class="label-celular" style="margin-top:3px;">
												</div>
											</td>
											<td class="text-center"><a class="text-danger" href="javascript:;" onclick="orden_entrega.detalles_destinos.eliminarDetalle(this); return false;"><span class="icon-trash"></span></a></td>
										</tr>
									{% endfor %}
								{% else %}
									{% for dest in orden_entrega.get_destinos %}
										<tr>
											<td>
												<div class="text-center numeracion"></div>
											</td>
											<td>{{ dest.personadestino }}</td>
											<td>
												{{ dest.personadestino.direccion }}
											</td>
											<td>
												{{ dest.personadestino.celular }}
											</td>
											<td class="text-center"></td>
										</tr>
									{% endfor %}
								{% endif %}
							</tbody>
							{% if request.dusuario.rol == request.dusuario.TRANSPORTISTA or request.dusuario.rol == request.dusuario.ADMINISTRADOR or request.user.is_superuser %}
							<tfoot>
								<tr>
									<td colspan="10"><a class="btn btn-xs btn-flat" href="javascript:orden_entrega.detalles_destinos.agregarDetalle();"><i class="icon-plus-circle2"></i> Agregar Destino</a></td>
								</tr>
							</tfoot>
							{% endif %}
						</table>
					</div>
				</div>
				<!-- fin destinos -->
			</div>
		</div>
	</form>
<div class="row">
	<div class="col-sm-12">
		<br>
		<button class="btn btn-success btn-sm" onclick="registrarOrdenEntrega(this);"><span class="icon-floppy-disk text-size-base"></span> Guardar</button>
	</div>
</div>
{% endblock %}



{% block footer_js %}
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='base' folder='media' %}js/usuario.js?v={{settings.JS_VERSION}}"></script>
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/persona' folder='media' %}js/persona.js?v={{settings.JS_VERSION}}"></script>
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/persona' folder='media' %}js/persona_destino.js?v={{settings.JS_VERSION}}"></script>
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/transporte' folder='media' %}js/vehiculo.js?v={{settings.JS_VERSION}}"></script>
	<script type="text/javascript" src="{% url 'comextweb.helpers.utils.mediaurl' application='apps/frontend/logistica' folder='media' %}js/ordenentrega.js?v={{settings.JS_VERSION}}"></script>
	
	<script type="text/javascript">
		
		$(function(){

			clientefield = new ObjectField($('#id_cliente_id'));
			vehiculofield = new ObjectField($('#id_vehiculo_id'));
			choferfield = new ObjectField($('#id_chofer_id'));
			
			urlchoferfield = choferfield.dlgUrl;
			choferfield.dlgUrl = urlchoferfield + '&solo_activos=1&solo_disponible_sistema=1';
			
			urlvehiculofield = vehiculofield.dlgUrl;
			vehiculofield.dlgUrl = urlvehiculofield + '?solo_activos=1&solo_disponible_sistema=1';
			
			var data_detalle_destinos = {
				'templateDetalle': $('#dtemplate_destino'),
				'tableDetalle': $('#tdetalle_destino'),
				'prefixDetalle': 'template',
				'funcCompDetalle': DetalleOrdenEntregaForm.sonIguales,
				'klassDetalle': DetalleOrdenEntregaForm
			};

			orden_entrega = new RegistrarOrdenEntregaForm(data_detalle_destinos);
			
			$('#id_solo_pase_puerta').bind('click', mostrarInfoSoloPasePuerta);
			mostrarInfoSoloPasePuerta();
		});
		
		function mostrarInfoSoloPasePuerta(){
			
			id_cliente = null;
			id_vehiculo = null;
			id_chofer = null;
			
			{% if orden_entrega %}
				{% if orden_entrega.generada == True %}
					{% if orden_entrega.solo_pase_puerta == True %}
						id_cliente = 1;
						id_vehiculo = 1;
						id_chofer = 1;
					{% else %}
						id_cliente = '{{ orden_entrega.cliente }}';
						id_vehiculo = '{{ orden_entrega.vehiculo }}';
						id_chofer = '{{ orden_entrega.chofer }}';
					{% endif %}
				{% else %}
					id_cliente = '{{ orden_entrega.cliente }}';
					id_vehiculo = '{{ orden_entrega.vehiculo }}';
					id_chofer = '{{ orden_entrega.chofer }}';
				{% endif %}
			{% endif %}
			
			if( $('#id_solo_pase_puerta').is(':checked') ){
	            $('.solo_pase_puerta').hide();
	            $('.info_pase_puerta').show();
	        }else{
	            $('.solo_pase_puerta').show();
	            if(  id_cliente != 'None' && id_vehiculo != 'None' && id_chofer != 'None' ){
	            	$('.info_pase_puerta').show();
	            }else{
	            	$('.info_pase_puerta').hide();
	            }
	        }
		}
		
		function registrarOrdenEntrega(el){
			$(el).prop('disabled', true);
			$(el).html('<i class="icon-spinner4 text-size-base spinner"></i>&nbsp;Guardando...');
			document.forms.registrarOrdenEntregaForm.submit();
		}
		
	</script>
{% endblock %}