<div class="box box-primary box-solid" id="div-form-operacion-predefinida-{{ hash_vista }}">
    <div class="box-header with-border">
        <h3 class="box-title">Asignacion de Roles </h3>
        <div class="box-tools pull-right">
            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
        </div>
    </div>
    <div class="box-body">
        <div class="row">
            <div class="col-md-3">
                {{ mostrarVista('usuarios', 'roles/lst-sel-roles', { "hash_listado":hash_vista, "roles":roles } ) }}
            </div>
            <div class="col-md-9">
                <div>
                    <div class="box-tools pull-right">
                        {{ boton( 'eliminar', "eliminarPlanOperacion", "eliminarOperacion" ~ hash_vista ~ "()") }}
                    </div>
                    <div id="tbl-roles-{{hash_vista}}">
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{% block  javascript %}
<script type="text/javascript" >
    $(document).ready(function () {
        cargarDivision( "tbl-roles-{{hash_vista}}",
            "usuarios", "Usuarios", "tablaRoles", 'usuarioID={{Usuario.usuarioID}}'
        );
            
        $("#list-listRoles-{{ hash_vista }} li").click(function(){
            cargarRol{{hash_vista}}($(this).attr("data-operacion"));
        });
        
        
    });
    
    function cargarRol{{hash_vista}}(rolID){
        ejecutarOperacion(
            "usuarios", "Roles", "obtenerDatos",  'rolID='+rolID, 
            function(rol){
                agregarTabla{{hash_vista}}( rol.rolID, rol.rolCODIGO, rol.rolTITULO, rol.rolDESCRIPCION);
            }   
        ); 
    }    
        
        
    function agregarTabla{{hash_vista}}(rolID, rolCODIGO, rolTITULO, rolDESCRIPCION) {
        if(!$('#tbl-roles-{{hash_vista}} table tr#' + rolID).length){
            var id = moment().unix() + Math.floor(Math.random() * (10000 - 1 + 1)) + 1;
            agregarFilaTabla(
                'tbl-roles-{{hash_vista}} table', 
                    [ 
                        "<input type='checkbox' id='checkb"+rolID+"' name='checkb[]' value='"+rolID+"' class='checkTable check-Administrador-ControlOperaciones Seleccion' />"
                        + '<input type="hidden" id="id-' + id + '" name="id[]" value="' + id + '" />'
                        + '<input type="hidden" id="rolID-' + id + '" name="rolID[' + id + ']" value="' + rolID + '" />',
                        rolCODIGO,
                        rolTITULO,
                        rolDESCRIPCION
                    ], rolID
                );
            checkBoxSICAM('.check-Administrador-ControlOperaciones');
        }else{
            swal("Alerta!", "El permiso ya se encuentra registrada en el rol!", "warning");
        }
    }
    
    
    function eliminarOperacion{{ hash_vista }}() {
        var seleccionoperaciones = variosSeleccionadosTabla('tbl-roles-{{hash_vista}} .table', 'ELIMINAR');
        validacionCheckbox(seleccionoperaciones, function (){
            swal({
              title: "¿Estás Seguro que Deseas Eliminar?",
              text: "Una vez que elimines no podrás recuperar los datos!",         
              icon: "warning",
              buttons: ["Cancelar", "Eliminar"],
                  dangerMode: true,
                })
                .then((willDelete) => {
                    if (willDelete) {
                        seleccionoperaciones.forEach(function(operacion) {
                            quitarFilaTabla("#tbl-roles-{{hash_vista}} table", operacion.value);
                        });
                    }
                });
            }, false);
    }
</script>
{% endblock %}