{% load thumbnail %}
<div class="panel panel-white {% if informe or not detalle_envio.es_inspeccionable %}panel-collapsed{% endif %}">
	<div class="panel-heading pt-10 pb-10">
		<h6 class="panel-title">
			{% if not informe %}
				<span class="icon-circle"></span>
			{% else %}
				<span class="text-success icon-checkmark-circle"></span>
			{% endif %}
			Informe
		</h6>
		<div class="heading-elements">
			<ul class="icons-list">
            	<li>
	            	{% if not detalle_envio.es_inspeccionable %}
	            		<span class="label label-danger">no aplica inspeccion</span>
	           		{% else %}
	            		{% if not informe %}
	            		<span class="label label-default">pendiente</span>
	            		{% else %}
		            		{% if informe.estado == 'E' %}
	            			<span class="label label-default">en curso</span>
		            		{% elif informe.estado == 'F' %}
	            			<span class="label label-success">finalizado</span>
		            		{% endif %}
	            		{% endif %}
	           		{% endif %}
            	</li>
            	<li><a data-action="collapse"></a></li>
        	</ul>
       	</div>
	<a class="heading-elements-toggle"><i class="icon-menu"></i></a></div>
	<div class="panel-body">
	{% if detalle_envio.es_inspeccionable %}
		<form action="" method="post">
		{% csrf_token %}
		{{ form.id }}{{ form.errors.id }}
		{{ form.non_field_errors }}
		<input id="id_informe" type="hidden" name="informe" value="{{ form.data.id }}" />
		<div class="row">
			<div class="col-sm-4">
				<label>Fecha Inicio</label>
				{{ form.fecha_inicio }}
				{{ form.errors.fecha_inicio }}
			</div>
			<div class="col-sm-2">
				<label>Cuadrilla</label><br/>	
				{{ form.cuadrilla }}
				{{ form.errors.cuadrilla }}
			</div>
			<div class="col-sm-2">
				<label>Observado</label><br/>
				{{ form.observado }}
				{{ form.errors.observado }}
			</div>
		</div>
		<div class="row">
			<div class="col-sm-6">
				<label>Contenido</label>
				{{ form.contenido }}
				{{ form.errors.contenido }}
			</div>
			<div class="col-sm-6 class_observado">
				<label>Observaciones</label>
				{{ form.observaciones }}
				{{ form.errors.observaciones }}
			</div>
		</div>
		<div class="">
			<br />
			<button type="submit" class="btn btn-success btn-sm btn-ladda btn-ladda-progress" data-style="slide-right" data-spinner-size="20"><span class="ladda-label"><i class="icon-floppy-disk"></i> Registrar Informe</span></button>
			{% if detalle_envio and not informe %}
				{% if detalle_envio.es_inspeccionable %}
				<a href="{% url 'no_aplica_detalleenvio' detalle_envio.id %}?no_aplica=1&inspeccion={{ inspeccion.id }}&detalle={{ detalle_envio.id }}" class="btn btn-primary btn-sm btn-ladda btn-ladda-progress" data-style="slide-right" data-spinner-size="20"><span class="ladda-label"><i class="icon-minus-circle2"></i> No Aplica Inspecci&oacute;n</span></a>
				{% endif %}
			{% endif %}
		</div>
	</form>
	{% else %}
	<a href="{% url 'no_aplica_detalleenvio' detalle_envio.id %}?aplica=1&inspeccion={{ inspeccion.id }}&detalle={{ detalle_envio.id }}" class="btn btn-primary btn-sm btn-ladda btn-ladda-progress" data-style="slide-right" data-spinner-size="20"><span class="ladda-label"><i class="icon-checkmark-circle"></i> Aplica Inspecci&oacute;n</span></a>
	{% endif %}
	</div>
</div>
<h4>Actividades</h4>
{% if informe %}
	<div class="panel-group panel-group-control panel-group-control-right content-group-lg" id="accordion-control-right">
		{% for a in actividades %}
		<div class="panel panel-white">
			<div class="panel-heading pt-10 pb-10">
				<h6 class="panel-title">
					<a class="collapsed" data-toggle="collapse" data-parent="#accordion-control-right" href="#accordion-control-right-group{{ a.orden }}">
						<span class="badge bg-slate">{{ a.orden }}</span>
						{{ a.nombre }}
						<span class="text-muted text-size-small">({{ a.get_label_minimo_fotos }})</span>
						<!-- <span class="icon-checkmark-circle text-size-small text-success"></span> -->
					</a>
				</h6>
			</div>
			<div id="accordion-control-right-group{{ a.orden }}" class="panel-collapse collapse">
				<div class="panel-body">
					<div class="">
						{% if informe.estado != 'F' or request.user.is_superuser %}
						<span class="btn btn-success btn-sm fileinput-button"> <i class="icon-plus3"></i> <span>Agregar Foto</span> <!-- The file input field used as target for the file upload widget -->
							<input class="cont-upload" type="file" name="file_cont" multiple="multiple" data-actividad="{{ a.id }}" />
						</span>&nbsp;
						{% endif %}
					</div><br />
					<div class="table-responsive">
						<table class="table table-striped table-condensed files">
							{% for img in imagenes_informe %}
								{% if a.id == img.actividad.id %}
								<tr id="tr_{{img.imagen.id}}" data-actividad="{{ a.id }}">
									<td width="100">
										<a target="_blank" href="{{ img.imagen.path.url }}" data-popup="lightbox" rel="group" title="Actividad {{ a.orden }}: {{ a.nombre }}">
											<img alt="{{ img.imagen.path.name }}" src="{% thumbnail img.imagen.path 140x100 crop %}">
										</a>
										<input type="hidden" class="id_detalle_actividad" name="id_detalle_actividad" value="comp:{{ a.id }},{{ informe.id }},{{ img.imagen.id }}" />
									</td>
									<td width="300">
										<label>Observaciones</label>
										<textarea id="observacion_{{ img.imagen.id }}" class="form-control descripcion" name="descripcion" required="">{{ img.imagen.observacion }}</textarea>
										<input type="hidden" name="tipo" value="carga">
									</td>
									<td class="vert-align text-center" width="200">
										<button class="btn btn-success btn-sm" onclick="actualizarActividadDetalle(this, {{ img.imagen.id }})">Actualizar</button>&nbsp;<button class="btn btn-sm btn-danger" onclick="eliminarActividadDetalle(this, {{ img.imagen.id }})"><i class="icon-trash"></i></button><br>
										<div class="progress" style="display: none;">
											<div class="progress-bar progress-bar-success" style="width: 100%;"></div>
										</div>
									</td>
								</tr>
								{% endif %}
							{% endfor %}
						</table>
					</div>
				</div>
			</div>
		</div>
		{% endfor %}
	</div>
	<div id="id_firmas_todos" class="{% if not informe.verificar_imagenes_actividad %}hide{% endif %}">
		<h4>Firmas</h4>
		<div class="row">
			<div class="col-sm-4">
				<button type="button" class="btn {% if informe.firma_bodega %} btn-primary {% else %} btn-default {% endif %}" data-toggle="modal" data-target="#modal-firma" data-keyboard="false" data-backdrop="static" data-informe="{{ informe.id }}" data-firma="bodega" data-url="{% if informe.firma_bodega %}/media/{{ informe.firma_bodega }}{% endif %}">
					<span class="glyphicon {% if informe.firma_bodega %}glyphicon-ok-sign {% else %} glyphicon-record {% endif %}"></span>&nbsp;Delegado Bodega
				</button>
			</div>
			<div class="col-sm-4">
				<button type="button" class="btn {% if informe.firma_inspector %} btn-primary {% else %} btn-default {% endif %}" data-toggle="modal" data-target="#modal-firma" data-keyboard="false" data-backdrop="static" data-informe="{{ informe.id }}" data-firma="inspector" data-url="{% if informe.firma_inspector %}/media/{{ informe.firma_inspector }}{% endif %}">
					<span class="glyphicon {% if informe.firma_inspector %} glyphicon-ok-sign {% else %} glyphicon-record {% endif %}"></span>&nbsp;Inspector Comextgando
				</button>
			</div>
			<div class="col-sm-4">
				<button type="button" class="btn {% if informe.firma_aduana %} btn-primary {% else %} btn-default {% endif %}" data-toggle="modal" data-target="#modal-firma" data-keyboard="false" data-backdrop="static" data-informe="{{ informe.id }}" data-firma="aduana" data-url="{% if informe.firma_aduana %}/media/{{ informe.firma_aduana }}{% endif %}">
					<span class="glyphicon {% if informe.firma_aduana %} glyphicon-ok-sign {% else %} glyphicon-record {% endif %}"></span>&nbsp;Funcionario Aduana
				</button>
			</div>
		</div>
	</div>
	<hr />
	{% if informe.estado != informe.FINALIZADO  %}
		{% if informe.verificar_firmas %}
			<a href="{% url 'finalizar_informe' informe.id %}" class="btn btn-success btn-sm btn-ladda btn-ladda-progress" data-style="slide-right" data-spinner-size="20"><span class="ladda-label"><i class="icon-checkmark3"></i> Finalizar Informe</span></a>
		{% else %}
			<a href="javascript:void();" class="btn btn-default btn-sm disabled"><i class="icon-checkmark3"></i> Finalizar Informe</a>&nbsp;&nbsp;<span class="text-muted text-size-small">Requiere que se completen todas las firmas.</span>
		{% endif %}
	{% endif %}
{% else %}
	<h6 class="text-muted"><span class="icon-info22"></span> Debe registrar el informe para proceder con las actividades.</h6>
{% endif %}