vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm

   1 <!--\r
   2   ============LICENSE_START=======================================================\r
   3   VID\r
   4   ================================================================================\r
   5   Copyright (C) 2017 - 2019 AT&T Intellectual Property. All rights reserved.\r
   6   ================================================================================\r
   7   Licensed under the Apache License, Version 2.0 (the "License");\r
   8   you may not use this file except in compliance with the License.\r
   9   You may obtain a copy of the License at\r
  10   \r
  11        http://www.apache.org/licenses/LICENSE-2.0\r
  12   \r
  13   Unless required by applicable law or agreed to in writing, software\r
  14   distributed under the License is distributed on an "AS IS" BASIS,\r
  15   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
  16   See the License for the specific language governing permissions and\r
  17   limitations under the License.\r
  18   ============LICENSE_END=========================================================\r
  19   -->\r
  20 \r
  21 <div>\r
  22 \r
  23         <div popup-window class="popupContents" ngx-show="{{popup.isVisible}}"\r
  24                  ng-cloak>\r
  25                 <div ng-include="'app/vid/scripts/view-models/creationDialog.htm'"></div>\r
  26                 <div ng-include="'app/vid/scripts/view-models/deleteResumeDialog.htm'"></div>\r
  27                 <div ng-include="'app/vid/scripts/view-models/detailsDialog.htm'"></div>\r
  28                 <div ng-include="'app/vid/scripts/view-models/statusDialog.htm'"></div>\r
  29             <div ng-include="'app/vid/scripts/view-models/iframeDialog.htm'"></div>\r
  30         </div>\r
  31         <div ng-controller="aaiSubscriberController" ng-init="getComponentList() ">\r
  32                 <div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">\r
  33                         <img src="app/vid/images/spinner.gif"></img>\r
  34                         <label>Status:</label><span class="status">{{status}}</span>\r
  35                 </div>\r
  36 \r
  37         <div class="error-msg" ng-if="errorMsg != null" style="white-space: pre-line"><font color='red'>{{errorMsg}}\r
  38             <pre>{{errorDetails | json}}</pre>\r
  39         </font></div>\r
  40 \r
  41         <h1 class="heading1" style="margin-top: 20px;">{{isPermitted ? "View/Edit" : "View"}} Service Instance</h1>\r
  42         <a class="btn btn-primary btn-xs pull-right" ng-click="reloadRoute();"><span\r
  43                 class="glyphicon glyphicon-refresh"></span></a>\r
  44 \r
  45         <br>\r
  46 \r
  47         <center>\r
  48             <table att-table border="1" ng-model="service">\r
  49                 <tr>\r
  50                     <th style="text-align: center" width="33%">SUBSCRIBER:\r
  51                         {{service.instance.subscriberName}}\r
  52                     </th>\r
  53                     <th style="text-align: center" width="34%">SERVICE TYPE:\r
  54                         {{service.instance.serviceType}}\r
  55                     </th>\r
  56                     <th data-tests-id="service-instanceId-th-id" style="text-align: center" width="33%">SERVICE INSTANCE\r
  57                         ID: {{service.instance.serviceInstanceId}}\r
  58                     </th>\r
  59                 <tr>\r
  60                 <tr>\r
  61                     <td colspan='3' style="text-align: center">Service Instance\r
  62                         Name: {{service.instance.name || "Not defined"}}\r
  63                     </td>\r
  64                 <tr>\r
  65             </table>\r
  66 \r
  67         </center>\r
  68 \r
  69         <div ui-tree data-drag-enabled="false" data-nodrop-enabled="true" style="margin: 30px">\r
  70 \r
  71             <ol ui-tree-nodes="" ng-model="service">\r
  72                 <li ng-repeat="aService in [service]" ui-tree-node>\r
  73 \r
  74                     <div ng-if="isCR && collectionResource != null">\r
  75                         <div ui-tree-handle class="tree-node tree-node-content">\r
  76                             <a class="btn btn-success btn-xs" data-nodrag ng-click="this.toggle()">\r
  77                                 <span class="glyphicon"\r
  78                                       ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>\r
  79                             </a>\r
  80                             SERVICE INSTANCE: {{aService.instance.name}} | ORCH STATUS: {{serviceOrchestrationStatus}}\r
  81                             <a ng-if="isPermitted" data-tests-id="deleteServiceButton"\r
  82                                class="pull-right btn btn-danger btn-xs" data-nodrag\r
  83                                ng-click="deleteService(aService.instance);">\r
  84                                 <span class="glyphicon glyphicon-remove"></span>\r
  85                             </a>\r
  86 \r
  87                             <a class="pull-right btn btn-primary btn-xs" data-tests-id="infoServiceButton" data-nodrag\r
  88                                ng-click="describeService(aService.instance)" style="margin-right: 8px;">\r
  89                                 <span class="glyphicon glyphicon-info-sign service-info"></span>\r
  90                             </a>\r
  91                         </div>\r
  92                         <ol ui-tree-nodes="" ng-model="collections" ng-class="{hidden: collapsed}">\r
  93                             <li ng-repeat="collection in collections" ui-tree-node>\r
  94                                 <div ui-tree-handle class="tree-node tree-node-content" data-tests-id="collectionDiv">\r
  95                                     <a class="btn btn-success btn-xs" data-nodrag ng-click="this.toggle()">\r
  96                                         <span class="glyphicon"\r
  97                                               ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>\r
  98                                     </a>\r
  99                                     COLLECTION: {{collection["collection-name"]}} | TYPE:\r
 100                                     {{collection["collection-type"]}}\r
 101                                 </div>\r
 102                                 <ol ui-tree-nodes="" ng-model="networks" ng-class="{hidden: collapsed}">\r
 103                                     <li ng-repeat="network in networks" ui-tree-node>\r
 104                                         <div ui-tree-handle class="tree-node tree-node-content"\r
 105                                              data-tests-id="collectionNetworkDiv">\r
 106                                             NETWORK INSTANCE GROUP: {{network["network-id"]}} | ROLE:\r
 107                                             {{network["network-role"]}} | TYPE: {{network["network-type"]}} | # OF\r
 108                                             NETWORKS: {{collectionResource.networks.length}}\r
 109                                         </div>\r
 110                                     </li>\r
 111                                 </ol>\r
 112                             </li>\r
 113                         </ol>\r
 114                     </div>\r
 115                     <div ng-if="!isCR">\r
 116                         <div ui-tree-handle class="tree-node tree-node-content">\r
 117                             <a class="btn btn-success btn-xs"\r
 118                                ng-if="(aService.instance.vnfs && aService.instance.vnfs.length > 0) ||(aService.instance.pnfs && aService.instance.pnfs.length > 0) || (aService.instance.networks && aService.instance.networks.length > 0)"\r
 119                                data-nodrag ng-click="this.toggle()">\r
 120                                 <span class="glyphicon"\r
 121                                       ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>\r
 122                             </a>\r
 123                             SERVICE INSTANCE: {{aService.instance.name}} | ORCH STATUS: {{serviceOrchestrationStatus}}\r
 124                             <a ng-if="((isMacro()) ||  (isObjectEmpty(aService.instance.vnfs) && isObjectEmpty(aService.instance.networks) && isObjectEmpty(aService.instance.pnfs))) && isPermitted"\r
 125                                data-tests-id="deleteServiceButton" class="pull-right btn btn-danger btn-xs" data-nodrag\r
 126                                ng-click="deleteService(aService.instance, serviceOrchestrationStatus);">\r
 127                                 <span class="glyphicon glyphicon-remove"></span>\r
 128                             </a>\r
 129                             <div class="pull-right btn-group"\r
 130                                  ng-if="(aService.convertedModel.vnfs||aService.convertedModel.vnfs) &&(!isObjectEmpty(aService.convertedModel.pnfs)||!isObjectEmpty(aService.convertedModel.pnfs))  && !aService.convertedModel.isNewFlow && isPermitted">\r
 131                                 <button type="button" data-tests-id="addVNFButton"\r
 132                                         class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 133                                         aria-haspopup="true" aria-expanded="false">\r
 134                                     Add node instance<span class="caret"></span>\r
 135                                 </button>\r
 136                                 <ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs">\r
 137                                     <a role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs"\r
 138                                        data-tests-id="addVNFOption-{{vnf.modelCustomizationName}}"\r
 139                                        ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}}</a>\r
 140 \r
 141                                 </ul>\r
 142                             </div>\r
 143                             <div class="pull-right btn-group"\r
 144                                  ng-if="aService.convertedModel.vnfs && !isObjectEmpty(aService.convertedModel.vnfs) && aService.convertedModel.isNewFlow && isPermitted">\r
 145                                 <button type="button" data-tests-id="addVNFButton"\r
 146                                         class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 147                                         aria-haspopup="true" aria-expanded="false">\r
 148                                     Add node instance<span class="caret"></span>\r
 149                                 </button>\r
 150                                 <ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs"\r
 151                                     data-tests-id="addVnfsDropdown">\r
 152                                     <li role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs">\r
 153                                         <a data-tests-id="addVNFOption-{{vnf.modelCustomizationName}}"\r
 154                                            ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}}\r
 155                                             {{vnf.nfType}} {{vnf.nfRole}} {{vnf.nfFunction}} {{vnf.nfCode}}</a>\r
 156                                     </li>\r
 157                                 </ul>\r
 158                             </div>\r
 159                             <!--  <div class="pull-right btn-group" ng-if="aService.model.networks && !equals(aService.model.networks, {})">-->\r
 160                             <div class="pull-right btn-group"\r
 161                                  ng-if="aService.convertedModel.networks && (!(isObjectEmpty(aService.convertedModel.networks))) && isPermitted">\r
 162                                 <!--<div class="pull-right btn-group" ng-if="aService.model.networks">-->\r
 163                                 <button type="button" data-tests-id="addNetworkButton"\r
 164                                         class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 165                                         aria-haspopup="true" aria-expanded="false">\r
 166                                     Add Network<span class="caret"></span>\r
 167                                 </button>\r
 168                                 <ul class="dropdown-menu" ng-model="aService.convertedModel.networks">\r
 169                                     <li ng-repeat="(networkUuid, network) in aService.convertedModel.networks">\r
 170                                         <a data-tests-id="addNetworkOption-{{network.modelCustomizationName}}"\r
 171                                            ng-click="addNetworkInstance(network, aService.instance.vnfs)">{{network.modelCustomizationName}}</a>\r
 172                                     </li>\r
 173                                 </ul>\r
 174                             </div>\r
 175                             <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 176                                ng-click="describeService(aService.instance)" style="margin-right: 8px;">\r
 177                                 <span class="glyphicon glyphicon-info-sign service-info"></span>\r
 178                             </a>\r
 179                             <a data-tests-id="deactivateButton" ng-disabled="!isActivateDeactivateEnabled('deactivate')"\r
 180                                class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="deactivateMSOInstance()"\r
 181                                style="margin-right: 8px;">\r
 182                                 Deactivate\r
 183                             </a>\r
 184                             <a ng-if="!isActivateFabricConfiguration()" data-tests-id="activateButton" ng-disabled="!isActivateDeactivateEnabled('activate')"\r
 185                                class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="activateMSOInstance()"\r
 186                                style="margin-right: 8px;">\r
 187                                 Activate\r
 188                             </a>\r
 189                             <a ng-if="isActivateFabricConfiguration()" data-tests-id="activateFabricConfigurationButton" ng-disabled="!allConfigurationsAssigned"\r
 190                                class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="activateFabricConfigurationMSO()"\r
 191                                style="margin-right: 8px;">\r
 192                                 Activate Fabric Configuration\r
 193                             </a>\r
 194                             <a data-tests-id="showAssignmentsButton" ng-if="isShowAssignmentsEnabled()"\r
 195                                class="pull-right btn btn-primary btn-xs" data-nodrag style="margin-right: 8px;"\r
 196                                target="_blank" ng-href="{{showAssignmentsSDNC()}}">\r
 197                                 Show Assignments\r
 198                             </a>\r
 199                             <a data-tests-id="verifyServiceButton" ng-if="isShowVerifyService()" ng-disabled="!isEnableVerifyService()"\r
 200                                class="pull-right btn btn-primary btn-xs" data-nodrag style="margin-right: 8px;"\r
 201                                target="_blank" ng-click="activateVerifyService()">\r
 202                                 Verify Service\r
 203                             </a>\r
 204                         </div>\r
 205                         <ol ui-tree-nodes="" ng-model="aService.instance.vnfs" ng-class="{hidden: collapsed}">\r
 206                             <li ng-repeat="vnf in aService.instance.vnfs" ui-tree-node>\r
 207                                 <div ui-tree-handle class="tree-node tree-node-content">\r
 208                                     <a class="btn btn-success btn-xs"\r
 209                                        ng-if="(vnf.vfModules && vnf.vfModules.length > 0) || (vnf.volumeGroups && vnf.volumeGroups.length > 0)"\r
 210                                        data-nodrag ng-click="this.toggle()">\r
 211                                         <span class="glyphicon"\r
 212                                               ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>\r
 213                                     </a>\r
 214                                     VNF: {{vnf.name}} | TYPE: {{vnf.nodeType}} | ORCH STATUS: {{vnf.nodeStatus}}\r
 215 \r
 216                                     <a ng-if="(vnf.vfModules.length == 0) && (vnf.volumeGroups.length == 0) && isPermitted"\r
 217                                        data-tests-id="deleteVNFButton" class="pull-right btn btn-danger btn-xs"\r
 218                                        data-nodrag ng-click="deleteVnf(aService.instance, vnf)">\r
 219                                         <span class="glyphicon glyphicon-remove"></span>\r
 220                                     </a>\r
 221                                     <!--  <div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs[vnf.object['model-invariant-id']][vnf.object['model-version-id']].vfModules">-->\r
 222                                     <div class="pull-right btn-group"\r
 223                                          ng-if="(hasVfModules(vnf.object) && (aService.convertedModel.isNewFlow)) && isPermitted">\r
 224 \r
 225                                         <button type="button" data-tests-id="addVFModuleButton"\r
 226                                                 class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 227                                                 aria-haspopup="true" aria-expanded="false">\r
 228                                             Add VF-Module<span class="caret"></span>\r
 229                                         </button>\r
 230                                         <ul class="dropdown-menu" ng-model="vfModule">\r
 231                                             <a ng-repeat="(vfModuleCustomizationUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].vfModules"\r
 232                                                data-tests-id="addVFModuleOption-{{vfModule.modelCustomizationName}}"\r
 233                                                ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}} </a>\r
 234                                         </ul>\r
 235                                     </div>\r
 236 \r
 237 \r
 238                                     <div class="pull-right btn-group"\r
 239                                          ng-if="(hasVfModules(vnf.object) && (!(aService.convertedModel.isNewFlow))) && isPermitted">\r
 240 \r
 241                                         <button type="button" data-tests-id="addVFModuleButton"\r
 242                                                 class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 243                                                 aria-haspopup="true" aria-expanded="false">\r
 244                                             Add VF-Module<span class="caret"></span>\r
 245                                         </button>\r
 246                                         <ul class="dropdown-menu" ng-model="vnf">\r
 247                                             <a ng-repeat="(vfModuleUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-version-id']].vfModules"\r
 248                                                data-tests-id="addVFModuleOption-{{vfModule.modelCustomizationName}}"\r
 249                                                ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}}</a>\r
 250                                             </li>\r
 251                                         </ul>\r
 252 \r
 253                                     </div>\r
 254 \r
 255                                     <div class="pull-right btn-group"\r
 256                                          ng-if="(hasVolumeGroups(vnf.object) && (aService.convertedModel.isNewFlow)) && isPermitted">\r
 257                                         <button type="button" data-tests-id="addVolumeGroupButton"\r
 258                                                 class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 259                                                 aria-haspopup="true" aria-expanded="false">\r
 260                                             Add Volume Group<span class="caret"></span>\r
 261                                         </button>\r
 262                                         <ul class="dropdown-menu" ng-model="volumeGroup">\r
 263                                             <a ng-repeat="(volumeGroupCustomizationUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].volumeGroups"\r
 264                                                data-tests-id="addVolumeGroupOption-{{volumeGroup.modelCustomizationName}}"\r
 265                                                ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>\r
 266                                         </ul>\r
 267                                     </div>\r
 268 \r
 269                                     <div class="pull-right btn-group"\r
 270                                          ng-if="(hasVolumeGroups(vnf.object) && (!(aService.convertedModel.isNewFlow))) && isPermitted">\r
 271 \r
 272                                         <button type="button" data-tests-id="addVolumeGroupButton"\r
 273                                                 class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"\r
 274                                                 aria-haspopup="true" aria-expanded="false">\r
 275                                             Add Volume Group<span class="caret"></span>\r
 276                                         </button>\r
 277                                         <ul class="dropdown-menu" ng-model="vnf">\r
 278                                             <a ng-repeat="(volumeGroupUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-version-id']].volumeGroups"\r
 279                                                data-tests-id="addVolumeGroupOption-{{volumeGroup.modelCustomizationName}}"\r
 280                                                ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>\r
 281                                             </li>\r
 282                                         </ul>\r
 283 \r
 284                                     </div>\r
 285 \r
 286                                     <!-- VID-374/378 - switching-off feature <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="getStatusOfVnf(aService.instance, vnf)" style="margin-right: 8px;">\r
 287                                         <span class="glyphicon glyphicon-exclamation-sign"></span>\r
 288                                     </a>  -->\r
 289                                     <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 290                                        ng-click="describeVnf(aService.instance, vnf)" style="margin-right: 8px;">\r
 291                                         <span class="glyphicon glyphicon-info-sign vnf-info"></span>\r
 292                                     </a>\r
 293                                 </div>\r
 294                                 <ol ui-tree-nodes="" ng-model="vnf.instanceGroups" ng-class="{hidden: collapsed}">\r
 295                                     <li ng-repeat="instanceGroup in vnf.instanceGroups" ui-tree-node>\r
 296                                         <div ui-tree-handle class="tree-node tree-node-content"\r
 297                                              ng-class="'instanceGroupTreeNode'">\r
 298                                             INSTANCE-GROUP: {{instanceGroup.name}} | TYPE: Instance-Group\r
 299                                         </div>\r
 300 \r
 301                                     </li>\r
 302                                 </ol>\r
 303 \r
 304                                 <ol ui-tree-nodes="" ng-model="vnf.vfModules" ng-class="{hidden: collapsed}">\r
 305                                     <li ng-repeat="vfModule in vnf.vfModules" ui-tree-node>\r
 306                                         <div ui-tree-handle class="tree-node tree-node-content"\r
 307                                              ng-class="'vfModuleTreeNode-' + vfModule.nodeStatus.toLowerCase()">\r
 308                                             <a class="btn btn-success btn-xs"\r
 309                                                ng-if="(vfModule.volumeGroups && vfModule.volumeGroups.length > 0)"\r
 310                                                data-nodrag ng-click="this.toggle()">\r
 311                                                 <span class="glyphicon"\r
 312                                                       ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>\r
 313                                             </a>\r
 314                                             VFMODULE: {{vfModule.name}} | TYPE: {{vfModule.nodeType}} | ORCH STATUS:\r
 315                                             {{vfModule.nodeStatus}}\r
 316                                             <!--  -->\r
 317                                             <a class="pull-right btn btn-danger btn-xs" ng-if="isPermitted"\r
 318                                                data-tests-id="deleteVFModuleButton-{{vfModule.name}}" data-nodrag\r
 319                                                ng-click="deleteVfModule(aService.instance, vfModule, vnf)">\r
 320                                                 <span class="glyphicon glyphicon-remove"></span>\r
 321                                             </a>\r
 322                                             <div class="pull-right btn-group">\r
 323                                                 <!--   <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">\r
 324                                                     Attach Volume Group<span class="caret"></span>\r
 325                                                   </button>\r
 326                                                   <ul class="dropdown-menu" ng-model="vnf.volumeGroups">\r
 327                                                     <li ng-repeat="volumeGroup in vnf.availableVolumeGroups">\r
 328                                                         <a ng-click="attachVolumeGroupInstance(vfModule, volumeGroup)">{{volumeGroup.name}}</a>\r
 329                                                     </li>\r
 330                                                   </ul> -->\r
 331                                             </div>\r
 332                                             <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 333                                                ng-click="describeVfModule(aService.instance, vfModule, vnf)"\r
 334                                                style="margin-right: 8px;">\r
 335                                                 <span class="glyphicon glyphicon-info-sign vfmodule-info"></span>\r
 336                                             </a>\r
 337                                             <div class="resume"\r
 338                                                  ng-if="isPermitted && isResumeShown(vfModule.nodeStatus)">\r
 339                                                 <a data-tests-id="resumeVFModuleButton-{{vfModule.name}}"\r
 340                                                    class="pull-right btn btn-success btn-xs button-margin"\r
 341                                                    ng-click="resume(aService.instance, vfModule, vnf)">\r
 342                                                     Resume\r
 343                                                 </a>\r
 344                                             </div>\r
 345 \r
 346                                         </div>\r
 347                                         <ol ui-tree-nodes="" ng-model="vfModule.volumeGroups"\r
 348                                             ng-class="{hidden: collapsed}">\r
 349                                             <li ng-repeat="volumeGroup in vfModule.volumeGroups" ui-tree-node>\r
 350                                                 <div ui-tree-handle class="tree-node tree-node-content">\r
 351                                                     VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}}\r
 352                                                     | ORCH STATUS: {{volumeGroup.nodeStatus}}\r
 353                                                     <!-- <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVolumeGroup(aService.instance, vnf, vfModule, volumeGroup)">\r
 354                                                         <span class="glyphicon glyphicon-remove"></span>\r
 355                                                     </a> -->\r
 356                                                     <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 357                                                        ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)"\r
 358                                                        style="margin-right: 8px;">\r
 359                                                         <span class="glyphicon glyphicon-info-sign"></span>\r
 360                                                     </a>\r
 361                                                 </div>\r
 362                                             </li>\r
 363                                         </ol>\r
 364                                     </li>\r
 365                                 </ol>\r
 366                                 <ol ui-tree-nodes="" ng-model="vnf.availableVolumeGroups"\r
 367                                     ng-class="{hidden: collapsed}">\r
 368                                     <li ng-repeat="volumeGroup in vnf.availableVolumeGroups" ui-tree-node>\r
 369                                         <div ui-tree-handle class="tree-node tree-node-content">\r
 370                                             VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}} | ORCH\r
 371                                             STATUS: {{volumeGroup.nodeStatus}}\r
 372                                             <a class="pull-right btn btn-danger btn-xs" ng-if="isPermitted"\r
 373                                                data-tests-id="deleteVNFVolumeGroupButton" data-nodrag\r
 374                                                ng-click="deleteVnfVolumeGroup(aService.instance, vnf, volumeGroup)">\r
 375                                                 <span class="glyphicon glyphicon-remove"></span>\r
 376                                             </a>\r
 377                                             <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 378                                                ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)"\r
 379                                                style="margin-right: 8px;">\r
 380                                                 <span class="glyphicon glyphicon-info-sign volume-group-info"></span>\r
 381                                             </a>\r
 382                                         </div>\r
 383                                     </li>\r
 384                                 </ol>\r
 385 \r
 386                                 <ol ui-tree-nodes="" ng-model="vnf.networks"\r
 387                                     ng-class="{hidden: collapsed}">\r
 388                                     <li ng-repeat="network in vnf.networks" ui-tree-node>\r
 389                                         <div ui-tree-handle class="tree-node tree-node-content">\r
 390                                             NETWORK: {{network.name}} | TYPE: {{network.nodeType}} | ORCH\r
 391                                             STATUS: {{network.nodeStatus}}\r
 392                                         </div>\r
 393                                         <ol ui-tree-nodes="" ng-model="network.vlans" ng-class="{hidden: collapsed}">\r
 394                                             <li ng-repeat="vlan in network.vlans" ui-tree-node>\r
 395                                                 <div ui-tree-handle class="tree-node tree-node-content"\r
 396                                                      ng-class="'vlansTreeNode'">\r
 397                                                     VLAN: {{vlan.vlanIdInner}} | TYPE: VLAN\r
 398                                                 </div>\r
 399 \r
 400                                             </li>\r
 401                                         </ol>\r
 402                                     </li>\r
 403                                 </ol>\r
 404                             </li>\r
 405                         </ol>\r
 406 \r
 407                         <ol ui-tree-nodes="" ng-model="aService.instance.networks" ng-class="{hidden: collapsed}">\r
 408                             <li ng-repeat="network in aService.instance.networks" ui-tree-node>\r
 409                                 <div ui-tree-handle class="tree-node tree-node-content">\r
 410                                     NETWORK: {{network.name}} | TYPE: {{network.nodeType}} | ORCH STATUS:\r
 411                                     {{network.nodeStatus}}\r
 412 \r
 413                                     <a class="pull-right btn btn-danger btn-xs" ng-if="!isMacro() && isPermitted"\r
 414                                        data-tests-id="deleteNetworkButton" data-nodrag\r
 415                                        ng-click="deleteNetwork(aService.instance, network)">\r
 416                                         <span class="glyphicon glyphicon-remove"></span>\r
 417                                     </a>\r
 418                                     <!--  <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteNetwork(aService.instance, network)">\r
 419                                        <span class="glyphicon glyphicon-remove"></span>\r
 420                                    </a>-->\r
 421                                     <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 422                                        ng-click="describeNetwork(aService.instance, network)"\r
 423                                        style="margin-right: 8px;">\r
 424                                         <span class="glyphicon glyphicon-info-sign network-info"></span>\r
 425                                     </a>\r
 426                                 </div>\r
 427 \r
 428                                 <ol ui-tree-nodes="" ng-model="network.vlans" ng-class="{hidden: collapsed}">\r
 429                                     <li ng-repeat="vlan in network.vlans" ui-tree-node>\r
 430                                         <div ui-tree-handle class="tree-node tree-node-content"\r
 431                                              ng-class="'vlansTreeNode'">\r
 432                                             VLAN: {{vlan.vlanIdInner}} | TYPE: VLAN\r
 433                                         </div>\r
 434 \r
 435                                     </li>\r
 436                                 </ol>\r
 437                             </li>\r
 438                         </ol>\r
 439 \r
 440                         <ol ui-tree-nodes="" ng-model="aService.instance.configurations" ng-class="{hidden: collapsed}">\r
 441                             <li ng-repeat="configuration in aService.instance.configurations" ui-tree-node>\r
 442                                 <div ui-tree-handle class="tree-node tree-node-content">\r
 443                                     <a class="btn btn-success btn-xs"\r
 444                                        ng-if="(configuration.ports && configuration.ports.length > 0)" data-nodrag\r
 445                                        ng-click="this.toggle()">\r
 446                                         <span class="glyphicon"\r
 447                                               ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>\r
 448                                     </a>\r
 449                                     CONFIGURATION: {{configuration.name}} | TYPE: {{configuration.nodeType}} | ORCH\r
 450                                     STATUS: {{configuration.nodeStatus}}\r
 451 \r
 452                                     <a class="pull-right btn btn-danger btn-xs"\r
 453                                        ng-if="!isMacro() && isPermitted && configuration.nodeStatus !== STATUS_CONSTANTS.AAI_ACTIVE"\r
 454                                        ng-disabled="!isConfigurationDataAvailiable(configuration)"\r
 455                                        data-tests-id="deleteConfigurationButton"\r
 456                                        data-nodrag\r
 457                                        ng-click="deleteConfiguration(aService, configuration)">\r
 458                                         <span class="glyphicon glyphicon-remove"></span>\r
 459                                     </a>\r
 460 \r
 461 \r
 462                                     <a class="pull-right btn btn-primary btn-xs" data-nodrag\r
 463                                        ng-click="toggleConfigurationStatus(aService, configuration)"\r
 464                                        ng-if="isPermitted && allowConfigurationActions"\r
 465                                        ng-disabled="!isConfigurationDataAvailiable(configuration)"\r
 466                                        data-tests-id="activateDeactivateButton">\r
 467                                         {{configuration.nodeStatus === STATUS_CONSTANTS.AAI_ACTIVE ? "Deactivate" :\r
 468                                         "Activate"}}\r
 469                                     </a>\r
 470                                 </div>\r
 471                                 <ol ui-tree-nodes="" ng-model="configuration.ports" ng-class="{hidden: collapsed}">\r
 472                                     <li ng-repeat="port in configuration.ports" ui-tree-node>\r
 473                                         <div ui-tree-handle class="tree-node tree-node-content">\r
 474                                             PORT: {{port.portName}} | ORCH STATUS: {{port.portStatus}}\r
 475 \r
 476                                             <button type="button" data-tests-id="enableDisableButton"\r
 477                                                     class="pull-right btn btn-primary btn-xs"\r
 478                                                     ng-if="configuration.nodeStatus == STATUS_CONSTANTS.AAI_ACTIVE"\r
 479                                                     ng-disabled="!isConfigurationDataAvailiable(configuration)"\r
 480                                                     ng-click="togglePortStatus(aService, configuration, port)">\r
 481                                                 {{port.portStatus === STATUS_CONSTANTS.AAI_ENABLED ? "Disable" :\r
 482                                                 "Enable"}}\r
 483                                             </button>\r
 484                                         </div>\r
 485                                     </li>\r
 486                                 </ol>\r
 487                             </li>\r
 488                         </ol>\r
 489 \r
 490                         <ol id="pnfs-tree" ui-tree-nodes="" ng-model="pnfs"\r
 491                             ng-class="{hidden: collapsed || pnf.length === 0}">\r
 492                             <li ng-repeat="pnf in pnfs" ui-tree-node>\r
 493                                 <div ui-tree-handle class="tree-node tree-node-content">\r
 494                                     PNF: {{pnf}}\r
 495                                     <a ng-if="isMacro()===false" class="dissociate-pnf pull-right btn btn-primary btn-xs" data-nodrag\r
 496                                        ng-click="dissociatePnf(pnf)" style="margin-right: 8px;">\r
 497                                         <span>Dissociate</span>\r
 498                                     </a>\r
 499                                 </div>\r
 500                             </li>\r
 501                         </ol>\r
 502                     </div>\r
 503                 </li>\r
 504             </ol>\r
 505         </div>\r
 506     </div>\r
 507 </div>\r