From 92821d7f1e56e61a7686e7d2762d65a12a5bea15 Mon Sep 17 00:00:00 2001
From: Oleksii Kriuchykhin <okriuchykhin@biosistemika.com>
Date: Mon, 31 May 2021 11:51:04 +0200
Subject: [PATCH] Fix dates formatting in report templates [SCI-5774]

---
 app/assets/stylesheets/reports/new.scss          |  5 +++++
 .../reports/date_input_component.html.erb        | 16 ++++++++++++++--
 app/components/reports/date_input_component.rb   |  1 +
 app/services/report_actions/report_content.rb    |  6 ++++++
 config/locales/en.yml                            |  3 +++
 5 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/reports/new.scss b/app/assets/stylesheets/reports/new.scss
index 3a751cc2a..03a25a88e 100644
--- a/app/assets/stylesheets/reports/new.scss
+++ b/app/assets/stylesheets/reports/new.scss
@@ -333,6 +333,11 @@
         }
       }
 
+      .datetime-picker-container {
+        display: block;
+        max-width: 40%;
+      }
+
       .sci-checkbox-container {
         float: left;
         margin-right: .5em;
diff --git a/app/components/reports/date_input_component.html.erb b/app/components/reports/date_input_component.html.erb
index ba9fd8ad5..b2df5b536 100644
--- a/app/components/reports/date_input_component.html.erb
+++ b/app/components/reports/date_input_component.html.erb
@@ -1,8 +1,20 @@
 <% if @editing %>
   <div class="sci-input-container">
     <%= label_tag @name, @label %>
-    <%= date_field_tag @name, @value, placeholder: @placeholder, class: 'sci-input-field', data: { type: 'DateInputComponent' } %>
+    <div class="datetime-picker-container">
+      <span class="fas fa-calendar-alt"></span>
+      <input type="datetime"
+             name="<%= @name %>"
+             data-toggle='date-time-picker'
+             class="sci-input-field"
+             placeholder="<%= @placeholder %>"
+             data-date-format="<%= datetime_picker_format_date_only %>"
+             data-date-locale="<%= I18n.locale %>"
+             data-date-use-current="false"
+             data-type="DateInputComponent"
+             value="<%= @value.present? ? l(Date.parse(@value), format: :full) : '' %>"/>
+    </div>
   </div>
 <% else %>
-  <%= @value %>
+  <%= @value.present? ? l(Date.parse(@value), format: :full) : '' %>
 <% end %>
diff --git a/app/components/reports/date_input_component.rb b/app/components/reports/date_input_component.rb
index eedbcdff8..a6e9fbe58 100644
--- a/app/components/reports/date_input_component.rb
+++ b/app/components/reports/date_input_component.rb
@@ -2,5 +2,6 @@
 
 module Reports
   class DateInputComponent < TemplateValueComponent
+    include BootstrapFormHelper
   end
 end
diff --git a/app/services/report_actions/report_content.rb b/app/services/report_actions/report_content.rb
index 22c7bcc0c..6f5f26244 100644
--- a/app/services/report_actions/report_content.rb
+++ b/app/services/report_actions/report_content.rb
@@ -39,6 +39,12 @@ module ReportActions
 
         if @template_values.present?
           formatted_template_values = @template_values.as_json.map { |k, v| v['name'] = k; v }
+          formatted_template_values.each do |template_value|
+            if template_value['view_component'] == 'DateInputComponent'
+              template_value['value'] =
+                Date.strptime(template_value['value'], I18n.backend.date_format.dup.gsub(/%-/, '%')).iso8601
+            end
+          end
           # Save new template values
           @report.report_template_values.create!(formatted_template_values)
         end
diff --git a/config/locales/en.yml b/config/locales/en.yml
index f2ed6495c..46ace7c01 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2291,6 +2291,9 @@ en:
       user_invalid: "Invalid email."
       too_many_emails: "Only invited first %{nr} emails. To invite more users, "
 
+  date:
+    formats:
+      full: "%{date_format}"
   time:
     formats:
       full_js: "D.M.YYYY HH:mm"