{% extends 'registro/base_sidebar.html' %}
{% load crispy_forms_tags %}
{% load static %}
{% block content %}

    <script src="{% static 'registrar/ensayos.js'%}" type="text/javascript"></script>

    <!-- Breadcrumb -->
    <br>
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{% url 'prevalidados' %}">Inicio</a></li>
            <li class="breadcrumb-item active" aria-current="page">Ensayo</li>
        </ol>
    </nav>

    <!-- Encabezado -->
    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
        <h1 class="h2">Datos del Ensayo Prevalidado</h1>
    </div>

    <!-- Contenido -->
    <div>
        <p>
            <b>Modalidad: </b>{{ ensayo.get_modalidad_display }}<br>
            <b>Título: </b>{{ ensayo.titulo }}<br>
            {% for autor in autores %}
                {% if autores.count > 1%}
                    <b>Autor {{ forloop.counter }}: </b>{{ autor.nombre }} {{ autor.apellido_paterno }} {{ autor.apellido_materno }}<br>
                {% else %}
                    <b>Autor: </b>{{ autor.nombre }} {{ autor.apellido_paterno }} {{ autor.apellido_materno }}<br>
                {% endif %}
                
                <b>Telefono: </b>{{ autor.telefono }}<br>
                <b>Correo: </b>{{ autor.correo }}<br>
                <b>Domicilio: </b>{{ autor.calle }} #{{ autor.numero }}, {{ autor.colonia }}, {{ autor.municipio }}, {{ autor.get_estado_display }}<br>
            {% endfor %}
            <br>
            <b>Documento Ensayo: </b>{% if ensayo.documento_ensayo %}<a href="#" id="show-ensayo" url="{{ ensayo.documento_ensayo.url }}" class="btn btn-info btn-sm editar-modal mb-1" data-toggle="tooltip" data-bs-placement="top" title="Ver Documento"><span data-feather="eye"></span></a> <a href="../..{{ ensayo.documento_ensayo.url }}" target="_blank">Abrir Archivo</a>{% endif %}<br>
            <b>Documento Credencial: </b>{% if ensayo.documento_credencial %}<a href="#" id="show-credencial" url="{{ ensayo.documento_credencial.url }}" class="btn btn-info btn-sm editar-modal" data-toggle="tooltip" data-bs-placement="top" title="Ver Documento"><span data-feather="eye"></span></a> <a href="../..{{ ensayo.documento_credencial.url }}" target="_blank">Abrir Archivo</a>{% endif %}<br>
            <b>Documento Cesión: </b>{% if ensayo.documento_cesion %}<a href="#" id="show-cesion" url="{{ ensayo.documento_cesion.url }}" class="btn btn-info btn-sm editar-modal mb-1 " data-toggle="tooltip" data-bs-placement="top" title="Ver Documento"><span data-feather="eye"></span></a> <a href="../..{{ ensayo.documento_cesion.url }}" target="_blank">Abrir Archivo</a>{% endif %}<br>
            <b>Documento Protesta: </b>{% if ensayo.documento_protesta %}<a href="#" id="show-protesta" url="{{ ensayo.documento_protesta.url }}" class="btn btn-info btn-sm editar-modal mb-1 " data-toggle="tooltip" data-bs-placement="top" title="Ver Documento"><span data-feather="eye"></span></a> <a href="../..{{ ensayo.documento_protesta.url }}" target="_blank">Abrir Archivo</a>{% endif %}<br>
        </p>
        <p style="float: right;">
            <a href="#" id="remove-doc" class="btn btn-danger btn-sm editar-modal" data-toggle="tooltip" data-bs-placement="top" title="Ocultar Documento"><span data-feather="eye"></span></a>
        </p>
    </div>
    
    <div id="frames" class="mb-2">
        
    </div>

    
        
    {{ form.media }}

    <form method="post" action="{% url 'incompletar' ensayo.pk %}" id="incompletar-form" autocomplete="off" enctype="multipart/form-data">
        {% csrf_token %}
        {{ form|crispy }}

        <div id="incomplete-reason" class="form-group mb-4">
            <label for="">Motivo para marcar como incompleto</label>
            <textarea class="form-control" name="motivo" id="motivo" rows="7" required></textarea>
        </div>
        
        <div class="position-relative mb-4">
            <br>
            <div id="main-buttons" class="btn-group position-absolute top-50 start-50 translate-middle" role="group">
                <a href="{% url 'prevalidados' %}" class="btn btn-outline-secondary">Cancelar</a>
                <a href="{% url 'validar' ensayo.pk %}" id="btn-validar" class="btn btn-success">Validar</a>     
                {% if ensayo.estatus == 0 %} 
                        <a href="#incomplete-reason" id="btn-incompletar" class="btn btn-danger">Incompleto</a>
                {% endif %}
            </div>
            <div id="secondary-buttons" class="btn-group position-absolute top-50 start-50 translate-middle" role="group">
                <a href="#" id="btn-cancel" class="btn btn-outline-secondary">Cancelar</a>
                {% if ensayo.estatus == 0 %} 
                    <button type="submit" id="submit" class="btn btn-danger">Enviar Notificación</button>
                {% endif %}
            </div>
        </div>
    </form>
{% endblock %}