Mange stock modal improvements [SCI-9591] (#6545)

* Mange stock modlla improvements [SCI-9591]

* Fix manage stock modal close button [SCI-9591]

* Update manage stock url after update stock value [SCI-9591]

app/assets/javascripts/sitewide/repository_row_card.js

@@ -83,7 +83,8 @@
           // reload dataTable
           if ($('.dataTable')[0]) $('.dataTable').DataTable().ajax.reload();
           // update item card stock column
-          window.manageStockCallback && window.manageStockCallback(data.value)
+          window.manageStockCallback && window.manageStockCallback(data.value);
+          $link.data('manageStockUrl', data.value.stock_url)
         };
         window.manageStockModalComponent.showModal(stockValueUrl, updateCallback);
       }

app/assets/stylesheets/my_modules/stock_consumption_modal.scss

@@ -7,11 +7,7 @@
     margin-bottom: .8em;
 
     .units {
-      margin: 1.25em 0 0 .5em;
+      margin: 1.5rem 0 0 .5rem;
     }
   }
-
-  .comments-container {
-    margin-bottom: 1em;
-  }
 }

app/assets/stylesheets/repository/stock_modal.scss

@@ -11,7 +11,6 @@
     .stock-initial-container,
     .stock-final-container {
       align-items: center;
-      background: $color-concrete;
       border-radius: $border-radius-modal;
       display: flex;
       flex-direction: column;

app/javascript/vue/repository_item_sidebar/repository_values/RepositoryStockValue.vue

@@ -3,7 +3,7 @@
     <div class="font-inter text-sm font-semibold leading-5 relative">
       <span class="truncate w-full inline-block pr-[50px]" :title="colName">{{ colName }}</span>
       <a style="text-decoration: none;" class="absolute right-0 btn-text-link font-normal export-consumption-button"
-        v-if="permissions?.can_export_repository_stock === true && colVal?.stock_formatted" :data-rows="JSON.stringify([repositoryRowId])"
+        v-if="permissions?.can_export_repository_stock === true && values?.stock_formatted" :data-rows="JSON.stringify([repositoryRowId])"
         :data-object-id="repositoryId">
         {{ i18n.t('repositories.item_card.stock_export') }}
       </a>
@@ -12,13 +12,13 @@
       class="text-sn-dark-grey font-inter text-sm font-normal leading-5 w-full rounded relative block"
       :class="editableClassName"
       @click="enableEditing"
-      :data-manage-stock-url="stockValueUrl"
+      :data-manage-stock-url="values?.stock_url"
       :data-repository-row-id="repositoryId"
     >
-      <div v-if="values?.stock_formatted" class="text-sn-dark-grey font-inter text-sm font-normal leading-5 stock-value">
+      <div v-if="values?.stock_formatted" :data-manage-stock-url="values?.stock_url" class="text-sn-dark-grey font-inter text-sm font-normal leading-5 stock-value">
         {{ values.stock_formatted }}
       </div>
-      <div v-else class="text-sn-dark-grey font-inter text-sm font-normal leading-5 stock-value">
+      <div v-else :data-manage-stock-url="values?.stock_url" class="text-sn-dark-grey font-inter text-sm font-normal leading-5 stock-value">
         {{ i18n.t('repositories.item_card.repository_stock_value.no_stock') }}
       </div>
       <span class="absolute right-2 reminder" :class="{ 'top-1.5': permissions?.can_manage, 'top-0': !permissions?.can_manage, hidden: !values?.reminder }">
@@ -49,8 +49,7 @@
         stock_amount: null,
         low_stock_threshold: null,
         isEditing: null,
-        values: null,
-        stockValueUrl: null
+        values: null
       }
     },
     props: {
@@ -64,8 +63,8 @@
       actions: null, 
     },
     mounted() {
-      this.values = this.colVal;
-      this.stockValueUrl = this.actions.stock.stock_value_url
+      this.values = this.colVal || {};
+      this.values.stock_url = this.actions?.stock_value_url
       window.manageStockCallback = this.submitCallback;
     },
     unmounted(){

app/javascript/vue/repository_row/manage_stock_value_modal.vue

@@ -9,15 +9,15 @@
     <div class="modal-dialog" role="document" v-if="stockValue">
       <div class="modal-content">
         <div class="modal-header">
-          <button type="button" class="close" data-dismiss="modal" :aria-label="i18n.t('general.close')">
+          <button type="button" class="close self-start" data-dismiss="modal" :aria-label="i18n.t('general.close')">
             <i class="sn-icon sn-icon-close"></i>
           </button>
           <h4 class="modal-title">
-            <template v-if="!!stockValue?.id">
-              {{ i18n.t('repository_stock_values.manage_modal.title', { item: repositoryRowName }) }}
+            <template v-if="stockValue?.id">
+              {{ i18n.t('repository_stock_values.manage_modal.edit_title', { item: repositoryRowName }) }}
             </template>
             <template v-else>
-              {{ i18n.t('repository_stock_values.manage_modal.edit_title', { item: repositoryRowName }) }}
+              {{ i18n.t('repository_stock_values.manage_modal.title', { item: repositoryRowName }) }}
             </template>
           </h4>
         </div>

app/views/my_modules/repositories/_consume_stock_modal.html.erb

@@ -16,7 +16,7 @@
   <div class="modal-dialog modal-sm" role="document">
     <div class="modal-content">
       <div class="modal-header">
-        <button type="button" class="close" data-dismiss="modal" aria-label="<%= t('general.close') %>">
+        <button type="button" class="close self-start" data-dismiss="modal" aria-label="<%= t('general.close') %>">
           <i class="sn-icon sn-icon-close"></i>
         </button>
         <h4 class="modal-title">

app/views/my_modules/repositories/_consume_stock_modal_content.html.erb

@@ -2,7 +2,7 @@
               method: :post,
               html: { data: { remote: true } } do |f| %>
   <div class="modal-header">
-    <button type="button" class="close" data-dismiss="modal" aria-label="<%= t('general.close') %>">
+    <button type="button" class="close self-start" data-dismiss="modal" aria-label="<%= t('general.close') %>">
       <i class="sn-icon sn-icon-close"></i>
     </button>
     <h4 class="modal-title">
@@ -29,14 +29,11 @@
       </div>
       <span class="units"> <%= @stock_value.repository_stock_unit_item&.data %></span>
     </div>
-    <div class="sci-input-container comments-container"  data-error-text="<%= t('repository_stock_values.manage_modal.comment_limit') %>">
-      <%= f.label :comment, t('my_modules.repository.stock_modal.comment') %>
-      <%= f.text_field :comment, placeholder: t('my_modules.repository.stock_modal.enter_comment'), tabindex: 1, class: 'sci-input-field' %>
-    </div>
-    <div class="row mt-3">
+
+    <div class="row">
       <div class="col-sm-12">
         <div class="stock-update-view">
-          <div class="stock-initial-container <%= 'negative' if @stock_value.amount < 0 %>">
+          <div class="stock-initial-container bg-sn-super-light-grey <%= 'negative' if @stock_value.amount < 0 %>">
             <span class="subtitle"><%= t('repository_stock_values.manage_modal.current_stock') %></span>
             <span class="value"><%= @stock_value.formatted_value %></span>
             <span class="units"><%= @stock_value.repository_stock_unit_item&.data %></span>
@@ -44,7 +41,7 @@
           <div class="stock-arrow">
             <i class="sn-icon sn-icon-arrow-right"></i>
           </div>
-          <div class="stock-final-container ">
+          <div class="stock-final-container bg-sn-super-light-grey">
             <span class="subtitle"><%= t('repository_stock_values.manage_modal.new_stock') %></span>
             <span class="value">-</span>
             <span class="units"><%= @stock_value.repository_stock_unit_item&.data %></span>
@@ -52,6 +49,10 @@
         </div>
       </div>
     </div>
+    <div class="sci-input-container comments-container mt-3"  data-error-text="<%= t('repository_stock_values.manage_modal.comment_limit') %>">
+      <%= f.label :comment, t('my_modules.repository.stock_modal.comment') %>
+      <%= f.text_field :comment, placeholder: t('my_modules.repository.stock_modal.enter_comment'), tabindex: 1, class: 'sci-input-field' %>
+    </div>
   </div>
   <div class="modal-footer">
     <button type="button"

app/views/repository_rows/show.json.jbuilder

@@ -21,12 +21,10 @@ json.actions do
     end
   end
   json.direct_file_upload_path rails_direct_uploads_url
-  json.stock do
-    if @repository_row.has_stock?
-      json.stock_value_url edit_repository_stock_repository_repository_row_url(@repository, @repository_row)
-    elsif @repository.has_stock_management?
-      json.stock_value_url new_repository_stock_repository_repository_row_url(@repository, @repository_row)
-    end
+  if @repository_row.has_stock?
+    json.stock_value_url edit_repository_stock_repository_repository_row_url(@repository, @repository_row)
+  elsif @repository.has_stock_management?
+    json.stock_value_url new_repository_stock_repository_repository_row_url(@repository, @repository_row)
   end
 end