## -*- coding: utf-8 -*- <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">${_('User groups administration')}</h3> </div> <div class="panel-body"> <div class="fields"> <div class="field"> <div class="label label-checkbox"> <label for="users_group_active">${_('Add `%s` to user group') % c.user.username}:</label> </div> <div class="input"> ${h.text('add_user_to_group', placeholder="user group name", class_="medium")} </div> </div> </div> <div class="groups_management"> ${h.secure_form(h.route_path('edit_user_groups_management_updates', user_id=c.user.user_id), request=request)} <div id="repos_list_wrap"> <table id="user_group_list_table" class="display"></table> </div> <div class="buttons"> ${h.submit('save',_('Save'),class_="btn")} </div> ${h.end_form()} </div> </div> </div> <script> var api; $(document).ready(function() { var get_datatable_count = function(){ $('#user_group_count').text(api.page.info().recordsDisplay); }; $('#user_group_list_table').on('click', 'a.editor_remove', function (e) { e.preventDefault(); var row = api.row($(this).closest('tr')); row.remove().draw(); } ); $('#user_group_list_table').DataTable({ data: ${c.groups|n}, dom: 'rtp', pageLength: ${c.visual.admin_grid_items}, order: [[ 0, "asc" ]], columns: [ { data: {"_": "group_name", "sort": "group_name"}, title: "${_('Name')}", className: "td-componentname," , render: function (data,type,full,meta) {return '<div><i class="icon-group" title="User group">'+data+'</i></div>'}}, { data: {"_": "group_description", "sort": "group_description"}, title: "${_('Description')}", className: "td-description" }, { data: {"_": "users_group_id"}, className: "td-user", render: function (data,type,full,meta) {return '<input type="hidden" name="users_group_id" value="'+data+'">'}}, { data: {"_": "active", "sort": "active"}, title: "${_('Active')}", className: "td-active"}, { data: {"_": "owner_data"}, title: "${_('Owner')}", className: "td-user", render: function (data,type,full,meta) {return '<div class="rc-user tooltip">'+ '<img class="gravatar" src="'+ data.owner_icon +'" height="16" width="16">'+ data.owner +'</div>' } }, { data: null, title: "${_('Action')}", className: "td-action", defaultContent: '-' } ], language: { paginate: DEFAULT_GRID_PAGINATION, emptyTable: _gettext("No user groups available yet.") }, "initComplete": function( settings, json ) { var data_grid = $('#user_group_list_table').dataTable(); api = data_grid.api(); get_datatable_count(); } }); // update the counter when doing search $('#user_group_list_table').on( 'search.dt', function (e,settings) { get_datatable_count(); }); // filter, filter both grids $('#q_filter').on( 'keyup', function () { var user_api = $('#user_group_list_table').dataTable().api(); user_api .columns(0) .search(this.value) .draw(); }); // refilter table if page load via back button $("#q_filter").trigger('keyup'); }); $('#language').select2({ 'containerCssClass': "drop-menu", 'dropdownCssClass': "drop-menu-dropdown", 'dropdownAutoWidth': true }); $(document).ready(function(){ $("#group_parent_id").select2({ 'containerCssClass': "drop-menu", 'dropdownCssClass': "drop-menu-dropdown", 'dropdownAutoWidth': true }); $('#add_user_to_group').autocomplete({ serviceUrl: pyroutes.url('user_group_autocomplete_data'), minChars:2, maxHeight:400, width:300, deferRequestBy: 300, //miliseconds showNoSuggestionNotice: true, params: { user_groups:true }, formatResult: autocompleteFormatResult, lookupFilter: autocompleteFilterResult, onSelect: function(element, suggestion){ var owner = {owner_icon: suggestion.owner_icon, owner:suggestion.owner}; api.row.add( {"active": suggestion.active, "owner_data": owner, "users_group_id": suggestion.id, "group_description": suggestion.description, "group_name": suggestion.value}).draw(); } }); }) </script>