aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/pages
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/ng2/pages')
-rw-r--r--catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html8
-rw-r--r--catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less120
-rw-r--r--catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts6
-rw-r--r--catalog-ui/src/app/ng2/pages/properties-assignment/properties.utils.ts1
4 files changed, 80 insertions, 55 deletions
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html
index 317a1fc827..fa3270ec77 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.html
@@ -28,7 +28,7 @@
</tab>
</tabs>
<div class="header">
- <div class="search-filter-container">
+ <div class="search-filter-container" [class.without-filter]="isInpusTabSelected">
<input type="text" class="search-box" placeholder="Search" [(ngModel)]="searchQuery" />
<span class="sprite search-icon"></span>
<filter-properties-assignment *ngIf="!isInpusTabSelected" #advanceSearch class="advance-search" [componentType]="component.componentType" (searchProperties)="searchPropertiesInstances($event)"></filter-properties-assignment>
@@ -42,7 +42,7 @@
<tab tabTitle="Composition">
<div class="hierarchy-nav-container">
<loader [display]="loadingInstances" size="medium" [relative]="true"></loader>
- <div class="hierarchy-header">
+ <div class="hierarchy-header white-sub-header">
<span tooltip="{{component.name}}">{{component.name}}</span>
</div>
<div *ngIf="!instancesNavigationData || instancesNavigationData.length === 0 || isInpusTabSelected">No data to display</div>
@@ -55,8 +55,8 @@
</tab>
<tab tabTitle="Property Structure">
<div class="hierarchy-nav-container">
- <div class="hierarchy-header">
- <span tooltip="{{!isInpusTabSelected ? (propertyStructureHeader || selectedFlatProperty.name) : ''}}">{{!isInpusTabSelected ? (propertyStructureHeader || selectedFlatProperty.name || "No Property Selected") : "No Property Selected"}}</span>
+ <div class="hierarchy-header white-sub-header" [class.selected]="selectedFlatProperty.path == propertyStructureHeader">
+ <span tooltip="{{!isInpusTabSelected ? propertyStructureHeader : ''}}">{{!isInpusTabSelected ? (propertyStructureHeader || "No Property Selected") : "No Property Selected"}}</span>
</div>
<div *ngIf="!propertiesNavigationData || propertiesNavigationData.length === 0 || isInpusTabSelected">No data to display</div>
<hierarchy-navigation class="hierarchy-nav"
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less
index e56374a2c2..7f9b4e7d58 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.less
@@ -1,4 +1,5 @@
@import '../../../../assets/styles/variables';
+//@import url('https://fonts.googleapis.com/css?family=Open+Sans');
@ng2-shadow-gray: #f8f8f8;
@ng2-light-gray: #eaeaea;
@ng2-medium-gray: #d2d2d2;
@@ -15,6 +16,7 @@
.properties-assignment-page {
height: 100%;
+ font-family: 'Open Sans', omnes-regular, sans-serif;
.main-content {
display:flex;
@@ -28,20 +30,21 @@
margin: 0 0 1em 0;
/deep/ .tabs {
- width:25%;
+ width:33%;
text-align:center;
-
}
/deep/ .tab {
- padding: 10px .5em;
+ padding: 12px;
+ flex: 1;
+ font-weight:bold;
&.active {
color:#009fdb;
border-color: #d2d2d2;
border-top: solid 4px #009fdb;
background-color: white;
- padding-top:7px;
+ padding-top:9px;
}
}
@@ -49,39 +52,47 @@
position:absolute;
top:0;
right:0;
- min-width:200px;
}
.search-filter-container{
- position: relative;
- right: 164px;
- }
+ position: absolute;
+ right: 100px;
+ display:flex;
+ flex-direction:row;
+
+ .search-box {
+ border: 1px solid @ng2-medium-gray;
+ border-radius: 3px;
+ height: 32px;
+ margin: 0;
+ padding: 2px 20px 4px 10px;
+ outline: none;
+ font-style: italic;
+ color:@ng2-med-dark-gray;
+
+ &::-moz-placeholder { color:@ng2-med-dark-gray;}
+ &::-webkit-input-placeholder{ color:@ng2-med-dark-gray;}
+ }
+
+ .search-icon {
+ background-position: -48px -3137px;
+ width: 14px;
+ height: 14px;
+ position: absolute;
+ right:42px;
+ top: 8px;
+ }
+
+ &.without-filter {
+ margin-right:10px;
+ .search-icon {
+ right: 4px;
+ }
+ }
- .search-box {
- border: 1px solid @ng2-medium-gray;
- border-radius: 4px;
- height: 32px;
- margin: 0;
- padding: 2px 20px 4px 10px;
- outline: none;
- font-style: italic;
- color:@ng2-med-dark-gray;
- margin-right:10px;
-
- &::-moz-placeholder { color:@ng2-med-dark-gray;}
- &::-webkit-input-placeholder{ color:@ng2-med-dark-gray;}
- }
- .search-icon {
- background-position: -48px -3137px;
- width: 14px;
- height: 14px;
- position: relative;
- right: 34px;
- top: 4px;
}
.advance-search{
- position: relative;
- right: 22px;
+
}
.clear-filter{
cursor: pointer;
@@ -104,18 +115,19 @@
display:flex;
flex:0 0 350px;
flex-direction:column;
- margin: 3em 0 1em 1em;
- padding: 10px;
- overflow:auto;
+ margin: 45px 0 1em 1em;
+ overflow-x:auto;
/deep/ .tabs {
- width: 33%;
+ border-bottom: solid 1px #d0d0d0;
}
/deep/ .tab {
- padding: 0.5em 1em 0 1em;
- white-space: nowrap;
- font-size: 13px;
+ flex: none;
+ padding: 8px 20px 0;
+ font-size: 14px;
+ font-weight:bold;
+ line-height:30px;
}
}
@@ -127,6 +139,28 @@
border: 1px solid #ddd;
}
+ /deep/ .white-sub-header {
+ background-color: #fffefe;
+ box-shadow: 0px 1px 0.99px 0.01px rgba(34, 31, 31, 0.15);
+ border-bottom: #d2d2d2 solid 1px;
+ color:#009fdb;
+ font-weight:bold;
+ font-size:14px;
+ text-align:left;
+ flex:0 0 auto;
+ padding: 10px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+
+ &.hierarchy-header {
+ padding-left:20px;
+ &.selected {
+ background-color: #e6f6fb;
+ }
+ }
+
+ }
.hierarchy-nav-container {
flex:1;
@@ -136,15 +170,7 @@
}
.hierarchy-header {
- height:30px;
- line-height: 2.5em;
- display: flex;
- width: 100%;
- padding-left: 14px;
- font-weight: bold;
- text-align: left;
- background-color: @ng2-light-gray;
- font-size: 13px;
+
span{
text-overflow: ellipsis;
overflow: hidden;
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
index 98fdc7391a..22d6f2fe51 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
@@ -242,10 +242,8 @@ export class PropertiesAssignmentComponent {
this.propertiesNavigationData = simpleFlatProperty;
}
- // Updatet the header in the navigation tree with property name.
- if(property instanceof DerivedFEProperty) {
- this.propertyStructureHeader = (property.propertiesName.split('#'))[0];
- }
+ // Update the header in the navigation tree with property name.
+ this.propertyStructureHeader = (property.propertiesName.split('#'))[0];
// Set selected property in table
this.selectedFlatProperty = this.hierarchyNavService.createSimpleFlatProperty(property, instanceName);
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties.utils.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties.utils.ts
index dfde2a40b2..0eb8534595 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties.utils.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties.utils.ts
@@ -43,6 +43,7 @@ export class PropertiesUtils {
this.initValueObjectRef(newFEProp); //initialize valueObj.
propertyFeArray.push(newFEProp);
newFEProp.updateExpandedChildPropertyId(newFEProp.name); //display only the first level of children
+ this.dataTypeService.checkForCustomBehavior(newFEProp);
}
});
instanceFePropertiesMap[instanceName] = propertyFeArray;