From 61fac69e419b21ee4f1639cb1c6cab329a35a808 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maur=C3=ADcio=20Meneghini=20Fauth?= Date: Mon, 26 Apr 2021 13:45:36 -0300 Subject: Replace edit user group dialog with a modal MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Replaces the edit user group jQuery UI dialog with a Bootstrap modal. - Replaces some jQuery code with vanilla JavaScript. Signed-off-by: Maurício Meneghini Fauth --- .eslintrc.json | 1 + js/src/server/privileges.js | 130 ++++++++++----------- templates/server/privileges/choose_user_group.twig | 21 ++-- templates/server/privileges/new_user_ajax.twig | 4 +- templates/server/privileges/users_overview.twig | 24 +++- 5 files changed, 96 insertions(+), 84 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index f09942e85a..46b6bd9141 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -12,6 +12,7 @@ }, "globals": { "AJAX": "readonly", + "bootstrap": "readonly", "CodeMirror": "readonly", "CommonActions": "readonly", "CommonParams": "readonly", diff --git a/js/src/server/privileges.js b/js/src/server/privileges.js index a4a60d1eb0..b205d84a25 100644 --- a/js/src/server/privileges.js +++ b/js/src/server/privileges.js @@ -31,6 +31,58 @@ function checkAddUser (theForm) { return Functions.checkPassword($(theForm)); } +function editUserGroup (event) { + const editUserGroupModal = document.getElementById('editUserGroupModal'); + const button = event.relatedTarget; + const username = button.getAttribute('data-username'); + + $.get( + 'index.php?route=/server/privileges', + { + 'username': username, + 'ajax_request': true, + 'edit_user_group_dialog': true, + 'server': CommonParams.get('server') + }, + data => { + if (typeof data === 'undefined' || data.success !== true) { + Functions.ajaxShowMessage(data.error, false, 'error'); + + return; + } + + const modal = bootstrap.Modal.getInstance(editUserGroupModal); + const modalBody = editUserGroupModal.querySelector('.modal-body'); + const saveButton = editUserGroupModal.querySelector('#editUserGroupModalSaveButton'); + + modalBody.innerHTML = data.message; + + saveButton.addEventListener('click', () => { + const form = $(editUserGroupModal.querySelector('#changeUserGroupForm')); + + $.post( + 'index.php?route=/server/privileges', + form.serialize() + CommonParams.get('arg_separator') + 'ajax_request=1', + data => { + if (typeof data === 'undefined' || data.success !== true) { + Functions.ajaxShowMessage(data.error, false, 'error'); + + return; + } + + const userGroup = form.serializeArray().find(el => el.name === 'userGroup').value; + // button -> td -> tr -> td.usrGroup + const userGroupTableCell = button.parentElement.parentElement.querySelector('.usrGroup'); + userGroupTableCell.textContent = userGroup; + } + ); + + modal.hide(); + }); + } + ); +} + /** * AJAX scripts for /server/privileges page. * @@ -53,7 +105,12 @@ function checkAddUser (theForm) { AJAX.registerTeardown('server/privileges.js', function () { $('#fieldset_add_user_login').off('change', 'input[name=\'username\']'); $(document).off('click', '#deleteUserCard .btn.ajax'); - $(document).off('click', 'a.edit_user_group_anchor.ajax'); + + const editUserGroupModal = document.getElementById('editUserGroupModal'); + if (editUserGroupModal) { + editUserGroupModal.removeEventListener('show.bs.modal', editUserGroup); + } + $(document).off('click', 'button.mult_submit[value=export]'); $(document).off('click', 'a.export_user_anchor.ajax'); $('#dropUsersDbCheckbox').off('click'); @@ -195,73 +252,10 @@ AJAX.registerOnload('server/privileges.js', function () { }); }); // end Revoke User - $(document).on('click', 'a.edit_user_group_anchor.ajax', function (event) { - event.preventDefault(); - $(this).parents('tr').addClass('current_row'); - var $msg = Functions.ajaxShowMessage(); - $.get( - $(this).attr('href'), - { - 'ajax_request': true, - 'edit_user_group_dialog': true - }, - function (data) { - if (typeof data !== 'undefined' && data.success === true) { - Functions.ajaxRemoveMessage($msg); - var buttonOptions = {}; - buttonOptions[Messages.strGo] = function () { - var usrGroup = $('#changeUserGroupDialog') - .find('select[name="userGroup"]') - .val(); - var $message = Functions.ajaxShowMessage(); - var argsep = CommonParams.get('arg_separator'); - $.post( - 'index.php?route=/server/privileges', - $('#changeUserGroupDialog').find('form').serialize() + argsep + 'ajax_request=1', - function (data) { - Functions.ajaxRemoveMessage($message); - if (typeof data !== 'undefined' && data.success === true) { - $('#usersForm') - .find('.current_row') - .removeClass('current_row') - .find('.usrGroup') - .text(usrGroup); - } else { - Functions.ajaxShowMessage(data.error, false); - $('#usersForm') - .find('.current_row') - .removeClass('current_row'); - } - } - ); - $(this).dialog('close'); - }; - buttonOptions[Messages.strClose] = function () { - $(this).dialog('close'); - }; - var $dialog = $('
') - .attr('id', 'changeUserGroupDialog') - .append(data.message) - .dialog({ - width: 500, - minWidth: 300, - modal: true, - buttons: buttonOptions, - title: $('legend', $(data.message)).text(), - close: function () { - $(this).remove(); - } - }); - $dialog.find('legend').remove(); - } else { - Functions.ajaxShowMessage(data.error, false); - $('#usersForm') - .find('.current_row') - .removeClass('current_row'); - } - } - ); - }); + const editUserGroupModal = document.getElementById('editUserGroupModal'); + if (editUserGroupModal) { + editUserGroupModal.addEventListener('show.bs.modal', editUserGroup); + } /** * AJAX handler for 'Export Privileges' diff --git a/templates/server/privileges/choose_user_group.twig b/templates/server/privileges/choose_user_group.twig index c76c21dcac..cdeaf1dde6 100644 --- a/templates/server/privileges/choose_user_group.twig +++ b/templates/server/privileges/choose_user_group.twig @@ -1,15 +1,12 @@
- {{ get_hidden_inputs(params) }} -
- {% trans 'User group' %} + {{ get_hidden_inputs(params) }} + - - - -
+ +
diff --git a/templates/server/privileges/new_user_ajax.twig b/templates/server/privileges/new_user_ajax.twig index b5fdd11b46..5689f30841 100644 --- a/templates/server/privileges/new_user_ajax.twig +++ b/templates/server/privileges/new_user_ajax.twig @@ -48,9 +48,9 @@ {% endif %} {% if user.has_group_edit %} - + {% endif %} diff --git a/templates/server/privileges/users_overview.twig b/templates/server/privileges/users_overview.twig index a6680ac75d..75bb3787fb 100644 --- a/templates/server/privileges/users_overview.twig +++ b/templates/server/privileges/users_overview.twig @@ -76,9 +76,9 @@ {% if menus_work and user_group_count > 0 %} {% if host.user is not empty %} - + {% endif %} {% endif %} @@ -144,3 +144,23 @@ + + -- cgit v1.2.3