dlux/cpeui/cpeui-module/src/main/resources/cpeui/tenant.tpl.html

   1 <div class="container" id="tenant-page">
   2         <h1>Tenant {{ curTenant }}</h1>
   3         <div class="menu">
   4                 <ul id="EVCs-tab" class="nav nav-pills" role="tablist">
   5                         <li ng-class="{ active: isTabSet('tenantData',1)}" ng-click="setTab('tenantData',1)" >
   6                                 <a id="evcs-configure-tab" > <i class="icon-tasks"></i> L2 Services</a>
   7                         </li>
   8                         <!-- UnComment to add L3 Services
   9                         <li ng-class="{ active: isTabSet('tenantData',2)}" ng-click="setTab('tenantData',2)" >
  10                                 <a id="evcs-configure-tab" > <i class="icon-tasks"></i> L3 Services</a>
  11                         </li>
  12                           END of UnComment to add L3 Services-->
  13                         <li id="refresh_btn" class="active refresh-btn" ng-click="updateEvcView()">
  14                                 <button class="btn add-row"> <i class="icon-refresh"></i> Refresh</button>
  15                         </li>
  16                 </ul>
  17         </div>
  18         <div id="EVCsContent" class="tab-content">
  19                 <div ng-show="isTabSet('tenantData',1)">
  20                         <div class="table-header">EVCs Table</div>
  21                         <table class="footable table table-striped">
  22                                 <thead>
  23                                         <tr>
  24                                                 <th>EVC ID</th>
  25                                                 <th>UNIs</th>
  26                                                 <th>Network Name</th>
  27                                                 <th>SVC Type</th>
  28                                                 <th>EVC Type</th>
  29                                                 <th colspan="2" >Tenant</th>
  30                                         </tr>
  31                                 </thead>
  32                                 <tbody id="l2_table">
  33                                         <tr ng-repeat-start="item in evcs | orderBy : sortEvc">
  34                                                 <td rowspan="{{ 1 + unisTables[item['svc-id']] }}">{{ item.evc['evc-id'] }}</td>
  35                                                 <td >
  36                                                         <button ng-show="!unisTables[item['svc-id']]" class="btn add-row btn-block" ng-click="unisTables[item['svc-id']] = true;">Show Unis</button>
  37                                                         <button ng-show="unisTables[item['svc-id']]" class="btn add-row btn-block" ng-click="unisTables[item['svc-id']] = false;">Hide Unis</button>
  38                                                 </td>
  39                                                 <td >{{ networkNames[item['svc-id']] }}</td>
  40                                                 <td >{{ item['svc-type'] }}</td>
  41                                                 <td >{{ title(item.evc['evc-type']) }}</td>
  42                                                 <td>{{ item['tenant-id'] }}</td>
  43                                                 <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(item['svc-id'])"> <i class="icon-trash"></i> </button></td>
  44                                         </tr>
  45                                         <tr ng-repeat-end ng-show="unisTables[item['svc-id']]">
  46                                                 <td colspan="6">
  47                                                         <table class="footable table table-striped inner-table">
  48                                                                 <thead>
  49                                                                         <tr>
  50                                                                                 <th>Device</th>
  51                                                                                 <th>UNI</th>
  52                                                                                 <th ng-if="item.isTree" >Role</th>
  53                                                                                 <th>Vlans <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
  54                                                                                 <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="linkEvcUniDialog.show($event, {'evc':item,'unis':unis,'ces':ces})"> <i class="icon-plus"></i> </button></th>
  55                                                                         </tr>
  56                                                                 </thead>
  57                                                                 <tbody id="l2_table">
  58                                                                         <tr ng-repeat-start="(ce, unis) in item.device2unis | orderBy : ce ">
  59                                                                                 <td rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
  60                                                                                 <td ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni.prettyID }}</td>
  61                                                                                 <td ng-if="item.isTree">{{ uni['role'] }}</td>
  62                                                                                 <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">
  63                                                                                 {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
  64                                                                                 </td>
  65                                                                                 <td ng-repeat-end class="delete-tr" style="white-space: nowrap;">
  66                                                                                 <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
  67                                                                                 </td>
  68                                                                         </tr>
  69                                                                         <tr ng-repeat-end ng-repeat="uni in unis | orderBy: sortUni | limitTo :(unis.length-1) :1">
  70                                                                                 <td>{{ uni.prettyID }}</td>
  71                                                                                 <td ng-if="item.isTree">{{ uni['role'] }}</td>
  72                                                                                 <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">
  73                                                                                 {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
  74                                                                                 </td>
  75                                                                                 <td class="delete-tr" style="white-space: nowrap;">
  76                                                                                 <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
  77                                                                                 </td>
  78                                                                         </tr>
  79                                                                 </tbody>
  80                                                         </table>
  81                                                 </td>
  82                                         </tr>
  83                                 </tbody>
  84                         </table>
  85                         <div><a class="btn btn-info add-row" ng-click="evcDialog.show($event,{'svcTypes':svcTypes})" >Create EVC</a></div>
  86                 </div>
  87                 <!-- UnComment to add L3 Services
  88                 <div ng-show="isTabSet('tenantData',2)">
  89                         <div class="table-header">IPVCs Table</div>
  90                         <table class="footable table table-striped">
  91                                 <thead>
  92                                         <tr>
  93                                                 <th>IPVC ID</th>
  94                                                 <th>UNIs</th>
  95                                                 <th>IPVC Type</th>
  96                                                 <th colspan="2" >Tenant</th>
  97                                         </tr>
  98                                 </thead>
  99                                 <tbody id="l2_table">
 100                                         <tr ng-repeat-start="ipvc in ipvcs | orderBy : sortIpvc">
 101                                                 <td rowspan="{{ 1 + unisTables[ipvc.ipvc['ipvc-id']] }}">{{ ipvc.ipvc['ipvc-id'] }}</td>
 102                                                 <td >
 103                                                         <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>
 104                                                         <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>
 105                                                 </td>
 106                                                 <td >{{ ipvc.ipvc['ipvc-type'] }}</td>
 107                                                 <td>{{ ipvc['tenant-id'] }}</td>
 108                                                 <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button></td>
 109                                         </tr>
 110                                         <tr ng-repeat-end ng-show="unisTables[ipvc.ipvc['ipvc-id']]">
 111                                                 <td colspan="5">
 112                                                         <table class="footable table table-striped inner-table">
 113                                                                 <thead>
 114                                                                         <tr>
 115                                                                                 <th>Device</th>
 116                                                                                 <th>UNI</th>
 117                                                                                 <th ng-if="ipvc.isTree" >Role</th>
 118                                                                                 <th>Vlans <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
 119                                                                                 <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="linkEvcUniDialog.show($event, {'ipvc':ipvc,'unis':unis,'ces':ces})"> <i class="icon-plus"></i> </button></th>
 120                                                                         </tr>
 121                                                                 </thead>
 122                                                                 <tbody id="l2_table">
 123                                                                         <tr ng-repeat-start="(ce, unis) in ipvc.device2unis | orderBy : ce ">
 124                                                                                 <td rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
 125                                                                                 <td ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni['uni-id'] }}</td>
 126                                                                                 <td ng-if="ipvc.isTree">{{ uni['role'] }}</td>
 127                                                                                 <td class="clickable" ng-click="!ipvc.evc['preserve-ce-vlan-id'] ? editVlanDialog.show($event, {svcid:ipvc['svc-id'], uniid:uni['uni-id'], vlans:uni.vlans}) : 0">
 128                                                                                 {{ uni.vlans.join(', ') }} {{ipvc.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
 129                                                                                 </td>
 130                                                                                 <td ng-repeat-end class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvcUni(ipvc['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button></td>
 131                                                                         </tr>
 132                                                                         <tr ng-repeat-end ng-repeat="uni in unis | orderBy: sortUni | limitTo :(unis.length-1) :1">
 133                                                                                 <td>{{ uni['uni-id'] }}</td>
 134                                                                                 <td ng-if="item.isTree">{{ uni['role'] }}</td>
 135                                                                                 <td class="clickable" ng-click="!item.evc['preserve-ce-vlan-id'] ? editVlanDialog.show($event, {svcid:ipvc['svc-id'], uniid:uni['uni-id'], vlans:uni.vlans}) : 0">
 136                                                                                 {{ uni.vlans.join(', ') }} {{ipvc.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
 137                                                                                 </td>
 138                                                                                 <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvcUni(ipvc['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button></td>
 139                                                                         </tr>
 140                                                                 </tbody>
 141                                                         </table>
 142                                                 </td>
 143                                         </tr>
 144                                 </tbody>
 145                         </table>
 146                         <div><a class="btn btn-info add-row" ng-click="evcDialog.show($event,{'svcTypes':svcTypes})" >Create IPVC</a></div>
 147                 </div>
 148                  END OF UnComment to add L3 Services -->
 149         </div>
 150         <div class="clear">
 151                 <button class="btn btn-default pull-right" onclick="window.location='#/cpeui/admin/tenants'" > Back </button>
 152         </div>
 153 </div>