From a662146866ac327a2d9e61031eec8ba220974a03 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Thu, 2 Sep 2021 14:36:07 +0000
Subject: [PATCH] Bug 28942: Use Flatpickr on acquisitions pages

This patch modifies several acquisitions pages replacing jQuery
datepickers with Flatpickr widgets.

To test, apply the patch and test datepickers on the following
Acquisitions pages:

 - Acquisitions -> Late orders (linked date fields in the sidebar)
 - Acquisitions -> Invoices (linked date fields in the sidebar)
 - Acquisitions -> Invoices -> Invoice details (shipment date and
   billing date)
 - Acquisitions -> Vendor -> Receive shipment (shipment date)
 - Acquisitions -> Vendor -> Receive shipment -> Receive (on order line)
   -> Date received field under "Accounting details
 - Acquisitions -> Orders search tab in the header -> Advanced search:
   Linked date fields in the search form."

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
---
 .../prog/en/includes/filter-orders.inc        |  8 ++--
 .../prog/en/modules/acqui/invoice.tt          |  6 ++-
 .../prog/en/modules/acqui/invoices.tt         | 48 +++++++++++++++----
 .../prog/en/modules/acqui/lateorders.tt       |  4 +-
 .../prog/en/modules/acqui/orderreceive.tt     |  3 +-
 .../prog/en/modules/acqui/parcels.tt          | 14 ++++--
 6 files changed, 63 insertions(+), 20 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc
index a2a7fc090e..ef8e38496d 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc
+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/filter-orders.inc
@@ -103,11 +103,11 @@
     </li>
 
     <li><label for="from">From: </label>
-    <input type="text" size="10" id="from" name="from" value="[% filters.from_placed_on | $KohaDates %]" class="datepickerfrom" />
-            <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
+        <input type="text" size="10" id="from" name="from" value="[% filters.from_placed_on | $KohaDates %]" class="flatpickrfrom" />
+        <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
     </li>
     <li><label for="to">To: </label>
-    <input type="text" size="10" id="to" name="to" value="[% filters.to_placed_on | $KohaDates %]" class="datepickerto" />
-            <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
+        <input type="text" size="10" id="to" name="to" value="[% filters.to_placed_on | $KohaDates %]" class="flatpickrto" />
+        <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
     </li>
 </ol>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoice.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoice.tt
index de9df0dcdd..ce0a059b87 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoice.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoice.tt
@@ -69,7 +69,8 @@
                 [% IF readonly %]
                     [% shipmentdate | $KohaDates %]
                 [% ELSE %]
-                    <input type="text" size="10" id="shipmentdate" name="shipmentdate" value="[% shipmentdate | $KohaDates %]" class="datepicker" />
+                    <input type="text" size="10" id="shipmentdate" name="shipmentdate" value="[% shipmentdate | $KohaDates %]" class="flatpickr" />
+                    <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
                 [% END %]
             </li>
 
@@ -78,7 +79,8 @@
                 [% IF readonly %]
                     [% billingdate | $KohaDates %]
                 [% ELSE %]
-                    <input type="text" size="10" id="billingdate" name="billingdate" value="[% billingdate | $KohaDates %]" class="datepicker" />
+                    <input type="text" size="10" id="billingdate" name="billingdate" value="[% billingdate | $KohaDates %]" class="flatpickr" />
+                    <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
                 [% END %]
             </li>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoices.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoices.tt
index 2526e8d46b..79c3942f30 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoices.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/invoices.tt
@@ -168,11 +168,17 @@
                                 <input type="text" size="10" id="merge_invoicenumber" name="invoicenumber" value="" class="required" required="required" />
                                 <span class="required">Required</span>
                                 </li>
-                        <li><label for="merge_shipmentdate">Shipment date:</label>
-                                <input type="text" size="10" id="merge_shipmentdate" name="shipmentdate" value="" class="datepicker" /></li>
+                        <li>
+                            <label for="merge_shipmentdate">Shipment date:</label>
+                            <input type="text" size="10" id="merge_shipmentdate" name="shipmentdate" value="" class="flatpickr" />
+                            <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
+                        </li>
 
-                      <li><label for="merge_billingdate">Billing date:</label>
-                              <input type="text" size="10" id="merge_billingdate" name="billingdate" value="" class="datepicker" /></li>
+                        <li>
+                            <label for="merge_billingdate">Billing date:</label>
+                            <input type="text" size="10" id="merge_billingdate" name="billingdate" value="" class="flatpickr" />
+                            <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
+                        </li>
 
                       <li><label for="merge_shipmentcost">Shipment cost:</label>
                               <input type="text" size="10" id="merge_shipmentcost" name="shipmentcost" value="" /></li>
@@ -291,11 +297,13 @@
               <ol>
                 <li>
                   <label for="shipmentdatefrom">From:</label>
-                  <input type="text" id="shipmentdatefrom" name="shipmentdatefrom" size="10" value="[% shipmentdatefrom | $KohaDates %]" class="datepicker" />
+                  <input type="text" id="shipmentdatefrom" name="shipmentdatefrom" size="10" value="[% shipmentdatefrom | $KohaDates %]" />
+                  <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
                 </li>
                 <li>
                   <label for="shipmentdateto">To:</label>
-                  <input type="text" id="shipmentdateto" name="shipmentdateto" size="10" value="[% shipmentdateto | $KohaDates %]" class="datepicker" />
+                  <input type="text" id="shipmentdateto" name="shipmentdateto" size="10" value="[% shipmentdateto | $KohaDates %]" />
+                  <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
                 </li>
               </ol>
             </fieldset>
@@ -306,11 +314,13 @@
               <ol>
                 <li>
                   <label for="billingdatefrom">From:</label>
-                  <input type="text" id="billingdatefrom" name="billingdatefrom" size="10" value="[% billingdatefrom | $KohaDates %]" class="datepicker" />
+                  <input type="text" id="billingdatefrom" name="billingdatefrom" size="10" value="[% billingdatefrom | $KohaDates %]" />
+                  <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
                 </li>
                 <li>
                   <label for="billingdateto">To:</label>
-                  <input type="text" id="billingdateto" name="billingdateto" size="10" value="[% billingdateto | $KohaDates %]" class="datepicker" />
+                  <input type="text" id="billingdateto" name="billingdateto" size="10" value="[% billingdateto | $KohaDates %]" />
+                  <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
                 </li>
               </ol>
             </fieldset>
@@ -449,6 +459,28 @@
                     $('#merge_invoices').show();
                 }
             });
+            var shipmentdatefrom = $("#shipmentdatefrom").flatpickr({
+                onClose: function( selectedDates, dateText, instance) {
+                    validate_date( selectedDates, instance );
+                    shipmentdateto.set('minDate', selectedDates[0]);
+                }
+            });
+            var shipmentdateto = $("#shipmentdateto").flatpickr({
+                onClose: function( selectedDates, dateText, instance) {
+                    validate_date( selectedDates, instance );
+                },
+            });
+            var billingdatefrom = $("#billingdatefrom").flatpickr({
+                onClose: function( selectedDates, dateText, instance) {
+                    validate_date( selectedDates, instance );
+                    billingdateto.set('minDate', selectedDates[0]);
+                }
+            });
+            var billingdateto = $("#billingdateto").flatpickr({
+                onClose: function( selectedDates, dateText, instance) {
+                    validate_date( selectedDates, instance );
+                },
+            });
         });
     </script>
 [% END %]
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt
index bbe1ee375f..c4847c145c 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt
@@ -232,11 +232,11 @@
 <ol>
     <li><label for="delay">Order date:</label><input size="3" maxlength="3" id="delay" type="text" name="delay" value="[% delay | html %]" /> days ago</li>
     <li><label for="from">Estimated delivery date from: </label>
-        <input type="text" size="10" id="from" name="estimateddeliverydatefrom" value="[% estimateddeliverydatefrom | html %]" class="datepickerfrom" />
+        <input type="text" size="10" id="from" name="estimateddeliverydatefrom" value="[% estimateddeliverydatefrom | html %]" class="flatpickrfrom" />
         <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
     </li>
     <li><label for="to">To: </label>
-        <input type="text" size="10" id="to" name="estimateddeliverydateto" value="[% estimateddeliverydateto | html %]" class="datepickerto" />
+        <input type="text" size="10" id="to" name="estimateddeliverydateto" value="[% estimateddeliverydateto | html %]" class="flatpickrto" />
         <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
     </li>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/orderreceive.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/orderreceive.tt
index f62b228052..d5a449aad7 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/orderreceive.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/orderreceive.tt
@@ -277,7 +277,8 @@
         <ol>
             <li>
                 <label for="datereceived">Date received: </label>
-                <input type="text" size="10" id="datereceived" name="datereceived" value="[% datereceived | $KohaDates %]" class="datepicker" />
+                <input type="text" size="10" id="datereceived" name="datereceived" value="[% datereceived | $KohaDates %]" class="flatpickr" />
+                <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
             </li>
        <li><label for="bookfund">Fund: </label><select id="bookfund" name="bookfund">
             <option value="">Keep current ([% budget_period_description | html %] - [% order.fund.budget_name | html %])</option>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/parcels.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/parcels.tt
index 5b4c53f548..7eeae33487 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/parcels.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/parcels.tt
@@ -163,7 +163,7 @@
         </li> -->
          <li>
             <label for="shipmentdate">Shipment date: </label>
-            <input type="text" id="shipmentdate" name="shipmentdate" maxlength="10" size="10" value="[% shipmentdate_today | $KohaDates %]" class="datepicker" />
+            <input type="text" id="shipmentdate" name="shipmentdate" maxlength="10" size="10" value="[% shipmentdate_today | $KohaDates %]" class="flatpickr" />
             <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
         </li>
         <li>
@@ -203,8 +203,16 @@
         <ol>
             <li> <input type="hidden" name="booksellerid" value="[% booksellerid | html %]" /></li>
             <li><label for="filter">Invoice number:</label><input type="text" size="20" name="filter" value="[% filter | html %]" id="filter" /></li>
-            <li><label for="datefrom">From:</label><input type="text" size="9" id="datefrom" name="datefrom" value="[% datefrom | html %]" class="datepicker" /><br />
-                <label for="dateto">To:</label><input type="text" size="9" id="dateto" name="dateto" value="[% dateto | html %]" class="datepicker" /></li>
+            <li>
+                <label for="datefrom">From:</label>
+                <input type="text" size="9" id="datefrom" name="datefrom" value="[% datefrom | html %]" class="flatpickr" />
+                <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
+            </li>
+            <li>
+                <label for="dateto">To:</label>
+                <input type="text" size="9" id="dateto" name="dateto" value="[% dateto | html %]" class="flatpickr" />
+                <div class="hint">[% INCLUDE 'date-format.inc' %]</div>
+            </li>
             <li><label for="orderby">Sort by :</label><select name="orderby" id="orderby">
                 <option value="invoicenumber">Invoice number</option>
                 <option value="shipmentdate">Shipment date</option>
-- 
2.39.5