feat: optimize e2e instance creation page code

Change-Id: I1014177f4bde31b9955ea59ef5c7a5171b6ad7a3
Issue-ID: USECASEUI-307
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>

2 files changed, 16 insertions, 18 deletions

diff --git a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html
index c0953a90..0a753a30 100644
--- a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html
+++ b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html
@@ -13,7 +13,7 @@
     See the License for the specific language governing permissions and
     limitations under the License.
 -->
-<!--<h3 class="title"> Services List </h3>-->
+
 <div class="model creation-model">
 
   <div class="top-title">
@@ -23,6 +23,7 @@
     </div>
   </div>
   <div class="detaildata fl">
+      <!--e2e detail data demonstration-->
     <div *ngIf="detailParams.serviceDomain == 'E2E Service'" class="baseparms clearfix">
       <div class="vnf-box">
         <h3> {{"i18nTextDefine_Base" | translate}} </h3>
@@ -56,7 +57,7 @@
         </ul>
       </div>
     </div>
-
+      <!--e2e detail data demonstration-->
     <div *ngIf="detailParams.serviceDomain=='Network Service'" class="baseparms clearfix">
       <div class="vnf-box">
         <h3> {{"i18nTextDefine_Base" | translate}} </h3>
@@ -93,7 +94,7 @@
     </div>
   </div>
 
-  <!-- chart -->
+  <!--topo chart -->
   <div class="chart fr">
     <div id="createChart">
       <svg width="100%" height="100%">
diff --git a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts
index 554f25c6..5affeb97 100644
--- a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts
+++ b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts
@@ -29,7 +29,6 @@ export class E2eDetailComponent implements OnInit {
   }
 
     ngOnInit() {
-        // this.getDetails();
         this.dataInit();
     }
 
@@ -39,7 +38,6 @@ export class E2eDetailComponent implements OnInit {
     serviceInstanceName: any;
     serviceType: any;
     input_parameters: any;
-    nsinput_parameters: any;
 
     // e2e
     service = {
@@ -52,7 +50,7 @@ export class E2eDetailComponent implements OnInit {
     ns_service = {
         name:"",
         description:""
-    }
+    };
     ns_nestedTemplates = [];
     ns_requestInputs = {};
     roote2e = {
@@ -120,7 +118,6 @@ export class E2eDetailComponent implements OnInit {
                 });
                 console.log(this.e2e_nestedTemplates);
                 console.log(this.e2e_requestInputs);
-                console.log(this.roote2e)
             }
         }else if(this.detailParams.serviceDomain == 'Network Service'){
             this.ns_service = {
@@ -139,7 +136,6 @@ export class E2eDetailComponent implements OnInit {
             });
             console.log(this.ns_nestedTemplates);
             console.log(this.ns_requestInputs);
-            console.log(this.rootns)
         }
         this.drawImage(this.detailParams.serviceDomain)
     }
@@ -158,19 +154,20 @@ export class E2eDetailComponent implements OnInit {
 
   }
 
+  // draw d3 charts
   render(data, imgmap) {
-    var width = document.getElementById("createChart").clientWidth,
+    let width = document.getElementById("createChart").clientWidth,
       height = document.getElementById("createChart").clientHeight;
-    var cluster = d3.layout.tree()
+    let cluster = d3.layout.tree()
       .size([width, height]);
-    var diagonal = d3.svg.diagonal()
+    let diagonal = d3.svg.diagonal()
       .projection(function (d) {
         return [d.x-18, d.y+40];
       });
-    var svg = d3.select("svg");
+    let svg = d3.select("svg");
 
     //marker
-    var marker =
+    let marker =
       svg.append("marker")
         .attr("id", "resolved")
         .attr("markerUnits", "strokeWidth")
@@ -189,16 +186,16 @@ export class E2eDetailComponent implements OnInit {
         .attr("stroke-width", 1)
         .style("stroke", "#2F8BF7")
         .attr('fill', 'white');
-    var i = 0;
-    var nodes = cluster.nodes(data).reverse();
+    let i = 0;
+    let nodes = cluster.nodes(data).reverse();
     nodes.forEach(function (d) {
       d.y = d.depth * 200+100;
 
     });
 
-    var links = cluster.links(nodes);
+    let links = cluster.links(nodes);
 
-    var linkEnter = svg.selectAll("path.link")
+    let linkEnter = svg.selectAll("path.link")
       .data(links);
 
     linkEnter.enter().append("path")
@@ -213,7 +210,7 @@ export class E2eDetailComponent implements OnInit {
         return "mypath" + i;
       });
 
-    var node = svg.selectAll(".node")
+    let node = svg.selectAll(".node")
       .data(nodes)
       .enter()
       .append("g")