From 98b362721986f55eb115f794770768ace71cc0ce Mon Sep 17 00:00:00 2001 From: Martin Artnik Date: Mon, 18 Jul 2022 12:31:04 +0200 Subject: [PATCH 1/2] Implement multiline editing in repositories [SCI-6982] --- .../renderers/columns/checklist.js | 2 +- .../repositories/renderers/columns/list.js | 4 +-- .../repositories/renderers/columns/status.js | 4 +-- .../repositories/repository_datatable.js | 35 ++++++++++--------- app/assets/javascripts/sitewide/atwho_res.js | 1 - .../repository/repository_table.scss | 11 +++--- .../toolbar/_row_actions.html.erb | 2 +- config/locales/en.yml | 2 +- 8 files changed, 32 insertions(+), 29 deletions(-) diff --git a/app/assets/javascripts/repositories/renderers/columns/checklist.js b/app/assets/javascripts/repositories/renderers/columns/checklist.js index aee9c6deb..58b798d04 100644 --- a/app/assets/javascripts/repositories/renderers/columns/checklist.js +++ b/app/assets/javascripts/repositories/renderers/columns/checklist.js @@ -38,7 +38,7 @@ var ChecklistColumnHelper = (function() { } function initialChecklistEditMode(formId, columnId, cell, values) { - var select = 'checklist-' + columnId; + var select = `checklist-${columnId}-${cell.parent()[0].id}`; var checklistUrl = $('.repository-column#' + columnId).data('items-url'); var $select = checklistSelect(select, checklistUrl, values); var $hiddenField = checklistHiddenField(formId, columnId, values); diff --git a/app/assets/javascripts/repositories/renderers/columns/list.js b/app/assets/javascripts/repositories/renderers/columns/list.js index 17dfc3595..431a90c09 100644 --- a/app/assets/javascripts/repositories/renderers/columns/list.js +++ b/app/assets/javascripts/repositories/renderers/columns/list.js @@ -4,7 +4,7 @@ var ListColumnHelper = (function() { function listSelect(select, url, value) { var selectedOption = ''; - var selectObject = $(``); @@ -26,7 +26,7 @@ var ListColumnHelper = (function() { } function initialListEditMode(formId, columnId, cell, value = null) { - var select = 'list-' + columnId; + var select = `list-${columnId}-${cell.parent()[0].id}`; var listUrl = $('.repository-column#' + columnId).data('items-url'); var $select = listSelect(select, listUrl, value); var $hiddenField = listHiddenField(formId, columnId, value); diff --git a/app/assets/javascripts/repositories/renderers/columns/status.js b/app/assets/javascripts/repositories/renderers/columns/status.js index 4a2c6bcf2..1b1b23f19 100644 --- a/app/assets/javascripts/repositories/renderers/columns/status.js +++ b/app/assets/javascripts/repositories/renderers/columns/status.js @@ -4,7 +4,7 @@ var StatusColumnHelper = (function() { function statusSelect(select, url, value) { var selectedOption = ''; - var selectObject = $(``); @@ -26,7 +26,7 @@ var StatusColumnHelper = (function() { } function initialStatusEditMode(formId, columnId, cell, value = null) { - var select = 'status-list-' + columnId; + var select = `status-list-${columnId}-${cell.parent()[0].id}`; var listUrl = $('.repository-column#' + columnId).data('items-url'); var $select = statusSelect(select, listUrl, value); var $hiddenField = statusHiddenField(formId, columnId, value); diff --git a/app/assets/javascripts/repositories/repository_datatable.js b/app/assets/javascripts/repositories/repository_datatable.js index 599b502c1..107511ecd 100644 --- a/app/assets/javascripts/repositories/repository_datatable.js +++ b/app/assets/javascripts/repositories/repository_datatable.js @@ -71,11 +71,7 @@ var RepositoryDatatable = (function(global) { $('#editDeleteCopy').hide(); $('#toolbarPrintLabel').hide(); } else { - if (rowsSelected.length === 1) { - $('#editRepositoryRecord').prop('disabled', false); - } else { - $('#editRepositoryRecord').prop('disabled', true); - } + $('#editRepositoryRecord').prop('disabled', false); $('#exportRepositoriesButton').removeClass('disabled'); $('#archiveRepositoryRecordsButton').prop('disabled', false); $('#copyRepositoryRecords').prop('disabled', false); @@ -142,10 +138,8 @@ var RepositoryDatatable = (function(global) { function changeToEditMode() { currentMode = 'editMode'; - // Table specific stuff - TABLE.button(0).enable(false); + clearRowSelection(); - $(TABLE_WRAPPER_ID).find('tr:not(.editing)').addClass('blocked'); updateButtons(); } @@ -262,9 +256,8 @@ var RepositoryDatatable = (function(global) { checkAvailableColumns(); - $(TABLE_ID).find('.repository-row-edit-icon').remove(); - RepositoryDatatableRowEditor.switchRowToEditMode(row); + changeToEditMode(); }); } @@ -542,6 +535,17 @@ var RepositoryDatatable = (function(global) { $('#repository-table_info').append(''); $('#selected_info').html(' (' + rowsSelected.length + ' entries selected)'); checkArchivedColumnsState(); + + // Hide edit button if not all selected rows are on the current page + let visibleRowIds = $( + `#repository-table-${$(TABLE_ID).data('repository-id')} tbody tr` + ).toArray().map((r) => parseInt(r.id, 10)); + + if (rowsSelected.every(r => visibleRowIds.includes(r))) { + $('#editRepositoryRecord').show(); + } else { + $('#editRepositoryRecord').hide(); + } }, preDrawCallback: function() { var archived = $('.repository-show').hasClass('archived'); @@ -769,15 +773,12 @@ var RepositoryDatatable = (function(global) { .on('click', '#editRepositoryRecord', function() { checkAvailableColumns(); - if (rowsSelected.length !== 1) { - return; - } - - let row = TABLE.row('#' + rowsSelected[0]); - $(TABLE_ID).find('.repository-row-edit-icon').remove(); - RepositoryDatatableRowEditor.switchRowToEditMode(row); + rowsSelected.forEach(function(rowNumber) { + RepositoryDatatableRowEditor.switchRowToEditMode(TABLE.row('#' + rowNumber)); + }); + changeToEditMode(); adjustTableHeader(); }) diff --git a/app/assets/javascripts/sitewide/atwho_res.js b/app/assets/javascripts/sitewide/atwho_res.js index 327720b26..0823a0baf 100644 --- a/app/assets/javascripts/sitewide/atwho_res.js +++ b/app/assets/javascripts/sitewide/atwho_res.js @@ -39,7 +39,6 @@ var SmartAnnotation = (function() { function generateFilterMenu() { var menu = ''; $.ajax({ - async: false, dataType: 'json', url: $(document.body).attr('data-atwho-repositories-url'), success: function(data) { diff --git a/app/assets/stylesheets/repository/repository_table.scss b/app/assets/stylesheets/repository/repository_table.scss index e9ad2ee83..2d589e5ca 100644 --- a/app/assets/stylesheets/repository/repository_table.scss +++ b/app/assets/stylesheets/repository/repository_table.scss @@ -345,6 +345,13 @@ opacity: 1; } } + + &.editing { + .assigned-column .repository-row-edit-icon { + opacity: 0; + pointer-events: none; + } + } } .editing { @@ -363,10 +370,6 @@ tr:hover { .assigned-column { - .repository-row-edit-icon { - opacity: 0; - } - .assign-counter-container { background-color: transparent; } diff --git a/app/views/repositories/toolbar/_row_actions.html.erb b/app/views/repositories/toolbar/_row_actions.html.erb index b1542b8ee..287fda4d4 100644 --- a/app/views/repositories/toolbar/_row_actions.html.erb +++ b/app/views/repositories/toolbar/_row_actions.html.erb @@ -3,7 +3,7 @@ <%if can_update_repository_rows?(@repository) %> diff --git a/config/locales/en.yml b/config/locales/en.yml index 8dd1f51ea..9a787d298 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -1699,7 +1699,7 @@ en: create: success_flash: "Successfully added item %{record} to inventory %{repository}" update: - success_flash: "Successfully updated item %{record} in inventory %{repository}" + success_flash: "Inventory items were successfully updated." destroy: success_flash: "%{records_number} item(s) successfully deleted." contains_other_records_flash: "%{records_number} item(s) successfully deleted. %{other_records_number} of the selected item(s) were created by other users and were not deleted." From 6227b1f5a1d1b5a8979719d178bfc792474ab320 Mon Sep 17 00:00:00 2001 From: Martin Artnik Date: Tue, 19 Jul 2022 14:22:40 +0200 Subject: [PATCH 2/2] Added edit overlays, disable more controls [SCI-6983] --- .../repositories/repository_datatable.js | 10 +++++ app/assets/stylesheets/repositories.scss | 44 +++++++++++++++++++ .../repositories/_repository_table.html.erb | 4 ++ .../repositories/_toolbar_buttons.html.erb | 3 ++ config/locales/en.yml | 3 +- 5 files changed, 63 insertions(+), 1 deletion(-) diff --git a/app/assets/javascripts/repositories/repository_datatable.js b/app/assets/javascripts/repositories/repository_datatable.js index 107511ecd..09efaa511 100644 --- a/app/assets/javascripts/repositories/repository_datatable.js +++ b/app/assets/javascripts/repositories/repository_datatable.js @@ -46,8 +46,12 @@ var RepositoryDatatable = (function(global) { function updateButtons() { if (currentMode === 'viewMode') { $(TABLE_WRAPPER_ID).removeClass('editing'); + $('.repository-save-changes-link').off('click'); + $('.repository-edit-overlay').hide(); $('#saveCancel').hide(); $('.manage-repo-column-index').prop('disabled', false); + $('#shareRepoBtn').removeClass('disabled'); + $('#viewSwitchButton').removeClass('disabled'); $('#addRepositoryRecord').prop('disabled', false); $('.dataTables_length select').prop('disabled', false); $('#repository-acitons-dropdown').prop('disabled', false); @@ -88,6 +92,9 @@ var RepositoryDatatable = (function(global) { } } else if (currentMode === 'editMode') { $(TABLE_WRAPPER_ID).addClass('editing'); + $('.repository-save-changes-link').on('click', function() { + $('#saveRecord').click(); + }); $('#importRecordsButton').hide(); $('#editDeleteCopy').hide(); $('#addRepositoryRecord').hide(); @@ -97,6 +104,8 @@ var RepositoryDatatable = (function(global) { } $('#saveCancel').show(); $('.manage-repo-column-index').prop('disabled', true); + $('#shareRepoBtn').addClass('disabled'); + $('#viewSwitchButton').addClass('disabled'); $('#repository-acitons-dropdown').prop('disabled', true); $('.dataTables_length select').prop('disabled', true); $('#addRepositoryRecord').prop('disabled', true); @@ -109,6 +118,7 @@ var RepositoryDatatable = (function(global) { $('.repository-row-selector').prop('disabled', true); $('.dataTables_filter input').prop('disabled', true); $('#toolbarPrintLabel').hide(); + $('.repository-edit-overlay').show(); } $('#toolbarPrintLabel').data('rows', JSON.stringify(rowsSelected)); diff --git a/app/assets/stylesheets/repositories.scss b/app/assets/stylesheets/repositories.scss index 620499267..9f06fd125 100644 --- a/app/assets/stylesheets/repositories.scss +++ b/app/assets/stylesheets/repositories.scss @@ -541,3 +541,47 @@ } } } + +.repository-table { + .repository-edit-overlay { + background: $color-white; + color: $color-silver-chalice; + display: none; + z-index: 1000; + + .repository-save-changes-link { + cursor: pointer; + } + } + + .repository-edit-overlay--toolbar { + height: 3em; + line-height: 2em; + padding: .5em 1em .5em .5em; + position: absolute; + right: 0; + text-align: right; + top: 2em; + width: 50%; + } + + .repository-edit-overlay--pagination { + bottom: 0; + height: 5em; + line-height: 5em; + padding: .5em; + position: fixed; + text-align: center; + width: calc(100% - var(--repository-sidebar-margin)); + + hr { + margin-top: -2.5em; + } + + span { + background: $color-white; + display: inline-block; + padding: 0 .5em; + } + } +} diff --git a/app/views/repositories/_repository_table.html.erb b/app/views/repositories/_repository_table.html.erb index 8de022268..b27db31f3 100644 --- a/app/views/repositories/_repository_table.html.erb +++ b/app/views/repositories/_repository_table.html.erb @@ -64,4 +64,8 @@ +
+ <%= t('repositories.pagination_edit_overlay_html') %> +
+
diff --git a/app/views/repositories/_toolbar_buttons.html.erb b/app/views/repositories/_toolbar_buttons.html.erb index 84c740ceb..9166e86d7 100644 --- a/app/views/repositories/_toolbar_buttons.html.erb +++ b/app/views/repositories/_toolbar_buttons.html.erb @@ -1,4 +1,7 @@