diff options
Diffstat (limited to 'catalog-ui/src/app/ng2/components/properties-table/properties-table.component.html')
| -rw-r--r-- | catalog-ui/src/app/ng2/components/properties-table/properties-table.component.html | 121 |
1 files changed, 23 insertions, 98 deletions
diff --git a/catalog-ui/src/app/ng2/components/properties-table/properties-table.component.html b/catalog-ui/src/app/ng2/components/properties-table/properties-table.component.html index 3ab47074e7..426ae3ab23 100644 --- a/catalog-ui/src/app/ng2/components/properties-table/properties-table.component.html +++ b/catalog-ui/src/app/ng2/components/properties-table/properties-table.component.html @@ -1,6 +1,5 @@ - - <div class="properties-table"> + <loader [display]="isLoading" size="large" [relative]="true"></loader> <div class="table-header"> <div class="table-cell col1">Property Name</div> <div class="table-cell col2">Type</div> @@ -13,16 +12,27 @@ <div *ngFor="let instanceName of feInstancesNames; trackBy:instanceName"> <div class="table-rows-header">{{instanceName | contentAfterLastDot}}</div> - <div class="table-row" *ngFor="let property of fePropertiesMap[instanceName]; trackBy:property?.name" (click)="onClickPropertyRow(property, instanceName, $event)" [ngClass]="{'selected': selectedPropertyId === property.uniqueId}"> - <div class="table-cell col1"> - <checkbox [label]="property.name" - [(checked)]="property.isSelected" - [disabled]="property.isDisabled || property.isDeclared" - (checkedChange)="propertyChecked(property)" - tooltip="{{property.name}}"></checkbox> - <span *ngIf="property.description" class="property-description-icon sprite-new show-desc" tooltip="{{property.description}}"></span> + <div class="table-row" + *ngFor="let property of fePropertiesMap[instanceName] | searchFilter:'name':searchTerm; trackBy:property?.name" + (click)="onClickPropertyRow(property, instanceName, $event)" + [ngClass]="{'selected': selectedPropertyId && selectedPropertyId === property.name }"> + + <div class="table-cell col1" [ngClass]="{'filtered':property.name === propertyNameSearchText}"> + <div class="property-name cut-inner-long-text"> + <checkbox [(checked)]="property.isSelected" + [disabled]="property.isDisabled || property.isDeclared || readonly" + (checkedChange)="propertyChecked(property)"></checkbox> + <div class="inner-cell-div" tooltip="{{property.name}}"> + <span>{{property.name}}</span> + </div> + </div> + <span *ngIf="property.description" class="property-description-icon sprite-new show-desc" tooltip="{{property.description}}"></span> + </div> + <div class="table-cell col2"> + <div class="inner-cell-div" tooltip="{{property.type | contentAfterLastDot}}"> + <span>{{property.type | contentAfterLastDot}}</span> + </div> </div> - <div class="table-cell col2">{{property.type | contentAfterLastDot}}</div> <div class="table-cell col3">{{property.schema && property.schema.property && property.schema.property.type ? (property.schema.property.type | contentAfterLastDot) : ''}}</div> <div class="table-cell valueCol"> @@ -32,7 +42,8 @@ [canBeDeclared]="true" [property]="property" [expandedChildId]="property.expandedChildPropertyId" - [propChildren]="property.flattenedChildren | filterChildProperties : property.expandedChildPropertyId" + [propertyNameSearchText]="propertyNameSearchText" + [readonly]="readonly" (valueChanged)="propValueChanged(property);" (expandChild)="property.updateExpandedChildPropertyId($event)" (clickOnPropertyRow)="onClickPropertyInnerRow($event, instanceName)" @@ -42,94 +53,8 @@ </div> </div> -<!-- - <div *ngIf="!property.isSimpleType && !property.isDeclared" class="table-cell valueCol child-property-container"> - - <div class="child-property-row" *ngFor="let flatProperty of property.flattenedChildren | filterChildProperties : property.expandedChildPropertyId" - [ngClass]="{'selected': selectedPropertyId === flatProperty.uniqueId}" (click)="clickOnPropertyRow(flatProperty, instanceName, $event)" [@fadeIn]="''"> - <derived-property [propertyObj]="flatProperty" [propertyNameSearchText]="propertyNameSearchText" [expanded]="flatProperty.propertiesName == property.expandedChildPropertyId" - (selectProperty)="propertySelected(property, $event, flatProperty.propertiesName)" (valueChanged)="propValueChanged(property)" (expandChild)="property.updateExpandedChildPropertyId($event)"></derived-property> - </div> - - </div> - <!-- - - - <property [propertyObj]="flatProperty" - [expanded]="flatProperty.parentName == property.expandedChildPropertyId" - (valueChanged)="propValueChanged($event)" - (selectChildProperty)="onChildPropertySelected($event)"></property> - <list-property *ngIf="property.type == 'list'" - [property]="property" - [selectedPropertyId]="selectedPropertyId" - (valueChanged)="propValueChanged($event)" - (selectChildProperty)="onChildPropertySelected($event)"></list-property> - <map-property *ngIf="property.type == 'map'" - [property]="property" - [selectedPropertyId]="selectedPropertyId" - (valueChanged)="propValueChanged($event)" - (selectChildProperty)="onChildPropertySelected($event)"></map-property> - <properties-value-inner-table *ngIf="property.isDataType" - [property]="property" - [selectedPropertyId]="selectedPropertyId" - (selectChildProperty)="onChildPropertySelected($event)" - (valueChanged)="propValueChanged($event)"></properties-value-inner-table> - --> - - </div> </div> </div> -<!-- -<div class="properties-table" style="display:block"> - <div class="table-header"> - <div class="table-cell col1">Property Name</div> - <div class="table-cell col2">Type</div> - <div class="table-cell col3">ES</div> - <div class="table-cell valueCol">Value</div> - </div> - <div class="table-body"> - <div class="no-data" *ngIf="!properties || !properties.length">No data to display</div> - <div class="table-row" *ngFor="let property of properties" (click)="clickOnPropertyRow(property)"> - <div class="table-cell col1"><checkbox [label]="property.name" [(checked)]="property.isSelected" (checkedChange)="propSelected(property)" [disabled]="property.isDisabled"></checkbox></div> - <div class="table-cell col2">{{property.type | contentAfterLastDot}}</div> - <div class="table-cell col3">{{property.schema && property.schema.property && property.schema.property.type ? (property.schema.property.type | contentAfterLastDot) : ''}}</div> - <div class="table-cell valueCol" [class.inner-table-container]="property.childrenProperties || !property.isSimpleType"> - <!--<input class="value-input" *ngIf="property.isSimpleType" - type="property.derivedFromSimpleTypeName || property.type" - [(ngModel)]="property.value" - (change)="putDefaultValueInEmptyProperty(property);propValueChanged(property);" - pattern="validationUtils.getValidationPattern(property.type)"/> - <dynamic-element - class="value-input" - *ngIf="property.isSimpleType" - [(value)]="property.value" - (valueChange)="putDefaultValueInEmptyProperty(property);propValueChanged(property);" - [type]="property.derivedFromSimpleTypeName || property.type" - [name]="property.name"> - </dynamic-element> - <list-property *ngIf="property.type == 'list'" - [property]="property" - [selectedPropertyId]="selectedPropertyId" - (valueChanged)="propValueChanged($event)" - (selectChildProperty)="onChildPropertySelected($event)"></list-property> - <map-property *ngIf="property.type == 'map'" - [property]="property" - [selectedPropertyId]="selectedPropertyId" - (valueChanged)="propValueChanged($event)" - (selectChildProperty)="onChildPropertySelected($event)"></map-property> - <properties-value-inner-table *ngIf="property.isDataType" - [property]="property" - [selectedPropertyId]="selectedPropertyId" - (selectChildProperty)="onChildPropertySelected($event)" - (valueChanged)="propValueChanged($event)"></properties-value-inner-table> - </div> - - </div> - </div> -</div> --> - - - |