1 <div class="container" id="tenant-page">
2 <h1>Tenant {{ curTenant }}</h1>
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" href="#/cpeui/tenant/{{curTenant}}/L2"> <i class="icon-tasks"></i> L2 Services</a>
8 <li ng-class="{ active: isTabSet('tenantData',2)}" ng-click="setTab('tenantData',2)" >
9 <a id="evcs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/L3" > <i class="icon-tasks"></i> L3 Services</a>
11 <li ng-class="{ active: isTabSet('tenantData',3)}" ng-click="setTab('tenantData',3)" >
12 <a id="evcs-configure-tab" href="#/cpeui/tenant/{{curTenant}}/unis"> <i class="icon-tasks"></i> UNIs</a>
14 <li id="refresh_btn" class="active refresh-btn" ng-click="updateEvcView()">
15 <button class="btn add-row"> <i class="icon-refresh"></i> Refresh</button>
19 <div id="EVCsContent" class="tab-content">
20 <div ng-show="isTabSet('tenantData',1)">
21 <div class="table-header">EVCs Table</div>
22 <table class="footable table table-striped">
25 <th class="minimal-width">EVC Name</th>
26 <th class="minimal-width">EVC ID</th>
27 <th class="minimal-width">Network Name</th>
28 <th class="minimal-width">SVC Type</th>
29 <th class="minimal-width">EVC Type</th>
30 <th class="minimal-width">Tenant</th>
31 <th colspan="2">UNIs</th>
35 <tr ng-repeat="item in evcs | orderBy : 'name'">
36 <td class="minimal-width">{{ item['name'] }}</td>
37 <td class="minimal-width">{{ item.evc['evc-id'] }}</td>
38 <td class="minimal-width">{{ networkNames[item['svc-id']] }}</td>
39 <td class="minimal-width">{{ item['svc-type'] }}</td>
40 <td class="minimal-width">{{ title(item.evc['evc-type']) }}</td>
41 <td class="minimal-width">{{ item['tenant-id'] }}</td>
44 <button class="btn add-row" ng-click="unisTables[item['svc-id']] = false" ng-if="unisTables[item['svc-id']]">
45 <i class="icon-plus"></i> Show UNIs
47 <table class="footable table table-striped inner-table" ng-if="!unisTables[item['svc-id']]">
50 <th class="minimal-width">
51 <button class="btn add-row" ng-click="unisTables[item['svc-id']] = true">
52 <i class="icon-minus"></i>
55 <th class="minimal-width">Device</th>
56 <th class="minimal-width">UNI</th>
57 <th class="minimal-width" ng-if="item.isTree" >Role</th>
58 <th class="minimal-width">VLANs <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
59 <th class="minimal-width">Profile</th>
60 <th class="delete-tr">
61 <button class="btn btn-md btn-info" ng-click="linkEvcUniDialog.show($event, {svc:item, unis:unis, ces:ces, profiles:profiles})">
62 <i class="icon-plus"></i>
68 <tr ng-repeat-start="(ce, unis) in item.device2unis | orderBy : ce ">
69 <td class="minimal-width" colspan="2" rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
70 <td class="minimal-width" ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni.prettyID }}</td>
71 <td class="minimal-width" 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)' : ''}}
75 <td class="minimal-width">{{ uni['ingress-bw-profile'] }}</td>
76 <td ng-repeat-end class="delete-tr" style="white-space: nowrap;">
77 <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
80 <tr ng-repeat-end ng-repeat="uni in unis | orderBy: sortUni | limitTo :(unis.length-1) :1">
81 <td>{{ uni.prettyID }}</td>
82 <td ng-if="item.isTree">{{ uni['role'] }}</td>
83 <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">
84 {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
86 <td class="minimal-width">{{ uni['ingress-bw-profile'] }}</td>
87 <td class="delete-tr" style="white-space: nowrap;">
88 <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
95 <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(item['svc-id'])"> <i class="icon-trash"></i> </button></td>
100 <button ng-show="!unisTables[item['svc-id']]" class="btn add-row btn-block" ng-click="unisTables[item['svc-id']] = true;">Show Unis</button>
101 <button ng-show="unisTables[item['svc-id']]" class="btn add-row btn-block" ng-click="unisTables[item['svc-id']] = false;">Hide Unis</button>
103 <tr ng-repeat-end ng-show="unisTables[item['svc-id']]">
105 <table class="footable table table-striped inner-table">
110 <th ng-if="item.isTree" >Role</th>
111 <th>VLANs <span style="font-size:small;color:inherit;"> (click to edit)</span></th>
112 <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>
115 <tbody id="l2_table">
116 <tr ng-repeat-start="(ce, unis) in item.device2unis | orderBy : ce ">
117 <td rowspan="{{unis.length}}">{{ cesDisplayNames[ce] }}</td>
118 <td ng-repeat-start="uni in unis | orderBy: sortUni | limitTo :1">{{ uni.prettyID }}</td>
119 <td ng-if="item.isTree">{{ uni['role'] }}</td>
120 <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">
121 {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
123 <td ng-repeat-end class="delete-tr" style="white-space: nowrap;">
124 <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
127 <tr ng-repeat-end ng-repeat="uni in unis | orderBy: sortUni | limitTo :(unis.length-1) :1">
128 <td>{{ uni.prettyID }}</td>
129 <td ng-if="item.isTree">{{ uni['role'] }}</td>
130 <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">
131 {{ uni.vlans.join(', ') }} {{item.evc['preserve-ce-vlan-id'] ? '(Preserved)' : ''}}
133 <td class="delete-tr" style="white-space: nowrap;">
134 <button class="btn btn-md btn-danger" ng-click="deleteEvcUni(item['svc-id'], uni['uni-id'])"> <i class="icon-trash"></i> </button>
144 <div><a class="btn add-row" ng-click="evcDialog.show($event,{'svcTypes':svcTypes})" >Create EVC</a></div>
146 <div ng-show="isTabSet('tenantData',2)">
147 <div class="table-header">IPVCs Table</div>
148 <table class="footable table table-striped">
151 <th class="minimal-width">IPVC Name</th>
152 <th class="minimal-width">IPVC ID</th>
153 <th class="minimal-width">IPVC Type</th>
154 <th class="minimal-width">Tenant</th>
155 <th colspan="2">UNIs</th>
158 <tbody id="l2_table">
159 <tr ng-repeat="ipvc in ipvcs | orderBy : 'name'">
160 <td class="minimal-width">{{ ipvc['name'] }}</td>
161 <td class="minimal-width">{{ ipvc.ipvc['ipvc-id'] }}</td>
162 <td class="minimal-width">{{ ipvc.ipvc['ipvc-type'] }}</td>
163 <td class="minimal-width">{{ ipvc['tenant-id'] }}</td>
165 <button class="btn add-row" ng-click="unisTables[ipvc.ipvc['ipvc-id']] = false" ng-if="unisTables[ipvc.ipvc['ipvc-id']]">
166 <i class="icon-plus"></i> Show UNIs
168 <table class="footable table table-striped inner-table" ng-if="!unisTables[ipvc.ipvc['ipvc-id']]">
171 <th class="minimal-width">
172 <button class="btn add-row" ng-click="unisTables[ipvc.ipvc['ipvc-id']] = true">
173 <i class="icon-minus"></i>
181 <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>
185 <tr ng-repeat="ipuni in ipvc.ipvc.unis.uni | orderBy: 'prettyID'">
186 <td colspan="2" ng-init="serviceIpuni = getMefInterfaceIpvc(ipuni['uni-id'],ipuni['ip-uni-id'])">{{ cesDisplayNames[ipuni.device] }}</td>
187 <td>{{ ipuni.prettyID }}</td>
188 <td>{{serviceIpuni['ip-address']}}</td>
189 <td>{{serviceIpuni.vlan}}</td>
190 <td class="minimal-width">{{ ipuni['ingress-bw-profile'] }}</td>
191 <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>
196 <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button></td>
198 <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>
199 <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>
201 <td class="delete-tr"><button class="btn btn-md btn-danger" ng-click="deleteEvc(ipvc['svc-id'])"> <i class="icon-trash"></i> </button></td>
203 <tr ng-repeat-end ng-show="unisTables[ipvc.ipvc['ipvc-id']]">
205 <table class="footable table table-striped inner-table">
212 <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>
215 <tbody id="l2_table">
216 <tr ng-repeat="ipuni in ipvc.ipvc.unis.uni">
217 <td ng-init="serviceIpuni = getMefInterfaceIpvc(ipuni['uni-id'],ipuni['ip-uni-id'])">{{ cesDisplayNames[ipuni.device] }}</td>
218 <td>{{ ipuni.prettyID }}</td>
219 <td>{{serviceIpuni['ip-address']}}</td>
220 <td>{{serviceIpuni.vlan}}</td>
221 <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>
230 <div><a class="btn add-row" ng-click="ipvcDialog.show($event,{'svcTypes':svcTypes})" >Create IPVC</a></div>
232 <div ng-show="isTabSet('tenantData',3)">
233 <div class="table-header">Tenant UNIs</div>
234 <table class="footable table table-striped">
237 <th class="minimal-width">Device</th>
238 <th class="minimal-width">UNI</th>
243 <tr ng-repeat="uni in unis | orderBy: '[\'uni-id\']'">
244 <td class="minimal-width">{{ cesDisplayNames[uni.device] }}</td>
245 <td class="minimal-width">{{ uni.prettyID }}</td>
247 <button class="btn add-row" ng-click="expandFlags.tuni[uni['uni-id']] = true" ng-if="!expandFlags.tuni[uni['uni-id']]">
248 <i class="icon-plus"></i> Show Ports
250 <table class="footable table table-striped inner-table" ng-if="expandFlags.tuni[uni['uni-id']]">
253 <th class="minimal-width">
254 <button class="btn add-row" ng-click="expandFlags.tuni[uni['uni-id']] = false">
255 <i class="icon-minus"></i>
258 <th class="minimal-width">IP UNI ID</th>
259 <th class="minimal-width">VLAN</th>
260 <th class="minimal-width">Address</th>
261 <th>Remote Subnets</th>
262 <th class="delete-tr"><button class="btn btn-md btn-info" ng-click="openIpUniDialog($event,uni)"> <i class="icon-plus"></i> </button></th>
266 <tr ng-repeat="ipuni in uni['ip-unis']['ip-uni'] | orderBy: '[\'ip-uni-id\']'">
267 <td colspan="2" class="minimal-width">{{ ipuni['ip-uni-id'] }}</td>
268 <td class="minimal-width">{{ ipuni.vlan }}</td>
269 <td class="minimal-width">{{ ipuni['ip-address'] }}</td>
271 <button class="btn add-row" ng-click="expandFlags.ipuni[uni['uni-id']+':'+ipuni['ip-uni-id']] = true" ng-if="!expandFlags.ipuni[uni['uni-id']+':'+ipuni['ip-uni-id']]">
272 <i class="icon-plus"></i> Show Subnets
274 <table class="footable table table-striped inner-table" ng-if="expandFlags.ipuni[uni['uni-id']+':'+ipuni['ip-uni-id']]">
277 <th class="minimal-width">
278 <button class="btn add-row" ng-click="expandFlags.ipuni[uni['uni-id']+':'+ipuni['ip-uni-id']] = false">
279 <i class="icon-minus"></i>
284 <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>
288 <tr ng-repeat="subnet in subnets[uni['uni-id']][ipuni['ip-uni-id']] | orderBy: subnet" ng-if="subnets[uni['uni-id']]">
289 <td colspan="2">{{ subnet.subnet }}</td>
290 <td>{{ subnet.gateway }}</td>
291 <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>
296 <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>
307 <button class="btn btn-default pull-right" onclick="window.location='#/cpeui/admin/tenants'" > Back </button>