From 4364b1666e85eb4d2e38184a7dcd1bd64826c8ff Mon Sep 17 00:00:00 2001
From: Tomas Cohen Arazi <tomascohen@theke.io>
Date: Fri, 24 Apr 2020 11:50:04 -0300
Subject: [PATCH] Bug 25279: Use the API to list cities

This patch makes the general cities datatable use the API for rendering.
To test:
1. Test the datatable behaviour
2. Apply this patch
3. Repeat your tests
=> SUCCESS: Things work! Filtering and sorting specially

Bonus: Use the browser inspector to notice each interaction with the
datatable triggers an API call with the right query parameters

Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
---
 admin/cities.pl                               |  5 -
 .../prog/en/modules/admin/cities.tt           | 98 +++++++++++--------
 2 files changed, 57 insertions(+), 46 deletions(-)

diff --git a/admin/cities.pl b/admin/cities.pl
index de86112797..f25ec18571 100755
--- a/admin/cities.pl
+++ b/admin/cities.pl
@@ -101,11 +101,6 @@ if ( $op eq 'add_form' ) {
     $op = 'list';
 }
 
-if ( $op eq 'list' ) {
-    my $cities = Koha::Cities->search( { city_name => { -like => "%$searchfield%" } } );
-    $template->param( cities => $cities, );
-}
-
 $template->param(
     cityid      => $cityid,
     searchfield => $searchfield,
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/cities.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/cities.tt
index f4ec95d825..3b33747ff3 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/cities.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/cities.tt
@@ -133,39 +133,18 @@
         Searching: [% searchfield | html %]
     [% END %]
 
-    [% IF cities.count %]
-        <table id="table_cities">
-            <thead>
-                <tr>
-                    <th>City ID</th>
-                    <th>City</th>
-                    <th>State</th>
-                    <th>ZIP/Postal code</th>
-                    <th>Country</th>
-                    <th>Actions</th>
-                </tr>
-            </thead>
-            <tbody>
-                [% FOREACH city IN cities %]
-                <tr>
-                    <td>[% city.cityid | html %]</td>
-                    <td>[% city.city_name | html %]</td>
-                    <td>[% city.city_state | html %]</td>
-                    <td>[% city.city_zipcode | html %]</td>
-                    <td>[% city.city_country | html %]</td>
-                    <td class="actions">
-                        <a class="btn btn-default btn-xs" href="/cgi-bin/koha/admin/cities.pl?op=add_form&amp;cityid=[% city.cityid | html %]"><i class="fa fa-pencil"></i> Edit</a>
-                        <a class="btn btn-default btn-xs" href="/cgi-bin/koha/admin/cities.pl?op=delete_confirm&amp;cityid=[% city.cityid | html %]"><i class="fa fa-trash"></i> Delete</a>
-                    </td>
-                </tr>
-                [% END %]
-            </tbody>
-        </table>
-    [% ELSE %]
-        <div class="dialog message">
-            There are no cities defined. <a href="/cgi-bin/koha/admin/cities.pl?op=add_form">Create a new city</a>.
-        </div>
-    [% END %]
+    <table id="table_cities">
+        <thead>
+            <tr>
+                <th>City ID</th>
+                <th>City</th>
+                <th>State</th>
+                <th>ZIP/Postal code</th>
+                <th>Country</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+    </table>
 [% END %]
 
             </main>
@@ -183,14 +162,51 @@
     [% INCLUDE 'datatables.inc' %]
     <script>
         $(document).ready(function() {
-            $("#table_cities").dataTable($.extend(true, {}, dataTablesDefaults, {
-                "aoColumnDefs": [
-                    { "aTargets": [ -1, -2 ], "bSortable": false, "bSearchable": false },
-                ],
-                "aaSorting": [[ 1, "asc" ]],
-                "iDisplayLength": 10,
-                "sPaginationType": "full_numbers"
-            }));
+            var cities_table_url = '/api/v1/cities';
+            var cities_table = $("#table_cities").api({
+                "ajax": {
+                    "url": cities_table_url
+                },
+                'dom': 'C<"top pager"ilpfB><"#filter_c">tr<"bottom pager"ip>',
+                "columns": [
+                    {
+                        "data": "city_id",
+                        "searchable": true,
+                        "orderable": true
+                    },
+                    {
+                        "data": "name",
+                        "searchable": true,
+                        "orderable": true
+                    },
+                    {
+                        "data": "state",
+                        "searchable": true,
+                        "orderable": true
+                    },
+                    {
+                        "data": "postal_code",
+                        "searchable": true,
+                        "orderable": true
+                    },
+                    {
+                        "data": "country",
+                        "searchable": true,
+                        "orderable": true
+                    },
+                    {
+                        "data": function( row, type, val, meta ) {
+
+                            var result = '<a class="btn btn-default btn-xs" href="/cgi-bin/koha/admin/cities.pl?op=add_form&amp;cityid='+ row.id +'"><i class="fa fa-pencil"></i> Edit</a>';
+                            result += '<a class="btn btn-default btn-xs" href="/cgi-bin/koha/admin/cities.pl?op=delete_confirm&amp;cityid='+ row.id +'"><i class="fa fa-trash"></i> Delete</a>';
+                            return result;
+
+                        },
+                        "searchable": false,
+                        "orderable": false
+                    }
+                ]
+            });
         });
     </script>
 [% END %]
-- 
2.39.5