<?php

    session_start();

    if(empty($_SESSION['login_appquadrata'])){

        echo"<script language='javascript'>window.location='/appquadrata/login'</script>;";

        exit();

    }

?>

<!DOCTYPE html>

<?php

/*inicializamos valores para la configuracion del template*/

$setting_template='../../../settings_template.txt';

$variables=[];

$_Color='';

$_Template='';

$_Theme_Template='';

$_Css='';

$_Js='';

$_Css_Version='';

$_Js_Version='';

if (file_exists($setting_template)) {

    $lines = file($setting_template, FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);

    foreach ($lines as $line) {

        list($nombre_variable, $valor) = explode('=', $line);

        $variables[$nombre_variable] = $valor;

    }

    /*recogemos los valores de las variables*/

    if (isset($variables['Color'])) {

        $_Color = $variables['Color'];



        //echo "El color es: $_Color";

    }

    if (isset($variables['Template'])) {

        $_Template = $variables['Template'];

        //echo "El Template es: $_template";

    }

    if (isset($variables['Theme_Template'])) {

        $_Theme_Template = $variables['Theme_Template'];

        //echo "El Theme_Template es: $_Theme_Template";

    }

    if (isset($variables['css'])) {

        $_Css = $variables['css'];

        //echo "El css es: $_Css";

    }

    if (isset($variables['js'])) {

        $_Js = $variables['js'];

        //echo "El js es: $_Js";

    }

    if (isset($variables['Rows_Columns'])) {

        $_Rows_Columns = $variables['Rows_Columns'];

    }else{

        $_Rows_Columns=4;

    }

    if (isset($variables['css_version'])) {

        $_Css_Version = $variables['css_version'];

        //echo "El css es: $_Css";

    }

    if (isset($variables['js_version'])) {

        $_Js_Version = $variables['js_version'];

        //echo "El js es: $_Js";

    }

}

/*terminan valores de configuracion pára el template*/

?>

<html  style="background-color: rgb(241, 245, 249);" lang="es" class="<?php if($_Color!=''){ echo 'theme-user'; }else{ echo $_Theme_Template; }?>">

<meta http-equiv='Content-Type' content='text/html; charset=ISO-8859-1'>

<meta name='description' content='Información sobre contenido de tu pagina'>

<meta name='keywords' content='aqui van los tags para ser encontrados por los boots de google ejemplo fibora,ti hyper solutions'>

<meta charset="UTF-8" />

<HEAD>



<?php

    //Declaramos la variable time, para que al modificar un archivo, este no se guarde en cache y se vizualicen los cambios

    $time_log_assets=time();

    include('../../path.php');

    //require('../modelo/catalogo_estado_civil.php');

    require(ROOT_CONTROLLER.'catalogo_estado_civil.php');

    $Obj_catalogo_estado_civil = new catalogo_estado_civil(); 

?>



    <!---<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">---><!--se agrego esta dependencia para los iconos de lado izquierdo en los inputs-->

    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js'></script>

    <meta name="viewport" content="width=device-width,initial-scale=1">

    <!-- BEGIN: CSS Assets-->

    <link rel="stylesheet" href="../../../dist/css/<?=$_Css;?>?dummy=<?=$_Css_Version;?>" />

    <!-- END: CSS Assets-->

    <link rel="stylesheet" href="../../../dist/css/input_file.css?dummy=<?=$_Css_Version;?>" />

    <script src="../../../dist/js/noback.js?dummy=<?=$_Css_Version;?>" type="text/javascript"></script>

    <!--Comienza plugins JTABLE--->

    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

    <!--Termina plugins JTABLE--->

    <!---llamamos la libreria de tinymce--->

    <script defer src="../../../dist/tinymce/tinymce/main.js?dummy=<?=$_Js_Version;?>"></script>

    <link rel="stylesheet" href="../../../dist/tinymce/tinymce/estilos.css?dummy=<?=$_Css_Version;?>" />

    <script src="../../../dist/tinymce/tinymce/tinymce.min.js?dummy=<?=$_Js_Version;?>" referrerpolicy="origin"></script>

    <!---Terminamos de agregar editor tinymce--->

    <!-- Cropper.js CSS -->
    <link href="../../../dist/css/cropper.min.css?dummy=<?=$_Js_Version;?>" rel="stylesheet"/>

    <!---incluimos dependencias para el select con buscador-->

    <script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>

    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />

    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

    <link rel="stylesheet" href="../../../dist/css/app_style.css?dummy=<?=$_Css_Version;?>" />

    <!--termina dependencias para el select con buscador--->

        

<?php



$action=!empty($_REQUEST['action'])?$_REQUEST['action']:'';

$_ScrollTo=!empty($_REQUEST['_ScrollTo'])?$_REQUEST['_ScrollTo']:'';

$_Buscar=!empty($_REQUEST['_Buscar'])?$_REQUEST['_Buscar']:'';

$_Action = $_Buscar!='' ? 'buscar' : '';

$_Pagina=!empty($_REQUEST['pagina'])?$_REQUEST['pagina']:'';

//DECLARAMOS VARIABLES PARA LA RELACION CON ENTIDAD PADRE
$_Clausula_Fk=!empty($_REQUEST['_Clausula_Fk'])?$_REQUEST['_Clausula_Fk']:'';

$_IdFk=!empty($_REQUEST['_IdFk'])?$_REQUEST['_IdFk']:'';

//DECLARAMOS VARIABLES PARA LA RELACION CON ENTIDAD BISABUELO
$_B_Clausula_Fk=!empty($_REQUEST['_B_Clausula_Fk'])?$_REQUEST['_B_Clausula_Fk']:'';

$_B_IdFk=!empty($_REQUEST['_B_IdFk'])?$_REQUEST['_B_IdFk']:'';

//DECLARAMOS VARIABLES PARA LA RELACION CON ENTIDAD ABUELO
$_A_Clausula_Fk=!empty($_REQUEST['_A_Clausula_Fk'])?$_REQUEST['_A_Clausula_Fk']:'';

$_A_IdFk=!empty($_REQUEST['_A_IdFk'])?$_REQUEST['_A_IdFk']:'';

$Id_Catalogo_Estado_Civil=!empty($_REQUEST['Id_Catalogo_Estado_Civil'])?$_REQUEST['Id_Catalogo_Estado_Civil']:'';
$Estado_Civil='';
$Fecha_De_Registro='';
$Usuario_Que_Registra='';
$Fecha_De_Modificacion='';
$Usuario_Que_Modifico='';


switch ($action) {

    case 'editar':
        $_Case_Consult='Editar_Columna';
        echo"<TITLE>Editar catalogo estado civil</TITLE>";
        break;

    default:
        $_Case_Consult='Registrar_Columna';
        echo"<TITLE>Registrar catalogo estado civil</TITLE>";
        break;

}



require_once(ROOT_CHARACTER_FIX);

$Obj_fix_characters = new fix_characters();

require_once(ROOT_CONTROLLER.'catalogo_estado_civil.php');

$Obj_catalogo_estado_civil = new catalogo_estado_civil();//para los datos del formulario

$Obj_catalogo_estado_civil2 = new catalogo_estado_civil();//para los datos del paginador


$isMobile = preg_match('/(iPhone|iPad|iPod|Android)/i', $_SERVER['HTTP_USER_AGENT']);

//lee las variables del formulario.

if (!empty($_POST))

{

    /*require_once(ROOT_CONFIG);      

    $Odbj_conexion = new odbconexion;

    $conexion=$Odbj_conexion->openconection();

    $consulta="SELECT * FROM catalogo_estado_civil WHERE Id_Catalogo_Estado_Civil='$Id_Catalogo_Estado_Civil' ORDER BY Id_Catalogo_Estado_Civil DESC";

    $Array_adapter_catalogo_estado_civil=$conexion->query($consulta);

    $conexion->close();*/

    $Array_adapter_catalogo_estado_civil=$Obj_catalogo_estado_civil->getbyid_catalogo_estado_civil($Id_Catalogo_Estado_Civil);

    while($field_catalogo_estado_civil=$Array_adapter_catalogo_estado_civil->fetch_assoc())

    {

    $Estado_Civil=$field_catalogo_estado_civil['Estado_Civil'];
   $Fecha_De_Registro=$field_catalogo_estado_civil['Fecha_De_Registro'];
   $Usuario_Que_Registra=$field_catalogo_estado_civil['Usuario_Que_Registra'];
   $Fecha_De_Modificacion=$field_catalogo_estado_civil['Fecha_De_Modificacion'];
   $Usuario_Que_Modifico=$field_catalogo_estado_civil['Usuario_Que_Modifico'];
   

    }

}?>    



<?php  

    $row_registers=0;

    $arreglo_registers = array();

    /*$Odbj_conexion = new odbconexion;

    $conexion=$Odbj_conexion->openconection();

    $consulta="SELECT * FROM catalogo_estado_civil ORDER BY Id_Catalogo_Estado_Civil ASC";

    $Array_adapter_catalogo_estado_civil_registers=$conexion->query($consulta);

    $conexion->close();*/

    $Array_adapter_catalogo_estado_civil_registers=$Obj_catalogo_estado_civil2->get_catalogo_estado_civil_paginador_frm();

    $rows_registers=$Array_adapter_catalogo_estado_civil_registers->num_rows;

    while($field_catalogo_estado_civil_register=$Array_adapter_catalogo_estado_civil_registers->fetch_assoc())

    {

        $row_registers++;

        array_push($arreglo_registers, array("id" => $field_catalogo_estado_civil_register['Id_Catalogo_Estado_Civil'], "numero" => $row_registers));

   

    }

    //permisos de columnas para usuarios no admin
    $Rol_Usuario_Logued_App=$_SESSION['Rol_appquadrata'];
    $Id_Modulo_Fk_En_Modulo_App=0;
    $columnasConPermiso = [];
    try{  
        $Odbj_conexion = new odbconexion;
        $conexion=$Odbj_conexion->openconection();
        $consulta="SELECT p.Id_Permiso_App,p.Id_Fk_Rol,p.Id_Modulo_Fk,p.Registrar,p.Leer,p.Editar,p.Eliminar,p.Exportar,m.Id_Modulo_App,m.Titulo_Modulo,m.Descripcion_Modulo,m.Tipo_Menu,m.Href_Modulo,m.Tipo_Enlace,m.Icon_Fa_Modulo FROM permiso_app_appquadrata p JOIN modulo_app_appquadrata m ON Id_Modulo_Fk=Id_Modulo_App WHERE Id_Fk_Rol='$Rol_Usuario_Logued_App' AND Leer='Si' ORDER BY Id_Permiso_App DESC ";
        $Array_adapter_permiso_modulo=$conexion->query($consulta);
        while($Field_Permiso_Modulo=$Array_adapter_permiso_modulo->fetch_assoc())
        {
            $Id_Modulo_Fk_En_Modulo_App=$Field_Permiso_Modulo['Id_Modulo_Fk'];
        }

        $consulta_columna="SELECT p.Id_Fk_Rol,m.Id_Modulo_App,p.Titulo_Columna,p.Leer_Columna,p.Registrar_Columna,p.Editar_Columna FROM permiso_columna_appquadrata p JOIN modulo_app_appquadrata m ON Id_Modulo_Fk=Id_Modulo_App WHERE Id_Fk_Rol='$Rol_Usuario_Logued_App' AND $_Case_Consult='Si' AND Id_Modulo_Fk='$Id_Modulo_Fk_En_Modulo_App'";
        $Array_adapter_permiso_columna=$conexion->query($consulta_columna);
        $conexion->close();
        while($Field_Permiso_columna=$Array_adapter_permiso_columna->fetch_assoc())
        {
            $columnasConPermiso[] = $Field_Permiso_columna['Titulo_Columna'];
        }

    }catch (Exception $e) {

        echo 'Excepcion capturada: ',  $e->getMessage(), "";

    }

?> 

<script language='JavaScript'> 

var statSend = false;

function checkSubmit() {

    if (!statSend) {

        statSend = true;

        return true;

    } else {

        alert('La Informaci\u00F3n ya se est\u00E1 enviando, por favor espere...');

        return false;

    }

}

</script> 

<style>

     ::-webkit-scrollbar {

        display: none;

    }



</style>

</HEAD>

    <center>

    <BODY onload="noback();">

  <?php

    //Comienza form del formulario

echo "<div class='intro-y box form-box'>";

    

    switch ($action) {

    case 'editar':

        echo "

            <div class='flex items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400'>

                <h2 class='font-medium text-base mr-auto'>

                    EDITAR CATALOGO ESTADO CIVIL

                </h2>";

            if($rows_registers>1){

                foreach ($arreglo_registers as $elemento) {

                    if ($elemento["id"] === $Id_Catalogo_Estado_Civil) {

                        $numeroEncontrado = $elemento["numero"];

                        break; // Detén el bucle una vez que se encuentre el elemento

                    }

                }

                echo "<p class='mr-3'>".$numeroEncontrado."/".$rows_registers."</p>";



                if($numeroEncontrado>1){

                    $registerPrev=$numeroEncontrado-1;

                    

                    foreach ($arreglo_registers as $elemento) {

                        if ($elemento["numero"] === $registerPrev) {

                            $idEncontradoPrev = $elemento["id"];

                            break; // Detén el bucle una vez que se encuentre el elemento

                        }

                    }

                    echo "<form action='./formulario.php' method='Post' onsubmit='loadingpage();'>

                        <input type='hidden' value='$idEncontradoPrev' name='Id_Catalogo_Estado_Civil'>

                        <input name='action' value='editar' type='hidden'>

                        <button type='submit' class='btn-navigation-registers'><svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' icon-name='chevron-left' data-lucide='chevron-left' class='lucide chevron-left w-6 h-6 mr-1 mt-1'><path d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'></path><circle cx='12' cy='12' r='3'></circle></svg></button>

                    </form>";

                }



                if($numeroEncontrado<$row_registers){

                    $registerNext=$numeroEncontrado+1;

                    

                    foreach ($arreglo_registers as $elemento) {

                        if ($elemento["numero"] === $registerNext) {

                            $idEncontradoNext = $elemento["id"];

                            break; // Detén el bucle una vez que se encuentre el elemento

                        }

                    }

                    echo "<form action='./formulario.php' method='Post' onsubmit='loadingpage();'>

                        <input type='hidden' value='$idEncontradoNext' name='Id_Catalogo_Estado_Civil'>

                        <input name='action' value='editar' type='hidden'>

                        <button type='submit' class='btn-navigation-registers'><svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' icon-name='chevron-right' data-lucide='chevron-right' class='lucide chevron-right w-6 h-6 mr-1 mt-1'><path d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'></path><circle cx='12' cy='12' r='3'></circle></svg></button>

                    </form>";

                }

            }

        echo "</div>";

        break;

    

    default:

        echo"

            <div class='flex items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400'>

                <h2 class='font-medium text-base mr-auto'>

                    REGISTRAR CATALOGO ESTADO CIVIL

                </h2>

            </div>";

        break;

    }



    switch($_Rows_Columns){

        case 1:

        $cols_columns=12;

        break;

        case 2:

        $cols_columns=6;

        break;

        case 3:

        $cols_columns=4;

        break;

        case 4:

        $cols_columns=3;

        break;

        default:

        $cols_columns=12;

        break;



    }



    echo "<div class='p-5'>

            <form name='registrar'onsubmit='loadingpage();return checkSubmit();' action='../bussines/guardar.php' method='Post' enctype='multipart/form-data'>      

            <div class='grid grid-cols-12 gap-x-5'>

                <div class='col-span-12 xl:col-span-12'>";

                    echo "<input type='hidden' name='_ScrollTo' value='$_ScrollTo'>";

                    echo "<input type='hidden' name='_Pagina' value='$_Pagina'>";

                    echo "<input type='hidden' name='Id_Catalogo_Estado_Civil' value='$Id_Catalogo_Estado_Civil'>";

                    echo "<div class='grid grid-cols-12 gap-x-5'>";

                      echo " 

                                <div class='mt-3  col-span-12 lg:col-span-$cols_columns xl:col-span-$cols_columns' ".(($Rol_Usuario_Logued_App <= 2) || (in_array('Estado_Civil', $columnasConPermiso) && $Rol_Usuario_Logued_App > 2) ? "" : "style='display:none;'").">

                                    <label for='update-profile-form-7' class='form-label'>Estado Civil: </label>

                                   <input id='Estado_Civil' name='Estado_Civil' value='$Estado_Civil' type='text' class='form-control'  placeholder='Estado Civil' >

                                </div>";
                                                   

echo "          

                   </div><!---Este div cierra el grid para los campos del formulario -->     

                </div>

            </div>";


        //Datos que vamos a mantener en cualquier situacion 
            $params = [];
            if (!empty($_Clausula_Fk))   $params[] = '_Clausula_Fk=' . urlencode($_Clausula_Fk);
            if (!empty($_IdFk))          $params[] = '_IdFk=' . urlencode($_IdFk);
            if (!empty($_A_Clausula_Fk)) $params[] = '_A_Clausula_Fk=' . urlencode($_A_Clausula_Fk);
            if (!empty($_A_IdFk))        $params[] = '_A_IdFk=' . urlencode($_A_IdFk);
            if (!empty($_B_Clausula_Fk)) $params[] = '_B_Clausula_Fk=' . urlencode($_B_Clausula_Fk);
            if (!empty($_B_IdFk))        $params[] = '_B_IdFk=' . urlencode($_B_IdFk);
            
            // Parámetros obligatorios
            $params[] = 'action=' . urlencode($_Action);
            $params[] = 'buscar=' . urlencode($_Buscar);
            $params[] = 'pagina=' . urlencode($_Pagina);
            $params[] = '_Id_Registro=' . urlencode($Id_Catalogo_Estado_Civil);
            $params[] = '_ScrollTo=' . urlencode($_ScrollTo);
            // Construcción de la URL
            $_Url_Param = './?' . implode('&', $params);

         switch ($action) {

            case 'editar':
            
            echo "<div class='flex justify-end mt-4'>
                    <input type='hidden' name='action' value='editar'>
                    <a href='$_Url_Param' class='btn btn-danger flex items-center w-20 mr-auto'> Cancelar</a>
                    <button type='submit' class='btn btn-primary'>Guardar</button>
                </div>";
            break;

            case 'duplicar':
            
            echo "<div class='flex justify-end mt-4'>
                    <input type='hidden' name='action' value='duplicar'>
                    <a href='$_Url_Param' class='btn btn-danger flex items-center w-20 mr-auto'> Cancelar</a>
                    <button type='submit' class='btn btn-primary'>Guardar</button>
                </div>";
            break;

            default:
            
            echo "<div class='flex justify-end mt-4'>
                    <input type='hidden' name='action' value='registrar'>
                    <a href='$_Url_Param' class='btn btn-danger flex items-center w-20 mr-auto'> Cancelar</a>
                    <button type='submit' class='btn btn-primary'>Guardar</button>
                </div>";
            break;

        }                

echo "
        <!-- Campos para la relacion con entidad padre -->
        <input type='hidden' name='_IdFk' value='$_IdFk'>
        <input type='hidden' name='_Clausula_Fk' value='$_Clausula_Fk'>

        <!-- Campos para la relacion con entidad bisabuelo _B -->
        <input type='hidden' name='_B_IdFk' value='$_B_IdFk'>
        <input type='hidden' name='_B_Clausula_Fk' value='$_B_Clausula_Fk'>

        <!-- Campos para la relacion con entidad abuelo _A -->
        <input type='hidden' name='_A_IdFk' value='$_A_IdFk'>
        <input type='hidden' name='_A_Clausula_Fk' value='$_A_Clausula_Fk'>

";

echo "  </form>

        </div>

    </div>";





    //Termina form del formulario

?>



    </BODY>
    
    <!---nuevo script eliminar imagenes--->
    <div id="toast-container" style="position: fixed; top: 20px; right: 20px; z-index: 9999;"></div>

    <!--Modal para Imagenes Crop--->
    <div id="cropModal" style="display:none; position:fixed; z-index:9999; top:0; left:0; width:100vw; height:100vh; background:rgba(0,0,0,0.8); align-items:center; justify-content:center;">
      <div style="background:#fff; padding:10px; border-radius:8px; width:90vw; max-width:450px; max-height:90vh; display:flex; flex-direction:column;">
        <h5 style="text-align:center;">Recorta tu imagen</h5>
        <div style="flex:1; overflow:auto; text-align:center;">
          <img id="imageToCrop" src="" style="max-width:100%; max-height:70vh;">
        </div>
        <div style="width: -webkit-fill-available;margin-top:10px; text-align:right;display: flex;justify-content: space-between;">
          <button onclick="closeCropModal()" class="btn btn-danger" style="background:#dc3545;">Cancelar</button>
          <button onclick="cropImage()" class="btn btn-primary" style="background:#0d6efd;">Recortar</button>
        </div>
      </div>
    </div>
    <!--End Modal para Imagenes Crop--->
    
    <script>
    document.addEventListener("DOMContentLoaded", function () {
        const inputsFile = document.querySelectorAll("input[type='file']");

        function showToast(message, type = 'success') {
            const toast = document.createElement("div");
            toast.textContent = message;
            toast.style.padding = "12px 20px";
            toast.style.marginBottom = "10px";
            toast.style.backgroundColor = type === 'error' ? "#dc3545" : "#28a745";
            toast.style.color = "white";
            toast.style.borderRadius = "4px";
            toast.style.boxShadow = "0 2px 8px rgba(0,0,0,0.3)";
            toast.style.fontSize = "14px";
            toast.style.opacity = "0.95";
            toast.style.textAlign = "center";
            document.getElementById("toast-container").appendChild(toast);

            setTimeout(() => {
                toast.remove();
            }, 3500);
        }

        inputsFile.forEach(function (input) {
            
            //const inputId = input.id;
            //reemplazamos el id por el nombre, ya que el nombre es un identificador y esto nos ayuda a mejorar la validacion
            const inputId = input.name;

            if (!input.dataset.btnQuitarAgregado) {
                const btn = document.createElement("button");
                btn.type = "button";
                btn.className = "delete-media-UI";
                btn.innerHTML = `
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" 
                       fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" 
                       stroke-linejoin="round" class="lucide lucide-trash2-icon lucide-trash-2">
                    <path d="M10 11v6"/>
                    <path d="M14 11v6"/>
                    <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/>
                    <path d="M3 6h18"/>
                    <path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
                  </svg>
                  Quitar archivo
                `;

                btn.style.clear = "both";
                btn.style.display = "none";

                const wrapper = input.closest('.inputfile-wrapper') || input.parentElement;
                if (wrapper) {
                    wrapper.appendChild(btn);
                } else {
                    input.insertAdjacentElement("afterend", btn);
                }

                input.dataset.btnQuitarAgregado = "true";

                input.addEventListener("change", function () {
                    btn.style.display = input.files.length > 0 ? "inline-flex" : "none";
                });

                btn.addEventListener("click", function () {
                    input.value = "";
                    btn.style.display = "none";

                    let mensajeToast = "Archivo eliminado correctamente.";

                    //if (inputId.includes("imagen")) {
                    if(inputId.endsWith("_file")){
                        const id = inputId.replace("_file", "");
                        const img = document.getElementById("blah" + id);
                        const span = document.getElementById("span" + id);
                        const hiddenInput = document.querySelector(`input[name='imagen_${id.split('_')[1]}']`);
                        if (img) img.src = "../../../dist/images/upload.gif";
                        if (span) span.textContent = "Seleccionar archivo";
                        if (hiddenInput) hiddenInput.value = "";
                    }

                    //if (inputId === "video_principal") {
                    if (!inputId.startsWith("archivo_") && !inputId.endsWith("_file")) {
                        const contenedor = document.getElementById("video_preview_" + inputId);
                        const hiddenInput = document.querySelector("input[name='hidden_" + inputId + "']");
                        if (contenedor) contenedor.innerHTML = `<p style="color:white;">No video</p>`;
                        if (hiddenInput) hiddenInput.value = "";
                        mensajeToast = "Video eliminado del formulario. Aún puede previsualizarse en caché.";
                    }

                    if (inputId.startsWith("archivo_")) {
                        const num = inputId.replace("archivo_", "");
                        const canvas = document.getElementById(num + "Canvas");
                        const icon = document.getElementById("img" + num);
                        const hiddenInput = document.querySelector(`input[name='${num}']`);
                        if (canvas) canvas.style.display = "none";
                        if (icon) {
                            icon.style.display = "block";
                            icon.src = "../../../dist/images/img_pdf.png";
                        }
                        if (hiddenInput) hiddenInput.value = "";
                    }

                    showToast(mensajeToast);
                });

                // Mostrar botón si ya hay archivo en modo edición
                let mostrarBtn = false;

                if(inputId.endsWith("_file")){
                    const num = inputId.replace("_file", "");
                    const hidden = document.querySelector(`input[name='${num}']`);
                    if (hidden && hidden.value.trim() !== "") mostrarBtn = true;
                }

                //if (inputId === "video_principal") {
                if (!inputId.startsWith("archivo_") && !inputId.endsWith("_file")) {
                    const hidden = document.querySelector("input[name='hidden_" + inputId + "']");
                    if (hidden && hidden.value.trim() !== "") mostrarBtn = true;
                }

                if (inputId.startsWith("archivo_")) {
                    const num = inputId.replace("archivo_", "");
                    const hidden = document.querySelector(`input[name='${num}']`);
                    if (hidden && hidden.value.trim() !== "") mostrarBtn = true;
                }

                if (mostrarBtn) {
                    btn.style.display = "inline-flex";
                }
            }
        });
    });
    </script>
    <!--end nuevo script eliminar imagenes-->
    <script src="../../../dist/js/form_keypad.js?time=<?=$_Js_Version;?>"></script> 

       

<script type="text/javascript">

    window.onload=function(){

        window.scrollTo(0,0);

        window.parent.scrollTo(0,0);

        if(parent.document.getElementById('loadingpage')){

            parent.document.getElementById('loadingpage').style.display='none';

        }

    }



    function loadingpage(){

        if(parent.document.getElementById('loadingpage')){

          parent.document.getElementById('loadingpage').style.display='block'; 

        }

    }

</script>

<script>

    //document.getElementsByClassName('').select2();

    $('.select-search').select2();

</script>   


    <!---CODIGO PARA IMAGENES CROP--->
    <script src="../../../dist/js/cropper.min.js"></script>
    <script>
    let cropper = null;
    let currentInput = null;
    let currentPreview = null;

    document.addEventListener('DOMContentLoaded', () => {
      document.querySelectorAll('.data-img-crop input[type="file"]').forEach(input => {
        input.addEventListener('change', handleFileChange);
      });
    });

    function handleFileChange(event) {
      const input = event.target;
      const file = input.files?.[0];
      if (!file) return;

      currentInput = input;
      currentPreview = input.closest('.data-img-crop').querySelector('.data-preview-img-crop');

      const reader = new FileReader();
      reader.onload = function (e) {
        const image = document.getElementById('imageToCrop');

        // Destruir cropper si existe
        if (cropper) {
          cropper.destroy();
          cropper = null;
        }

        // Forzar recarga de la imagen para evitar superposición
        image.removeAttribute('src'); // limpia completamente
        image.onload = () => {
          cropper = new Cropper(image, {
            aspectRatio: 1,
            viewMode: 1,
            autoCropArea: 1,
            responsive: true
          });

          document.getElementById('cropModal').style.display = 'flex';
        };

        setTimeout(() => {
          image.src = e.target.result; // recargar después de limpiar
        }, 10); // delay mínimo para forzar el onload correctamente
      };

      reader.readAsDataURL(file);
    }

    function cropImage() {
      if (!cropper) return;

      const canvas = cropper.getCroppedCanvas({ width: 300, height: 300 });
      canvas.toBlob(blob => {
        const url = URL.createObjectURL(blob);

        // Mostrar preview
        if (currentPreview) {
          currentPreview.src = url;
        }

        // Reemplazar archivo en input
        const file = new File([blob], 'cropped.png', { type: 'image/png' });
        const dataTransfer = new DataTransfer();
        dataTransfer.items.add(file);
        currentInput.files = dataTransfer.files;

        closeCropModal();
      }, 'image/png');
    }

    function closeCropModal() {
      document.getElementById('cropModal').style.display = 'none';

      // Destruir cropper
      if (cropper) {
        cropper.destroy();
        cropper = null;
      }

      // Limpiar imagen para evitar duplicados
      const image = document.getElementById('imageToCrop');
      image.removeAttribute('src');

      // Reset inputs
      currentInput = null;
      currentPreview = null;
    }
    </script>
    <!---END CODIGO PARA IMAGENES CROP--->
    <script src="../../../dist/js/app.js"></script> 

    </center>

</HTML>