UI Changes according to Ofir requirements 72/50772/1
authorElisha Oren <elisha.oren@hpe.com>
Wed, 18 Jan 2017 13:21:43 +0000 (15:21 +0200)
committerElisha Oren <elisha.oren@hpe.com>
Sun, 22 Jan 2017 09:33:27 +0000 (11:33 +0200)
 * Inventory Tab
 * small fixes and move creation button to table header
 * change Profile Byte to KB

Change-Id: I50e389cb9a27ef5507d161beee9b17658fafcc91
Signed-off-by: Elisha Oren <elisha.oren@hpe.com>
13 files changed:
dlux/cpeui/cpeui-module/src/main/resources/cpeui/admin.controller.js
dlux/cpeui/cpeui-module/src/main/resources/cpeui/admin.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/cpeui.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/dialogs/AddProfile.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/dialogs/EditVlans.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/dialogs/LinkEvcUni.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/dialogs/LinkIpvcUni.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/services/cpeui.services.js
dlux/cpeui/cpeui-module/src/main/resources/cpeui/services/utils.js
dlux/cpeui/cpeui-module/src/main/resources/cpeui/static/cpeui-custom.css
dlux/cpeui/cpeui-module/src/main/resources/cpeui/tenant.controller.js
dlux/cpeui/cpeui-module/src/main/resources/cpeui/tenant.tpl.html
dlux/cpeui/cpeui-module/src/main/resources/cpeui/tenantsTable.tpl.html

index 91bad4d7e634b15f2dd65991366acd805195e436..6a035d2a20820b31ad6c72e733ecc283b63c0455 100644 (file)
@@ -26,11 +26,6 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
               });
             });
 
-        $scope.OpenTenantPortal = function(tenant) {
-          $scope.currentTenent = tenant;
-          window.location = "#cpeui/tenant/" + tenant.name +"/";
-        };
-
         $scope.DeleteTenant = function(tenantID) {
           CpeuiDialogs.confirm(function() {
             CpeuiSvc.deleteTenant(tenantID, function() {
index a5d74790ec7d010f434f519899b66e183119f625..e4d30226c63170b0420de71caa673def497585c0 100644 (file)
@@ -1,5 +1,5 @@
 <div class="container">
-       <h1>Admin Page</h1>
+       <h1>Global Administration</h1>
        <div class="menu">
                <ul id="MainTabs" class="nav nav-pills" role="tablist">
                        <li ng-class="{ active: isTabSet('admin',1)}"
@@ -7,7 +7,18 @@
                                 <i class="icon-desktop"></i> Tenants</a></li>
                        <li ng-class="{ active: isTabSet('admin',2)}"
                                ng-click="setTab('admin',2)"><a id="evcs-configure-tab" href="#/cpeui/admin/cpes">
-                                       <i class="icon-tasks"></i> CPEs (Devices)</a></li>
+                                       <i class="icon-tasks"></i> Assigned CPEs</a></li>
+                       <!-- For Future Use
+                       <li ng-class="{ active: isTabSet('admin',6)}"
+                               ng-click="setTab('admin',6)"><a id="unassigned-cpe-tab" href="#/cpeui/admin/ucpes">
+                                       <i class="icon-tasks"></i> Unassigned CPEs</a></li>
+                       <li ng-class="{ active: isTabSet('admin',7)}"
+                               ng-click="setTab('admin',7)"><a id="dashboard-tab" href="#/cpeui/admin/dashboard">
+                                       <i class="icon-dashboard"></i> Dashboard</a></li>
+                       <li ng-class="{ active: isTabSet('admin',7)}"
+                               ng-click="setTab('admin',7)"><a id="monitor-tab" href="#/cpeui/admin/monitor">
+                                       <i class="icon-bar-chart"></i> CPE Monitor</a></li>
+                    -->
                        <li ng-class="{ active: isTabSet('admin',3)}"
                                ng-click="setTab('admin',3);updateView()"><a href="#/cpeui/admin/unis">
                                 <i class="icon-exchange"></i> UNIs</a>
@@ -17,7 +28,7 @@
                                <i class="icon-signal"></i> Networks</a>
                         </li>
                         <li ng-class="{ active: isTabSet('admin',5)}" ng-click="setTab('admin',5);updateProfilesView()">
-                               <a href="#/cpeui/admin/profiles"><i class="icon-book"></i> Profiles</a>
+                               <a href="#/cpeui/admin/profiles"><i class="icon-book"></i> Bandwidth Profiles</a>
                         </li>
                        <li id="refresh_btn" class="active refresh-btn"
                                ng-click="updateView()"><button class="btn add-row"> <i class="icon-refresh"></i> Refresh</button>
                <table class="footable table table-striped">
                        <thead>
                                <tr>
-                                       <th>CPE ID</th>
-                                       <th>CPE name</th>
-                                       <th colspan="2">Tenant</th>
+                                       <th>ID</th>
+                                       <th>Name</th>
+                                       <th>Tenant</th>
+                    <th class="minimal-width">
+                                          <button class="btn btn-md btn-info" ng-click="cesDialog.show($event)">
+                                              <i class="icon-plus"></i>
+                                              <md-tooltip>Add Device</md-tooltip>
+                                          </button>
+                                       </th>
                                </tr>
                        </thead>
                        <tbody id="ces_table">
                                                </md-select>
                                        </md-input-container>
                                        </td>
-                                       <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteCe(curTenant,item['dev-id'])"> <i class="icon-trash"></i> </button></td>
+                                       <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteCe(curTenant,item['dev-id'])"> <i class="icon-trash"></i> </button></td>
                                </tr>
                        </tbody>
                </table>
-               <div>
-                       <a class="btn add-row" ng-click="cesDialog.show($event)">Create CPE</a>
-               </div>
        </div>
        <div ng-show="isTabSet('admin',3)">
                <div class="table-header">UNIs</div>
                                        <td ng-if="item['tenant-id'] == undefined" >
                                                <button class="btn add-row btn-middle" ng-click="linkUniDialog.show($event, {'uni':item['uni-id'], tenants:tenantArray})"><i class="icon-link"></i> Link Tenant</button>
                                        </td>
-                                       <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteUni(item['uni-id'])"> <i class="icon-trash"></i> </button></td>
+                                       <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteUni(item['uni-id'])"> <i class="icon-trash"></i> </button></td>
                                </tr>
                        </tbody>
                </table>
                </table>                
        </div>
        <div ng-show="isTabSet('admin',5)">
-               <div class="table-header">Profiles</div>
+               <div class="table-header">Bandwidth Profiles</div>
                <table class="footable table table-striped">
                        <thead>
                                <tr>
-                                       <th>Profile Name</th>
+                                       <th>Bandwidth Profile Name</th>
                                        <th>Committed Information Rate (kb/s)</th>
-                                       <th>Committed Burst Size (Bytes)</th>
-                                       <th></th>
+                                       <th>Committed Burst Size (KB)</th>
+                                       <th class="minimal-width">
+                       <button class="btn btn-md btn-info right" ng-click="addProfile.show($event)">
+                           <i class="icon-plus"></i>
+                           <md-tooltip>Add Profile</md-tooltip>
+                       </button>
+                    </th>
                                </tr>
                        </thead>
                        <tbody>
                                <tr ng-repeat="profile in profiles | orderBy: '[\'bw-profile\']'">
-                                       <td class="minimal-width">{{ profile['bw-profile'] }}</td>
-                                       <td class="minimal-width">{{ profile.cir }}</td>
-                                       <td class="minimal-width">{{ profile.cbs }}</td>
-                                       <td class="delete-tr">
+                                       <td>{{ profile['bw-profile'] }}</td>
+                                       <td>{{ profile.cir }}</td>
+                                       <td>{{ profile.cbs }}</td>
+                                       <td class="minimal-width">
                                           <button class="btn btn-md btn-info" ng-click="editProfile(profile['bw-profile'],profile.cbs,profile.cir)">
                         <i class="icon-edit"></i>
-                        <md-tooltip>Edit Profile</md-tooltip>
+                        <md-tooltip>Edit Bandwidth Profile</md-tooltip>
                         </button>
                                                <button class="btn btn-md btn-danger" ng-click="deleteProfile(profile['bw-profile'])">
                                                <i class="icon-trash"></i>
-                                               <md-tooltip>Delete Profile</md-tooltip>
+                                               <md-tooltip>Delete Bandwidth Profile</md-tooltip>
                                                </button>
                                        </td>
                                </tr>
                        </tbody>
                </table>
-               <div>
-                       <a class="btn add-row" ng-click="addProfile.show($event)">Add Profile</a>
-               </div>
        </div>
 </div>
index 512aacdd8d75d9f040d3a93fc79beb49cfb49e77..0b43d1dbb5f631dd4586b447055baa6285adfb2d 100644 (file)
@@ -1,3 +1,3 @@
-<div ng-app="">
+<div id="cpeui" ng-app="">
     <div ui-view="cpeui" />
 </div>
index dd2355dd2775386d109d45b20d200b60ea8816ea..e15ecf9abe6a3c44d678e2d96f94589524e03b77 100644 (file)
@@ -1,7 +1,7 @@
-<md-dialog class="cpe-dialog" aria-label="Create Profile" ng-cloak>
+<md-dialog class="cpe-dialog" aria-label="Create Bandwidth Profile" ng-cloak>
        <md-toolbar>
                <div class="md-toolbar-tools">
-                       <h2>{{params.edit ? 'Edit' : 'Create'}} Profile</h2>
+                       <h2>{{params.edit ? 'Edit' : 'Create'}} Bandwidth Profile</h2>
                        <span flex></span>
                        <md-button class="md-icon-button" aria-label="Close dialog"
                                ng-click="cancel()"> <i class="icon-remove-sign"></i> </md-button>
@@ -12,7 +12,7 @@
                        <div layout="column" ng-cloak>
                                <md-content layout-padding>
                                        <md-input-container class="md-block" ng-init="obj['bw-profile'] = params.profileName">
-                                               <label>Profile Name</label>
+                                               <label>Bandwidth Profile Name</label>
                                                <input name="profilename" required ng-model="obj['bw-profile']" ng-disabled="params.edit">
                                                <div ng-messages="projectForm.profilename.$error">
                                                        <div ng-message="required">This is required!</div>
@@ -27,7 +27,7 @@
                                                </div>
                                        </md-input-container>
                                        <md-checkbox name="" ng-model="obj.default_cbs" ng-init="obj.default_cbs = (!params.edit || getDefualtCbs(params.cir) == params.cbs)">
-                                          Use default Committed Burst Size {{obj.cir ? ('(' + getDefualtCbs(obj.cir) + ' Bytes)') : ''}}
+                                          Use default Committed Burst Size {{obj.cir ? ('(' + getDefualtCbs(obj.cir) + ' KB)') : ''}}
                                        </md-checkbox>
                                        <md-input-container class="md-block" ng-if="!obj.default_cbs" ng-init="obj.cbs = params.cbs">
                                                <label>Committed Burst Size (Bytes)</label>
index 5f9ebfdc5d9c63be520ef26a41cdb69a0ec9c7f8..b246ec540e17da6fda85a925a0ca8dd9c9a2fb89 100644 (file)
                <tbody id="l2_table">
                        <tr ng-repeat="vlan in params.vlans | orderBy">
                                <td>{{ vlan }}</td>
-                               <td class="delete-tr"><button class="btn btn-md btn-danger"
+                               <td class="minimal-width"><button class="btn btn-md btn-danger"
                                                ng-click="deleteVlan(params.svcid, params.uniid, vlan, params.vlans)">
                                                <i class="icon-trash"></i>
                                        </button></td>
                        </tr>
                        <tr>
                                <td><input id="vlan_input" type="number" name="vlan" ng-model="obj.vlan"></td>
-                               <td class="delete-tr"><button class="btn btn-md btn-info"
+                               <td class="minimal-width"><button class="btn btn-md btn-info"
                                                ng-click="addVlan(params.svcid, params.uniid, obj.vlan, params.vlans)">
                                                <i class="icon-plus"></i> ADD</button>
                                                </td>
index 0112793630bd33249239fc9f10892b74f502ca9e..05f1bc9c08186d7065aca3035bb7a7a047110b5c 100644 (file)
@@ -33,7 +33,7 @@
         </md-select>
       </md-input-container>
       <md-input-container class="md-block">
-        <label>Profile</label>
+        <label>Bandwidth Profile</label>
         <md-select ng-model="obj.profile_name" name="profile_name">
                <md-option ng-value="undefined" > - None - </md-option>
                        <md-option ng-repeat="profile in params.profiles | orderBy: '[\'bw-profile\']'" value="{{ profile['bw-profile'] }}" >{{ profile['bw-profile'] }} <span class="small">(CIR: {{profile.cir}}, CBS: {{profile.cbs}})</span></md-option>
                <tbody id="l2_table">
                        <tr ng-repeat="vlan in obj.vlans | orderBy">
                                <td>{{ vlan }}</td>
-                               <td class="delete-tr"><button class="btn btn-md btn-danger"
+                               <td class="minimal-width"><button class="btn btn-md btn-danger"
                                                ng-click="deleteVlan(vlan)">
                                                <i class="icon-trash"></i>
                                        </button></td>
                        </tr>
                        <tr>
                                <td><input id="vlan_input" type="number" name="current_vlan" ng-model="current_vlan"></td>
-                               <td class="delete-tr"><button class="btn btn-md btn-info"
+                               <td class="minimal-width"><button class="btn btn-md btn-info"
                                                ng-click="addVlan(current_vlan)">
                                                <i class="icon-plus"></i>
                                        </button></td>
index 96360a7070f4685150500fde5b8f7bc55b0c6e4d..b4ee2c0402d4c04dbf0f5b5d8bd4b80d05cfce48 100644 (file)
@@ -32,7 +32,7 @@
         </md-select>
       </md-input-container>
       <md-input-container class="md-block">
-        <label>Profile</label>
+        <label>Bandwidth Profile</label>
         <md-select ng-model="obj.profile_name" name="profile_name">
                <md-option ng-value="undefined" > - None - </md-option>
                        <md-option ng-repeat="profile in params.profiles | orderBy: '[\'bw-profile\']'" value="{{ profile['bw-profile'] }}" >{{ profile['bw-profile'] }} <span class="small">(CIR: {{profile.cir}}, CBS: {{profile.cbs}})</span></md-option>
index 5a169b8fbd177e2e5cb5f1432a5939308f101708..8b14c5946b5b0269415f1d8560dff102405f69f6 100644 (file)
@@ -1,6 +1,6 @@
 define(['app/cpeui/cpeui.module'],function(cpeui) {
 
-    cpeui.factory('CpeuiSvc', function($http, Utils) {
+    cpeui.factory('CpeuiSvc', function($http, CpeUiUtils) {
         var baseUrl = "/restconf/config/mef-global:mef-global/";
         var svc = {};
 
@@ -54,6 +54,11 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
               url:"/restconf/config/mef-global:mef-global/profiles/ingress-bwp-flows/"
           }).then(function successCallback(response) {
               if (callback != undefined) {
+                  if (response.data["ingress-bwp-flows"]["bwp-flow"]){
+                      response.data["ingress-bwp-flows"]["bwp-flow"].forEach(function(p){
+                         p.cir = Math.round(p.cir/1024);
+                      });
+                  }
                   callback(response.data["ingress-bwp-flows"]["bwp-flow"]);
               }
           }, function errorCallback(response) {
@@ -70,7 +75,7 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
               url:"/restconf/config/mef-global:mef-global/profiles/ingress-bwp-flows/",
               data: {"bwp-flow":{
                         "bw-profile" : name,
-                         "cir" : cir,
+                         "cir" : cir*1024,
                          "cbs" : cbs
                     }}
           }).then(function successCallback(response) {
@@ -86,7 +91,7 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
               url:"/restconf/config/mef-global:mef-global/profiles/ingress-bwp-flows/bwp-flow/"+name,
               data: {"bwp-flow":{
                       "bw-profile": name,
-                      cir: cir,
+                      cir: cir*1024,
                       cbs:cbs
                     }}
           }).then(function successCallback(response) {
@@ -153,7 +158,6 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
         svc.getCes = function(callback) {
             var ces;
             var operMap = {};
-
             $http({
                 method:'GET',
                 url:"/restconf/operational/mef-topology:mef-topology/devices/"
@@ -311,7 +315,7 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
 
         // IPVCs
         svc.addIpvc = function(ipvc, tenant, callback) {
-          var ipvcId = Utils.randomId();
+          var ipvcId = CpeUiUtils.randomId();
           var data = {
             "mef-service" :  {
               "svc-id" : ipvcId,
@@ -336,7 +340,7 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
       };
 
       svc.addIpUni = function(uniid, ip_address, vlan, segmentation_id, callback) {
-        var ipUniId = Utils.randomId();
+        var ipUniId = CpeUiUtils.randomId();
         var data = {"ip-uni":{
           "ip-uni-id": ipUniId,
           "ip-address": ip_address
@@ -455,7 +459,7 @@ define(['app/cpeui/cpeui.module'],function(cpeui) {
     svc.addEvc = function(evc, evc_type, tenant, callback) {
             var uni_json = getJsonUnis(evc.unis);
 //            preserved-vlan
-            var evcId = Utils.randomId();
+            var evcId = CpeUiUtils.randomId();
             var data = {
               "mef-service" :  {
                 "svc-id" : evcId,
index 4dbe208f38cedb32b68f1f6cc09a621dd32f3dad..ff10fa13ea7e5eba90a0aec18550af9b1fd6cf87 100644 (file)
@@ -9,7 +9,7 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
       });
   };
 
-  cpeui.factory('Utils', function() {
+  cpeui.factory('CpeUiUtils', function() {
       var svc = {};
 
       svc.randomId = function () {
index 2a57adbfdfd2a6a620bd6cdb85ce08c4f03b0722..a717ae6e6d7e790c8eb26273a4d686ec45a9d22f 100644 (file)
@@ -5,15 +5,6 @@
 DIV {
  /*   color: white;*/
 }
-/**
-#EVCs-tab {
-    background: #808285 none repeat scroll 0 0;
-    overflow-y:auto;
-    z-index:1000;
-    border-bottom:0;
-    padding: 0 5px;
-}
- */
 .nestedTabs .nav-tabs li a {
     background-color: transparent !important;
     border-radius: 4px 4px 0 0 !important;
@@ -84,9 +75,6 @@ MD-SELECT-MENU MD-OPTION div, MD-SELECT-VALUE SPAN, MD-SELECT-VALUE SPAN * {
 .layout-padding md-input-container {
        padding: 0 !important;
 }
-.delete-tr {
-       width:1px;
-}
 .minimal-width {
        white-space: nowrap;
        width: 1px;
@@ -165,4 +153,16 @@ MD-TOOLBAR:active {
 .animate-if.ng-leave,
 .animate-if.ng-enter.ng-enter-active {
   height:0;
-}
\ No newline at end of file
+}
+.footable .multiline-headers TH {
+       /* text-align: center; */
+       vertical-align: middle; 
+}
+a.link {
+       text-decoration: underline;
+}
+TD a.link {
+       display:block;
+       width:100%;
+}
+
index 75dcc49c569a9d6c25113dd8148d8304db99508b..2c39d328f8e1fad702ea63e358e0345321200ef5 100644 (file)
@@ -6,6 +6,7 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
     $scope.unis = [];
     $scope.ces = [];
     $scope.ipvcs = [];
+    $scope.evcs = [];
     $scope.subnets = {};
     $scope.profiles =[];
     $scope.cesDisplayNames = {};
@@ -17,11 +18,12 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
     };
 
     var tabIndexs = {
+        "inventory" : 0,
         "L2" : 1,
         "L3" : 2,
-        "unis" : 3,
+        "unis" : 6,
       }
-    if (tabIndexs[$stateParams.tenantTabName]) {
+    if ($stateParams.tenantTabName in tabIndexs) {
       $scope.tab.tenantData = tabIndexs[$stateParams.tenantTabName];
     }
 
@@ -74,12 +76,37 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
         $scope.evcs = services.filter(function(svc){ return svc.evc != undefined;});
         $scope.ipvcs = services.filter(function(svc){ return svc.ipvc != undefined;});
         $scope.updateUnis();
-        console.log($scope.ipvcs);
+        function mapUniToService(uni, service) {
+            var uniObj = $scope.unis.filterByField('uni-id',uni['uni-id'])[0];
+            if (!uniObj.vlanToService) {
+                uniObj.vlanToService = [];
+            }
+            uniObj.hasService = true;
+            if (uni['evc-uni-ce-vlans'] && uni['evc-uni-ce-vlans']['evc-uni-ce-vlan']){
+                uni['evc-uni-ce-vlans']['evc-uni-ce-vlan'].forEach(function(v){
+                    uniObj.vlanToService.push({"vlan":v.vid, "svc":service});
+                });
+            } else {
+                if (uni["ip-uni-id"]) {
+                    var ipuni = $scope.unis.filterByField('uni-id',uni['uni-id'])[0];
+                    ipuni["ip-unis"]["ip-uni"].forEach(function(ipu){
+                        if (ipu['ip-uni-id'] == uni["ip-uni-id"]){
+                            var vlan = ipu.vlan ? ipu.vlan : 0;
+                            uniObj.vlanToService.push({"vlan":vlan, "svc":service});
+                        }
+                    });
+                } else {
+                    uniObj.vlanToService.push({"vlan":0, "svc":service});
+                }
+            }
+        }
+
         $scope.ipvcs.forEach(function(e){
           if (e.ipvc.unis != undefined && e.ipvc.unis.uni != undefined){
               e.ipvc.unis.uni.forEach(function(u){
                 u.device = u['uni-id'].split(":")[u['uni-id'].split(":").length-2];
                 u.prettyID = u['uni-id'].split(":")[u['uni-id'].split(":").length-1];
+                mapUniToService(u,e);
             });
           }
         });
@@ -93,6 +120,7 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
               }
               u.prettyID = u['uni-id'].split(":")[u['uni-id'].split(":").length - 1];
               e.device2unis[$scope.unisMap[u['uni-id']].device].push(u);
+              mapUniToService(u,e);
             });
           }
         });
@@ -102,6 +130,15 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
       });
     };
 
+    $scope.doesAllUniHasService = function(ceUnis) {
+        for (var i=0 ; i< ceUnis.length; ++i) {
+            if (!ceUnis[i].hasService) {
+                return false;
+            }
+        }
+        return true;
+    }
+
     $scope.title = function(str) {
       if (!str) {
         return str;
@@ -316,6 +353,11 @@ define([ 'app/cpeui/cpeui.module' ], function(cpeui) {
     $scope.sortUni = function(uni) {
       return uni['uni-id'];
     };
+
+    $scope.isEmpty = function(obj){
+        return angular.equals({}, obj);
+    }
+
     init();
   });
 });
index acfe1158e2df2a4ad6a388797375a879bec37f7c..570cd8b11c112f37b9a60938f0498a8e0939f1ea 100644 (file)
@@ -1,15 +1,29 @@
 <div class="container" id="tenant-page">
-    <h1>Tenant {{ curTenant }}</h1>
+    <h1>Tenant Administration - {{ curTenant }}</h1>
     <div class="menu">
-        <ul id="EVCs-tab" class="nav nav-pills" role="tablist">
+        <ul id="TenantsTabs" class="nav nav-pills" role="tablist">
+            <li ng-class="{ active: isTabSet('tenantData',0)}" ng-click="setTab('tenantData',0)" >
+                <a id="inventory-tab" href="#/cpeui/tenant/{{curTenant}}/inventory"> <i class="icon-tasks"></i> Inventory</a>
+            </li>
             <li ng-class="{ active: isTabSet('tenantData',1)}" ng-click="setTab('tenantData',1)" >
-                <a id="evcs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/L2"> <i class="icon-tasks"></i> L2 Services</a>
+                <a id="evcs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/L2"> <i class="icon-exchange"></i> L2 Services</a>
             </li>
             <li ng-class="{ active: isTabSet('tenantData',2)}" ng-click="setTab('tenantData',2)" >
-                <a id="evcs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/L3" > <i class="icon-tasks"></i> L3 Services</a>
+                <a id="ipvs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/L3" > <i class="icon-screenshot"></i> L3 Services</a>
             </li>
+            <!-- For Future use
             <li ng-class="{ active: isTabSet('tenantData',3)}" ng-click="setTab('tenantData',3)" >
-                <a id="evcs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/unis"> <i class="icon-tasks"></i> UNIs</a>
+                <a href="#/cpeui/tenant/{{curTenant}}/dashboard" > <i class="icon-dashboard"></i> Dashboard</a>
+            </li>
+            <li ng-class="{ active: isTabSet('tenantData',4)}" ng-click="setTab('tenantData',4)" >
+                <a href="#/cpeui/tenant/{{curTenant}}/cpemonitor" > <i class="icon-bar-chart"></i> CPE Monitor</a>
+            </li>
+            <li ng-class="{ active: isTabSet('tenantData',5)}" ng-click="setTab('tenantData',5)" >
+                <a href="#/cpeui/tenant/{{curTenant}}/servicemonitor" > <i class="icon-bar-chart"></i> Service Monitor</a>
+            </li>
+             -->
+            <li ng-class="{ active: isTabSet('tenantData',6)}" ng-click="setTab('tenantData',6)" >
+                <a id="tenant-uni-tab" href="#/cpeui/tenant/{{curTenant}}/unis"> <i class="icon-tasks"></i> UNIs</a>
             </li>
             <li id="refresh_btn" class="active refresh-btn" ng-click="updateEvcView()">
                 <button class="btn add-row"> <i class="icon-refresh"></i> Refresh</button>
         </ul>
     </div>
     <div id="EVCsContent" class="tab-content">
-        <div ng-show="isTabSet('tenantData',1)">
-            <div class="table-header">EVCs Table</div>
+       <div ng-show="isTabSet('tenantData',0)">
+            <div class="table-header">Inventory</div>
             <table class="footable table table-striped">
                 <thead>
                     <tr>
-                        <th class="minimal-width">EVC Name</th>
-                        <th class="minimal-width">EVC ID</th>
-                        <th class="minimal-width">Network Name</th>
-                        <th class="minimal-width">SVC Type</th>
-                        <th class="minimal-width">EVC Type</th>
-                        <th class="minimal-width">Tenant</th>
-                        <th colspan="2">UNIs</th>
+                        <th class="minimal-width">CPE-ID</th>
+                        <th class="minimal-width">Device Name</th>
+                        <th>UNIs</th>
                     </tr>
                 </thead>
-                <tbody id="l2_table">
-                    <tr ng-repeat="item in evcs | orderBy : 'name'">
-                        <td class="minimal-width">{{ item['name'] }}</td>
-                        <td class="minimal-width">{{ item.evc['evc-id'] }}</td>
-                        <td class="minimal-width">{{ networkNames[item['svc-id']] }}</td>
-                        <td class="minimal-width">{{ item['svc-type'] }}</td>
-                        <td class="minimal-width">{{ title(item.evc['evc-type']) }}</td>
-                        <td class="minimal-width">{{ item['tenant-id'] }}</td>
-
-                        <td >
-                        <button class="btn add-row" ng-click="unisTables[item['svc-id']] = false" ng-if="unisTables[item['svc-id']]">
-                            <i class="icon-plus"></i> Show UNIs
-                        </button>
-                            <table class="footable table table-striped inner-table" ng-if="!unisTables[item['svc-id']]">
+                <tbody ng-repeat="ce in ces" ng-init="ceUnis = unis.filterByField('device',ce['dev-id'])">
+                    <tr>
+                        <td class="minimal-width" ng-bind="ce['dev-id']"></td>
+                        <td class="minimal-width" ng-bind="ce['device-name']"></td>
+                        <td>
+                        <table class="footable table table-striped inner-table" ng-if="!unisTables[item['svc-id']]">
                                 <thead>
                                     <tr>
-                                        <th class="minimal-width">
-                                            <button class="btn add-row" ng-click="unisTables[item['svc-id']] = true">
-                                                <i class="icon-minus"></i>
-                                            </button>
-                                        </th>
-                                        <th class="minimal-width">Device</th>
-                                        <th class="minimal-width">UNI</th>
-                                        <th class="minimal-width" ng-if="item.isTree" >Role</th>
-                                        <th class="minimal-width">VLANs <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
-                                        <th class="minimal-width">Profile</th>
-                                        <th class="delete-tr">
-                                            <button class="btn btn-md btn-info" ng-click="linkEvcUniDialog.show($event, {svc:item, unis:unis, ces:ces, profiles:profiles})">
-                                            <i class="icon-plus"></i>
-                                            </button>
-                                        </th>
+                                        <th class="minimal-width">Interface Name</th>
+                                        <th class="minimal-width">VLAN</th>
+                                        <th class="minimal-width">Service</th>
                                     </tr>
                                 </thead>
-                                <tbody>
-                                    <tr ng-repeat-start="(ce, unis) in item.device2unis | orderBy : ce ">
-                                        <td class="minimal-width" colspan="2" rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
-                                        <td class="minimal-width" ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni.prettyID }}</td>
-                                        <td class="minimal-width" ng-if="item.isTree">{{ uni['role'] }}</td>
-                                        <td class="clickable" ng-click="!item.evc['preserve-ce-vlan-id'] ? editVlanDialog.show($event, {svcid:item['svc-id'], uniid:uni['uni-id'], vlans:uni.vlans}) : 0">
-                                        {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
-                                        </td>
-                                        <td class="minimal-width">{{ uni['ingress-bw-profile'] }}</td>
-                                        <td ng-repeat-end class="delete-tr" style="white-space: nowrap;">
-                                        <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
+                                <tbody ng-repeat="uni in ceUnis">
+                                    <tr ng-repeat="svcs in uni.vlanToService | orderBy: '-vlan'" ng-if="uni.hasService">
+                                        <td rowspan="{{uni.vlanToService.length}}" ng-if="$first" ng-bind="uni.prettyID" />
+                                        <td ng-bind="svcs.vlan ? svcs.vlan : '-'" />
+                                        <td>
+                                            <a class="link" href="#/cpeui/tenant/dav1/{{svcs.svc.evc ? 'L2' : 'L3'}}?svcs.svc={{svcs.svc['svc-id']}}">{{svcs.svc.name ? svcs.svc.name : svcs.svc['svc-id']}}</a>
                                         </td>
                                     </tr>
-                                    <tr ng-repeat-end ng-repeat="uni in unis | orderBy: sortUni | limitTo :(unis.length-1) :1">
-                                        <td>{{ uni.prettyID }}</td>
-                                        <td ng-if="item.isTree">{{ uni['role'] }}</td>
-                                        <td class="clickable" ng-click="!item.evc['preserve-ce-vlan-id'] ? editVlanDialog.show($event, {svcid:item['svc-id'], uniid:uni['uni-id'], vlans:uni.vlans}) : 0">
-                                        {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
-                                        </td>
-                                        <td class="minimal-width">{{ uni['ingress-bw-profile'] }}</td>
-                                        <td class="delete-tr" style="white-space: nowrap;">
-                                        <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
-                                        </td>
+                                </tbody>
+                                <tbody ng-if="!doesAllUniHasService(ceUnis)">
+                                    <tr>
+                                        <td><b ng-repeat="uni in ceUnis" ng-if="!uni.hasService">{{uni.prettyID}}{{$last ? '' : ', '}}</b></td>
+                                        <td></td>
+                                        <td></td>
                                     </tr>
                                 </tbody>
                             </table>
                         </td>
-
-                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(item['svc-id'])"> <i class="icon-trash"></i> </button></td>
                     </tr>
-
-                        <!--
-                        <td >
-                            <button ng-show="!unisTables[item['svc-id']]" class="btn add-row btn-block" ng-click="unisTables[item['svc-id']] = true;">Show Unis</button>
-                            <button ng-show="unisTables[item['svc-id']]" class="btn add-row btn-block" ng-click="unisTables[item['svc-id']] = false;">Hide Unis</button>
-                        </td>
-                    <tr ng-repeat-end ng-show="unisTables[item['svc-id']]">
-                        <td colspan="6">
-                            <table class="footable table table-striped inner-table">
+                </tbody>
+                </table>
+        </div>
+        <div ng-show="isTabSet('tenantData',1)">
+            <div class="table-header">L2 Service Config</div>
+            <table class="footable table table-striped">
+                <thead>
+                    <tr>
+                        <th class="minimal-width">Service ID</th>
+                        <th class="minimal-width">Service Name</th>
+                        <th class="minimal-width">Type</th>
+                        <th class="minimal-width">Segmentation ID</th>
+                        <th>UNIs</th>
+                        <th class="minimal-width">
+                            <button class="btn btn-md btn-info right" ng-click="evcDialog.show($event,{'svcTypes':svcTypes})">
+                                <i class="icon-plus"></i>
+                                <md-tooltip>Create EVC</md-tooltip>
+                            </button>
+                        </th>
+                    </tr>
+                </thead>
+                <tbody id="l2_table">
+                    <tr ng-repeat="item in evcs | orderBy : 'name'">
+                        <td class="minimal-width">{{ item.evc['evc-id'] }}</td>
+                        <td class="minimal-width">{{ item['name'] }}</td>
+                        <td class="minimal-width">{{ item['svc-type'] | uppercase }}</td>
+                        <td class="minimal-width">{{ item.evc['segmentation-id'] }}</td>
+                        <td>
+                            <table class="footable table table-striped inner-table" ng-if="!isEmpty(item.device2unis)">
                                 <thead>
                                     <tr>
-                                        <th>Device</th>
-                                        <th>UNI</th>
-                                        <th ng-if="item.isTree" >Role</th>
-                                        <th>VLANs <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
-                                        <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="linkEvcUniDialog.show($event, {'svc':item,'unis':unis,'ces':ces})"> <i class="icon-plus"></i> </button></th>
+                                        <th class="minimal-width">Device</th>
+                                        <th class="minimal-width">Port</th>
+                                        <th class="minimal-width">VLANs <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
+                                        <th class="minimal-width" ng-if="item.isTree" >Role</th>
+                                        <th>Bandwidth Profile</th>
+                                        <th class="minimal-width"></th>
                                     </tr>
                                 </thead>
-                                <tbody id="l2_table">
+                                <tbody>
                                     <tr ng-repeat-start="(ce, unis) in item.device2unis | orderBy : ce ">
-                                        <td rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
-                                        <td ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni.prettyID }}</td>
-                                        <td ng-if="item.isTree">{{ uni['role'] }}</td>
+                                        <td class="minimal-width" rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
+                                        <td class="minimal-width" ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni.prettyID }}</td>
                                         <td class="clickable" ng-click="!item.evc['preserve-ce-vlan-id'] ? editVlanDialog.show($event, {svcid:item['svc-id'], uniid:uni['uni-id'], vlans:uni.vlans}) : 0">
                                         {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
                                         </td>
-                                        <td ng-repeat-end class="delete-tr" style="white-space: nowrap;">
+                                        <td class="minimal-width" ng-if="item.isTree">{{ uni['role'] }}</td>
+                                        <td >{{ uni['ingress-bw-profile'] }}</td>
+                                        <td ng-repeat-end class="minimal-width" style="white-space: nowrap;">
                                         <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
                                         </td>
                                     </tr>
                                         <td class="clickable" ng-click="!item.evc['preserve-ce-vlan-id'] ? editVlanDialog.show($event, {svcid:item['svc-id'], uniid:uni['uni-id'], vlans:uni.vlans}) : 0">
                                         {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
                                         </td>
-                                        <td class="delete-tr" style="white-space: nowrap;">
-                                        <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
+                                        <td class="minimal-width">{{ uni['ingress-bw-profile'] }}</td>
+                                            <td class="minimal-width" style="white-space: nowrap;">
+                                            <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])">
+                                                <i class="icon-trash"></i>
+                                            </button>
                                         </td>
                                     </tr>
                                 </tbody>
                             </table>
                         </td>
+
+                        <td class="minimal-width">
+                            <button class="btn btn-md btn-danger" ng-click="deleteEvc(item['svc-id'])"> <i class="icon-trash"></i> </button>
+                            <button class="btn btn-md btn-info" ng-click="linkEvcUniDialog.show($event, {svc:item, unis:unis, ces:ces, profiles:profiles})">
+                                <i class="icon-plus"></i>
+                                    <md-tooltip>Add UNI</md-tooltip>
+                            </button>
+                        </td>
                     </tr>
-                         -->
                 </tbody>
             </table>
-            <div><a class="btn add-row" ng-click="evcDialog.show($event,{'svcTypes':svcTypes})" >Create EVC</a></div>
         </div>
         <div ng-show="isTabSet('tenantData',2)">
-            <div class="table-header">IPVCs Table</div>
+            <div class="table-header">L3 Service Config</div>
             <table class="footable table table-striped">
                 <thead>
                     <tr>
-                        <th class="minimal-width">IPVC Name</th>
-                        <th class="minimal-width">IPVC ID</th>
-                        <th class="minimal-width">IPVC Type</th>
-                        <th class="minimal-width">Tenant</th>
-                        <th colspan="2">UNIs</th>
+                        <th class="minimal-width">Service ID</th>
+                        <th class="minimal-width">Service Name</th>
+                        <th>Service Endpoints</th>
+                        <th class="minimal-width">
+                            <button class="btn btn-md btn-info right" ng-click="ipvcDialog.show($event,{'svcTypes':svcTypes})">
+                                <i class="icon-plus"></i>
+                                <md-tooltip>Create IPVC</md-tooltip>
+                            </button>
+                        </th>
                     </tr>
                 </thead>
                 <tbody id="l2_table">
                     <tr ng-repeat="ipvc in ipvcs | orderBy : 'name'">
-                        <td class="minimal-width">{{ ipvc['name'] }}</td>
                         <td class="minimal-width">{{ ipvc.ipvc['ipvc-id'] }}</td>
-                        <td class="minimal-width">{{ ipvc.ipvc['ipvc-type'] }}</td>
-                        <td class="minimal-width">{{ ipvc['tenant-id'] }}</td>
-                        <td >
-                        <button class="btn add-row" ng-click="unisTables[ipvc.ipvc['ipvc-id']] = false" ng-if="unisTables[ipvc.ipvc['ipvc-id']]">
-                            <i class="icon-plus"></i> Show UNIs
-                        </button>
-                            <table class="footable table table-striped inner-table" ng-if="!unisTables[ipvc.ipvc['ipvc-id']]">
+                        <td class="minimal-width">{{ ipvc['name'] }}</td>
+                        <td>
+                            <table class="footable table table-striped inner-table" ng-if="ipvc.ipvc.unis.uni">
                                 <thead>
                                     <tr>
-                                        <th class="minimal-width">
-                                            <button class="btn add-row" ng-click="unisTables[ipvc.ipvc['ipvc-id']] = true">
-                                                <i class="icon-minus"></i>
-                                            </button>
-                                        </th>
-                                        <th>Device</th>
-                                        <th>UNI</th>
-                                        <th>IP Address</th>
+                                        <th class="minimal-width">Device Name</th>
+                                        <th class="minimal-width">Port</th>
                                         <th>Vlan</th>
-                                        <th>Profile</th>
-                                        <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="linkIpvcUniDialog.show($event, {svc:ipvc, unis:unis, ces:ces, profiles:profiles})"> <i class="icon-plus"></i> </button></th>
+                                        <th class="minimal-width">I/F Address</th>
+                                        <th>Bandwidth Profile</th>
+                                        <th class="minimal-width"></th>
                                     </tr>
                                 </thead>
                                 <tbody>
                                     <tr ng-repeat="ipuni in ipvc.ipvc.unis.uni | orderBy: 'prettyID'">
-                                        <td colspan="2" ng-init="serviceIpuni = getMefInterfaceIpvc(ipuni['uni-id'],ipuni['ip-uni-id'])">{{ cesDisplayNames[ipuni.device] }}</td>
-                                        <td>{{ ipuni.prettyID }}</td>
-                                        <td>{{serviceIpuni['ip-address']}}</td>
+                                        <td class="minimal-width" ng-init="serviceIpuni = getMefInterfaceIpvc(ipuni['uni-id'],ipuni['ip-uni-id'])">{{ cesDisplayNames[ipuni.device] }}</td>
+                                        <td class="minimal-width">{{ ipuni.prettyID }}</td>
                                         <td>{{serviceIpuni.vlan}}</td>
-                                        <td class="minimal-width">{{ ipuni['ingress-bw-profile'] }}</td>
-                                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteIpvcUni(ipvc['svc-id'], ipuni['uni-id'], ipuni['ip-uni-id'])"> <i class="icon-trash"></i> </button></td>
+                                        <td class="minimal-width">{{serviceIpuni['ip-address']}}</td>
+                                        <td>{{ ipuni['ingress-bw-profile'] }}</td>
+                                        <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteIpvcUni(ipvc['svc-id'], ipuni['uni-id'], ipuni['ip-uni-id'])"> <i class="icon-trash"></i> </button></td>
                                     </tr>
                                 </tbody>
                             </table>
                         </td>
-                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button></td>
+                        <td class="minimal-width">
+                            <button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button>
+                            <button class="btn btn-md btn-info" ng-click="linkIpvcUniDialog.show($event, {svc:ipvc, unis:unis, ces:ces, profiles:profiles})"> <i class="icon-plus"></i> </button>
+                        </td>
                         <!--
                             <button ng-show="!unisTables[ipvc.ipvc['ipvc-id']]" class="btn add-row btn-block" ng-click="unisTables[ipvc.ipvc['ipvc-id']] = true;">Show Unis</button>
                             <button ng-show="unisTables[ipvc.ipvc['ipvc-id']]" class="btn add-row btn-block" ng-click="unisTables[ipvc.ipvc['ipvc-id']] = false;">Hide Unis</button>
                         </td>
-                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button></td>
+                        <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button></td>
                     </tr>
                     <tr ng-repeat-end ng-show="unisTables[ipvc.ipvc['ipvc-id']]">
                         <td colspan="5">
                                         <th>UNI</th>
                                         <th>IP Address</th>
                                         <th>vlan</th>
-                                        <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="linkIpvcUniDialog.show($event, {'svc':ipvc,'unis':unis,'ces':ces})"> <i class="icon-plus"></i> </button></th>
+                                        <th class="minimal-width"><button class="btn btn-md btn-info" ng-click="linkIpvcUniDialog.show($event, {'svc':ipvc,'unis':unis,'ces':ces})"> <i class="icon-plus"></i> </button></th>
                                     </tr>
                                 </thead>
                                 <tbody id="l2_table">
                                         <td>{{ ipuni.prettyID }}</td>
                                         <td>{{serviceIpuni['ip-address']}}</td>
                                         <td>{{serviceIpuni.vlan}}</td>
-                                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteIpvcUni(ipvc['svc-id'], ipuni['uni-id'], ipuni['ip-uni-id'])"> <i class="icon-trash"></i> </button></td>
+                                        <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteIpvcUni(ipvc['svc-id'], ipuni['uni-id'], ipuni['ip-uni-id'])"> <i class="icon-trash"></i> </button></td>
                                     </tr>
                                 </tbody>
                             </table>
                     </tr>
                 </tbody>
             </table>
-            <div><a class="btn add-row" ng-click="ipvcDialog.show($event,{'svcTypes':svcTypes})" >Create IPVC</a></div>
         </div>
-        <div ng-show="isTabSet('tenantData',3)">
+        <div ng-show="isTabSet('tenantData',6)">
             <div class="table-header">Tenant UNIs</div>
             <table class="footable table table-striped">
                 <thead>
                                         <th class="minimal-width">VLAN</th>
                                         <th class="minimal-width">Address</th>
                                         <th>Remote Subnets</th>
-                                        <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="openIpUniDialog($event,uni)"> <i class="icon-plus"></i> </button></th>
+                                        <th class="minimal-width"><button class="btn btn-md btn-info" ng-click="openIpUniDialog($event,uni)"> <i class="icon-plus"></i> </button></th>
                                     </tr>
                                 </thead>
                                 <tbody>
                                                         </th>
                                                         <th>Subnet</th>
                                                         <th>Gateway</th>
-                                                        <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="ipUniSubnetDialog.show($event,{uniid:uni['uni-id'],ipuniid:ipuni['ip-uni-id']})"> <i class="icon-plus"></i> </button></th>
+                                                        <th class="minimal-width"><button class="btn btn-md btn-info" ng-click="ipUniSubnetDialog.show($event,{uniid:uni['uni-id'],ipuniid:ipuni['ip-uni-id']})"> <i class="icon-plus"></i> </button></th>
                                                     </tr>
                                                 </thead>
                                                 <tbody>
                                                     <tr ng-repeat="subnet in subnets[uni['uni-id']][ipuni['ip-uni-id']] | orderBy: subnet" ng-if="subnets[uni['uni-id']]">
                                                         <td colspan="2">{{ subnet.subnet }}</td>
                                                         <td>{{ subnet.gateway }}</td>
-                                                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteIpUniSubnet(uni['uni-id'],ipuni['ip-uni-id'],subnet.subnet)"> <i class="icon-trash"></i> </button></td>
+                                                        <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteIpUniSubnet(uni['uni-id'],ipuni['ip-uni-id'],subnet.subnet)"> <i class="icon-trash"></i> </button></td>
                                                     </tr>
                                                 </tbody>
                                             </table>
                                         </td>
-                                        <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteIpUni(uni['uni-id'],ipuni['ip-uni-id'])"> <i class="icon-trash"></i> </button></td>
+                                        <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="deleteIpUni(uni['uni-id'],ipuni['ip-uni-id'])"> <i class="icon-trash"></i> </button></td>
                                     </tr>
                                 </tbody>
                             </table>
index d0e3ecb4ba6c87dd078ddc9bcd8837c6f3a67804..6cc5557b382dc9171d36417032bd8fbf6119d48a 100644 (file)
@@ -1,22 +1,22 @@
-<div class="">
-               <div class="table-header">Tenants</div>
-               <table class="footable table table-striped">
-                       <thead>
-                               <tr>
-                                       <th>Tenant name</th>
-                                       <th colspan="2">Open ...</th>
-                               </tr>
-                       </thead>
-                       <tbody id="tenants_table">
-                               <tr ng-repeat="item in tenantArray | orderBy : 'name'">
-                                       <td>{{ item.name }}</td>
-                                       <td><button class="btn add-row btn-block" ng-click="OpenTenantPortal(item)">Open ...</button></td>
-                                       <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="DeleteTenant(item.name)"> <i class="icon-trash"></i> </button></td>
-                               </tr>
-                       </tbody>
-               </table>
-               <div>
-                       <a class="btn add-row" ng-click="tenantDialog.show($event)">Create Tenant</a>
-               </div>
-       </div>
-</div>
+<div>
+       <div class="table-header">Tenants</div>
+       <table class="footable table table-striped">
+          <thead>
+                  <tr>
+                  <th>Name</th>
+                  <th>
+                     <button class="btn btn-md btn-info" ng-click="tenantDialog.show($event)">
+                           <i class="icon-plus"></i> 
+                           <md-tooltip>Create Tenant</md-tooltip>
+              </button>
+                  </th>
+                  </tr>
+          </thead>
+               <tbody id="tenants_table">
+                       <tr ng-repeat="item in tenantArray | orderBy : 'name'">
+                               <td><a class="link" href="#cpeui/tenant/{{ item.name }}/">{{ item.name }}</a></td>
+                               <td class="minimal-width"><button class="btn btn-md btn-danger" ng-click="DeleteTenant(item.name)"> <i class="icon-trash"></i> </button></td>
+                       </tr>
+               </tbody>
+       </table>        
+</div>
\ No newline at end of file