diff --git a/app/assets/javascripts/my_modules/assigned_users.js b/app/assets/javascripts/my_modules/assigned_users.js new file mode 100644 index 000000000..4a96775b0 --- /dev/null +++ b/app/assets/javascripts/my_modules/assigned_users.js @@ -0,0 +1,81 @@ +/* global I18n dropdownSelector HelperModule animateSpinner */ +/* eslint-disable no-use-before-define */ +(function() { + function initAssignedUsersSelector() { + var myModuleUserSelector = '#module-assigned-users-selector'; + + dropdownSelector.init(myModuleUserSelector, { + closeOnSelect: true, + labelHTML: true, + tagClass: 'my-module-user-tags', + tagLabel: (data) => { + return `${data.label} + ${data.label}`; + }, + customDropdownIcon: () => { + return ''; + }, + optionLabel: (data) => { + if (data.params.avatar_url) { + return ` + ${data.label} + ${data.label}`; + } + + return data.label; + }, + onSelect: function() { + var selectElement = $(myModuleUserSelector); + var lastUser = selectElement.next().find('.ds-tags').last(); + var lastUserId = lastUser.find('.tag-label').data('ds-tag-id'); + var newUser; + + if (lastUserId > 0) { + newUser = { + user_my_module: { + user_id: lastUserId + } + }; + } else { + newUser = { + user_my_module: { + user_id: selectElement.val() + } + }; + } + + $.post(selectElement.data('users-create-url'), newUser, function(result) { + dropdownSelector.removeValue(myModuleUserSelector, 0, '', true); + dropdownSelector.addValue(myModuleUserSelector, { + value: result.user.id, + label: result.user.full_name, + params: { + avatar_url: result.user.avatar_url, + user_module_id: result.user.user_module_id + } + }, true); + }).fail(function() { + dropdownSelector.removeValue(myModuleUserSelector, lastUserId, '', true); + }); + }, + onUnSelect: (id) => { + var umID = $(myModuleUserSelector).find(`option[value="${id}"]`).data('params').user_module_id; + + $.ajax({ + url: `${$(myModuleUserSelector).data('update-module-users-url')}/${umID}`, + type: 'DELETE', + success: () => { + dropdownSelector.closeDropdown(myModuleUserSelector); + }, + error: (r) => { + if (r.status === 403) { + HelperModule.flashAlertMsg(I18n.t('general.no_permissions'), 'danger'); + } + } + }); + } + }).getContainer(myModuleUserSelector).addClass('my-module-users-container'); + } + + initAssignedUsersSelector(); +}()); diff --git a/app/views/user_my_modules/_index.html.erb b/app/views/user_my_modules/_index.html.erb index 60efd7322..7977a7c2a 100644 --- a/app/views/user_my_modules/_index.html.erb +++ b/app/views/user_my_modules/_index.html.erb @@ -19,3 +19,5 @@ 'data-view-mode': !can_manage_my_module_designated_users?(my_module) } %> + +<%= javascript_include_tag 'my_modules/assigned_users' %> diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb index f0c69bfd4..bbbbf2d91 100644 --- a/config/initializers/assets.rb +++ b/config/initializers/assets.rb @@ -31,6 +31,7 @@ Rails.application.config.assets.precompile += %w(my_modules/status_flow.js) Rails.application.config.assets.precompile += %w(my_modules/protocols/protocol_status_bar.js) Rails.application.config.assets.precompile += %w(my_modules/results.js) Rails.application.config.assets.precompile += %w(my_modules/stock.js) +Rails.application.config.assets.precompile += %w(my_modules/assigned_users.js) Rails.application.config.assets.precompile += %w(my_modules/tags.js) Rails.application.config.assets.precompile += %w(my_modules/archived.js) Rails.application.config.assets.precompile += %w(my_modules/pwa_mobile_app.js)