@extends('layouts.dashboardnew')

@section('content')


<div class="container-fluid paso-uno">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    
                    
                    <div class="col-md-12">
                        <div class="col-md-4">
                            <div class="form-group">
                               <h3>Información de los Rangos del Sistema </h3>
                               <button class="btn btn-info btn-block" onclick="toggle()">Editar</button>
                            </div>
                        </div>
                    </div>
                    
                    
                    @include('setting/rango/modal/informacion')
                
                </div>
            </div>
        </div>
    </div>
</div>    


<div class="container-fluid paso-dos" style="display:none;">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    
                    <div class="col-md-12">
                        <div class="col-md-4">
                            <div class="form-group">
                               <h3>Configuración de los Rangos del Sistema </h3>
                               <button class="btn btn-danger btn-block" onclick="toggle()">Regresar</button>
                            </div>
                        </div>
                    </div>
                    
                    @include('setting/rango/modal/editar')
                    
                </div>
            </div>
        </div>
    </div>
</div>    

@endsection


@push('script')
<script type="text/javascript">

    function toggle() {
      $('.paso-uno').toggle('slow')
      $('.paso-dos').toggle('slow')
    }
    
    
    
    function detalleRango() {
        
        $('#rango').empty()
        let cantRango = (parseInt($('#cantrango').val()) + 1)
        let cantNivel = (parseInt($('#cantnivel').val()) + 1)
        let sReferidos = $('#s_referido').val()
        let sReferidosD = $('#s_referidoD').val()
        let sReferidosInd = $('#s_referidoind').val()
        let sReferidosAct = $('#s_referidoact').val()
        let sTotalPuntos = $('#s_personal').val()
        let sTotalPuntosGrupales = $('#s_grupal').val()
        let sTotalComisiones = $('#s_comisiones').val()
        let sRolNecesario = $('#s_rolnecesario').val()
        let sBono = $('#s_bono').val()
        let sNivel = $("#s_nivel").val()
        let divrango = ''
        
        if (sTotalPuntos == '1' || sTotalPuntosGrupales == '1') {
            $('#vpuntos').show()
        } else {
            $('#vpuntos').hide()
        }
        
        for (let i = 1; i < cantRango; i++) {
            divrango = divrango + '<div class="col-sm-4 col-xs-12">' +
            '<div class="form-group">'+
                '<h5>Rango ' + i + '</h5>' +
                '<div class="col-md-12">' +
                '<label for="">Nombre Rango ' + i + '</label>' +
                '<input class="form-control" type="text" name="nombrerango' + i + '" required>' +
                '</div>'+
            '</div>'
                    
            // agregar referidos directos
            if (sReferidosD == '1') {
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                '<label for="">Cantidad Referidos Directos</label>' +
                '<input class="form-control" type="number" name="cantrefed' + i + '" required>' +
                '</div>'+
                '</div>'
            }
            
            // agregar referidos indirectos
            if (sReferidosInd == '1') {
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                '<label for="">Cantidad Referidos Indirectos</label>' +
                '<input class="form-control" type="number" name="cantrefeind' + i + '" required>' +
                '</div>'+
                '</div>'
            }
            
            // agregar todos los referidos
            if (sReferidos == '1') {
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                '<label for="">Cantidad Referidos</label>' +
                '<input class="form-control" type="number" name="cantrefe' + i + '" required>' +
                '</div>'+
                '</div>'
            }
            
            // agregar referidos activos
                if (sReferidosAct == '1') {
                    divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                    '<div class="form-group">'+
                    '<label for="">Cantidad Referido Activo</label>' +
                    '<input class="form-control" type="number" name="cantrefeact' + i + '" required>' +
                    '</div>'+
                    '</div>'
                }
                
            // agregar puntos personales
            if (sTotalPuntos == '1') {
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                '<label for="">Total Puntos Personales</label>' +
                '<input class="form-control" type="number" name="totalpunto' + i + '" required>' +
                '</div>'+
                '</div>'
            }
            
            // agregar puntos globales o de la red o generales
            if (sTotalPuntosGrupales == '1') {
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                '<label for="">Total Puntos Grupales</label>' +
                '<input class="form-control" type="number" name="totalpuntoG' + i + '" required>' +
                '</div>'+
                '</div>'
            }
                
            // agregar total de comisiones
            if (sTotalComisiones == '1') {
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                '<label for="">Total Comisiones</label>' +
                '<input class="form-control" type="number" name="totalcomi' + i + '" required>' +
                '</div>'+
                '</div>'
            }
                
                // agregar si afecta un nivel
                if (sNivel == '1') {
                    let tmp = ""
                    for (let i = 1; i < cantNivel; i++) {
                        tmp = tmp + '<option value="' + i + '">Nivel ' + i + '</option>'
                    }
                    divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                        '<div class="form-group">'+
                        '<label for="">Nivel que Afecta</label>' +
                        '<select class="form-control" name="nivelafec' + i + '" required>' +
                        '<option value="" selected disabled>Seleccione una opción</option>' +
                        '<option value="0">No Aplica</option>' +
                        tmp +
                        '</select>' +
                        '</div>'+
                        '</div>'
                }
                // agregar si recibe un bono
                if (sBono == '1') {
                    divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                        '<div class="form-group">'+
                        '<label for="">Bono Recibido</label>' +
                        '<input class="form-control" type="number" name="totalbono' + i + '" required>' +
                        '</div>'+
                        '</div>'
                }
                let tmp = ""
                for (let i = 1; i < cantRango; i++) {
                    tmp = tmp + '<option value="' + i + '">Rango ' + i + '</option>'
                }
                // agregar si utiliza los roles necesarios
                if (sRolNecesario == '1') {
                    divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                    '<div class="form-group">'+
                    '<label for="">Rango Necesarios en Red (rango y cantidad)</label>' +
                    '<div class="col-xs-6"><select class="form-control" name="rangonecesario' + i + '" required>' +
                    '<option value="" selected disabled>Seleccione una opción</option>' +
                    '<option value="0">No Aplica</option>' +
                    tmp +
                    '</select></div>' +
                    '<div class="col-xs-6"><input class="form-control" type="number" name="rangonececant' + i + '" required></div>' +
                    '</div>'+
                    '</div>'
                }
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                    '<div class="form-group">'+
                    '<label for="">Rango Previo Nesesario</label>' +
                    '<select class="form-control" name="rangoprevio' + i + '" required>' +
                    '<option value="" selected disabled>Seleccione una opción</option>' +
                    '<option value="0">No Aplica</option>' +
                    tmp +
                    '</select>' +
                    '</div>'+
                    '</div>'
                divrango = divrango + '<div class="col-sm-12 col-xs-12">' +
                '<div class="form-group">'+
                    '<label for="">Permite Cobrar Comisiones</label>' +
                    '<select class="form-control" name="p_cobrar_comision' + i + '" required>' +
                    '<option value="" selected disabled>Seleccione una opción</option>' +
                    '<option value="0">No</option>' +
                    '<option value="1">SI</option>' +
                    '</select>' +
                    '</div>'+
                    '</div>'
                divrango = divrango + '</div>'
            }
            $('#rango').append(divrango)
        }
  
</script>
@endpush