From 4e4b306dec1b7e33e11144a3c17136a0683bd299 Mon Sep 17 00:00:00 2001
From: Luji7 <lu.ji3@zte.com.cn>
Date: Thu, 23 Mar 2017 14:44:57 +0800
Subject: show NFV-O service detail

commit gui code for showing service detail.

Issue-ID: CLIENT-45
Change-Id: I398fec812619c072e7aead4e2c1ff0399ab91a8e
Signed-off-by: Luji7 <lu.ji3@zte.com.cn>
---
 .../src/main/webapp/lifecyclemgr/js/DataService.js |  3 ++
 .../src/main/webapp/lifecyclemgr/js/app.js         | 46 ++++++++++++++++++++++
 .../webapp/lifecyclemgr/templates/nfvoDetail.html  | 27 +++++++++++++
 3 files changed, 76 insertions(+)
 create mode 100644 lifecyclemgr/src/main/webapp/lifecyclemgr/templates/nfvoDetail.html

(limited to 'lifecyclemgr')

diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js
index 8251458f..2a33517d 100644
--- a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js
+++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/DataService.js
@@ -87,6 +87,9 @@ app.factory("DataService", function($http, $log){
         loadServiceDetails : function(id) {
             return JSON.parse('[{"id":"12345", "name":"sdno"}, {"id":"23456", "name":"gso"},{"id":"12345", "name":"nfvo"}]');
         },
+        loadNfvoServiceDetails : function(id) {
+            return JSON.parse('{"vnfInfoId": [{ "vnfInstanceId": "123", "vnfInstanceName": "vnf instance 1", "vnfProfileId": "321" }, { "vnfInstanceId": "123", "vnfInstanceName": "vnf instance 1", "vnfProfileId": "321" }],  "vlInfo": [{ "networkResource": {"resourceName": "network resource 1"}, "linkPortResource": { "resourceName": "link port resource 1"}}, { "networkResource": {"resourceName": "network resource 1"}, "linkPortResource": { "resourceName": "link port resource 1"}}], "vnffgInfo": [{"vnfId": "vnfid-123", "virtualLinkId": "virtual link 123", "cpId": "cp id 123", "nfp": "nfp 123"}, {"vnfId": "vnfid-123", "virtualLinkId": "virtual link 123", "cpId": "cp id 123", "nfp": "nfp 123"}]}');
+        },
 
         generateTemplatesComponent : function() {
             //dropdown data
diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js
index 3fceb57a..c7d7b3db 100644
--- a/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js
+++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js
@@ -94,6 +94,11 @@ var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', '
                 templateUrl : "templates/inputData.html",
                 controller : "inputDataCtrl"
             })
+            .state("home.lcTabs.detailInfo.nfvoDetail", {
+                url : "/nfvoDetailInfo",
+                templateUrl: "templates/nfvoDetail.html",
+                controller: "nfvoDetailCtrl"
+            })
 
             .state("home.lcTabs.detailInfo.vpnManager", {
                 url : "/vpnManager",
@@ -683,6 +688,47 @@ var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', '
 
     })
 
+    .controller('nfvoDetailCtrl', function($scope, $stateParams, $compile, DataService) {
+        console.log("nfvoDetailCtrl --> $stateParams.id:: " + $stateParams.id);
+        //$scope.currentId = $stateParams.id;
+
+        var jsonData = DataService.loadNfvoServiceDetails($stateParams.id);
+        var table_tpl = $(modelTemplate).filter('#table').html();
+        var vnfData = fetchDataForVnf(jsonData);
+        $('#vnfInfoTable').html(Mustache.to_html(table_tpl, vnfData));
+
+        var vlData = fetchDataForVl(jsonData);
+        $('#vlInfoTable').html(Mustache.to_html(table_tpl, vlData));
+
+        var vnffgData = fetchDataForVnffg(jsonData);
+        $('#vnffgInfoTable').html(Mustache.to_html(table_tpl, vnffgData));
+
+        function fetchDataForVnf(jsonData) {
+            var header = ["Vnf instance Name"];
+            var rowData = jsonData.vnfInfoId.map(function (vnfInfo) {
+                return {"values": [vnfInfo.vnfInstanceName]}
+            });
+            return {"itemHeader": header,"rowitem": rowData,"striped": false,"border": true,"hover": true,"condensed": false,"filter": false,"action": "","searchField": ""}
+        }
+
+        function fetchDataForVl(jsonData) {
+            var header = ["Network Resource Name","Link Port Resource Name"];
+            var rowData = jsonData.vlInfo.map(function (vl) {
+                return {"values": [vl.networkResource.resourceName, vl.linkPortResource.resourceName]}
+            });
+            return {"itemHeader": header,"rowitem": rowData,"striped": false,"border": true,"hover": true,"condensed": false,"filter": false,"action": "","searchField": ""}
+        }
+
+        function fetchDataForVnffg(jsonData) {
+            var header = ["vnfInstanceId of vnffg instance","vlInstanceId of vnffg instance","cpInstanceId of vnffg instance", "nfpInstanceId of vnffg instance"];
+            var rowData = jsonData.vnffgInfo.map(function (vnffg) {
+                return {"values": [vnffg.vnfId, vnffg.virtualLinkId, vnffg.cpId, vnffg.nfp]}
+            });
+            return {"itemHeader": header,"rowitem": rowData,"striped": false,"border": true,"hover": true,"condensed": false,"filter": false,"action": "","searchField": ""}
+        }
+
+    })
+
 
 var modelTemplate = "";
 function loadTemplate() {
diff --git a/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/nfvoDetail.html b/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/nfvoDetail.html
new file mode 100644
index 00000000..20813ef8
--- /dev/null
+++ b/lifecyclemgr/src/main/webapp/lifecyclemgr/templates/nfvoDetail.html
@@ -0,0 +1,27 @@
+<!--
+
+    Copyright 2016-2017 ZTE Corporation.
+
+    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.
+
+-->
+<div class="nfvoDetail">
+    <h5>VNF information:</h5>
+    <div id="vnfInfoTable"></div>
+    <br/>
+    <h5>VL information:</h5>
+    <div id="vlInfoTable"></div>
+    <br/>
+    <h5>VNFFG information:</h5>
+    <div id="vnffgInfoTable"></div>
+</div>
\ No newline at end of file
-- 
cgit 1.2.3-korg