DataTables for device PoE status report

Netdisco/lib/App/Netdisco/Web/Plugin/Report/DevicePoeStatus.pm

@@ -3,6 +3,7 @@ package App::Netdisco::Web::Plugin::Report::DevicePoeStatus;
 use Dancer ':syntax';
 use Dancer::Plugin::DBIC;
 use Dancer::Plugin::Auth::Extensible;
+use App::Netdisco::Util::ExpandParams 'expand_hash';
 
 use App::Netdisco::Web::Plugin;
 
@@ -14,20 +15,45 @@ register_report(
     }
 );
 
-get '/ajax/content/report/devicepoestatus' => require_login sub {
-    my $results = schema('netdisco')->resultset('Device')
-        ->with_poestats_as_hashref;
+get '/ajax/content/report/devicepoestatus/data' => require_role admin => sub {
+    send_error( 'Missing parameter', 400 )
+        unless ( param('draw') && param('draw') =~ /\d+/ );
 
-    return unless scalar $results;
+    my $rs = schema('netdisco')->resultset('Virtual::DevicePoeStatus');
+
+    my $exp_params = expand_hash( scalar params );
+
+    my $recordsTotal = $rs->count;
+
+    my @data = $rs->get_datatables_data($exp_params)->hri->all;
+
+    my $recordsFiltered = $rs->get_datatables_filtered_count($exp_params);
+
+    content_type 'application/json';
+    return to_json(
+        {   draw            => int( param('draw') ),
+            recordsTotal    => int($recordsTotal),
+            recordsFiltered => int($recordsFiltered),
+            data            => \@data,
+        }
+    );
+};
+
+get '/ajax/content/report/devicepoestatus' => require_login sub {
 
     if ( request->is_ajax ) {
-        template 'ajax/report/devicepoestatus.tt', { results => $results, },
-            { layout => undef };
+        template 'ajax/report/devicepoestatus.tt', {}, { layout => undef };
     }
     else {
+        my @results
+            = schema('netdisco')->resultset('Virtual::DevicePoeStatus')
+            ->hri->all;
+
+        return unless scalar @results;
+
         header( 'Content-Type' => 'text/comma-separated-values' );
         template 'ajax/report/devicepoestatus_csv.tt',
-            { results => $results, },
+            { results => \@results, },
             { layout  => undef };
     }
 };

Netdisco/share/views/ajax/device/details.tt

@@ -114,15 +114,15 @@
         <br/>PS1 [[% d.ps1_type | html_entity %]]: [% d.ps1_status | html_entity %]
         <br/>PS2 [[% d.ps2_type | html_entity %]]: [% d.ps2_status | html_entity %]</td>
     </tr>
-    [% IF d.power_modules.size %]
+    [% IF p.size %]
     <tr>
       <td>PoE Status</td>
       <td>
-      [% FOREACH m IN d.power_modules %]
+      [% FOREACH m IN p %]
         [% UNLESS m.module == 1 %]
           <br/>
         [% END %]
-        Module [% m.module %]: [% m.status | html_entity %], [% m.capable_ports %] power-capable ports, [% m.powered_ports %] powered ([% m.disabled_ports %] admin disabled, [% m.errored_ports %] errors), [% m.pwr_committed %]/[% m.power %] watts committed.
+        Module [% m.module %]: [% m.status | html_entity %], [% m.poe_capable_ports %] power-capable ports, [% m.poe_powered_ports %] powered ([% m.poe_disabled_ports %] admin disabled, [% m.poe_errored_ports %] errors), [% m.poe_power_committed %]/[% m.power %] watts committed.
       [% END %]
       </td>
     </tr>

Netdisco/share/views/ajax/report/devicepoestatus.tt

@@ -1,28 +1,14 @@
-[% USE Number.Format %]
-<div class="accordion" id="accordion-radio-pwr">
-[% count = 0 %]
-[% FOREACH row IN results %]
-  [% NEXT UNLESS row.power_modules.size %]
-  [% count = count + 1 %]
-  <div class="accordion-group">
-      <div class="accordion-heading"> 
-          <a class="accordion-toggle" data-toggle="collapse" data-target="#collapse-[% count %]" href="#collapse-[% count %]">
-            <i class="icon-chevron-down"></i> &nbsp;
-            [% row.dns || row.name %] &nbsp;
-            ( [% row.model %] ) &nbsp;
-            [% IF row.location %]
-              Location: [% row.location %]
-            [% END %]
-          </a>
-      </div>
-      <div id="collapse-[% count %]" class="accordion-body collapse in">
-        <div class="accordion-inner">
-        <table class="table table-bordered table-condensed">
+<table id="data-table" class="table table-bordered table-hover" width="100%" cellspacing="0">
   <thead>
     <tr>
+      <th>IP</th>
+      <th>DNS</th>
+      <th>Name</th>
+      <th>Model</th>
+      <th>Location</th>
       <th>PoE<br>Module</th>
-              <th class="nd_center-cell">Power<br>(W)</th>
       <th class="nd_center-cell">Supply</th>
+      <th class="nd_center-cell">Power<br>(W)</th>
       <th class="nd_center-cell">Capable<br>Ports</th>
       <th class="nd_center-cell">Powered<br>Ports</th>
       <th class="nd_center-cell">Disabled<br>Ports</th>
@@ -32,29 +18,168 @@
     </tr>
   </thead>
   <tbody>
-          [% FOREACH m IN row.power_modules %]
+    [% FOREACH row IN results %]
     <tr>
-              <td class="nd_center-cell">[% m.module %]</td>
-              <td class="nd_center-cell">[% m.power | format_number %]</td>
-              <td class="nd_center-cell">[% m.status %]</td>
-              <td class="nd_center-cell">[% m.capable_ports %]</td>
-              <td class="nd_center-cell">[% m.powered_ports %]</td>
-              <td class="nd_center-cell">[% m.disabled_ports %]</td>
-              <td class="nd_center-cell">[% m.errored_ports %]</td>
-              <td class="nd_center-cell">[% m.pwr_committed | format_number %]</td>
-              <td class="nd_center-cell">[% m.pwr_delivering | format_number %]</td>
+      <td>[% row.ip %]</td>
+      <td>[% row.dns %]</td>
+      <td>[% row.name %]</td>
+      <td>[% row.model %]</td>
+      <td>[% row.location %]</td>
+      <td>[% row.module %]</td>
+      <td class="nd_center-cell">[% row.power %]</td>
+      <td class="nd_center-cell">[% row.status %]</td>
+      <td class="nd_center-cell">[% row.poe_capable_ports %]</td>
+      <td class="nd_center-cell">[% row.poe_powered_ports %]</td>
+      <td class="nd_center-cell">[% row.poe_disabled_ports %]</td>
+      <td class="nd_center-cell">[% row.poe_errored_ports %]</td>
+      <td class="nd_center-cell">[% row.poe_power_committed %]</td>
+      <td class="nd_center-cell">[% row.poe_power_delivering %]</td>
     </tr>
     [% END %]
   </tbody>
 </table>
-      </div>
-    </div>
-  </div>
-[%END%]
-</div>
+
+<style>
+tr.group,
+tr.group:hover {
+    background-color: #ddd !important;
+}
+</style>
 
 <script>
-$('.accordion').on('show hide', function (n) {
-    $(n.target).siblings('.accordion-heading').find('.accordion-toggle i').toggleClass('icon-chevron-up icon-chevron-down');
+function groupString(d) {
+    "use strict";
+    var s = '';
+    s = s + 'Device: ';
+    s = s + '<a href="[% uri_for('/device') %]?tab=details&q=' + encodeURIComponent(d.ip) + '">';
+    s = s + he.encode(d.dns || d.name || d.ip);
+    if (d.dns || d.name) {
+        s = s + ' (' +  he.encode(d.ip) + ') ';
+    }
+    s = s + '</a> Model: ' + he.encode(d.model || '');
+    s = s + he.encode(d.location ? ' Location: ' + d.location : '');
+
+    return s;
+}
+
+$(document).ready(function() {
+    var table = $('#data-table').DataTable({
+    "processing": true,
+    "stateSave": true,
+    "pageLength": 25,
+    "language": {
+      "search": 'Filter records: '
+    },
+    "serverSide": true,
+    "ajax": '/ajax/content/report/devicepoestatus/data',
+    "order": [[ 0, 'asc' ]],
+    "columns": [
+      {
+        // Grouping column
+        "data": 'ip',
+        "visible": false
+      }, {
+        // Included for filtering
+        "data": 'dns',
+        "visible": false
+      }, {
+        // Included for filtering
+        "data": 'name',
+        "visible": false
+      }, {
+        // Included for filtering
+        "data": 'model',
+        "visible": false
+      }, {
+        // Included for filtering
+        "data": 'location',
+        "visible": false
+      }, {
+        "data": 'module',
+        "searchable": false
+      }, {
+        "data": 'status',
+        "className": "nd_center-cell",
+        "render": function(data, type, row, meta) {
+          return he.encode(data || '');
+        }
+      }, {
+        "data": 'power',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }, {
+        "data": 'poe_capable_ports',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }, {
+        "data": 'poe_powered_ports',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }, {
+        "data": 'poe_disabled_ports',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }, {
+        "data": 'poe_errored_ports',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }, {
+        "data": 'poe_power_committed',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }, {
+        "data": 'poe_power_delivering',
+        "className": "nd_center-cell",
+        "searchable": false,
+        "render": function(data, type, row, meta) {
+          return data.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+        }
+      }
+    ],
+    "drawCallback": function ( settings ) {
+      var api = this.api();
+      var rows = api.rows( {page:'current'} ).nodes();
+      var last=null;
+
+      api.column(0, {page:'current'} ).data().each( function ( group, i ) {
+        if ( last !== group ) {
+          var row_data = api.row( i ).data();
+          $(rows).eq( i ).before(
+            '<tr class="group"><td colspan="9">' + groupString(row_data) + '</td></tr>'
+            );
+          last = group;
+        }
+      } );
+    }
+  } );
+ 
+    // Order by the grouping
+    $('#data-table tbody').on( 'click', 'tr.group', function () {
+        var currentOrder = table.order()[0];
+        if ( currentOrder[0] === 0 && currentOrder[1] === 'asc' ) {
+            table.order( [ 0, 'desc' ] ).draw();
+        }
+        else {
+            table.order( [ 0, 'asc' ] ).draw();
+        }
+    } );
 } );
 </script>

Netdisco/share/views/ajax/report/devicepoestatus_csv.tt

@@ -4,22 +4,16 @@
               'Errored Ports' 'Committed (W)' 'Delivering (W)' ]) %]
 
 [% FOREACH row IN results %]
-  [% NEXT UNLESS row.power_modules.size %]
   [% mydlist = [] %]
-  [% mydevice = row.dns || row.name %]
+  [% mydevice = row.dns || row.name || row.ip %]
   [% mydlist.push(mydevice) %]
-  [% mydlist.push(row.model) %]
-  [% mydlist.push(row.location) %]
-  [% FOREACH m IN row.power_modules %]
-    [% myplist = [] %]
-    [% FOREACH col IN [ m.module m.power m.status m.capable_ports
-                        m.powered_ports m.disabled_ports m.errored_ports
-                        m.pwr_committed m.pwr_delivering
+  [% FOREACH col IN [ row.model row.location row.module row.power row.status
+                      row.poe_capable_ports row.poe_powered_ports
+                      row.poe_disabled_ports row.poe_errored_ports
+                      row.poe_power_committed row.poe_power_delivering
                       ] %]
-      [% myplist.push(col) %]
+    [% mydlist.push(col) %]
   [% END %]
-    [% CALL mydlist.splice(3, 9, myplist ) %]
   [% CSV.dump(mydlist) %]
 
 [%END%]
-[%END%]