{% extends 'templates/app.twig' %}
{% block content %}

<div class="centro_cultural">
    <main>
        <div class="col-lg-12 section_inmuebles_banner section_noticias_banner background_" style="background-image:url({{ base_url() }}/images/inmobiliaria/portada.jpg)">
            <div class="ca_ content_item">
                <h2>CANAL DE GESTI&Oacute;N DE DENUNCIAS</h2>
            </div>
        </div>
    </main>

    <div class="col-lg-12 section_landing_second" style="background-color: #ffffff;">
        <div class="row section_home_eventos_i">
            <div class="col-lg-12">

                <div>
                    <div class="formulario_pink">

                        <form class="row" method="post" autocomplete="off" enctype="multipart/form-data" id="FormDenuncia" name="FormDenuncia" action="{{ base_url() }}/canal-denuncias/registrar">

                            <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                <h4>Canal de Gesti&oacute;n de Denuncias</h4>
                                <hr>
                                <p>
                                    Este canal permite presentar denuncias relacionadas con presuntos hechos irregulares,
                                    actos contrarios a las normas &eacute;ticas o conductas que afecten la integridad de la SBLM.
                                </p>
                                <h5>Proceso</h5>
                                <ul>
                                    <li><b>1.</b> Seleccionar el tipo de denuncia.</li>
                                    <li><b>2.</b> Registrar los datos solicitados, salvo denuncia an&oacute;nima.</li>
                                    <li><b>3.</b> Describir los hechos denunciados de forma clara y detallada.</li>
                                    <li><b>4.</b> Adjuntar pruebas sustentatorias, si corresponde.</li>
                                </ul>
                            </div>

                            <div class="col-lg-12 col-md-12 col-sm-12">
                                <hr>
                            </div>

                            <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                <h5>Tipo de denuncia</h5>
                            </div>

                            <div class="col-md-12" style="background: #f7f7f7;border: solid 1px #dedede;color: black;border-radius: 10px; padding-top: 15px;">
                                <div class="col-12 row">
                                    <label>1. Seleccione el tipo de denuncia</label>
                                </div>

                                <div class="col-12">
                                    <div class="col-4 form-group clearfix">
                                        <div class="icheck-primary d-inline">
                                            <input type="radio" id="denuncia_identificada" value="IDENTIFICADA" name="tipo_denuncia" checked>
                                            <label for="denuncia_identificada" style="font-size: 15px !important;font-weight: normal;">Denuncia identificada</label>
                                        </div>
                                    </div>

                                    <div class="col-4 form-group clearfix">
                                        <div class="icheck-success d-inline">
                                            <input type="radio" id="denuncia_anonima" value="ANONIMA" name="tipo_denuncia">
                                            <label for="denuncia_anonima" style="font-size: 15px !important;font-weight: normal;">Denuncia an&oacute;nima</label>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div id="datos_denunciante" class="col-md-12" style="background: #f7f7f7;border: solid 1px #dedede;color: black;border-radius: 10px; margin: 20px 0 20px 0; padding-top: 15px;">

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <h5>Datos del denunciante</h5>
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>2. Nombres y apellidos / Raz&oacute;n social</label>
                                    <input type="text" name="nombres_denunciante" id="nombres_denunciante" class="form-control formulario">
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>3. DNI, pasaporte, carn&eacute; de extranjer&iacute;a o RUC</label>
                                    <input type="text" name="documento_denunciante" id="documento_denunciante" class="form-control formulario">
                                </div>

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>4. Domicilio</label>
                                    <input type="text" name="domicilio" id="domicilio" class="form-control formulario">
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>5. Tel&eacute;fono o celular</label>
                                    <input type="text" name="telefono" id="telefono" class="form-control formulario">
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>6. Correo electr&oacute;nico</label>
                                    <input type="email" name="correo" id="correo" class="form-control formulario">
                                </div>

                            </div>

                            <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                <h5>Contenido de la denuncia</h5>
                            </div>

                            <div class="col-md-12" style="background: #f7f7f7;border: solid 1px #dedede;color: black;border-radius: 10px; padding-top: 15px;">

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>7. Nombre y cargo de los colaboradores comprendidos en los hechos</label>
                                    <textarea name="colaboradores_involucrados" id="colaboradores_involucrados" class="form-control formulario" rows="3"></textarea>
                                </div>

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>8. Presuntas irregularidades denunciadas</label>
                                    <textarea name="hechos_denunciados" id="hechos_denunciados" class="form-control formulario obligate" rows="5" data-content="Debe describir los hechos denunciados."></textarea>
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>9. Fecha aproximada en la que ocurrieron los hechos</label>
                                    <input type="date" name="fecha_hechos" id="fecha_hechos" class="form-control formulario">
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>10. Lugar o &aacute;rea de los hechos</label>
                                    <input type="text" name="lugar_hechos" id="lugar_hechos" class="form-control formulario">
                                </div>

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>11. Pruebas sustentatorias</label>
                                    <p class="mb-2">Puede adjuntar documentos, im&aacute;genes u otros medios probatorios.</p>
                                    <input type="file" name="pruebas[]" id="pruebas" class="form-control" multiple>
                                </div>

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>12. Testigo(s)</label>
                                    <textarea name="testigos" id="testigos" class="form-control formulario" rows="3"></textarea>
                                </div>

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>13. Observaci&oacute;n</label>
                                    <textarea name="observacion" id="observacion" class="form-control formulario" rows="3"></textarea>
                                </div>

                            </div>

                            <div class="col-lg-12 col-md-12 col-sm-12 form-group" style="margin-top: 25px;">
                                <h5>Medidas de protecci&oacute;n</h5>
                            </div>

                            <div class="col-md-12" style="background: #f7f7f7;border: solid 1px #dedede;color: black;border-radius: 10px; padding-top: 15px;">

                                <div class="col-lg-12 form-group">
                                    <input type="checkbox" id="solicita_proteccion" name="solicita_proteccion" value="1">
                                    <label for="solicita_proteccion">Solicito medidas de protecci&oacute;n</label>
                                </div>

                                <div class="col-lg-6 col-md-12 col-sm-12 form-group">
                                    <label>14. Tipo de medida de protecci&oacute;n</label>
                                    <select name="tipo_proteccion" id="tipo_proteccion" class="form-control formulario">
                                        <option value="">Seleccione una opci&oacute;n</option>
                                        <option value="RESERVA DE IDENTIDAD">Reserva de identidad</option>
                                        <option value="MEDIDAS DE PROTECCION LABORAL">Medidas de protecci&oacute;n laboral</option>
                                        <option value="OTRA MEDIDA">Otra medida de protecci&oacute;n</option>
                                    </select>
                                </div>

                                <div class="col-lg-12 col-md-12 col-sm-12 form-group">
                                    <label>15. Sustento de la medida solicitada</label>
                                    <textarea name="sustento_proteccion" id="sustento_proteccion" class="form-control formulario" rows="4"></textarea>
                                </div>

                                <div class="col-lg-12 form-group">
                                    <input type="checkbox" id="declaracion" name="declaracion" value="1" class="checked" data-content="Debe aceptar la declaraci&oacute;n.">
                                    <label for="declaracion">
                                        Declaro que la informaci&oacute;n registrada es veraz y autorizo su uso para la atenci&oacute;n de la denuncia.
                                    </label>
                                </div>

                                <div class="col-lg-12 form-group">
                                    <div class="msg"></div>
                                </div>

                                <div class="col-lg-12 form-group">
                                    <button type="submit" id="registrardenuncia" class="btn btn_default next_">ENVIAR DENUNCIA</button>
                                </div>

                                {{ csrf.field | raw }}

                            </div>

                        </form>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

<script>
    $('#denuncia_anonima').on('click', function() {
        $('#datos_denunciante').hide();
    });

    $('#denuncia_identificada').on('click', function() {
        $('#datos_denunciante').show();
    });
</script>

{% endblock content %}