Merge pull request #5423 from sboursen-scinote/sb_SCI-8252

Button in the toolbar for assigning items to task from the inventory [SCI-8252]

app/assets/javascripts/repositories/repository_datatable.js

@@ -872,6 +872,12 @@ var RepositoryDatatable = (function(global) {
       changeToEditMode();
       // adjustTableHeader();
     })
+    .on('click', '#assignRepositoryRecords', function(e) {
+      e.preventDefault();
+      e.stopPropagation();
+
+      window.AssignItemsToTaskModalComponentContainer.showModal();
+    })
     .on('click', '#deleteRepositoryRecords', function(e) {
       e.preventDefault();
       e.stopPropagation();

app/assets/stylesheets/repository/assign_items_to_task_modal.scss

@@ -22,7 +22,10 @@
       display: flex;
       flex-direction: column;
       row-gap: .25rem;
+    }
 
+    .sn-select__search-input:focus {
+      box-shadow: none;
     }
 
     label {

app/javascript/packs/vue/assign_items_to_task_modal.js

@@ -26,6 +26,9 @@ function initAssignItemsToTaskModalComponent() {
         };
       },
       methods: {
+        showModal() {
+          this.visibility = true;
+        },
         closeModal() {
           this.visibility = false;
         }

app/javascript/vue/assign_items_to_tasks_modal/container.vue

@@ -39,6 +39,7 @@
             </label>
 
             <SelectSearch
+              :value="selectedProject"
               ref="projectsSelector"
               @change="changeProject"
               :options="projects"
@@ -65,6 +66,7 @@
             </label>
 
             <SelectSearch
+              :value="selectedExperiment"
               :disabled="!selectedProject"
               ref="experimentsSelector"
               @change="changeExperiment"
@@ -88,6 +90,7 @@
             </label>
 
             <SelectSearch
+              :value="selectedTask"
               :disabled="!selectedExperiment"
               ref="tasksSelector"
               @change="changeTask"

app/javascript/vue/shared/select.vue

@@ -18,6 +18,7 @@
   export default {
     name: 'Select',
     props: {
+      value: { type: [String, Number] },
       options: { type: Array, default: () => [] },
       initialValue: { type: [String, Number] },
       placeholder: { type: String },
@@ -25,7 +26,6 @@
     },
     data() {
       return {
-        value: null,
         isOpen: false,
         optionPositionStyle: ''
       }
@@ -66,8 +66,7 @@
         }
       },
       setValue(value) {
-        this.value = value;
-        this.$emit('change', this.value);
+        this.$emit('change', value);
       },
       updateOptionPosition() {
         const container = this.$refs.container;

app/javascript/vue/shared/select_search.vue

@@ -1,5 +1,5 @@
 <template>
-  <Select class="sn-select--search" :options="currentOptions" :placeholder="placeholder" v-bind:disabled="disabled" @change="change" @blur="blur" @open="open" @close="close">
+  <Select class="sn-select--search" :value="value" :options="currentOptions" :placeholder="placeholder" v-bind:disabled="disabled" @change="change" @blur="blur" @open="open" @close="close">
     <input ref="focusElement" v-model="query" type="text" class="sn-select__search-input" :placeholder="searchPlaceholder" />
     <span class="sn-select__value">{{ valueLabel || (placeholder || i18n.t('general.select')) }}</span>
     <span class="sn-select__caret caret"></span>
@@ -12,6 +12,7 @@
   export default {
     name: 'SelectSearch',
     props: {
+      value: { type: [String, Number] },
       options: { type: Array, default: () => [] },
       optionsUrl: { type: String },
       placeholder: { type: String },
@@ -21,7 +22,6 @@
     components: { Select },
     data() {
       return {
-        value: null,
         query: null,
         currentOptions: null,
         isOpen: false
@@ -59,15 +59,15 @@
         this.$emit('blur');
       },
       change(value) {
-        this.value = value;
         this.isOpen = false;
-        this.$emit('change', this.value);
+        this.$emit('change', value);
       },
       open() {
         this.isOpen = true;
         this.$emit('open');
       },
       close() {
+        this.query = '';
         this.isOpen = false;
         this.$emit('close');
       },

app/services/toolbars/repository_rows_service.rb

@@ -30,6 +30,7 @@ module Toolbars
       [
         restore_action,
         edit_action,
+        assign_action,
         duplicate_action,
         export_action,
         print_label_action,
@@ -68,6 +69,19 @@ module Toolbars
       }
     end
 
+    def assign_action
+      return unless can_manage_repository_rows?(@repository)
+
+      {
+        name: 'assign',
+        label: I18n.t('repositories.assign_record'),
+        icon: 'fas fa-paperclip',
+        button_class: 'assign-repository-rows-btn',
+        button_id: 'assignRepositoryRecords',
+        type: :legacy
+      }
+    end
+
     def duplicate_action
       return unless can_create_repository_rows?(@repository)
 

config/locales/en.yml

@@ -1958,6 +1958,7 @@ en:
         errors_list_title: "Items were not imported because one or more errors were found:"
         no_repository_name: "Item name is required!"
     edit_record: "Edit"
+    assign_record: "Assign to task"
     copy_record: "Duplicate"
     delete_record: "Delete"
     archive_record: "Archive"