Support set value for tree branch

Set value for tree branch node.

Issue-ID: SDC-355

Change-Id: I4fea941bc2f3de321079049ea4735491cf9ca474
Signed-off-by: Lvbo163 <lv.bo163@zte.com.cn>

1 files changed, 36 insertions, 48 deletions

diff --git a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html b/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html
index 0a12a600..cf4f9354 100644
--- a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html
+++ b/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html
@@ -1,54 +1,42 @@
 
-<!--
-/**
- * Copyright (c) 2017 ZTE Corporation.
- * All rights reserved. This program and the accompanying materials
- * are made available under the terms of the Eclipse Public License v1.0
- * and the Apache License 2.0 which both accompany this distribution,
- * and are available at http://www.eclipse.org/legal/epl-v10.html
- * and http://www.apache.org/licenses/LICENSE-2.0
- *
- * Contributors:
- *     ZTE - initial API and implementation and/or initial documentation
- */
- -->
 <p-tree *ngIf="parameters.length > 0" [value]="parameters">
-    <ng-template let-node  pTemplate="default">
-        <b4t-parameter [param]="node.parameter" [canEditName]="node.keyEditable" [valueSource]= "valueSource"
-            [planItems]="planItems" (paramChange)="paramChange($event, node)"></b4t-parameter>
-    </ng-template>
+        <ng-template let-node  pTemplate="default">
+            <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "valueSource"
+                [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)"
+                (delete)="deleteTreeNode(node)"></b4t-parameter>
+        </ng-template>
 
-    <ng-template let-node  pTemplate="array">
-        <span *ngIf="!node.keyEditable">[Array]({{node.children.length}}) {{node.label}}:</span>
-        <span *ngIf="node.keyEditable">[Array]({{node.children.length}})
-            <b4t-editable-property [parameter]="getKeyParameter(node)"  [showLabel]="false"
-                [planItems]="planItems" (parameterChange)="keyParameterChange(node, $event)"></b4t-editable-property>
-        </span>
-        <i class="fa fa-plus-square-o" (click)="addChildNode4ObjectArray(node)"></i>
-    </ng-template>
-    <ng-template let-node pTemplate="object">
-        <span *ngIf="!node.keyEditable">[Object] {{node.label}}:</span>
-        <span *ngIf="node.keyEditable">[Object]
-            <b4t-editable-property [parameter]="getKeyParameter(node)"  [showLabel]="false"
-                [planItems]="planItems" (parameterChange)="keyParameterChange(node, $event)"></b4t-editable-property>:
-        </span>
+        <ng-template let-node  pTemplate="array">
+            <div class="row">
+                <div class="col-md-11">
+                    <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "getObjectValueSource()"
+                    [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)"
+                    (delete)="deleteTreeNode(node)"></b4t-parameter>
+                </div>
+                <div class="col-md-1">
+                    <i class="fa fa-plus-square-o" (click)="addChildNode4ObjectArray(node)"></i>
+                </div>
+            </div>
+        </ng-template>
 
-        <span *ngIf="canEditValue(node)" class="dynamic-object-value">
-            <textarea [ngModel]="getObjectValue(node)" (ngModelChange)="updateObjectValue(node, $event)"></textarea>
-        </span>
+        <ng-template let-node pTemplate="object">
+            <div class="row">
+                <div [ngClass]="getWidth(node)">
+                    <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "getObjectValueSource()"
+                    [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)"
+                    (delete)="deleteTreeNode(node)"></b4t-parameter>
+                </div>
+                <div *ngIf="canAdd(node)" class="col-md-1">
+                    <i class="fa fa-plus-square-o" (click)="addChildNode4DynamicObject(node)"></i>
+                </div>
+            </div>
 
-        <i *ngIf="canDelete(node)" class="fa fa-minus-square-o" (click)="deleteTreeNode(node)"></i>
-        <i *ngIf="canAdd(node)" class="fa fa-plus-square-o" (click)="addChildNode4DynamicObject(node)"></i>
-    </ng-template>
+        </ng-template>
 
-    <ng-template let-node pTemplate="map">
-        <span *ngIf="!node.keyEditable">[Map] {{node.label}}:</span>
-        <span *ngIf="node.keyEditable">[Map]
-            <b4t-editable-property [parameter]="getKeyParameter(node)" [showLabel]="false"
-                [planItems]="planItems" (parameterChange)="keyParameterChange(node, $event)"></b4t-editable-property>:
-        </span>
-
-        <i *ngIf="canDelete(node)" class="fa fa-minus-square-o" (click)="deleteTreeNode(node)"></i>
-        <i *ngIf="canAdd(node)" class="fa fa-plus-square-o" (click)="addChildNode4DynamicObject(node)"></i>
-    </ng-template>
-</p-tree>
+        <ng-template let-node pTemplate="map">
+            <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "getObjectValueSource()"
+            [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)"
+            (delete)="deleteTreeNode(node)"></b4t-parameter>
+            <i *ngIf="canAdd(node)" class="fa fa-plus-square-o" (click)="addChildNode4DynamicObject(node)"></i>
+        </ng-template>
+    </p-tree>