aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html
diff options
context:
space:
mode:
authorMichael Lando <ml636r@att.com>2017-06-09 03:19:04 +0300
committerMichael Lando <ml636r@att.com>2017-06-09 03:19:04 +0300
commited64b5edff15e702493df21aa3230b81593e6133 (patch)
treea4cb01fdaccc34930a8db403a3097c0d1e40914b /catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html
parent280f8015d06af1f41a3ef12e8300801c7a5e0d54 (diff)
[SDC-29] catalog 1707 rebase commit.
Change-Id: I43c3dc5cf44abf5da817649bc738938a3e8388c1 Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html')
-rw-r--r--catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html66
1 files changed, 66 insertions, 0 deletions
diff --git a/catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html b/catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html
new file mode 100644
index 0000000000..17e4002ae5
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/properties-table/dynamic-property/dynamic-property.component.html
@@ -0,0 +1,66 @@
+<div class="dynamic-property-row"
+ [ngClass]="{'selected': selectedPropertyId === property.uniqueId }"
+ [class.with-top-border]="property.isChildOfListOrMap"
+ (click)="onClickPropertyRow(property, $event)">
+ <!-- LEFT CELL - for all NON-PropFEModel properties except for MAP)-->
+ <ng-container *ngIf="!isPropertyFEModel">
+ <div class="table-cell" *ngIf="canBeDeclared"> <!-- simple children of complex type -->
+ <checkbox [label]="property.name" [(checked)]="property.isSelected" [disabled]="property.isDisabled ||property.isDeclared" (checkedChange)="checkProperty.emit(property.propertiesName)"
+ ></checkbox>
+ </div>
+ <div class="table-cell" *ngIf="!canBeDeclared && !property.isChildOfListOrMap">{{property.name}}</div> <!-- simple children of complex type within map or list -->
+ </ng-container>
+ <!-- RIGHT CELL -->
+ <ng-container *ngIf="propType == derivedPropertyTypes.SIMPLE || property.isDeclared">
+ <div class="table-cell" [class.full-width]="isPropertyFEModel || property.isChildOfListOrMap">
+ <dynamic-element class="value-input"
+ pattern="validationUtils.getValidationPattern(property.type)"
+ [(value)]="property.value"
+ [type]="property.type"
+ [name]="property.name"
+ (valueChange)="propValueChanged(property);"
+ > <!--[disabled]="property.isDisabled || property.isDeclared" -->
+ </dynamic-element>
+ </div>
+ </ng-container>
+ <ng-container *ngIf="!property.isDeclared"> <!-- other cases need to fail if isDeclared, in which case we need to use full width value above instead) -->
+
+ <ng-container *ngIf="propType == derivedPropertyTypes.COMPLEX && !isPropertyFEModel">
+ <div class="table-cell complex" [class.full-width]="property.isChildOfListOrMap">
+ <span>{{property.type | contentAfterLastDot }}</span>
+ </div>
+ </ng-container>
+ <ng-container *ngIf="property.isChildOfListOrMap && propType == derivedPropertyTypes.MAP">
+ <div class="table-cell map-entry"><input type="text" /></div>
+ <div class="table-cell" *ngIf="property.schema.property.isSimpleType">
+ <input type="text" [(ngModel)]="property.value" /></div>
+ <div class="table-cell" *ngIf="!property.schema.property.isSimpleType">
+ <span>{{property.schema.property.type | contentAfterLastDot }}</span>
+ </div>
+ </ng-container>
+
+ <!-- ICONS: add, delete, and expand -->
+ <div *ngIf="(propType == derivedPropertyTypes.LIST || propType == derivedPropertyTypes.MAP) && !property.isChildOfListOrMap" class="table-cell"><span class="sprite-new add-item-icon" (click)="addRows()"></span></div>
+ <span *ngIf="property.isChildOfListOrMap" class="delete-span sprite-new delete-item-icon" (click)="deleteItem.emit(property.propertiesName)"></span>
+ <span *ngIf="propType == derivedPropertyTypes.COMPLEX || (property.isChildOfListOrMap && propChildren)" (click)="expandChildById(propPath)" class="expand-icon" [class.expanded]="propPath == expandedChildId">V</span>
+ </ng-container>
+
+</div>
+<!-- Now, recurse into children -->
+<ng-container *ngIf="propChildren && !property.isDeclared">
+ <ng-container *ngFor="let prop of propChildren | filterChildProperties: expandedChildId; trackBy:prop?.propertiesName">
+ <dynamic-property
+ [selectedPropertyId]="selectedPropertyId"
+ [canBeDeclared]="childrenCanBeDeclared"
+ [property]="prop"
+ [expandedChildId]="expandedChildId"
+ [propChildren]=""
+ (valueChanged)="propValueChanged(prop);"
+ (expandChild)="expandChildById($event)"
+ (deleteItem)="deleteListOrMapItem($event)"
+ (clickOnPropertyRow)="onClickPropertyRow($event)"
+ (checkProperty)="checkedChange($event)"
+ >
+ </dynamic-property>
+ </ng-container>
+</ng-container>