ONOS-1817 - GUI -- Bytes and packets are now displayed in the flow table.

Change-Id: I0d2cc8134a36dc7421270cdca27686c43cc3a8aa

@@ -59,6 +59,8 @@ public class FlowViewMessageHandler extends UiMessageHandler {
     private static final String TIMEOUT = "timeout";
     private static final String PERMANENT = "permanent";
     private static final String STATE = "state";
+    private static final String PACKETS = "packets";
+    private static final String BYTES = "bytes";
 
     private static final String COMMA = ", ";
 
@@ -98,7 +100,7 @@ public class FlowViewMessageHandler extends UiMessageHandler {
 
         private static final String[] COL_IDS = {
                 ID, APP_ID, GROUP_ID, TABLE_ID, PRIORITY, SELECTOR,
-                TREATMENT, TIMEOUT, PERMANENT, STATE
+                TREATMENT, TIMEOUT, PERMANENT, STATE, PACKETS, BYTES
         };
 
         public FlowTableRow(FlowEntry f) {
@@ -112,6 +114,8 @@ public class FlowViewMessageHandler extends UiMessageHandler {
             add(TIMEOUT, f.timeout());
             add(PERMANENT, f.isPermanent());
             add(STATE, capitalizeFully(f.state().toString()));
+            add(PACKETS, f.packets());
+            add(BYTES, f.packets());
         }
 
         private String getSelectorString(FlowEntry f) {

@@ -26,6 +26,8 @@
                     <td colId="timeout" sortable>Timeout </td>
                     <td colId="permanent" sortable>Permanent </td>
                     <td colId="state" sortable>State </td>
+                    <td colId="packets" sortable>Packets </td>
+                    <td colId="bytes" sortable>Bytes </td>
                 </tr>
             </table>
         </div>
@@ -33,7 +35,7 @@
         <div class="table-body">
             <table>
                 <tr ng-hide="tableData.length" class="no-data ignore-width">
-                    <td colspan="8">
+                    <td colspan="10">
                         No Flows found
                     </td>
                 </tr>
@@ -47,13 +49,15 @@
                     <td>{{flow.timeout}}</td>
                     <td>{{flow.permanent}}</td>
                     <td>{{flow.state}}</td>
+                    <td>{{flow.packets}}</td>
+                    <td>{{flow.bytes}}</td>
                 </tr>
                 <tr class="ignore-width">
-                    <td class="selector" colspan="8">{{flow.selector}}</td>
+                    <td class="selector" colspan="10">{{flow.selector}}</td>
                 </tr>
                 <tr class="ignore-width"
                     ng-repeat-end ng-repeat-done>
-                    <td class="treatment" colspan="8">{{flow.treatment}}</td>
+                    <td class="treatment" colspan="10">{{flow.treatment}}</td>
                 </tr>
             </table>
         </div>