DataTables for port search results tab

Use device_port_vlan table to search for VLANs rather than the device_port table

Netdisco/lib/App/Netdisco/Web/Plugin/Search/Port.pm

@@ -7,39 +7,57 @@ use Dancer::Plugin::Auth::Extensible;
 use App::Netdisco::Web::Plugin;
 use App::Netdisco::Util::Web 'sql_match';
 
-register_search_tab({ tag => 'port', label => 'Port', provides_csv => 1 });
+register_search_tab( { tag => 'port', label => 'Port', provides_csv => 1 } );
 
 # device ports with a description (er, name) matching
 get '/ajax/content/search/port' => require_login sub {
     my $q = param('q');
-    send_error('Missing query', 400) unless $q;
-    my $set;
+    send_error( 'Missing query', 400 ) unless $q;
+    my $rs;
 
-    if ($q =~ m/^\d+$/) {
-        $set = schema('netdisco')->resultset('DevicePort')
-          ->search({vlan => $q});
+    if ( $q =~ m/^\d+$/ ) {
+        $rs
+            = schema('netdisco')->resultset('DevicePort')
+            ->columns( [qw/ ip port name descr /] )->search(
+            { "port_vlans.vlan" => $q },
+            {   '+columns' => [qw/ device.dns device.name port_vlans.vlan /],
+                join       => [qw/ port_vlans device /]
+            }
+            );
     }
     else {
-        my ($likeval, $likeclause) = sql_match($q);
+        my ( $likeval, $likeclause ) = sql_match($q);
 
-        $set = schema('netdisco')->resultset('DevicePort')
-          ->search({-or => [
-                      {name => (param('partial') ? $likeclause : $q)},
-                      (length $q == 17 ? {mac => $q}
-                                       : \['mac::text ILIKE ?', $likeval]),
-                    ]});
+        $rs
+            = schema('netdisco')->resultset('DevicePort')
+            ->columns( [qw/ ip port name descr /] )->search(
+            {   -or => [
+                    { "me.name" => ( param('partial') ? $likeclause : $q ) },
+                    (   length $q == 17
+                        ? { "me.mac" => $q }
+                        : \[ 'me.mac::text ILIKE ?', $likeval ]
+                    ),
+                ]
+            },
+            {   '+columns' => [qw/ device.dns device.name port_vlans.vlan /],
+                join       => [qw/ port_vlans device /]
+            }
+            );
     }
-    return unless $set->count;
 
-    if (request->is_ajax) {
-        template 'ajax/search/port.tt', {results => $set},
+    my @results = $rs->hri->all;
+    return unless scalar @results;
+
+    if ( request->is_ajax ) {
+        my $json = to_json( \@results );
+        template 'ajax/search/port.tt', { results => $json },
             { layout => undef };
     }
     else {
         header( 'Content-Type' => 'text/comma-separated-values' );
-        template 'ajax/search/port_csv.tt', {results => $set},
+        template 'ajax/search/port_csv.tt', { results => \@results },
             { layout => undef };
     }
 };
 
-true;
+1;

Netdisco/share/views/ajax/search/port.tt

@@ -1,23 +1,45 @@
-<table class="table table-bordered table-condensed table-striped nd_floatinghead">
+<table id="data-table" class="table table-striped table-bordered" width="100%" cellspacing="0">
   <thead>
     <tr>
-      <th>Description</th>
-      <th>Port</th>
       <th>Name</th>
+      <th>Port</th>
+      <th>Description</th>
       <th>Vlan</th>
     </tr>
   </thead>
-  </tbody>
-    [% WHILE (row = results.next) %]
-    <tr>
-      <td>[% row.name | html_entity %]</td>
-      <td><a href="[% device_ports %]&q=[% row.ip | uri %]&f=[% row.port | uri %]">
-        [% row.ip | html_entity %] [ [% row.port | html_entity %] ]</a>
-        [% ' (' _ row.device.dns _ ')' IF row.device.dns %]
-      </td>
-      <td>[% row.descr | html_entity %]</td>
-      <td>[% row.vlan  | html_entity %]</td>
-    </tr>
-    [% END %]
-  </tbody>
 </table>
+
+<script type="text/javascript">
+$(document).ready(function() {
+  var table = $('#data-table').dataTable({
+    "deferRender": true,
+    "data": [% results %],
+    "columns": [{
+        "data": 'name',
+        "render": function(data, type, row, meta) {
+          return he.encode(data || '');
+        }
+      }, {
+        "data": 'ip',
+        "render": function(data, type, row, meta) {
+          var ddns = '';
+          if (row.device.dns || row.device.name) {
+            ddns = ' (' + he.encode(row.device.dns || row.device.name)  + ')';
+          }
+          return '<a href="[% device_ports %]&q=' + encodeURIComponent(data) + '&f=' + encodeURIComponent(row.port) + '">' + he.encode(data) + '[' + he.encode(row.port) + ']</a>' + ddns;
+        }
+      }, {
+        "data": 'descr',
+        "render": function(data, type, row, meta) {
+          return he.encode(data || '');
+        }
+      }, {
+        "data": 'port_vlans.vlan',
+        "render": function(data, type, row, meta) {
+          return data;
+        }
+      }
+    ]
+  });
+});</script>
+

Netdisco/share/views/ajax/search/port_csv.tt

@@ -1,7 +1,7 @@
 [% USE CSV -%]
 [% CSV.dump([ 'Description' 'Port' 'Name' 'Vlan' ]) %]
 
-[% WHILE (row = results.next) %]
+[% FOREACH row IN results %]
   [% mylist = [] %]
   [% myport = "$row.ip [ $row.port ] (" _ row.device.dns _ ")" IF row.device.dns %]
   [% FOREACH col IN [ row.name myport row.descr row.vlan ] %]