@extends('layout.main')
@section('contenido')
    {{-- ==================================================
        MENSAJES
    ================================================== --}}
    @if (Session::has('fecha'))
        <div class="alert alert-danger alert-dismissible fade show mb-2 mt-2" role="alert">
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            <strong>Atención. </strong>{{ Session::get('fecha') }}
        </div>
    @endif
    @if (Session::has('monto'))
        <div class="alert alert-danger alert-dismissible fade show mb-2 mt-2" role="alert">
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            <strong>Atención. </strong>{{ Session::get('monto') }}
        </div>
    @endif
    @if (Session::has('mensaje'))
        <div class="alert alert-success alert-dismissible fade show mb-2 mt-2" role="alert">
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            <strong>Ok. </strong>{{ Session::get('mensaje') }}
        </div>
    @endif
    @if(isset($datos_transaccion))
        <div class="alert alert-success alert-dismissible fade show mb-2 mt-2" role="alert">
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            <strong>Ok. </strong> Beneficiario guardado correctamente!
        </div>
    @endif
    <form action="{{ url('/guardarTransaccion') }}" method="post" id="Form">
        @csrf
        <input type="hidden" name="desde_vista" value="transaccion_home">
        <div class="card mt-2 mb-2">
            <div class="card-header">
                <div class="navbar">
                    <h4 class="text-success">Registrar Transacción</h4>
                    <a class="btn btn-primary btn-lg" title="Listar" href="{!! url('/transaccion') !!}"><strong><i class="fas fa-list"></i></strong></a>
                </div>
            </div>
            {{-- <input type="text" id="vuelo_beneficiario" name="vuelo_beneficiario"> --}}
            <div class="card-body">
                <div class="row col-md-4 mb-2">
                    <div class="col-md-4 col-6">
                        <div class="mb-1"><label><strong>Tipo</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Tipo</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Tipo</strong></label></div> --}}
                        <select class="form-select form-select-sm" name="tipo" id="tipo" onchange="mostrar_ocultar()">
                            @if(!empty(session('datos')['tipo']))
                                <option value="CARGO" {{ session('datos')['tipo'] == "CARGO" ? 'selected' : '' }}>Cargo</option>                    
                                <option value="ABONO" {{ session('datos')['tipo'] == "ABONO" ? 'selected' : '' }}>Abono</option>                    
                                <option value="TRANSFERENCIA" {{ session('datos')['tipo'] == "TRANSFERENCIA" ? 'selected' : '' }}>Transferencia</option>                    
                                <option value="COMPRA" {{ session('datos')['tipo'] == "COMPRA" ? 'selected' : '' }}>Compra</option>
                                <option value="VENTA" {{ session('datos')['tipo'] == "VENTA" ? 'selected' : '' }}>Venta</option>
                            @else
                                <option value="CARGO" {{ old('tipo') == "CARGO" ? 'selected' : '' }}>Cargo</option>                    
                                <option value="ABONO" {{ old('tipo') == "ABONO" ? 'selected' : '' }}>Abono</option>                    
                                <option value="TRANSFERENCIA" {{ old('tipo') == "TRANSFERENCIA" ? 'selected' : '' }}>Transferencia</option>                    
                                <option value="COMPRA" {{ old('tipo') == "COMPRA" ? 'selected' : '' }}>Compra</option>
                                <option value="VENTA" {{ old('tipo') == "VENTA" ? 'selected' : '' }}>Venta</option>
                            @endif
                        </select>
                    </div>
                    <div class="col-md-4 col-6 mb-2">
                        <div class="mb-1"><label><strong>Fecha</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Fecha</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Fecha</strong></label></div> --}}
                        @if(!empty(session('datos')['fecha']))
                            <input type="date" class="form-control form-control-sm" value="{!! session('datos')['fecha'] !!}" name="fecha" id="fecha" autocomplete="off">
                        @else
                            <input type="date" class="form-control form-control-sm" value="{!!old('fecha',$date['0']->fecha)!!}" name="fecha" id="fecha" autocomplete="off">
                        @endif
                    </div>
                    <div class="col-md-4 col-6" id="div_condicion">
                        <div class="mb-1"><label><strong>Condición</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Condición</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Condición</strong></label></div> --}}
                        @if(!empty(session('datos')['condicion']))
                            <select class="form-select form-select-sm" name="condicion" id="condicion">
                                <option value="CONTADO" {{ session('datos')['condicion'] == "CONTADO" ? 'selected' : '' }}>Contado</option>
                                <option value="CREDITO" {{ session('datos')['condicion'] == "CREDITO" ? 'selected' : '' }}>Crédito</option>
                            </select>
                        @else
                            <select class="form-select form-select-sm" name="condicion" id="condicion">
                                <option value="CONTADO" {{ old('condicion') == "CONTADO" ? 'selected' : '' }}>Contado</option>
                                <option value="CREDITO" {{ old('condicion') == "CREDITO" ? 'selected' : '' }}>Crédito</option>
                            </select>
                        @endif
                    </div>
                </div>
                {{-- <div class="card col-md-6 mb-3">
                    <div class="card-body"> --}}
                        <div class="col-md-4 col-12"> 
                            <div class="mb-1"><label><strong>Desde Cuenta</strong></label></div>
                            {{-- <div class="mb-1"><label id="cuenta"><strong>Cuenta</strong></label></div> --}}
                            {{-- <div class="mb-1"><label id="desde_cuenta"><strong>Desde Cuenta</strong></label></div> --}}
                            {{-- <div class="mb-2 d-none d-sm-block"><label id="cuenta"><strong>Cuenta</strong></label></div> --}}
                            {{-- <div align="right" class="mb-2 d-block d-sm-none"><label id="cuenta1"><strong>Cuenta</strong></label></div> --}}
                            
                            {{-- <div class="mb-2 d-none d-sm-block"><label id="desde_cuenta"><strong>Desde Cuenta</strong></label></div> --}}
                            {{-- <div align="right" class="mb-2 d-block d-sm-none"><label id="desde_cuenta1"><strong>Desde Cuenta</strong></label></div> --}}
                             {{-- *********************************************************** --}}
                            <div class="input-group mb-2">
                                <select name="idcuenta" id="idcuenta" class="form-select" style="width: 90%">
                                    @foreach ($cuentas as $cuenta)
                                        @if(!empty(session('datos')['idcuenta']))
                                            <option value="{!!$cuenta['idcuenta']!!}" {!!session('datos')['idcuenta'] == $cuenta['idcuenta'] ? 'selected' : '' !!}>
                                                {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                            </option>  
                                        @else
                                            <option value="{{$cuenta['idcuenta']}}" {{ old('idcuenta') == $cuenta['idcuenta'] ? 'selected' : '' }}>
                                                {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                            </option>  
                                        @endif
                                    @endforeach
                                </select>
                                <button class="btn btn-secondary btn-sm" id="cuenta_vuelo" type="button">+</button>
                            </div>
                            <script>
                                $(document).ready(function() {
                                    $('#idcuenta').select2();
                                });
                            </script>
                        {{-- </div> --}}
                            <div class="mb-2 collapse" id="div_hasta_cuenta">
                                <div class="mb-1"><label><strong>Hasta Cuenta</strong></label></div>
                                {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Hasta Cuenta</strong></label></div> --}}
                                {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Hasta Cuenta</strong></label></div> --}}
                                <div class="input-group">
                                    <select name="hasta_idcuenta" id="hasta_idcuenta" class="form-select" style="width: 90%">
                                        @foreach ($cuentas as $cuenta)
                                            @if(!empty(session('datos')['hasta_idcuenta']))
                                                <option value="{!!$cuenta['idcuenta']!!}" {!!session('datos')['hasta_idcuenta'] == $cuenta['idcuenta'] ? 'selected' : '' !!}>
                                                    {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                                </option>  
                                            @else
                                                <option value="{!!$cuenta['idcuenta']!!}" {!! old('idcuenta') == $cuenta['idcuenta'] ? 'selected' : '' !!}>
                                                    {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                                </option>  
                                            @endif    


                                            {{-- @if(!empty(session('datos')['hasta_idcuenta']))
                                                <option value="{!!$cuenta['idcuenta']!!}" {!!session('datos')['hasta_idcuenta'] == $cuenta['idcuenta'] ? 'selected' : '' !!}>
                                                    {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                                </option>  
                                            @else
                                                <option value="{{$cuenta['idcuenta']}}" {{ old('idcuenta') == $cuenta['idcuenta'] ? 'selected' : '' }}>
                                                    {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                                </option>  
                                            @endif --}}
                                        @endforeach
                                        {{-- @foreach ($cuentas as $cuena)
                                            <option value="{{$cuenta['idcuenta']}}" {{ old('idcuenta') == $cuenta['idcuenta'] ? 'selected' : '' }}>
                                            {!! $cuenta['denominacion'].' - Saldo: '.number_format($cuenta['saldo'], 0, ',', '.') !!}
                                        </option>                    
                                        @endforeach --}}
                                    </select>
                                    <button class="btn btn-secondary btn-sm" id="cuenta_vuelo" type="button">+</button>
                                </div>
                                <script>
                                    $(document).ready(function() {
                                        $('#hasta_idcuenta').select2();
                                    });
                                </script>
                            </div>
                            <div class="mb-2" id="div_beneficiario">
                                <div class="mb-1"><label><strong>Beneficiario</strong></label></div>
                                {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Beneficiario</strong></label></div> --}}
                                {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Beneficiario</strong></label></div> --}}
                                {{-- *********************************************************** --}}
                                <div class="input-group">
                                    <select name="idbeneficiario" id="idbeneficiario" class="form-select" style="width: 90%">
                                        @foreach ($beneficiarios as $beneficiario)
                                            @if(!empty(session('datos')['idbeneficiario']))
                                                <option value="{!! $beneficiario['idbeneficiario'] !!}"{!! session('datos')['idbeneficiario'] == $beneficiario['idbeneficiario'] ? 'selected' : '' !!}>
                                                    {{ "RUC/CI: ".$beneficiario['ruc_ci']." - ".$beneficiario['denominacion'] }}
                                                </option>                    
                                            @else
                                                <option value="{{$beneficiario['idbeneficiario']}}" {{ old('idbeneficiario') == $beneficiario['idbeneficiario'] ? 'selected' : '' }}>
                                                    {{ "RUC/CI: ".$beneficiario['ruc_ci']." - ".$beneficiario['denominacion'] }}
                                                </option>                    
                                            @endif
                                        @endforeach
                                    </select>
                                    <button class="btn btn-secondary btn-sm" id="beneficiario_vuelo" type="button">+</button>
                                </div>
                                <script>
                                    $(document).ready(function() {
                                        $('#idbeneficiario').select2();
                                    });
                                </script>
                            </div>
                        {{-- <div class="mb-3"> --}}
                            <div class="mb-1"><label><strong>Categoria</strong></label></div>
                            {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Categoria</strong></label></div> --}}
                            {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Categoria</strong></label></div> --}}
                            {{-- <div id="mensaje_categoria"></div> --}}
                            {{-- *********************************************************** --}}
                            <div class="input-group mb-2">
                                <select name="idcategoria" id="idcategoria" class="form-select" style="width: 90%">
                                    @foreach ($categorias as $categoria)
                                        @if(!empty(session('datos')['idcategoria']))
                                            <option value="{!! $categoria['idcategoria'] !!}" {!! session('datos')['idcategoria'] == $categoria['idcategoria'] ? 'selected' : '' !!}>
                                                {!! $categoria['descripcion'] !!}
                                            </option> 
                                        @else
                                            <option value="{{$categoria['idcategoria']}}" {{ old('idcategoria') == $categoria['idcategoria'] ? 'selected' : '' }}>
                                                {{ $categoria['descripcion'] }}
                                            </option>                    
                                        @endif
                                    @endforeach
                                </select>
                                <button class="btn btn-secondary btn-sm" id="categoria_vuelo" type="button">+</button>
                            </div>
                            <script>
                                $(document).ready(function() {
                                    $('#idcategoria').select2();
                                });
                            </script>
                        </div>
                    {{-- </div> --}}
                {{-- </div> --}}
                {{-- BLOQUE DE MONTOS --}}
                <div class="row col-md-4 mb-2">
                    <div class="col-md-4 col-4" id="div_exe">
                        <div class="mb-1"><label><strong>Exenta</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Exenta</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Exenta</strong></label></div> --}}
                        @if (@empty(session('datos')['exe']))
                            <input type="tel" class="form-control form-control-sm" name="exe" id="exe" autocomplete="off" 
                            onkeyup="format(this)" onchange="format(this)" 
                            value="{!! old('exe') !!}">
                        @else
                            <input type="tel" class="form-control form-control-sm" name="exe" id="exe" autocomplete="off" 
                            onkeyup="format(this)" onchange="format(this)" 
                            value="{!! session('datos')['exe'] !!}">
                        @endif
                    </div>
                    <div class="col-md-4 col-4" id="div_5">
                        <div class="mb-1"><label><strong>Grav. 5%</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Grav. 5%</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Grav. 5%</strong></label></div> --}}
                        @if (@empty(session('datos')['gra5']))
                            <input type="tel" class="form-control form-control-sm" name="gra5" id="gra5" autocomplete="off" 
                            onkeyup="format(this)" onchange="format(this)" 
                            value="{!! old('gra5') !!}">
                        @else
                            <input type="tel" class="form-control form-control-sm" name="gra5" id="gra5" autocomplete="off" 
                            onkeyup="format(this)" onchange="format(this)" 
                            value="{!! session('datos')['gra5'] !!}">
                        @endif
                        {{-- <input type="tel" class="form-control form-control-sm" name="gra5" id="gra5" autocomplete="off" 
                        onkeyup="format(this)" onchange="format(this)"
                        value="{!!old('gra5')!!}"> --}}
                    </div>
                    <div class="col-md-4 col-4" id="div_10">
                        <div class="mb-1"><label><strong>Grav. 10%</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Grav. 10%</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Grav. 10%</strong></label></div> --}}
                        @if (@empty(session('datos')['gra10']))
                            <input type="tel" class="form-control form-control-sm" name="gra10" id="gra10" autocomplete="off" 
                            onkeyup="format(this)" onchange="format(this)" 
                            value="{!! old('gra10') !!}">
                        @else
                            <input type="tel" class="form-control form-control-sm" name="gra10" id="gra10" autocomplete="off" 
                            onkeyup="format(this)" onchange="format(this)" 
                            value="{!! session('datos')['gra10'] !!}">
                        @endif
                        {{-- <input type="tel" class="form-control form-control-sm" name="gra10" id="gra10" autocomplete="off" 
                        onkeyup="format(this)" onchange="format(this)"
                        value="{!!old('gra10')!!}"> --}}
                    </div>
                </div>
                <div class="card mb-2 collapse" id="det_transaccion">
                    <div class="card-header">
                        <h4 class="card-title">Detalle de Transacción</h4>
                    </div>
                    <div class="card-body">
                        <div class="row mb-2">
                            <div class="col-md-4">
                                <div class="mb-1"><label><strong>Artículo</strong></label></div>
                                {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Artículo</strong></label></div>
                                <div class="mb-2 d-none d-sm-block"><label><strong>Artículo</strong></label></div> --}}
                                <div class="input-group">
                                    <select name="idarticulo" id="idarticulo" style="width: 90%">
                                        @foreach ($articulos as $articulo)
                                            <option value="{!! $articulo['idarticulo'] !!}">{!!$articulo['nombre']!!}
                                            </option>
                                        @endforeach
                                    </select>
                                    <button class="btn btn-secondary btn-sm" id="articulo_vuelo" type="button">+</button>
                                </div>
                                <script>
                                    $(document).ready(function() {
                                        $('#idarticulo').select2();
                                    });
                                </script>
                            </div>
                            <div class="col-md-1 col-4">
                                <div class="mb-2 d-none d-sm-block"><label><strong>Impuesto</strong></label></div>
                                <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Impuesto</strong></label></div>
                                <select name="tipo_impuesto" id="tipo_impuesto" class="form-select form-select-sm">
                                    <option value="EXE">Exe</option>
                                    <option value="GRA5">5%</option>
                                    <option value="GRA10">10%</option>
                                </select>
                            </div>
                            <div class="col-md-1 col-4">
                                <div class="mb-2 d-none d-sm-block"><label><strong>Precio</strong></label></div>
                                <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Precio</strong></label></div>
                                <input type="tel" class="form-control form-control-sm" id="precio" autocomplete="off" onkeyup="format(this)" onchange="format(this)">
                            </div>
                            <div class="col-md-1 col-4">
                                <div class="mb-2 d-none d-sm-block"><label><strong>Cantidad</strong></label></div>
                                <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Cantidad</strong></label></div>
                                <input type="number" class="form-control form-control-sm" id="cantidad" value="1" autocomplete="off" min="1" max="1000" onkeyup="format(this)" onchange="format(this)">
                            </div>
                            <div class="col-md-1">
                                <div class="mb-2 d-none d-sm-block"><label><strong>Agregar</strong></label></div>
                                <button type="button" class="btn btn-primary btn-sm" id='boton-agregar' role='button'><strong>+</strong></button>
                            </div>  
                        </div>
                        <div class="table-responsive">
                            <table class="table table-striped table-sm table-bordered" id="detalle">
                                <thead>
                                    <tr class="table-primary">
                                        <th width="5%">ID</th>
                                        <th width="7%">Tipo</th>
                                        <th width="43%">Artículo</th>
                                        <th width="15%">Precio</th>
                                        <th width="10%">Cantidad</th>
                                        <th width="15%">Subtotal</th>
                                        <th width="3%">&nbsp;</th>
                                    </tr>
                                </thead>
                                <tbody id="tbody"></tbody>
                            </table>
                        </div>
                        <div align="right">
                            <div class="col-2">
                                <div class="form-floating">
                                    <input type="text" readonly value="0" class="form-control" id="total" name="total">
                                    <label for="floatingInput"><strong>Total</strong></label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row col-md-4 mb-2">
                    <div class="col-md-4 col-4">
                        <div class="mb-1"><label><strong>Estado</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Estado</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Estado</strong></label></div> --}}
                        @if(!empty(session('datos')['estado']))
                            <select class="form-select form-select-sm" name="estado" id="estado">
                                <option value="NINGUNO" {{ session('datos')['estado'] == "NINGUNO" ? 'selected' : '' }}>Ninguno</option>
                                <option value="CONCILIADA" {{ session('datos')['estado'] == "CONCILIADA" ? 'selected' : '' }}>Conciliada</option>
                            </select>
                        @else
                            <select class="form-select form-select-sm" name="estado" id="estado">
                                <option value="NINGUNO" {{ old('estado') == "NINGUNO" ? 'selected' : '' }}>Ninguno</option>
                                <option value="CONCILIADA" {{ old('estado') == "CONCILIADA" ? 'selected' : '' }}>Conciliada</option>
                            </select>
                        @endif 
                    </div>
                    <div class="col-md-8 col-8">
                        <div class="mb-1"><label><strong>Nota</strong></label></div>
                        {{-- <div class="mb-2 d-none d-sm-block"><label><strong>Nota</strong></label></div> --}}
                        {{-- <div align="right" class="mb-2 d-block d-sm-none"><label><strong>Nota</strong></label></div> --}}
                        @if (@empty(session('datos')['nota']))
                            <textarea class="form-control form-control-sm" name="nota" rows="1">{!!old('nota')!!}</textarea>
                        @else
                            <textarea class="form-control form-control-sm" name="nota" rows="1">{!!session('datos')['nota']!!}</textarea>
                        @endif
                    </div>
                </div>
            </div>
            <div class="card-footer" align="right">
                <a href="{{ url('/') }}" class="btn btn-secondary btn-lg" title="Cancelar"><i class="fas fa-ban"></i></a>
                <button class="btn btn-success btn-lg" title="Guardar"><i class="fas fa-save"></i></button>
            </div>
        </div>
    </form>
    {{-- ======================================================
        SE BORRA LA VARIABLE DE SESSION LUEGO DE HABERLA UTILIZADO
    ====================================================== --}}
    @php session()->forget('datos'); @endphp 
    <script>
        $(document).ready(function() {
            $('#cuenta_vuelo').click(function() {
                Form.setAttribute('action', 'cuenta_transaccion_vuelo')
                $("#Form").submit();
            });
            $('#beneficiario_vuelo').click(function() {
                Form.setAttribute('action', 'beneficiario_transaccion_vuelo')
                $("#Form").submit();
            });
            $('#categoria_vuelo').click(function() {
                Form.setAttribute('action', 'categoria_transaccion_vuelo')
                $("#Form").submit();
            });
            $('#articulo_vuelo').click(function() {
                Form.setAttribute('action', 'articulo_transaccion_vuelo')
                $("#Form").submit();
            });
        });
        /*--------------------------------------------*/
        // document.getElementById("det_transaccion").style.display = "none";
        
        // document.getElementById("div_hasta_cuenta").style.display = "none";
        document.getElementById("desde_cuenta").style.display = "none";

        // document.getElementById("desde_cuenta1").style.display = "none";
        /*--------------------------------------*/
        $('#form_cuenta_nuevo').on('submit', function(e) {
            if (!e.isDefaultPrevented()) {
                $.ajax({
                    type: "POST",
                    url: "{{ url('/categoriavuelo_guardar') }}",
                    data: $(this).serialize(),
                    success: function(data) {
                        $("#mensaje_categoria").html(data);
                        $('#form_categoria_nuevo')[0].reset();
                        $("#ModalNuevaCategoria").modal("hide");
                    }
                });
                return (true);
            }
        })
        /*---------------------------------------------*/
        $('#form_beneficiario_nuevo').on('submit', function(e) {
            if (!e.isDefaultPrevented()) {
                $.ajax({
                    type: "POST",
                    url: "{{ url('/categoriavuelo_guardar') }}",
                    data: $(this).serialize(),
                    success: function(data) {
                        $("#mensaje_categoria").html(data);
                        $('#form_categoria_nuevo')[0].reset();
                        $("#ModalNuevaCategoria").modal("hide");
                    }
                });
                return (true);
            }
        })
        /*---------------------------------------------*/
        $('#form_categoria_nuevo').on('submit', function(e) {
            if (!e.isDefaultPrevented()) {
                /* var url = "articulo_guardar.php"; */
                //alert('asdfasdfasfd') 
                $.ajax({
                    type: "POST",
                    url: "{{ url('/categoriavuelo_guardar') }}",
                    data: $(this).serialize(),
                    success: function(data) {

                        // if (data == 1) {
                        //     alert('Registro guardado..')
                        $("#mensaje_categoria").html(data);
                        //$("#select_categoria").load('/categoria_select');//error


                        //}
                        //var alertbox = '<div class="alert alert-primary" role="alert">  A simple primary alert—check it out!</div>';
                        /*var messageAlert = 'alert-' + data.type;
                        var messageText = data.message;*/
                        //var alertBox = '<div>ddf</div>';
                        //var alertBox = '<div class="alert content ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + messageText + '</div>';
                        /*if (messageAlert && messageText) {
                            setTimeout(function() {
                            $(".content").fadeOut(1500);
                            if(messageAlert=='alert-success'){
                                //$("#lista_articulo").load("lista_articulo.php"); 
                                $("#ModalNuevaCategoria").modal("hide");
                                //$("#ModalNuevaCategoria .close").click() 
                                $('#form_categoria_nuevo')[0].reset();
                            }
                            },1500);
                        } */
                        $('#form_categoria_nuevo')[0].reset();
                        $("#ModalNuevaCategoria").modal("hide");
                    }
                });
                return (true);
            }
        })


        function mostrar_ocultar() {
            var x = document.getElementById("tipo").value;
            if (x == 'CARGO') {
                document.getElementById("div_hasta_cuenta").style.display = "none";
                document.getElementById("div_condicion").style.display = "block";
                document.getElementById("div_beneficiario").style.display = "block";
                document.getElementById("det_transaccion").style.display = "none";
                document.getElementById("div_exe").style.display = "block";
                document.getElementById("div_5").style.display = "block";
                document.getElementById("div_10").style.display = "block";
                document.getElementById("cuenta").style.display = "block";
                document.getElementById("cuenta1").style.display = "block";
                document.getElementById("desde_cuenta").style.display = "none";
                document.getElementById("desde_cuenta1").style.display = "none";
            }
            if (x == 'ABONO') {
                document.getElementById("div_hasta_cuenta").style.display = "none";
                document.getElementById("div_condicion").style.display = "block";
                document.getElementById("div_beneficiario").style.display = "block";
                document.getElementById("det_transaccion").style.display = "none";
                document.getElementById("div_exe").style.display = "block";
                document.getElementById("div_5").style.display = "block";
                document.getElementById("div_10").style.display = "block";
                document.getElementById("cuenta").style.display = "block";
                document.getElementById("cuenta1").style.display = "block";
                document.getElementById("desde_cuenta").style.display = "none";
                document.getElementById("desde_cuenta1").style.display = "none";
            }
            if (x == 'TRANSFERENCIA') {
                document.getElementById("div_hasta_cuenta").style.display = "block";
                document.getElementById("div_condicion").style.display = "none";
                document.getElementById("div_beneficiario").style.display = "none";
                document.getElementById("det_transaccion").style.display = "none";
                document.getElementById("div_exe").style.display = "block";
                document.getElementById("div_5").style.display = "block";
                document.getElementById("div_10").style.display = "block";
                document.getElementById("cuenta").style.display = "none";
                document.getElementById("cuenta1").style.display = "none";
                // var label = document.getElementById("cuenta");
                // label.innerText += "Desde cuenta"; 
                document.getElementById("desde_cuenta").style.display = "block";
                document.getElementById("desde_cuenta1").style.display = "block";

            }
            if (x == 'COMPRA') {
                document.getElementById("div_hasta_cuenta").style.display = "none";
                document.getElementById("div_condicion").style.display = "block";
                document.getElementById("div_beneficiario").style.display = "block";
                document.getElementById("det_transaccion").style.display = "block";
                document.getElementById("div_exe").style.display = "none";
                document.getElementById("div_5").style.display = "none";
                document.getElementById("div_10").style.display = "none";
                document.getElementById("cuenta").style.display = "block";
                document.getElementById("cuenta1").style.display = "block";
                document.getElementById("desde_cuenta").style.display = "none";
                document.getElementById("desde_cuenta1").style.display = "none";
            }
            if (x == 'VENTA') {
                document.getElementById("div_hasta_cuenta").style.display = "none";
                document.getElementById("div_condicion").style.display = "block";
                document.getElementById("div_beneficiario").style.display = "block";
                document.getElementById("det_transaccion").style.display = "block";
                document.getElementById("div_exe").style.display = "none";
                document.getElementById("div_5").style.display = "none";
                document.getElementById("div_10").style.display = "none";
                document.getElementById("cuenta").style.display = "block";
                document.getElementById("cuenta1").style.display = "block";
                document.getElementById("desde_cuenta").style.display = "none";
                document.getElementById("desde_cuenta1").style.display = "none";
            }
        }

        // $(document).ready(function() {
        var contador = 1
        // var detalle = new Array();
        $("#boton-agregar").click(function() {
            if (!$("#precio").val()) {
                alert('precio')
            } else {
                if (!$("#cantidad").val()) {
                    alert('cantidad')
                } else {
                    var art = document.getElementById("idarticulo");
                    var artnombre = art.options[art.selectedIndex].text;
                    var idarticulo = $("#idarticulo").val();
                    /*--------------------------------------------------*/
                    var tipo_impuesto = $('#tipo_impuesto').val();
                    /*--------------------------------------------------*/
                    var total = $("#total").val();
                    var total = total.replace(/\./g, '')
                    /*--------------------------------------------------*/
                    var precio = $("#precio").val();
                    var precio = precio.replace(/\./g, '')
                    /*--------------------------------------------------*/
                    var cantidad = $("#cantidad").val();
                    var cantidad = cantidad.replace(/\./g, '')
                    /*--------------------------------------------------*/
                    var subtotal = parseFloat(precio) * parseFloat(cantidad);
                    var total = parseFloat(total) + parseFloat(subtotal)
                    /*--------------------------------------------------*/
                    $('#total').val(separadorMiles(total))
                    /*--------------------------------------------------*/
                    $("#detalle").find('tbody')
                        .append($('<tr>')
                            .append($('<td>' +
                                '<input type="text" class="form-control form-control-sm" id="sinbordefondo" readonly value="' +
                                separadorMiles(idarticulo) + '" name="det[' + contador + '][idarticulo]"' + '</td>'
                            ))
                            .append($('<td>' +
                                '<input type="text" class="form-control form-control-sm" id="sinbordefondo" readonly value="' +
                                tipo_impuesto + '" name="det[' + contador + '][tipo_impuesto]"' + '</td>'
                            ))
                            .append($('<td>' +
                                '<input type="text" class="form-control form-control-sm" id="sinbordefondo" readonly value="' +
                                artnombre + '" name="det[' + contador + '][artnombre]"' + '</td>'))
                            .append($('<td>' +
                                '<input type="text" class="form-control form-control-sm" id="sinbordefondo" readonly value="' +
                                separadorMiles(precio) + '" name="det[' + contador + '][precio]"' + '</td>'))
                            .append($('<td>' +
                                '<input type="text" class="form-control form-control-sm" id="sinbordefondo" readonly value="' +
                                separadorMiles(cantidad) + '" name="det[' + contador + '][cantidad]"' + '</td>'))
                            .append($('<td>' +
                                '<input type="text" class="form-control form-control-sm" id="subtotal" readonly value="' +
                                separadorMiles(subtotal) + '" name="det[' + contador + '][subtotal]"' + '</td>'
                            ))
                            .append($(
                                '<td align="center"><a class="btn btn-danger btn-sm" id="borrar"><strong>-</strong></a></td>'
                            ))
                        .append($('</tr>'))
                    );
                }
            }
            contador++
            // console.table(detalle);
            // // console.log(detalle)
            // // $('#objet_detalle').val(JSON.stringify(detalle));
            $("#precio").val('');
            $("#cantidad").val('1');
        });
        $(document).on('click', '#borrar', function(event) {
            $(this).parents("tr").remove(); // se elimina el registro
            total = 0 //inicializacion de variable 
            $('#detalle tbody tr').each(function() { // se recorre la tabla hasta el registro
                var valor = $(this).find('input[id="subtotal"]').val(); //se busca y se asigna el valor del subtotal
                var valor = valor.replace(/\./g, '')
                total = parseFloat(total) + parseFloat(valor); // se acumula subtotal
            });
            $('#total').val(separadorMiles(total)) //se asigna subtotal a total
        });
    </script>

@endsection


<style>
    /* quitar el borde y el fondo de los text's cuando se dibuja el detalle  */
    #sinbordefondo {
        background: transparent;
        border: 0;
    }
    /* quitar el borde y el fondo de los text's para el campo subtotal en el detalle  */
    #subtotal {
        background: transparent;
        border: 0;
    }
</style>