@extends('layouts.app')

@section('content')
<!-- end sidebar menu -->
<!-- start page content -->
<div class="page-content-wrapper">
    <div class="page-content">
        <div class="page-bar">
            <div class="page-title-breadcrumb">
                <!--<div class="pull-left">
                        <div class="page-title text-danger">Sin Sucursal</div>
                    </div>-->
                <ol class="breadcrumb page-breadcrumb pull-right">
                    <li><i class="fa fa-home"></i>&nbsp;<a class="parent-item" href="{{ url('/dashboard') }}">Inicio</a>&nbsp;<i class="fa fa-angle-right"></i>
                    </li>
                    <li><i class="fa fa-users"></i>&nbsp;<a class="parent-item" href="{{ url('/plantillas') }}">Listado de Plantillas</a>
                        &nbsp;<i class="fa fa-angle-right"></i>
                    <li><i class="fa fa-users"></i>&nbsp;<a class="parent-item" href="{{ url('/contratos') }}">Plantilla ()</a>
                        &nbsp;<i class="fa fa-angle-right"></i>
                    </li>
                    <li class="active">Servicio o Tipo</li>
                </ol>
            </div>
        </div>
        <!-- start widget -->
        <!-- start admited patient list -->
        <div class="row">
            <div class="col-md-12 col-sm-12">
                <div class="card  card-box">
                    <div class="card-head">
                        <header>Datos generales</header>
                    </div>
                    @if(isset($edit))
                    {!! Form::model($edit,['url' => 'comisiones/asignar-empleado/'.$id,'method'=>'POST','enctype'=>'multipart/form-data','id'=>'frmPlantillas']) !!}
                    @else
                    {!! Form::open(['url' => 'comisiones/asignar-empleado/'. $id,'method'=>'POST','enctype'=>'multipart/form-data','role'=>'form','id'=>'frmPlantillas']) !!}
                    @endif
                    <div class="card-body">
                        <div class="row mb-3 ">
                            <div class="col-4">
                                <label for="">Tipo de uso</label>
                                {!! Form::select('tipo_uso',['1' => 'Tipo de servicio', '2'=>'Servicio'], null,['id'=>'tipo_uso','class'=>'form-control select2']) !!}
                            </div>

                           {{--  {!! Form::mselect('tipo_servicio',$servicios,null,'Tipo de Servicio',$errors,4,true, ['onchange'=>'busqueda(this)']) !!} --}}
                            <div class="col-4">
                                <label >Tipo de Servicio</label>
                                {!! Form::select('tipo_servicio', $servicios,null,['id'=>'tipo_servicio','class'=>'form-control select2','onchange' => "busqueda()",'placeholder'=>'Servicios']) !!}
                            </div>
                            <div class="col-4">
                                <label for="">Servicio</label>
                                {!! Form::select('servicio',[],null,['id'=>'servicio','class'=>'form-control select2','placeholder'=>'Servicios']) !!}
                            </div>

                        </div>
                        <div class="row mb-3 col-md-12">
                            <div class="col-6">
                                <label for="comision_anticipada" class="form-label">Comisión Anticipada </label><br>
                                <input type="checkbox" name="comision_anticipada" data-off="No" data-on="Si" {{isset($edit) ? $edit->ecs_comision_anticipada ? 'checked' : '' : ''}} data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                            </div>

                            <div class="col-6">
                                <label for="prima" class="form-label">Usar Prima Como Parte de Pago </label><br>
                                <input type="checkbox" name="prima" data-off="No" data-on="Si" {{isset($edit) ? $edit->ecs_permite_prima ? 'checked' : '' : ''}} data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                            </div>

                        </div>
                        <div class="row mb-3 col-md-12">
                            <div class="col-6">
                                <label for="">Aplica Sobre</label>
                                {!! Form::select('comisiones',['1'=>'Solo ventas propias', '2'=>'Ventas propias y subalternos','3'=>'Todas las ventas de la sucursal','4'=>'Todas las ventas de valle de paz','5'=>'Todas las ventas antiguas de una asociacion solidarista'],null,['id'=>'comisiones','class'=>'form-control select2','onchange' => "",'placeholder'=>'-Seleccionar-']) !!}
                            </div>
                           {{--  {!! Form::mselect('comisiones',[],null,'Aplica Comisión Sobre',$errors,6,false) !!} --}}

                            {!! Form::mNumber('meta_venta',isset($edit) ? $edit->plantilla_jerarquia : null,'Meta de Ventas Mes',$errors,6,false) !!}
                        </div>
                        <div class="row mb-3">
                            <div class="col-6">
                                <label for="">Subalternos Directos</label>
                                {!! Form::select('subalternos_directos',[],null,['id'=>'subalternos_directos','class'=>'form-control select2','placeholder'=>'Seleccionar']) !!}
                            </div>
                            <div class="col-6">
                                <label for="">Subalternos Secundarios
                                </label>
                                {!! Form::select('subalternos_secundarios',[],null,['id'=>'subalternos_secundarios','class'=>'form-control select2','placeholder'=>'Seleccionar']) !!}
                            </div>

                        </div>
                        <div class="row mb-3">
                            <div class="col-6">
                                <label for="">Sedes</label>
                                {!! Form::select('sede',$sedes,null,['id'=>'sede','class'=>'form-control select2','placeholder'=>'Seleccionar']) !!}
                            </div>
                            <div class="col-6">
                                <label for="">Asociaciones</label>
                                {!! Form::select('asociacion',$asociaciones,null,['id'=>'asociacion','class'=>'form-control select2','placeholder'=>'Seleccionar']) !!}
                            </div>
                        </div>


                        <div class="row mb-3 col-md-12">
                            {!! Form::mselect('tipo_comision',$tipo_comision,null,'Tipo de Comisión',$errors,6,false) !!}

                            <div class="col-6">
                                <label for="cuotas_aplica">Cuotas en las que aplica</label>
                                {!! Form::select('cuotas',[''=>'Seleccionar','1'=>'Todas las cutoas de comisión unica','2'=>'Seleccionar cuotas comisión unica','3'=>'Seleccionar cuotas comision variables'],null,['id'=>'cuotas_aplica','class' =>'form-control select2', 'onchange'=>'cuota(this)']) !!}
                            </div>
                        </div>
                        <div class="row mb-3 col-12" id="unica_cuota">
                            <div class="col-md-6">
                                <a onclick="agregar_unica()" class="btn btn-primary mb-3"><i class="fa fa-plus"></i>Agregar</a>
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover" id="unica">
                                        <thead>
                                            <tr>
                                                <th>Cuota</th>
                                                <th>Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>

                            {!! Form::mNumber('procentaje',isset($edit) ? $edit->plantilla_jerarquia : null,'Porcentaje o Valor de Comisión',$errors,6,false) !!}
                        </div>
                        {{-- <div class="row mb-3 col-12">
                            {!! Form::mNumber('procentaje',isset($edit) ? $edit->plantilla_jerarquia : null,'Porcentaje o Valor de Comisión',$errors,12,true) !!}
                        </div> --}}

                        <div class="row mb-3 col-12">
                            <a onclick="agregar_variable()" class="btn btn-primary mb-3"><i class="fa fa-plus"></i>Agregar</a>
                            <div class="table-responsive">
                                <table class="table table-striped table-hover" id="variable">
                                    <thead>
                                        <tr>
                                            <th>Cuota</th>
                                            <th>Porcentaje o Valor</th>
                                            <th>Acciones</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <div class="row mb-3 col-md-12">
                            {!! Form::mselect('base_calculo',['1'=>'Valor Total','2'=>'Valor total del lote','3'=>'Valor total - Comisión Recaudadora','4'=>'Valor total del lote - Comisión Recaudadora', '5'=>'Valor fijo'],null,'Base para Cálculo',$errors,6,false) !!}

                            {!! Form::mtext('valor_comision',null,'Valor Comisión',$errors,6,false,false,null,'') !!}


                        </div>

                        <div class="row mb-3 col-md-12">
                            <div class="col-6">
                                <label for="">Monto Mínino</label>
                                <input class="form-control" type="text" name="monto_minimo" id="monto_minimo"
                                data-thousands="." data-decimal="," data-prefix="₡ " />

                            </div>
                            <div class="col-6">
                                <label for="monto_maximo">Monto Máximo</label>
                                <input class="form-control" type="text" name="monto_maximo" id="monto_maximo"
                                data-thousands="." data-decimal="," data-prefix="₡ " />
                            </div>

                        </div>
                    </div>

                </div>
            </div>

            <div class="col-md-12">
                <div class="card card-box">
                    <div class="card-head">
                        Reglas comisión
                    </div>
                    <div class="card-body">
                        <div class="row mb-3">
                           <div class="col-4">
                            <label for="">Regla Establecida de Venta </label>
                            <input type="number" name="regla_de_ventam" class="form-control">
                           </div>

                           <div class="col-4">
                            <label for="regla_dos_meses" class="form-label">Aplica Regla Dos Meses </label><br>
                            <input type="checkbox" name="regla_dos_meses" data-off="No" data-on="Si" {{isset($edit) ? $edit->ecs_regla_dos_meses ? 'checked' : '' : ''}} data-toggle="toggle" data-onstyle="primary" data-offstyle="danger">
                           </div>

                           <div class="col-4">
                            <label for="">Valor Diferencia Para Regla Cambio Plan</label>
                          {{--   {!! Form::text('cambio_plan_difencia_valor',null,'Valor Diferencia Para Regla Cambio Plan',$errors,6,false,true,null,'') !!} --}}
                          <input class="form-control" type="text" name="cambio_plan_difencia_valor" id="cambio_plan_difencia_valor"
                          data-thousands="." data-decimal="," data-prefix="₡ " />
                           </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12 col-sm-12">
                <div class="card  card-box">
                    <div class="card-head">
                        <header>Vendedores directos</header>
                    </div>

                    <div class="card-body">
                        <div class="row mb-3 col-md-12">
                            <div class="col-6">
                                <label for="vendedores_directors" class="form-label">Gana Comisión Sobre Vendedores Directos </label><br>
                                <input type="checkbox" name="vendedores_directors" data-off="No" data-on="Si" {{isset($edit) ? $edit->cliente_autoriza_envio_email ? 'checked' : '' : ''}} data-toggle="toggle" data-onstyle="primary" data-offstyle="danger" id="calculo_vendedores_directos" onchange="calculo_vendedores_directos(this)">
                            </div>


                        </div>
                        <div class="row mb-3 col-12" id="aplica_calculo_vendedores_directos">
                            <div class="col-md-6">
                                <a onclick="agregar_unica_vendedores_directos()" class="btn btn-primary mb-3"><i class="fa fa-plus"></i>Agregar</a>
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover" id="unica_vendedores_directos">
                                        <thead>
                                            <tr>
                                                <th>Cuota</th>
                                                <th>Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="row col-md-12">
                           {{--  <label for="">Cuotas sobre vendedores Directos</label> --}}
                            {!! Form::mselect('cuotas_vendedores_directos',['1'=>'Todas las cuotas comisión unica','2'=>'Seleccionar cuotas comisión unica','3'=>'Seleccionar cuotas comision variable'],null,'Cuotas Sobre Vendedores Directos',$errors,6,false) !!}
                            {!! Form::mNumber('procentaje_valor_comision_vend_directo',isset($edit) ? $edit->plantilla_jerarquia : null,'Porcentaje o Valor de Comisión',$errors,6,false) !!}
                        </div>



                        <div class="row mb-3 col-12">
                            {!! Form::mselect('calculo_vendedor_directos',['1'=>'Valor total','2'=>'Valor total del lote','3'=>'Valor total - Comision recaudadora', '4'=>'Valor total del lote - Comision recaudadora','5'=>'Valor fijo', '6'=>'Valor de la prima'],null,'Cálculo Sobre Vendedores Directos',$errors,6,false) !!}
                        </div>
                    </div>

                </div>
            </div>

            <div class="col-md-12 col-sm-12">
                <div class="card  card-box">
                    <div class="card-head">
                        <header>Vendedores de la sucursal</header>
                    </div>

                    <div class="card-body">
                        <div class="row mb-3 col-md-12">
                            <div class="col-6">
                                <label for="aplica_vendedores_sucursal" class="form-label">Gana Comisión Sobre Vendedores de la Sucursal</label><br>
                                <input type="checkbox" name="aplica_vendedores_sucursal" data-off="No" data-on="Si" {{isset($edit) ? $edit->cliente_autoriza_envio_email ? 'checked' : '' : ''}} data-toggle="toggle" data-onstyle="primary" data-offstyle="danger" id="calculo_vendedores_sucursal" onchange="calculo_vendedores_sucursal(this)">
                            </div>


                        </div>
                        <div class="row mb-3 col-12" id="aplica_calculo_vendedores_sucursal">
                            <div class="col-md-6">
                                <a onclick="agregar_unica_vendedores_sucursal()" class="btn btn-primary mb-3"><i class="fa fa-plus"></i>Agregar</a>
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover" id="unica_vendedores_sucursal">
                                        <thead>
                                            <tr>
                                                <th>Cuota</th>
                                                <th>Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

                        <div class="row col-md-12">

                            {!! Form::mselect('cuotas_vendedores_sucursal',['1'=>'Todas las cuotas comisión unica','2'=>'Seleccionar cuotas comisión unica','3'=>'Seleccionar cuotas comision variable'],null,'Cuotas Sobre Vendedores Sucursal',$errors,6,true) !!}

                            {!! Form::mNumber('procentaje_valor_sucursal',isset($edit) ? $edit->plantilla_jerarquia : null,'Porcentaje Sobre Vendedores de la Sucursal',$errors,6,false) !!}
                        </div>
                        <div class="row mb-3 col-12">
                            {!! Form::mselect('calculo_vendedor_sucursal',['1'=>'Valor total','2'=>'Valor total del lote','3'=>'Valor total - Comision recaudadora', '4'=>'Valor total del lote - Comision recaudadora','5'=>'Valor fijo', '6'=>'Valor de la prima'],null,'Cálculo Sobre Vendedores Sucursal',$errors,6,false) !!}
                        </div>



                    </div>

                </div>
            </div>

            <div class="col-md-12 col-sm-12">
                <div class="card  card-box">
                    <div class="card-head">
                        <header>Vendedores secundarios</header>
                    </div>

                    <div class="card-body">
                        <div class="row mb-3 col-md-12">
                            <div class="col-6">
                                <label for="aplica_vendedores_secundarios" class="form-label">Gana Comisión Sobre Vendedores Secundarios</label><br>
                                <input type="checkbox" name="aplica_vendedores_secundarios" data-off="No" data-on="Si" {{isset($edit) ? $edit->cliente_autoriza_envio_email ? 'checked' : '' : ''}} data-toggle="toggle" data-onstyle="primary" data-offstyle="danger" id="calculo_vendedores_secundarios" onchange="calculo_vendedores_secundarios(this)">
                            </div>


                        </div>
                        <div class="row mb-3 col-12" id="aplica_calculo_vendedores_secundarios">
                            <div class="col-md-6">
                                <a onclick="agregar_unica_vendedores_secundarios()" class="btn btn-primary mb-3"><i class="fa fa-plus"></i>Agregar</a>
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover" id="unica_vendedores_secundarios">
                                        <thead>
                                            <tr>
                                                <th>Cuota</th>
                                                <th>Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="row mb-3 col-12">
                            {!! Form::mselect('servicio_cuotas_vende_secundarios',['1'=>'Todas las cuotas comisión unica','2'=>'Seleccionar cuotas comisión unica','3'=>'Seleccionar cuotas comision variable'],null,'Cuotas Sobre Vendedores Secundarios',$errors,6,false) !!}

                            {!! Form::mNumber('procentaje_vendedores_secundarias',isset($edit) ? $edit->plantilla_jerarquia : null,'Porcentaje Sobre Vendedores de la Secundarios',$errors,6,false) !!}



                        </div>
                        <div class="row mb-3 col-12">
                            {!! Form::mselect('calculo_vendedor_secundarios',['1'=>'Valor total','2'=>'Valor total del lote','3'=>'Valor total - Comision recaudadora', '4'=>'Valor total del lote - Comision recaudadora','5'=>'Valor fijo', '6'=>'Valor de la prima'],null,'Cálculo Sobre Vendedores Secundarios',$errors,6,false) !!}
                        </div>

                        {{-- <div class="row mb-3 col-12">
                            <a onclick="agregar_variable()" class="btn btn-primary mb-3"><i class="fa fa-plus"></i>Agregar</a>
                            <div class="table-responsive">
                                <table class="table table-striped table-hover" id="variable">
                                    <thead>
                                        <tr>
                                            <th>Cuota</th>
                                            <th>Porcentaje o Valor</th>
                                            <th>Acciones</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row mb-3 col-12">
                            {!! Form::mselect('cuota_sobre_vendedores_secundarios',['1'=>'Valor total','2'=>'Valor total del lote','3'=>'Valor total - Comision recaudadora', '4'=>'Valor total del lote - Comision recaudadora','5'=>'Valor fijo', '6'=>'Valor de la prima'],null,'Cálculo Sobre Vendedores Directos',$errors,6,false) !!}
                        </div> --}}
                    </div>


                </div>
            </div>

            <div class="col-md-12 col-sm-12">
                <div class="card-footer text-center">
                    <div class="text-center">
                        <button type="submit" class="btn bg-success">Aceptar</button>
                        <a class="btn bg-danger" href="{{url('plantilla/'.$id.'/ver')}}">Cancelar</a>
                    </div>
                </div>
            </div>
            {!! Form::close() !!}

        </div>
    </div>
</div>
@endsection
@section('script')
<script>
    document.getElementById('unica_cuota').style.display='none'
    document.getElementById('aplica_calculo_vendedores_directos').style.display = 'none'
    document.getElementById('aplica_calculo_vendedores_sucursal').style.display = 'none'
    document.getElementById('aplica_calculo_vendedores_secundarios').style.display = 'none'
    function eliminar(id) {
        Swal.fire({
            icon: 'warning',
            title: 'Eliminar',
            text: '¿Realmente desea eliminar la couta?',
            showCancelButton: true,
            confirmButtonText: 'Si',
            cancelButtonText: 'No',
            customClass: {
                confirmButton: 'btn btn-primary',
                cancelButton: 'btn btn-danger'
            },
        }).then((result) => {
            if (result.isConfirmed) {
                $('#fila_' + id).remove();
            }
        });

    }

    function cuota(){

        if(document.getElementById('cuotas_aplica').value === '1'){
            document.getElementById('unica_cuota').style.display='none'
        }else{
            document.getElementById('unica_cuota').style.display='block'
        }
    }

    function calculo_vendedores_directos(){

        if(document.getElementById('calculo_vendedores_directos').checked){
            document.getElementById('aplica_calculo_vendedores_directos').style.display = 'block'
        }else{
            document.getElementById('aplica_calculo_vendedores_directos').style.display = 'none'
        }
    }

    function calculo_vendedores_sucursal(){
        if(document.getElementById('calculo_vendedores_sucursal').checked){
            document.getElementById('aplica_calculo_vendedores_sucursal').style.display = 'block'
        }else{
            document.getElementById('aplica_calculo_vendedores_sucursal').style.display = 'none'
        }
    }

    function calculo_vendedores_secundarios(){
        if(document.getElementById('calculo_vendedores_secundarios').checked){
            document.getElementById('aplica_calculo_vendedores_secundarios').style.display = 'block'
        }else{
            document.getElementById('aplica_calculo_vendedores_secundarios').style.display = 'none'
        }
    }

    function agregar_unica() {
        var idFila = Math.floor(Math.random() * (9999 - 1)) + 2;
        var html = `<tr id="fila_${idFila}">
                            <td>
                                <div class="input-group spinner">
                                    <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="dwn" type="button">
                                        <span class="fa fa-minus"></span>
                                    </button>
                                        </span>
                                    <input type="text" name="unica_vendedores" class="form-control text-center"  min="0" max="100"> <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="up" type="button">
                                        <span class="fa fa-plus"></span>
                                    </button>
                                </span>
                                </div>
                            </td>
                            <td>
                                <a onclick="eliminar(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i></a>
                            </td>
                        </tr>`;
        $('#unica tbody').append(html);

    }

    function agregar_unica_vendedores_secundarios() {
        var idFila = Math.floor(Math.random() * (9999 - 1)) + 2;
        var html = `<tr id="fila_${idFila}">
                            <td>
                                <div class="input-group spinner">
                                    <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="dwn" type="button">
                                        <span class="fa fa-minus"></span>
                                    </button>
                                        </span>
                                    <input type="text" name="unica_vendedores_secundarios" class="form-control text-center"  min="0" max="100"> <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="up" type="button">
                                        <span class="fa fa-plus"></span>
                                    </button>
                                </span>
                                </div>
                            </td>
                            <td>
                                <a onclick="eliminar(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i></a>
                            </td>
                        </tr>`;
        $('#unica_vendedores_secundarios tbody').append(html);

    }

    function agregar_unica_vendedores_sucursal() {
        var idFila = Math.floor(Math.random() * (9999 - 1)) + 2;
        var html = `<tr id="fila_${idFila}">
                            <td>
                                <div class="input-group spinner">
                                    <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="dwn" type="button">
                                        <span class="fa fa-minus"></span>
                                    </button>
                                        </span>
                                    <input type="text" name="unica_vendedores_sucursal" class="form-control text-center"  min="0" max="100"> <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="up" type="button">
                                        <span class="fa fa-plus"></span>
                                    </button>
                                </span>
                                </div>
                            </td>
                            <td>
                                <a onclick="eliminar(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i></a>
                            </td>
                        </tr>`;
        $('#unica_vendedores_sucursal tbody').append(html);

    }

    function agregar_unica_vendedores_directos() {
        var idFila = Math.floor(Math.random() * (9999 - 1)) + 2;
        var html = `<tr id="fila_${idFila}">
                            <td>
                                <div class="input-group spinner">
                                    <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="dwn" type="button">
                                        <span class="fa fa-minus"></span>
                                    </button>
                                        </span>
                                    <input type="text" name="cuotas_vendedores_directo_data" class="form-control text-center"  min="0" max="100"> <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="up" type="button">
                                        <span class="fa fa-plus"></span>
                                    </button>
                                </span>
                                </div>
                            </td>
                            <td>
                                <a onclick="eliminar(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i></a>
                            </td>
                        </tr>`;
        $('#unica_vendedores_directos tbody').append(html);

    }

    function agregar_variable() {
        var idFila = Math.floor(Math.random() * (9999 - 1)) + 2;
        var html = `<tr id="fila_${idFila}">
                            <td>
                                <div class="input-group spinner">
                                    <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="dwn" type="button">
                                        <span class="fa fa-minus"></span>
                                    </button>
                                        </span>
                                    <input type="text"  class="form-control text-center" min="0" max="100"> <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="up" type="button">
                                        <span class="fa fa-plus"></span>
                                    </button>
                                </span>
                                </div>
                            </td>
                            <td>
                                <div class="input-group spinner">
                                    <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="dwn" type="button">
                                        <span class="fa fa-minus"></span>
                                    </button>
                                        </span>
                                    <input type="text" class="form-control text-center"  min="0"> <span class="input-group-btn">
                                    <button class="btn btn-info" data-dir="up" type="button">
                                        <span class="fa fa-plus"></span>
                                    </button>
                                </span>
                                </div>
                            </td>
                            <td>
                                <a onclick="eliminar(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i></a>
                            </td>
                        </tr>`;
        $('#variable tbody').append(html);

    }

    function busqueda(e) {

        var id_servicio = $('#tipo_servicio').val();


        if (id_servicio != '') {
            var url = "{{ URL::asset('servicios/tipo-servicio') }}" + "/" + id_servicio;
            $.get(url, function(res) {

                var obj = $.parseJSON(res);

                document.getElementById('servicio').innerHTML = "";
                document.getElementById("servicio").options[document.getElementById("servicio").options.length] = new Option('Seleccionar', ' ');
                if (obj.length > 0) {

                    for (i = 0; i < obj.length; i++) {
                        document.getElementById("servicio").options[document.getElementById("servicio").options.length] = new Option(obj[i]['servicio_nombre'], obj[i]['servicio_id']);
                    }
                }
            });



        }
    }

    $(document).ready(function() {

        $("#cambio_plan_difencia_valor").maskMoney();
        $("#monto_minimo").maskMoney();
        $("#monto_maximo").maskMoney();



        //Initialize Select2 Elements
        $('.select2').select2()

        //Initialize Select2 Elements
        $('.select2bs4').select2({
            theme: 'bootstrap4'
        });

        /* $('#frmPlantillas').validate({
            rules: {
                nombre: {
                    required: true
                },
                jerarquia: {
                    required: true
                },
                estado: {
                    required: true
                },
            },
            messages: {
                nombre: {
                    required: "Campo nombre es requerido"
                },
                jerarquia: {
                    required: "Campo jerarquía es requerido"
                },
                estado: {
                    required: "Campo estado es requerido"
                }
            },
            errorElement: 'span',
            errorPlacement: function(error, element) {
                error.addClass('invalid-feedback');
                element.closest('.form-group').append(error);
            },
            highlight: function(element, errorClass, validClass) {
                $(element).addClass('is-invalid');
            },
            unhighlight: function(element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
            }
        }); */
    });
</script>
@endsection