@extends('header_nuevo_generico')
@section('main')
<div class="container-fluid pt-5 mt-5">    
    <!-- -->
    <div class="row justify-content-center my-2 mb-3">
        <div class="col-xl-12 col-lg-12 col-md-12">
            <h3 class="text-center text-fidelitas">@traducir('panel_traducciones','Panel de Traducciones') @if(env('APP_ID') == 1) @endif</h3>
        </div>
    </div>
    <div class="row justify-content-center mb-5">
        <div class="col-3">
            <h5 class="text-center">@traducir('select_plataforma','Seleccione la plataforma')</h5>
            <form id="frmTraduccionesPlataforma">
                {{ csrf_field() }}
                <div class="col-12 text-center">
                    <!-- <label class="form-label" for="pais">@traducir('Plataforma','Plataforma')</label> -->
                    <select name="plataforma_select" id="plataforma_select" class="form-select form-select-sm text-center">
                        <option value="0">@traducir('select_plataforma','Seleccione la plataforma') ...</option>
                        <option value="1" selected> Backend Fidelitas </option>
                        <option value="3"> Web Fidelitas </option>
                        <option value="4"> Web de Legajos </option>
                        <option value="5"> Contratista Imperium </option>
                       <!--  <option value="99" selected>Backend IV</option>
                        <option value="160">Cliente IV</option>
                        <option value="150">Legajos IV</option> -->
                    </select>
                </div>
            </form>
        </div>
    </div>
    <!-- -->
    <form id="labelsTabla">
        <input type="hidden" name="boton_filtroIngles" value="@traducir('btn_filtro_eng','Inglés Inconcluso')">
        <input type="hidden" name="boton_filtroPortugues" value="@traducir('btn_filtro_por_panel_trad','Portugués Inconcluso')">
        <input type="hidden" name="boton_desactivarFiltro" value="@traducir('desactvar_filtro_panel_trad','Desactivar Filtro')">
        <input type="hidden" name="vista" value="@traducir('vistas_panel_trad','Vista')">
        <input type="hidden" name="fecha_creacion" value="@traducir('fecha_creacion_panel_trad','Fecha de Creación')">
        <input type="hidden" name="espanol" value="@traducir('espanol','Español')">
        <input type="hidden" name="ingles" value="@traducir('ingles','Inglés')">
        <input type="hidden" name="portugues" value="@traducir('portugues','Portugués')">
        <input type="hidden" name="estado" value="@traducir('estado','Estado')">
    </form>
    <div class="row justify-content-center mt-3">
        <div class="col-12">
            <div id="fancyTablaTraducciones" class="d-none"></div>
        </div>
        <span id="espera-tabla-traducciones" class="text-center mt-5"><div class="spinner spinner-border text-fidelitas"></div></span>
    </div>
</div>

<!-- MODAL EDITAR TRADUCCIÓN -->
<div class="modal fade" id="modalEditarTrad" tabindex="-1" aria-hidden="true" data-bs-backdrop="static" >
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title d-flex justify-content-start">
                    <h5>@traducir('MODAL_TRAD','Traducción de') <span id="title_blade_trad"></span></h5> 
                </div>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body" id="modal_body_trad">


                <div class="row justify-content-center my-3">
                    <span id="espera-traduccion" class="d-none text-center"><div class="spinner spinner-border text-fidelitas"></div></span>
                </div>
                <form id="frmTraducir" class="d-none" action="" method="POST">
                    <input type="hidden" name="_token" id="token" value="{{csrf_token()}}">
                    <input type="hidden" name="id_trad">
                    <input type="hidden" name="blade">
                    <input type="hidden" name="app_key">
                    <input type="hidden" name="app_id">
                    <input type="hidden" name="eng_finish">
                    <input type="hidden" name="por_finish">
                    <!-- -->
                    <div class="row justify-content-center my-3">
                        <div class="col-lg-10 col-md-9 my-lg-auto my-3">
                            <small>@traducir('label_spa','Texto original en español')</small>
                            <div class="form-floating">
                                <textarea name="txt_spa" id="txt_spa" rows="3" style="height:2%;" class="form-control" placeholder="@traducir('txt_spa','Texto en español')"></textarea>
                                <label for="txt_spa" class="form-label">@traducir('txt_spa','Texto en español') <strong class="text-danger">*</strong></label>
                            </div>
                        </div>
                        <div class="col-lg-2">
                        </div>
                    </div>
                    <div class="row justify-content-center my-3 align-items-center">
                        <div class="col-lg-10 col-md-9 my-lg-auto my-3">
                            <small>@traducir('label_eng','Traducción en inglés')</small>
                            <div class="form-floating">
                                <textarea name="txt_eng" id="txt_eng" rows="3" style="height:2%;" class="form-control" placeholder="@traducir('txt_eng','Texto en inglés')"></textarea>
                                <label for="txt_eng" class="form-label">@traducir('txt_eng','Texto en inglés') <strong class="text-danger">*</strong></label>
                            </div>
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" value="" id="eng_finish_check">
                                <label class="form-check-label" for="eng_finish">
                                <small class="text-muted">Inglés finalizado</small>
                                </label>
                            </div>
                        </div>
                        <div class="col-lg-2 text-center">
                            <button type="button" class="btn btn-fidelitas" id="auto_trad_eng"><i class="bi bi-google"></i> <br>Translate</button>
                        </div>
                    </div>
                    <div class="row justify-content-center my-3 align-items-center">
                        <div class="col-lg-10 col-md-9 my-lg-auto my-3">
                            <small>@traducir('label_por','Traducción en portugués')</small>
                            <div class="form-floating">
                                <textarea name="txt_por" id="txt_por" rows="4" style="height:2%;" class="form-control" placeholder="@traducir('txt_por','Texto en portugués')"></textarea>
                                <label for="txt_por" class="form-label">@traducir('txt_por','Texto en portugués') <strong class="text-danger">*</strong></label>
                            </div>
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" value="" id="por_finish_check">
                                <label class="form-check-label" for="por_finish">
                                <small class="text-muted">Portugués finalizado</small>
                                </label>
                            </div>
                        </div>
                        <div class="col-lg-2 text-center">
                            <button type="button" class="btn btn-fidelitas" id="auto_trad_por"><i class="bi bi-google"></i> <br>Translate</button>
                        </div>
                    </div>
                    <div class="row my-3">
                        <div id="guardado-ok" class="d-none col-12 text-success text-center">@traducir('datos_guardados','Datos guardados con éxito. Recargando ..') <span><div class="spinner spinner-border"></div></span></div>
                        <div id="guardado-err" class="d-none col-12 text-danger text-center">@traducir('error','Ocurrió un error, revise los datos enviados y reintente guardar')</div>
                    </div>
                    <div class="row">
                        <div class="text-end col-md-6">
                            <button id="btnCancelTrad" type="button" class="btn btn-sm btn-outline-danger" data-bs-dismiss="modal"><i class="bi bi-x-octagon"></i> @traducir('Cancelar','Cancelar')</button>
                        </div>
                        <div class="text-start col-md-6">
                            <button id="btnSubmitTrad" type="submit" class="btn btn-sm btn-outline-success"><i class="bi bi-check2-circle"></i> @traducir('Guardar','Guardar')</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection
<!-- -->
@section('funcionesJS')
<script src="{{ asset('/Libreria_CA/Js/funciones_panel_traducciones.js') }}?v={{rand()}}"></script>
<script>
    $(document).ready(function(){
        let data = '<?php echo($trad);?>';
        eventosPanelTraducciones(data);
    });
</script>
@endsection