aboutsummaryrefslogtreecommitdiffstats
path: root/vid-app-common/src/main/webapp/app/vid/scripts/view-models
diff options
context:
space:
mode:
authorjimmydot <jf2512@att.com>2017-05-07 14:58:24 -0400
committerjimmydot <jf2512@att.com>2017-05-07 14:58:24 -0400
commit3982f4f67314ec37fd9b22ae54049958af777c1b (patch)
tree72111b7c13ee7529cce1ea4c8d83c89fdd164450 /vid-app-common/src/main/webapp/app/vid/scripts/view-models
parent00e0d25933699f9e39c3f0b86c983165a1e3e330 (diff)
[VID-6] Initial rebase push
Change-Id: I9077be9663754d9b22f77c6a7b3109b361b39346 Signed-off-by: jimmydot <jf2512@att.com>
Diffstat (limited to 'vid-app-common/src/main/webapp/app/vid/scripts/view-models')
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm83
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm67
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm80
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm95
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm147
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm125
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm64
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/deletionDialog.htm70
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm48
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm248
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm47
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/popupWindow.htm30
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm91
-rwxr-xr-xvid-app-common/src/main/webapp/app/vid/scripts/view-models/statusDialog.htm66
14 files changed, 1261 insertions, 0 deletions
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm
new file mode 100755
index 00000000..d22e3d91
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubs.htm
@@ -0,0 +1,83 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<link rel="stylesheet" type="text/css" href="app/vid/styles/aaiGetSubs.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/styles/aaiSubDetails.css" />
+<script src="app/vid/scripts/controller/aaiSubscriberController.js"></script>
+<div ng-controller="aaiSubscriberController" ng-cloak>
+
+ <div>
+ <div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif"></img>
+ <label>Status:</label><span class="status">{{status}}</span>
+ </div>
+
+ <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>
+
+ <h2 class="heading2"><center>Search Existing Service Instances</center></h2>
+ <br>
+ Please search by the Subscriber name or enter Service Instance Id or Service Instance Name below:&nbsp;<br><br>
+
+ <table>
+ <tr>
+ <td style="width:30%">
+ <div class="fn-ebz-container">
+ <label class="fn-ebz-text-label">Subscriber Name:</label>
+ </div>
+ </td>
+ <td style="width:30%" nowrap>
+ <div class="fn-ebz-container" ng-init="autoGetSubs();">
+ <select ng-model="selectedCustomer" ng-options="item.globalCustomerId as item.subscriberName for item in customerList | orderBy:'subscriberName'">
+ <option value="">Select a subscriber</option></select>
+ &nbsp;&nbsp;<a class="btn btn-primary" ng-click="refreshSubs();" ><span class="glyphicon glyphicon-refresh"></span></a>
+ </div>
+ </td>
+
+ </tr>
+ <tr>
+ <td style="width:30%">
+ <div class="fn-ebz-container">
+ <select style="width: 250px;" ng-model="selectedserviceinstancetype" ng-options="stype.sinstance as stype.sinstance for stype in serviceInstanceses" >
+ <option value="">Select a Service Instance</option>
+ </select>
+ </div>
+ </td>
+ <td style="width:60%">
+ <div class="fn-ebz-container">
+ <input type="text" style="width: 350px;" name="selectedServiceInstance" ng-model="selectedServiceInstance" restrict-input ="{type : selectedserviceinstancetype}" />
+ </div>
+ </td>
+
+ </tr>
+ <tr>
+ <td>
+ <td style="width:30%">
+ <div>
+ <button type="submit" class="btn btn-primary" size="small" ng-click="getSubscriberDet(selectedCustomer,selectedserviceinstancetype,selectedServiceInstance);">Submit</button></a>
+ </div>
+ </td>
+ </td>
+ </tr>
+ </table>
+
+
+ </div>
+
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm
new file mode 100755
index 00000000..6a911be1
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiGetSubscriberList.htm
@@ -0,0 +1,67 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<link rel="stylesheet" type="text/css" href="app/vid/styles/aaiGetSubs.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/styles/aaiSubDetails.css" />
+<script src="app/vid/scripts/controller/aaiSubscriberController.js"></script>
+<div ng-controller="aaiSubscriberController" ng-cloak>
+
+ <div>
+ <div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif"></img>
+ <label>Status:</label><span class="status">{{status}}</span>
+ </div>
+
+ <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>
+
+ <h2 class="heading2"><center>Create New Service Instance</center></h2>
+
+ <table>
+ <tr>
+ <td >
+ <div class="fn-ebz-container">
+ <label class="fn-ebz-text-label">Subscriber Name:</label>
+ </div>
+ </td>
+ <td style="width:80%" nowrap>
+ <div class="fn-ebz-container" ng-init="autoGetSubs();">
+ <select ng-model="selectedCustomer" ng-options="item.globalCustomerId as item.subscriberName for item in customerList | orderBy:'subscriberName'">
+ <option value="">Select Subscriber Name</option></select>
+ &nbsp;&nbsp;<a class="btn btn-primary" ng-click="refreshSubs();" ><span class="glyphicon glyphicon-refresh"></span></a>
+ </div>
+ </td>
+
+ </tr>
+ <tr>
+ <td >
+ </td>
+ <td style="width:80%">
+ <div >
+ <button type="submit" class="btn btn-primary" size="small" ng-click="getServiceTypes(selectedCustomer);">Submit</button></a>
+ &nbsp;&nbsp;<button type="submit" class="btn btn-primary" size="small" ng-click="cancelCreateSI()">Cancel</button></a>
+ </div>
+ </td>
+ </tr>
+ </table>
+
+
+ </div>
+
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm
new file mode 100755
index 00000000..6711bfaf
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiServiceTypes.htm
@@ -0,0 +1,80 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<link rel="stylesheet" type="text/css" href="app/vid/styles/aaiGetSubs.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/styles/aaiSubDetails.css" />
+<script src="app/vid/scripts/controller/aaiSubscriberController.js"></script>
+<div ng-controller="aaiSubscriberController" ng-cloak>
+
+ <div>
+ <div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif"></img>
+ <label>Status:</label><span class="status">{{status}}</span>
+ </div>
+ <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>
+ <h2 class="heading2"><center>Create New Service Instance</center></h2>
+
+ <table>
+
+ <tr>
+ <td >
+ <div class="fn-ebz-container">
+ <label class="fn-ebz-text-label" >Subscriber Name :</label>
+ </div>
+ </td>
+ <td style="width:80%" nowrap>
+ <div class="fn-ebz-container">
+ <textarea style=" height: 15px width: 100% border: none resize: none overflow: hidden background-color: #ddd outline: none" ng-model="createSubscriberName">{{createSubscriberName}}</textarea>
+
+ </div>
+ </td>
+
+ </tr>
+ <tr>
+ <td >
+ <div class="fn-ebz-container">
+ <label class="fn-ebz-text-label">Service Type :</label>
+ </div>
+ </td>
+ <td style="width:80%" nowrap>
+ <div class="fn-ebz-container" ng-init="getServiceTypesList()">
+ <select ng-model="selectedServicetype" ng-options="key as value for (key , value) in serviceTypeList">
+ <option value="">Select Service Type</option></select>
+ &nbsp;&nbsp;<a class="btn btn-primary" ng-click="refreshServiceTypes(subId);" ><span class="glyphicon glyphicon-refresh"></span></a>
+ </div>
+ </td>
+
+ </tr>
+ <tr>
+ <td >
+ </td>
+ <td style="width:80%">
+ <div >
+ <button type="submit" class="btn btn-primary" size="small" ng-click="getAaiServiceModels(selectedServicetype,createSubscriberName);">Submit</button></a>
+ &nbsp;&nbsp;<button type="submit" class="btn btn-primary" size="small" ng-click="cancelCreateSIType()">Cancel</button></a>
+ </div>
+ </td>
+ </tr>
+ </table>
+
+
+ </div>
+
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm
new file mode 100755
index 00000000..2426f152
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubDetails.htm
@@ -0,0 +1,95 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+ <div ng-controller="aaiSubscriberController" ng-cloak>
+
+ <div>
+ <div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif">
+ </img>
+ <label>Status:</label><span class="status">{{status}}</span>
+ </div>
+
+ <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>
+
+ <h1 class="heading1"><center>Subscriber Details for {{selectedSubscriber}} ({{selectedSubscriberName}})</center></h1>
+ <br>
+ <div class="fn-ebz-container">
+ Filter:
+ <input class="fn-ebz-text" type="text" ng-model="searchString" size="20" style="width: 250px;">
+ </div>
+ <div ng-init="getSubDetails();">
+
+ <div style="margin-top: 30px">
+ <table att-table width="100%" table-data="displayData" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage" type="header">
+
+ <thead att-table-row>
+ <tr>
+ <th att-table-header sortable="false" key="viewSubDetails">View/Edit</th>
+ <th att-table-header sortable="true" key="globalCustomerId">Global Customer ID</th>
+ <th att-table-header sortable="true" key="subscriberName">Subscriber Name</th>
+ <th att-table-header sortable="true" key="serviceType">Service Type</th>
+ <th att-table-header default-sort="A" sortable="true" key="serviceInstanceName">Service Instance Name</th>
+ <th att-table-header sortable="true" key="serviceInstanceId">Service Instance ID</th>
+ </tr>
+ </thead>
+ <tbody att-table-row type="body" row-repeat="disData in displayData">
+ <tr>
+ <td att-table-body>
+ <div>
+ <a alt="View/Edit" ng-click="getAsdcModel(disData);"> View/Edit </a>
+ </div>
+ </td>
+ <!-- <td att-table-body ><button type=button ng-click="getAsdcModel(disData);" att-button btn-type="primary" size="small">View/Edit</button></td> --->
+ <td att-table-body ng-bind="disData['globalCustomerId']"></td>
+ <td att-table-body ng-bind="disData['subscriberName']"></td>
+ <td att-table-body ng-bind="disData['serviceType']"></td>
+ <td att-table-body ng-bind="disData['serviceInstanceName']"></td>
+ <td att-table-body ng-bind="disData['serviceInstanceId']"></td>
+ </tr>
+ </tbody>
+ </table>
+ <table width='100%'>
+ <tr>
+ <td width='33%' valign='middle'>
+ <span style="cursor: pointer" ng-if="currentPage>1"><button att-button size="small" ng-click="prevPage();">&lt; prev page</button></span>
+ </td>
+ <td width='33%' valign='middle'>
+ Jump to page:
+ <input class="fn-ebz-text" type="text" ng-model="currentPage" size="5" style="width: 47px;">
+ Results per page: <span style="cursor: pointer" ng-click="viewPerPage = 10" ng-style="viewPerPage === 10 && {'textDecoration':'underline','text-color':'black'}">10</span>
+ | <span style="cursor: pointer" ng-click="viewPerPage = 25" ng-style="viewPerPage === 25 && {'textDecoration':'underline','text-color':'black'}">25</span>
+ | <span style="cursor: pointer" ng-click="viewPerPage = 50" ng-style="viewPerPage === 50 && {'textDecoration':'underline','text-color':'black'}">50</span>
+ </td>
+ <td width='34%' align='right' valign='middle'>
+ <span style="cursor: pointer" ng-if="currentPage<totalPage"><button att-button size="small" ng-click="nextPage();">next page &gt;</button></span>
+ </td>
+ </tr>
+ </table>
+
+
+ </div>
+
+ </div>
+
+
+ </div>
+
+ </div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm
new file mode 100755
index 00000000..a7ea8336
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/aaiSubViewEdit.htm
@@ -0,0 +1,147 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="aaiSubscriberController" ng-cloak>
+
+ <div popup-window class="popupContents" ngx-show="{{popup.isVisible}}"
+ ng-cloak>
+ <div ng-include="'app/vid/scripts/view-models/creationDialog.htm'"></div>
+ <div ng-include="'app/vid/scripts/view-models/deletionDialog.htm'"></div>
+ <div ng-include="'app/vid/scripts/view-models/detailsDialog.htm'"></div>
+ </div>
+
+ <div>
+ <div class="statusLine">
+ <img src="app/vid/images/spinner.gif"
+ ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]"></img>
+ <label>Status:</label><span class="status">{{status}}</span>
+ </div>
+
+ <h2 class="heading2">
+ <center>VIEW/EDIT SERVICE INSTANCE <a class="btn btn-primary btn-xs pull-right" ng-click="reloadRoute();" ><span class="glyphicon glyphicon-refresh"></span></a></center>
+ </h2>
+ </center>
+ </h2>
+ <br>
+
+
+ <center>
+ <table border="1">
+ <tr>
+ <th style="text-align: center" width="33%">SUBSCRIBER:
+ {{globalCustomerId}}</th>
+ <th style="text-align: center" width="34%">SERVICE TYPE:
+ {{serviceType}}</th>
+ <th style="text-align: center" width="33%">SERVICE INSTANCE
+ ID: {{serviceInstanceId}}</th>
+ <tr>
+ <tr>
+ <td colspan='3' style="text-align: center">Service Instance
+ Name: {{serviceInstanceName || "Not defined"}}
+ </td>
+ <tr>
+ </table>
+
+ </center>
+
+
+ <br>
+
+ <div ng-init="autoPopulateViewEdit();">
+ <script type="text/ng-template" id="nodes_renderer.html">
+ <div ui-tree-handle data-drag-enabled="false" class="tree-node tree-node-content">
+ <a class="btn btn-success btn-xs" ng-if="node.nodes && node.nodes.length > 0" data-nodrag ng-click="toggle(this)"><span
+ class="glyphicon"
+ ng-class="{
+ 'glyphicon-chevron-right': collapsed,
+ 'glyphicon-chevron-down': !collapsed
+ }"></span></a>
+ <div class='btn'>{{node.nodeType}}</div><div class='btn'>{{node.nodeId}}</div><div class='btn'>{{node.nodeStatus}}</div>
+
+ <a class="pull-right btn btn-danger btn-xs" ng-if="node.delete != false" data-nodrag ng-click="showVnfDetails(node);"><span class="glyphicon glyphicon-remove"></a>
+ <a class="pull-right btn btn-primary btn-xs" ng-if="node.info != false" data-nodrag ng-click="showVnfDetails();"><span
+ class="glyphicon glyphicon-zoom-in"></span></a>
+
+ </div>
+ <ol ui-tree-nodes ng-model="node.nodes" ng-class="{hidden: collapsed}">
+ <li ng-repeat="node in node.nodes" ui-tree-node ng-include="'nodes_renderer.html'">
+ </li>
+ </ol>
+</script>
+ <b>EXISTING</b>
+ <div ng-controller="TreeCtrl">
+ <div>
+ <div ui-tree id="tree-root" >
+ <ol ui-tree-nodes ng-model="treeList"">
+ <li ng-repeat="node in treeList" ui-tree-node data-nodrag
+ ng-include="'nodes_renderer.html'"></li>
+ </ol>
+ </div>
+ </div>
+
+ </div>
+ <b>AVAILABLE</b>
+
+ <script type="text/ng-template" id="nodes_renderer2.html">
+ <div ui-tree-handle data-drag-enabled="false" class="tree-node tree-node-content" >
+ <a class="btn btn-success btn-xs" ng-if="node.nodes && node.nodes.length > 0" data-nodrag ng-click="toggle(this)"><span
+ class="glyphicon"
+ ng-class="{
+ 'glyphicon-chevron-right': collapsed,
+ 'glyphicon-chevron-down': !collapsed
+ }"></span></a>
+ <div class='btn'>{{node.nodeType}}</div><div class='btn'>{{node.nodeId}}</div><div class='btn'>{{node.nodeStatus}}</div>
+
+ <a class="pull-right btn btn-primary btn-xs" ng-if="node.delete != false" data-nodrag ng-click="callDelete(this)">
+ <span class="glyphicon glyphicon-plus"></span>
+ </a>
+
+ <a class="pull-right btn btn-primary btn-xs" ng-if="node.info != false" data-nodrag ng-click="showInfoDialog(node.itemType, node.nodeId, node.nodeType);">
+ <span class="glyphicon glyphicon-zoom-in"></span>
+ </a>
+
+ </div>
+ <ol ui-tree-nodes ng-model="node.nodes" ng-class="{hidden: collapsed}">
+ <li ng-repeat="node in node.nodes" ui-tree-node ng-include="'nodes_renderer2.html'">
+ </li>
+ </ol>
+</script>
+
+ <div ng-controller="TreeCtrl">
+ <div>
+ <div ui-tree id="tree-root">
+ <ol ui-tree-nodes ng-model="availableTreeList">
+ <li ng-repeat="node in availableTreeList" ui-tree-node
+ data-nodrag ng-include="'nodes_renderer2.html'"></li>
+ </ol>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div>
+
+ <button type="button" " att-button
+ btn-type="primary" size="small">Show Details</button>
+
+ <pre>
+ {{inventoryResponseItem | json}}
+ </pre>
+ </div>
+ </div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm
new file mode 100755
index 00000000..a78b95ee
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/createInstanceServiceModels.htm
@@ -0,0 +1,125 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<link rel="stylesheet" type="text/css" href="app/vid/styles/serviceModels.css" />
+<div popup-window class="popupContents" ngx-show="{{popup.isVisible}}" ng-cloak>
+ <div ng-include="'app/vid/scripts/view-models/creationDialog.htm'"/>
+</div>
+<div >
+
+ <span class="statusLine" ng-class="{true:'smcVisible', false:'smcHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif"></img>
+ </span>
+ <span class="statusLine" ng-class="{true:'progVisible', false:'progHidden'}[isProgressVisible]">
+ <label>Status:</label><span class="status"><span ng-show="error"><font color='red'><b>Error: </b></font></span>{{status}}</span>
+ </span>
+ <br><br>
+
+
+ <table>
+
+ <tr>
+ <td >
+ <div class="fn-ebz-container">
+ <label class="fn-ebz-text-label" >Subscriber Name :</label>
+ </div>
+ </td>
+ <td style="width:80%" nowrap>
+ <div class="fn-ebz-container">
+ <textarea style=" height: 15px width: 100% border: none resize: none overflow: hidden background-color: #ddd outline: none" ng-model="createSubscriberName">{{createSubscriberName}}</textarea>
+
+ </div>
+ </td>
+
+ </tr>
+ <tr>
+ <td >
+ <div class="fn-ebz-container">
+ <label class="fn-ebz-text-label" >Service Type :</label>
+ </div>
+ </td>
+ <td style="width:80%" nowrap>
+ <div class="fn-ebz-container">
+ <textarea style=" height: 15px width: 100% border: none resize: none overflow: hidden background-color: #ddd outline: none" ng-model="serviceTypeName">{{serviceTypeName}}</textarea>
+
+ </div>
+ </td>
+
+ </tr>
+
+ </table>
+
+ <div class="fn-ebz-container">
+ Filter:
+ <input class="fn-ebz-text" type="text" ng-model="searchString" size="20" style="width: 250px;">
+ </div>
+
+ <!-- <h1 class="heading1" style="margin-top:20px;">Browse SDC Service Models</h1> -->
+ <div style="margin-top:30px" ng-init="getAaiServiceModelsList();">
+
+ <table att-table table-data="services" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage">
+ <thead att-table-row type="header">
+ <tr>
+ <th att-table-header key="action">Action</th>
+ <th att-table-header key="uuid">UUID</th>
+ <th att-table-header key="invariantUUID">Invariant UUID</th>
+ <th att-table-header default-sort="A" key="name">Name</th>
+ <th att-table-header key="version">Version</th>
+ <th att-table-header key="category">Category</th>
+ <th att-table-header key="distributionStatus">Distribution Status</th>
+ <th att-table-header key="lastUpdaterUserId">Last Updated By</th>
+ <th att-table-header key="toscaModelUrl">Tosca Model</th>
+ </tr>
+ </thead>
+ <tbody att-table-row type="body" row-repeat="service in services">
+ <tr>
+ <td att-table-body ><button type=button ng-click="deployService(service)" att-button btn-type="primary" size="small">Deploy</button></td>
+ <td att-table-body ng-bind="service['uuid']"></td>
+ <td att-table-body ng-bind="service['invariantUUID']"></td>
+ <td att-table-body ng-bind="service['name']"></td>
+ <td att-table-body ng-bind="service['version']"></td>
+ <td att-table-body ng-bind="service['category']"></td>
+ <td att-table-body ng-bind="service['distributionStatus']"></td>
+ <td att-table-body ng-bind="service['lastUpdaterUserId']"></td>
+ <td att-table-body ng-bind="service['toscaModelUrl']"></td>
+ </tr>
+ </tbody>
+ </table>
+ <table width='100%'>
+ <tr>
+ <td width='33%' valign='middle'>
+ <span style="cursor: pointer" ng-if="currentPage>1"><button att-button size="small" ng-click="prevPage();">&lt; prev page</button></span>
+ </td>
+ <td width='33%' valign='middle'>
+ Jump to page:
+ <input class="fn-ebz-text" type="text" ng-model="currentPage" size="5" style="width: 47px;">
+ Results per page: <span style="cursor: pointer" ng-click="viewPerPage = 10" ng-style="viewPerPage === 10 && {'textDecoration':'underline','text-color':'black'}">10</span>
+ | <span style="cursor: pointer" ng-click="viewPerPage = 25" ng-style="viewPerPage === 25 && {'textDecoration':'underline','text-color':'black'}">25</span>
+ | <span style="cursor: pointer" ng-click="viewPerPage = 50" ng-style="viewPerPage === 50 && {'textDecoration':'underline','text-color':'black'}">50</span>
+ </td>
+ <td width='34%' align='right' valign='middle'>
+ <span style="cursor: pointer" ng-if="currentPage<totalPage"><button att-button size="small" ng-click="nextPage();">next page &gt;</button></span>
+ </td>
+ </tr>
+ </table>
+
+ </div>
+ </div>
+
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
new file mode 100755
index 00000000..0ac74a9a
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
@@ -0,0 +1,64 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="creationDialogController">
+
+ <div ng-show="isDialogVisible">
+ <div class="titleLine">
+ <img src="app/vid/images/spinner.gif"
+ ngx-visible="{{isSpinnerVisible}}"></img>
+ <h3>Create {{componentName}} -- {{createType}}</h3>
+ </div>
+
+ <div class="error" ng-show="isErrorVisible">
+ <img src="app/vid/images/error.png"></img>{{error}}
+ </div>
+
+ <div ngx-visible="{{isDataVisible}}">
+ <parameter-block control="summaryControl"></parameter-block>
+ <h4>
+ User Provided Data (<img class="requiredIndicator"
+ src="app/vid/images/asterisk.png" height='10' width='10'></img> indicates required field)
+ </h4>
+ <parameter-block control="userProvidedControl"
+ callback="userParameterChanged(id);" editable></parameter-block>
+
+ <div class="prompt">
+ <p>
+ Enter Data and <span>Confirm</span> to<br />Create <span>{{componentName}}</span>
+ </p>
+ <p>
+ <span>Cancel</span> to Return to Previous Page.<br />Data entered
+ will be lost
+ </p>
+ </div>
+
+ </div>
+ <div class="buttonRow">
+ <button ngx-enabled="{{isConfirmEnabled}}" att-button size="small"
+ ng-click="confirm();">Confirm</button>
+ <button type="button" ng-click="cancel();" att-button
+ btn-type="primary" size="small">Cancel</button>
+ </div>
+ </div>
+
+ <div ng-include="'app/vid/scripts/view-models/msoCommit.htm'"></div>
+
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/deletionDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/deletionDialog.htm
new file mode 100755
index 00000000..b4b93166
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/deletionDialog.htm
@@ -0,0 +1,70 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="deletionDialogController">
+
+ <div ng-show="isDialogVisible">
+ <div class="titleLine">
+ <img src="app/vid/images/spinner.gif"
+ ngx-visible="{{isSpinnerVisible}}"></img>
+ <h3>Delete {{componentName}}</h3>
+ </div>
+
+ <div class="error" ng-show="isErrorVisible">
+ <img src="app/vid/images/error.png"></img>{{error}}
+ </div>
+
+ <parameter-block control="summaryControl"></parameter-block>
+
+ <div ngx-visible="{{isDataVisible}}">
+
+ <h4>
+ User Provided Data (<img class="requiredIndicator"
+ src="app/vid/images/asterisk.png" height='10' width='10'></img> indicates required field)
+ </h4>
+ <parameter-block control="userProvidedControl"
+ callback="userParameterChanged(id);" editable></parameter-block>
+
+ <div class="prompt">
+ <p>
+ Enter Data and <span>Confirm</span> to<br />Delete <span>{{componentName}}</span>
+ </p>
+ <p>
+ <span>Cancel</span> to Return to Previous Page.<br />Data entered
+ will be lost
+ </p>
+ </div>
+ </div>
+
+ <div class="buttonRow">
+ <!-- <button type="button" ng-click="confirm();" att-button
+ btn-type="primary" size="small" class="confirm">Confirm</button>
+ <button type="button" ng-click="cancel();" att-button
+ btn-type="primary" size="small">Cancel</button> --->
+ <button ngx-enabled="{{isConfirmEnabled}}" att-button size="small"
+ ng-click="confirm();">Confirm</button>
+ <button type="button" ng-click="cancel();" att-button
+ btn-type="primary" size="small">Cancel</button>
+ </div>
+ </div>
+
+ <div ng-include="'app/vid/scripts/view-models/msoCommit.htm'"></div>
+
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm
new file mode 100755
index 00000000..0e72e772
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm
@@ -0,0 +1,48 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="detailsDialogController" ng-show="isDialogVisible">
+
+ <div class="titleLine">
+ <img src="app/vid/images/spinner.gif"
+ ngx-visible="{{isSpinnerVisible}}"></img>
+ <h3>Service Instance Details</h3> <!-- {{componentName}} -->
+ </div>
+
+ <div class="error" ng-show="isErrorVisible">
+ <img src="app/vid/images/error.png"></img>{{error}}
+ </div>
+
+ <parameter-block control="summaryControl"></parameter-block>
+
+ <h4>{{componentName}} Details</h4>
+
+ <parameter-block control="detailsControl"></parameter-block>
+
+ <h4>Instantiation Transactions</h4>
+
+ <pre class="log">{{log}}</pre>
+
+ <div class="buttonRow">
+ <button type="button" ng-click="close();" att-button
+ btn-type="primary" size="small">Close</button>
+ </div>
+
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm
new file mode 100755
index 00000000..e4bb67ff
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm
@@ -0,0 +1,248 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="InstantiationController">
+
+ <div popup-window class="popupContents" ngx-show="{{popup.isVisible}}"
+ ng-cloak>
+ <div ng-include="'app/vid/scripts/view-models/creationDialog.htm'"></div>
+ <div ng-include="'app/vid/scripts/view-models/deletionDialog.htm'"></div>
+ <div ng-include="'app/vid/scripts/view-models/detailsDialog.htm'"></div>
+ <div ng-include="'app/vid/scripts/view-models/statusDialog.htm'"></div>
+ </div>
+ <div ng-controller="aaiSubscriberController" ng-init="getComponentList() ">
+ <div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif"></img>
+ <label>Status:</label><span class="status">{{status}}</span>
+ </div>
+
+ <div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>
+
+ <h1 class="heading1" style="margin-top: 20px;">View/Edit Service Instance</h1>
+ <a class="btn btn-primary btn-xs pull-right" ng-click="reloadRoute();" ><span class="glyphicon glyphicon-refresh"></span></a>
+
+ <br>
+
+ <center>
+ <table att-table border="1" ng-model="service">
+ <tr>
+ <th style="text-align: center" width="33%">SUBSCRIBER:
+ {{service.instance.subscriberName}}</th>
+ <th style="text-align: center" width="34%">SERVICE TYPE:
+ {{service.instance.serviceType}}</th>
+ <th style="text-align: center" width="33%">SERVICE INSTANCE
+ ID: {{service.instance.serviceInstanceId}}</th>
+ <tr>
+ <tr>
+ <td colspan='3' style="text-align: center">Service Instance
+ Name: {{service.instance.name || "Not defined"}}
+ </td>
+ <tr>
+ </table>
+
+ </center>
+
+ <div ui-tree data-drag-enabled="false" data-nodrop-enabled="true" style="margin: 30px">
+
+ <ol ui-tree-nodes="" ng-model="service" >
+ <li ng-repeat="aService in [service]" ui-tree-node>
+ <div ui-tree-handle class="tree-node tree-node-content">
+ <a class="btn btn-success btn-xs" ng-if="(aService.instance.vnfs && aService.instance.vnfs.length > 0) || (aService.instance.networks && aService.instance.networks.length > 0)" data-nodrag ng-click="this.toggle()">
+ <span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>
+ </a>
+ SERVICE INSTANCE: {{aService.instance.name}}
+ <a ng-if="((isMacro()) || ( ( isObjectEmpty(aService.instance.vnfs) && isObjectEmpty(aService.instance.networks) ) ))" class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteService(aService.instance);">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a>
+ <div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs && (!(isObjectEmpty(aService.convertedModel.vnfs))) && (!(aService.convertedModel.isNewFlow))">
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add VNF<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs">
+ <a role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs" ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}}</a>
+
+ </ul>
+ </div>
+ <div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs && (!(isObjectEmpty(aService.convertedModel.vnfs))) && (aService.convertedModel.isNewFlow)">
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add VNF<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs">
+ <li role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs">
+ <a ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}} {{vnf.nfType}} {{vnf.nfRole}} {{vnf.nfFunction}} {{vnf.nfCode}}</a>
+ </li>
+ </ul>
+ </div>
+ <!-- <div class="pull-right btn-group" ng-if="aService.model.networks && !equals(aService.model.networks, {})">-->
+ <div class="pull-right btn-group" ng-if="aService.convertedModel.networks && (!(isObjectEmpty(aService.convertedModel.networks)))">
+ <!--<div class="pull-right btn-group" ng-if="aService.model.networks">-->
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add Network<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="aService.convertedModel.networks">
+ <li ng-repeat="(networkUuid, network) in aService.convertedModel.networks">
+ <a ng-click="addNetworkInstance(network, aService.instance.vnfs)">{{network.modelCustomizationName}}</a>
+ </li>
+ </ul>
+ </div>
+ <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeService(aService.instance)" style="margin-right: 8px;">
+ <span class="glyphicon glyphicon-info-sign"></span>
+ </a>
+ </div>
+ <ol ui-tree-nodes="" ng-model="aService.instance.vnfs" ng-class="{hidden: collapsed}">
+ <li ng-repeat="vnf in aService.instance.vnfs" ui-tree-node>
+ <div ui-tree-handle class="tree-node tree-node-content">
+ <a class="btn btn-success btn-xs" ng-if="(vnf.vfModules && vnf.vfModules.length > 0) || (vnf.volumeGroups && vnf.volumeGroups.length > 0)" data-nodrag ng-click="this.toggle()">
+ <span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>
+ </a>
+ VNF: {{vnf.name}} | TYPE: {{vnf.nodeType}} | ORCH STATUS: {{vnf.nodeStatus}}
+ <a ng-if="(vnf.vfModules.length == 0) && (vnf.volumeGroups.length == 0)" class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVnf(aService.instance, vnf)">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a>
+ <!-- <div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs[vnf.object['model-invariant-id']][vnf.object['model-version-id']].vfModules">-->
+ <div class="pull-right btn-group" ng-if="(hasVfModules(vnf.object) && (aService.convertedModel.isNewFlow))">
+
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add VF-Module<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="vfModule" >
+ <a ng-repeat="(vfModuleCustomizationUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].vfModules" ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}} </a>
+ </ul>
+ </div>
+
+
+ <div class="pull-right btn-group" ng-if="(hasVfModules(vnf.object) && (!(aService.convertedModel.isNewFlow)))">
+
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add VF-Module<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="vnf">
+ <a ng-repeat="(vfModuleUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-version-id']].vfModules" ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}}</a>
+ </li>
+ </ul>
+
+ </div>
+
+ <div class="pull-right btn-group" ng-if="(hasVolumeGroups(vnf.object) && (aService.convertedModel.isNewFlow))">
+
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add Volume Group<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="volumeGroup" >
+ <a ng-repeat="(volumeGroupCustomizationUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].volumeGroups" ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>
+ </ul>
+ </div>
+
+ <div class="pull-right btn-group" ng-if="(hasVolumeGroups(vnf.object) && (!(aService.convertedModel.isNewFlow)))">
+
+ <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Add Volume Group<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="vnf">
+ <a ng-repeat="(volumeGroupUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-version-id']].volumeGroups" ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>
+ </li>
+ </ul>
+
+ </div>
+
+ <!-- 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;">
+ <span class="glyphicon glyphicon-exclamation-sign"></span>
+ </a> -->
+ <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVnf(aService.instance, vnf)" style="margin-right: 8px;">
+ <span class="glyphicon glyphicon-info-sign"></span>
+ </a>
+ </div>
+ <ol ui-tree-nodes="" ng-model="vnf.vfModules" ng-class="{hidden: collapsed}">
+ <li ng-repeat="vfModule in vnf.vfModules" ui-tree-node>
+ <div ui-tree-handle class="tree-node tree-node-content">
+ <a class="btn btn-success btn-xs" ng-if="(vfModule.volumeGroups && vfModule.volumeGroups.length > 0)" data-nodrag ng-click="this.toggle()">
+ <span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>
+ </a>
+ VFMODULE: {{vfModule.name}} | TYPE: {{vfModule.nodeType}} | ORCH STATUS: {{vfModule.nodeStatus}}
+ <!-- -->
+ <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVfModule(aService.instance, vfModule, vnf)">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a>
+ <div class="pull-right btn-group">
+ <!-- <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Attach Volume Group<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" ng-model="vnf.volumeGroups">
+ <li ng-repeat="volumeGroup in vnf.availableVolumeGroups">
+ <a ng-click="attachVolumeGroupInstance(vfModule, volumeGroup)">{{volumeGroup.name}}</a>
+ </li>
+ </ul> -->
+ </div>
+ <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVfModule(aService.instance, vfModule, vnf)" style="margin-right: 8px;">
+ <span class="glyphicon glyphicon-info-sign"></span>
+ </a>
+ </div>
+ <ol ui-tree-nodes="" ng-model="vfModule.volumeGroups" ng-class="{hidden: collapsed}">
+ <li ng-repeat="volumeGroup in vfModule.volumeGroups" ui-tree-node>
+ <div ui-tree-handle class="tree-node tree-node-content">
+ VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}} | ORCH STATUS: {{volumeGroup.nodeStatus}}
+ <!-- <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVolumeGroup(aService.instance, vnf, vfModule, volumeGroup)">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a> -->
+ <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)" style="margin-right: 8px;">
+ <span class="glyphicon glyphicon-info-sign"></span>
+ </a>
+ </div>
+ </li>
+ </ol>
+ </li>
+ </ol>
+ <ol ui-tree-nodes="" ng-model="vnf.availableVolumeGroups" ng-class="{hidden: collapsed}">
+ <li ng-repeat="volumeGroup in vnf.availableVolumeGroups" ui-tree-node>
+ <div ui-tree-handle class="tree-node tree-node-content">
+ VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}} | ORCH STATUS: {{volumeGroup.nodeStatus}}
+ <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVnfVolumeGroup(aService.instance, vnf, volumeGroup)">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a>
+ <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)" style="margin-right: 8px;">
+ <span class="glyphicon glyphicon-info-sign"></span>
+ </a>
+ </div>
+ </li>
+ </ol>
+ </li>
+ </ol>
+ <ol ui-tree-nodes="" ng-model="aService.instance.networks" ng-class="{hidden: collapsed}">
+ <li ng-repeat="network in aService.instance.networks" ui-tree-node>
+ <div ui-tree-handle class="tree-node tree-node-content">
+ NETWORK: {{network.name}} | TYPE: {{network.nodeType}} | ORCH STATUS: {{network.nodeStatus}}
+
+ <a class="pull-right btn btn-danger btn-xs" ng-if="(!isMacro())" data-nodrag ng-click="deleteNetwork(aService.instance, network)">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a>
+ <!-- <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteNetwork(aService.instance, network)">
+ <span class="glyphicon glyphicon-remove"></span>
+ </a>-->
+ <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeNetwork(aService.instance, network)" style="margin-right: 8px;">
+ <span class="glyphicon glyphicon-info-sign"></span>
+ </a>
+ </div>
+ </li>
+ </ol>
+ </li>
+ </ol>
+ </div>
+ </div>
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm
new file mode 100755
index 00000000..e3f415c4
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/msoCommit.htm
@@ -0,0 +1,47 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="msoCommitController" ng-show="isViewVisible">
+
+ <div class="statusLine">
+ <img src="app/vid/images/spinner.gif"
+ ngx-visible="{{isSpinnerVisible}}"> </img> <label>Status:</label><span
+ class="status">{{status}}</span>
+ </div>
+
+ <div class="feedback">
+
+ <div progress-bar control="progressBarControl"
+ value="{{percentProgress}}" increases-only="true"
+ ngx-show="{{isProgressVisible}}"></div>
+
+ <div class="error" ng-show="!isProgressVisible">
+ <img src="app/vid/images/error.png"></img>{{error}}
+ </div>
+
+ </div>
+
+ <pre class="log">{{log}}</pre>
+
+ <div class="buttonRow">
+ <button ngx-enabled="{{isCloseEnabled}}" att-button size="small"
+ ng-click="close();">Close</button>
+ </div>
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/popupWindow.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/popupWindow.htm
new file mode 100755
index 00000000..b932f25d
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/popupWindow.htm
@@ -0,0 +1,30 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div>
+<table
+ style="display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-collapse: collapse; margin: 0; padding: 0">
+ <tr>
+ <td align="center" style="vertical-align: top; padding: 10px"><div
+ style="display: inline-block; padding: 5px; background-color: white"
+ ng-transclude></div></td>
+ </tr>
+</table>
+</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
new file mode 100755
index 00000000..c0a8ee54
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
@@ -0,0 +1,91 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<link rel="stylesheet" type="text/css" href="app/vid/styles/serviceModels.css" />
+<div popup-window class="popupContents" ngx-show="{{popup.isVisible}}" ng-cloak>
+ <div ng-include="'app/vid/scripts/view-models/creationDialog.htm'"/>
+</div>
+<div>
+
+ <span class="statusLine" ng-class="{true:'smcVisible', false:'smcHidden'}[isSpinnerVisible]">
+ <img src="app/vid/images/spinner.gif"></img>
+ </span>
+ <span class="statusLine" ng-class="{true:'progVisible', false:'progHidden'}[isProgressVisible]">
+ <label>Status:</label><span class="status"><span ng-show="error"><font color='red'><b>Error: </b></font></span>{{status}}</span>
+ </span>
+ <br><br>
+
+ <div class="fn-ebz-container">
+ Filter:
+ <input class="fn-ebz-text" type="text" ng-model="searchString" size="20" style="width: 250px;">
+ </div>
+
+ <h1 class="heading1" style="margin-top:20px;">Browse SDC Service Models</h1>
+ <div style="margin-top:30px" ng-init="getServiceModels();">
+
+ <table att-table table-data="services" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage">
+ <thead att-table-row type="header">
+ <tr>
+ <th att-table-header key="action">Action</th>
+ <th att-table-header key="uuid">UUID</th>
+ <th att-table-header key="invariantUUID">Invariant UUID</th>
+ <th att-table-header default-sort="A" key="name">Name</th>
+ <th att-table-header key="version">Version</th>
+ <th att-table-header key="category">Category</th>
+ <th att-table-header key="distributionStatus">Distribution Status</th>
+ <th att-table-header key="lastUpdaterUserId">Last Updated By</th>
+ <th att-table-header key="toscaModelUrl">Tosca Model</th>
+ </tr>
+ </thead>
+ <tbody att-table-row type="body" row-repeat="service in services">
+ <tr>
+ <td att-table-body ><button type=button ng-click="deployService(service)" att-button btn-type="primary" size="small">Deploy</button></td>
+ <td att-table-body ng-bind="service['uuid']"></td>
+ <td att-table-body ng-bind="service['invariantUUID']"></td>
+ <td att-table-body ng-bind="service['name']"></td>
+ <td att-table-body ng-bind="service['version']"></td>
+ <td att-table-body ng-bind="service['category']"></td>
+ <td att-table-body ng-bind="service['distributionStatus']"></td>
+ <td att-table-body ng-bind="service['lastUpdaterUserId']"></td>
+ <td att-table-body ng-bind="service['toscaModelUrl']"></td>
+ </tr>
+ </tbody>
+ </table>
+ <table width='100%'>
+ <tr>
+ <td width='33%' valign='middle'>
+ <span style="cursor: pointer" ng-if="currentPage>1"><button att-button size="small" ng-click="prevPage();">&lt; prev page</button></span>
+ </td>
+ <td width='33%' valign='middle'>
+ Jump to page:
+ <input class="fn-ebz-text" type="text" ng-model="currentPage" size="5" style="width: 47px;">
+ Results per page: <span style="cursor: pointer" ng-click="viewPerPage = 10" ng-style="viewPerPage === 10 && {'textDecoration':'underline','text-color':'black'}">10</span>
+ | <span style="cursor: pointer" ng-click="viewPerPage = 25" ng-style="viewPerPage === 25 && {'textDecoration':'underline','text-color':'black'}">25</span>
+ | <span style="cursor: pointer" ng-click="viewPerPage = 50" ng-style="viewPerPage === 50 && {'textDecoration':'underline','text-color':'black'}">50</span>
+ </td>
+ <td width='34%' align='right' valign='middle'>
+ <span style="cursor: pointer" ng-if="currentPage<totalPage"><button att-button size="small" ng-click="nextPage();">next page &gt;</button></span>
+ </td>
+ </tr>
+ </table>
+
+ </div>
+ </div>
+
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/statusDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/statusDialog.htm
new file mode 100755
index 00000000..914516b8
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/statusDialog.htm
@@ -0,0 +1,66 @@
+<!--
+ ============LICENSE_START=======================================================
+ VID
+ ================================================================================
+ Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+ ================================================================================
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ ============LICENSE_END=========================================================
+ -->
+
+<div ng-controller="statusDialogController" ng-show="isDialogVisible">
+
+ <div class="titleLine">
+ <img src="app/vid/images/spinner.gif"
+ ngx-visible="{{isSpinnerVisible}}"></img>
+ <h3>VNF Update Prov Status</h3> <!-- {{componentName}} -->
+ </div>
+
+ <div class="error" ng-show="isErrorVisible">
+ <img src="app/vid/images/error.png"></img>{{error}}
+ </div>
+
+ <div class="success" ng-show="isSuccessVisible">
+ <b><center><h3><font color="green">{{success}}</font></h3></center></b>
+ </div>
+
+ <parameter-block control="summaryControl"></parameter-block>
+
+ <h4>{{componentName}} Status</h4>
+
+ <parameter-block control="detailsControl"></parameter-block>
+
+ <h4>
+ Modify Prov_Status: (<img class="requiredIndicator"
+ src="app/vid/images/asterisk.png" height='10' width='10'></img> indicates required field)
+ </h4>
+ <parameter-block control="userProvidedControl"
+ callback="userParameterChanged(id);" editable></parameter-block>
+
+ <div class="prompt">
+ <p>
+ Select Target Prov Status and <span>Submit</span> to<br />to Change the Prov Status of <span>{{componentName}}</span>
+ </p>
+ <p>
+ <span>Close</span> to Return to Previous Page.<br />
+ </p>
+ </div>
+
+ <div class="buttonRow">
+ <button ngx-enabled="{{isSubmitEnabled}}" att-button size="small"
+ ng-click="submit();">Submit</button>
+ <button ngx-enabled="{{isCancelEnabled}}" ng-click="cancel();" att-button
+ btn-type="primary" size="small">Close</button>
+ </div>
+
+</div>