aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/components/logic
diff options
context:
space:
mode:
authorMichael Lando <ml636r@att.com>2018-07-29 16:13:45 +0300
committerMichael Lando <ml636r@att.com>2018-07-29 16:20:34 +0300
commit5b593496b8f1b8e8be8d7d2dbcc223332e65a49b (patch)
tree2f9dfc45191e723da69cf74be7829784e9741b94 /catalog-ui/src/app/ng2/components/logic
parent9200382f2ce7b4bb729aa287d0878004b2d2b4f9 (diff)
re base code
Change-Id: I12a5ca14a6d8a87e9316b9ff362eb131105f98a5 Issue-ID: SDC-1566 Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'catalog-ui/src/app/ng2/components/logic')
-rw-r--r--catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-display-options.ts8
-rw-r--r--catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.html7
-rw-r--r--catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.less38
-rw-r--r--catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.html7
-rw-r--r--catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.less15
-rw-r--r--catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.ts3
-rw-r--r--catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html11
-rw-r--r--catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts8
-rw-r--r--catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html14
-rw-r--r--catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.less65
-rw-r--r--catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts3
-rw-r--r--catalog-ui/src/app/ng2/components/logic/properties-table/property-table.module.ts4
-rw-r--r--catalog-ui/src/app/ng2/components/logic/select-requirement-or-capability/select-requirement-or-capability.component.html2
-rw-r--r--catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.html2
-rw-r--r--catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.ts1
-rw-r--r--catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.html15
-rw-r--r--catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.ts11
17 files changed, 164 insertions, 50 deletions
diff --git a/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-display-options.ts b/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-display-options.ts
index c8d4566653..36257ca94e 100644
--- a/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-display-options.ts
+++ b/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-display-options.ts
@@ -23,10 +23,16 @@ export class HierarchyDisplayOptions {
valueProperty: string;
childrenProperty: string;
searchText:string;
- constructor(idProperty:string, valueProperty:string, childrenProperty?:string, searchText?:string) {
+ archived:boolean;
+
+ iconProperty: string;
+ constructor(idProperty:string, valueProperty:string, childrenProperty?:string, searchText?:string, iconProperty?:string, archived?:boolean) {
+
this.idProperty = idProperty;
this.valueProperty = valueProperty;
this.childrenProperty = childrenProperty;
this.searchText = searchText;
+ this.archived = archived;
+ this.iconProperty = iconProperty;
}
}
diff --git a/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.html b/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.html
index c3f9e5ac74..aa60337f84 100644
--- a/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.html
@@ -1,7 +1,12 @@
<div class="navigation-wrapper">
<div class="node-item" *ngFor="let item of displayData" (click)="onClick($event, item)">
<div class="node-data-wrapper" [ngClass]="{'selected': selectedItem && selectedItem === item[displayOptions.idProperty]}">
- <span class="node-data" [ngClass]="{'mark':item[displayOptions.valueProperty] === displayOptions.searchText}" [attr.data-tests-id]="item[displayOptions.valueProperty]">{{item[displayOptions.valueProperty]}}</span>
+ <span class="node-data" [ngClass]="{'mark':item[displayOptions.valueProperty] === displayOptions.searchText}" [attr.data-tests-id]="item[displayOptions.valueProperty]">
+
+ <span *ngIf="displayOptions.iconProperty" [ngClass]="['node-data-icon', item[displayOptions.iconProperty], 'small']"></span>
+ {{item[displayOptions.valueProperty]}}
+ <span class="sprite-new archive-label" *ngIf="item.originArchived"></span>
+ </span>
</div>
<div class="children-node" *ngIf="item[displayOptions.childrenProperty]">
<hierarchy-navigation class="children-hierarchy" [displayData]="item[displayOptions.childrenProperty]"
diff --git a/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.less b/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.less
index 4befa2c797..33ffb49537 100644
--- a/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.less
+++ b/catalog-ui/src/app/ng2/components/logic/hierarchy-navigtion/hierarchy-navigation.component.less
@@ -1,3 +1,5 @@
+@import './../../../../../assets/styles/mixins.less';
+
.navigation-wrapper {
text-align: left;
}
@@ -30,6 +32,25 @@
.node-data {
margin-left: 10px;
margin-right: 10px;
+ align-items: center;
+ display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ max-width: 300px;
+ .archive-label{
+ margin-left: 5px;
+ }
+}
+
+.node-data-icon {
+ vertical-align: middle;
+ margin-right: 7px;
+
+ &.defaulticon.small {
+ background-color: #999;
+ border-radius: 14px;
+ }
}
.node-data-wrapper.selected {
@@ -50,3 +71,20 @@
+.icon-group {
+ .square-icon();
+ background-color: @main_color_a;
+
+ &::before {
+ content: "G";
+ }
+}
+.icon-policy {
+ .square-icon();
+ background-color: @main_color_r;
+
+ &::before {
+ content: "P";
+ }
+}
+
diff --git a/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.html b/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.html
index b7cde7eb23..daffc9efea 100644
--- a/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.html
@@ -17,8 +17,8 @@
tooltip="{{input.description}}" tooltipDelay="0"></span>
</div>
<div class="table-cell col3">
- <div class="inner-cell-div" tooltip="{{instanceNamesMap[input.instanceUniqueId]}}">
- <span>{{instanceNamesMap[input.instanceUniqueId]}}</span>
+ <div class="inner-cell-div" tooltip="{{instanceNamesMap[input.instanceUniqueId]?.name}}">
+ <span>{{instanceNamesMap[input.instanceUniqueId]?.name}}</span>
</div>
</div>
<div class="table-cell col2">
@@ -34,7 +34,8 @@
[type]="input.type"
[name]="input.name"
(elementChanged)="onInputChanged(input, $event)"
- [readonly]="readonly">
+ [readonly]="readonly"
+ [testId]="'input-' + input.name">
</dynamic-element>
<div class="delete-button-container">
<span *ngIf="input.instanceUniqueId && !readonly" class="sprite-new delete-btn" (click)="openDeleteModal(input)" data-tests-id="delete-input-button"></span>
diff --git a/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.less b/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.less
index d709f3f0c5..5fbb62f7fb 100644
--- a/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.less
+++ b/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.less
@@ -85,8 +85,8 @@
border-right:#d2d2d2 solid 1px;
}
&.col1 {
- flex: 1 0 210px;
- max-width:210px;
+ flex: 1 0 120px;
+ max-width:120px;
display: flex;
justify-content: space-between;
@@ -112,14 +112,7 @@
}
&.valueCol {
- flex: 1 0 auto;
- min-width: 350px;
- display: flex;
- justify-content: flex-end;
- padding: 0px;
- align-items: center;
-
- .value-input {
+ .value-input {
flex: 1;
border: none;
background-color: inherit;
@@ -142,7 +135,7 @@
padding: 0px;
.delete-button-container {
- padding: 3px 5px 0 0 ;
+ padding: 0 8px 0 0 ;
}
}
}
diff --git a/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.ts b/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.ts
index ebecbc9390..0c7fc2a24c 100644
--- a/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/inputs-table/inputs-table.component.ts
@@ -24,6 +24,7 @@
import {Component, Input, Output, EventEmitter} from "@angular/core";
import {InputFEModel} from "app/models";
import {ModalService} from "../../../services/modal.service";
+import { InstanceFeDetails } from "app/models/instance-fe-details";
@Component({
selector: 'inputs-table',
@@ -33,7 +34,7 @@ import {ModalService} from "../../../services/modal.service";
export class InputsTableComponent {
@Input() inputs: Array<InputFEModel>;
- @Input() instanceNamesMap: Map<string, string>;
+ @Input() instanceNamesMap: Map<string, InstanceFeDetails>;
@Input() readonly:boolean;
@Input() isLoading:boolean;
@Output() inputChanged: EventEmitter<any> = new EventEmitter<any>();
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html
index 4805875d83..b5ae7a8f66 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.html
@@ -19,6 +19,7 @@
[name]="property.name"
(elementChanged)="mapKeyChanged.emit($event.value)"
[readonly]="readonly"
+ [testId]="'prop-key-' + propertyTestsId"
></dynamic-element>
</div>
</ng-container>
@@ -27,12 +28,13 @@
<div class="table-cell">
<dynamic-element class="value-input"
pattern="validationUtils.getValidationPattern(property.type)"
- [value]="property.valueObj"
+ [value]="property.isDeclared ? property.value : property.valueObj"
[type]="property.isDeclared ? 'string' : property.type"
[name]="property.name"
[path]="property.propertiesName"
(elementChanged)="onElementChanged($event)"
[readonly]="readonly || property.isDeclared || property.isDisabled"
+ [testId]="'prop-' + propertyTestsId"
></dynamic-element>
</div>
</ng-container>
@@ -45,9 +47,9 @@
</ng-container>
<!-- ICONS: add, delete, and expand -->
<ng-container *ngIf="!property.isDeclared">
- <a *ngIf="(propType == derivedPropertyTypes.LIST || propType == derivedPropertyTypes.MAP) && !property.isChildOfListOrMap" class="property-icon add-item" (click)="createNewChildProperty();" [ngClass]="{'disabled':readonly || preventInsertItem(property)}">Add value to list</a>
- <span *ngIf="property.isChildOfListOrMap" (click)="deleteItem.emit(property);" class="property-icon sprite-new delete-item-icon" [ngClass]="{'disabled':readonly}"></span>
- <span *ngIf="!isPropertyFEModel && (propType == derivedPropertyTypes.COMPLEX || ((propType == derivedPropertyTypes.LIST || propType == derivedPropertyTypes.MAP) && hasChildren))" (click)="expandChildById(propPath)" class="property-icon sprite-new round-expand-icon" [class.open]="expandedChildId.indexOf(propPath) == 0"></span>
+ <a *ngIf="(propType == derivedPropertyTypes.LIST || propType == derivedPropertyTypes.MAP) && !property.isChildOfListOrMap" class="property-icon add-item" (click)="createNewChildProperty();" [ngClass]="{'disabled':readonly || preventInsertItem(property)}" [attr.data-tests-id]="'add-to-list-' + propertyTestsId">Add value to list</a>
+ <span *ngIf="property.isChildOfListOrMap" (click)="deleteItem.emit(property);" class="property-icon sprite-new delete-item-icon" [ngClass]="{'disabled':readonly}" [attr.data-tests-id]="'delete-from-list-' + propertyTestsId"></span>
+ <span *ngIf="!isPropertyFEModel && (propType == derivedPropertyTypes.COMPLEX || ((propType == derivedPropertyTypes.LIST || propType == derivedPropertyTypes.MAP) && hasChildren))" (click)="expandChildById(propPath)" class="property-icon sprite-new round-expand-icon" [class.open]="expandedChildId.indexOf(propPath) == 0" [attr.data-tests-id]="'expand-' + propertyTestsId"></span>
</ng-container>
</div>
@@ -59,6 +61,7 @@
[hasDeclareOption]="hasDeclareOption"
[canBeDeclared]="hasDeclareOption && prop.canBeDeclared"
[property]="prop"
+ [rootProperty]="rootProperty || property"
[expandedChildId]="expandedChildId"
[propertyNameSearchText]="propertyNameSearchText"
[readonly]="readonly"
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts
index 6f7e57b643..6e19c95003 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/dynamic-property/dynamic-property.component.ts
@@ -41,6 +41,7 @@ export class DynamicPropertyComponent {
propPath: string;
isPropertyFEModel: boolean;
nestedLevel: number;
+ propertyTestsId: string;
@Input() canBeDeclared: boolean;
@Input() property: PropertyFEModel | DerivedFEProperty;
@@ -50,6 +51,7 @@ export class DynamicPropertyComponent {
@Input() readonly: boolean;
@Input() hasChildren: boolean;
@Input() hasDeclareOption:boolean;
+ @Input() rootProperty: PropertyFEModel;
@Output('propertyChanged') emitter: EventEmitter<void> = new EventEmitter<void>();
@Output() expandChild: EventEmitter<string> = new EventEmitter<string>();
@@ -69,6 +71,8 @@ export class DynamicPropertyComponent {
this.propType = this.property.derivedDataType;
this.propPath = (this.property instanceof PropertyFEModel) ? this.property.name : this.property.propertiesName;
this.nestedLevel = (this.property.propertiesName.match(/#/g) || []).length;
+ this.rootProperty = (this.rootProperty) ? this.rootProperty : <PropertyFEModel>this.property;
+ this.propertyTestsId = this.getPropertyTestsId();
}
ngDoCheck() {
@@ -105,6 +109,10 @@ export class DynamicPropertyComponent {
}).length > 1;
}
+ getPropertyTestsId = () => {
+ return [this.rootProperty.name].concat(this.rootProperty.getParentNamesArray(this.property.propertiesName, [], true)).join('.');
+ };
+
onElementChanged = (event: IUiElementChangeEvent) => {
this.property.updateValueObj(event.value, event.isValid);
this.emitter.emit();
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html
index ecfa7e7c5e..b574b552ae 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.html
@@ -9,8 +9,14 @@
<div class="table-body" [ngClass]="{'view-mode': readonly}">
<div class="no-data" *ngIf="!fePropertiesMap || !(fePropertiesMap | keys).length">No data to display</div>
- <ng-container *ngFor="let instanceId of fePropertiesMap | keys; trackBy:instanceId">
- <div class="table-rows-header white-sub-header" *ngIf="feInstanceNamesMap">{{feInstanceNamesMap[instanceId]}}</div>
+ <ng-container *ngFor="let instanceId of fePropertiesMap | keys; trackBy:vspId">
+ <div class="table-rows-header white-sub-header" *ngIf="feInstanceNamesMap">
+
+
+ <span [ngClass]="['prop-instance-icon', feInstanceNamesMap[instanceId].iconClass, 'small']"></span>
+ {{feInstanceNamesMap[instanceId].name}}
+ <div class="sprite-new archive-label" *ngIf="feInstanceNamesMap[instanceId].originArchived == true" ></div>
+ </div>
<div class="table-row"
*ngFor="let property of fePropertiesMap[instanceId] | searchFilter:'name':searchTerm; trackBy:property?.name"
@@ -22,8 +28,8 @@
<checkbox *ngIf="hasDeclareOption" [(checked)]="property.isSelected"
[disabled]="property.isDisabled || property.isDeclared || readonly"
(checkedChange)="propertyChecked(property)" [attr.data-tests-id]="property.name"></checkbox>
- <div class="inner-cell-div" tooltip="{{property.name}}">
- <span>{{property.name}}</span>
+ <div class="inner-cell-div-multiline" tooltip="{{property.name}}">
+ <multiline-ellipsis className="table-cell-multiline-ellipsis" [lines]="2">{{property.name}}</multiline-ellipsis>
</div>
</div>
<span *ngIf="property.description" class="property-description-icon sprite-new show-desc" tooltip="{{property.description}}" tooltipDelay="0"></span>
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.less b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.less
index 20da0b6ec2..72f67e434e 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.less
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.less
@@ -1,4 +1,4 @@
-@import './../../../../../assets/styles/variables.less';
+@import './../../../../../assets/styles/mixins.less';
@import '../../../../../assets/styles/sprite';
@smaller-screen: ~"only screen and (max-width: 1580px)";
@@ -12,13 +12,16 @@
text-align:left;
- .inner-cell-div{
- max-width: 100%;
+ .inner-cell-div {
text-overflow: ellipsis;
overflow: hidden;
height: 20px;
}
+ .inner-cell-div-multiline {
+ max-width: 100%;
+ }
+
.table-header {
display: flex;
flex-direction:row;
@@ -36,6 +39,11 @@
.table-rows-header {
border: #d2d2d2 solid 1px;
border-top:none;
+ display: flex;
+ align-items: center;
+ .archive-label{
+ margin-left: 10px;
+ }
}
.table-body {
@@ -120,7 +128,7 @@
.property-description-icon {
float: right;
margin-top: 4px;
- margin-left: 5px;
+ margin-left: 15px;
flex: 0 0 auto;
}
}
@@ -177,4 +185,53 @@
}
}
+ .table-row {
+ /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+ background: linear-gradient(to right, transparent 0%, #ffffff 80%);
+ padding-left: 1em;
+ }
+
+ &.selected /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+ background: linear-gradient(to right, transparent 0%, #e6f6fb 80%);
+ padding-left: 1em;
+ }
+
+ &.readonly /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+ background: linear-gradient(to right, transparent 0%, #f8f8f8 80%);
+ padding-left: 1em;
+ }
+
+ &:hover:not(.selected) /deep/ .table-cell-multiline-ellipsis .multiline-ellipsis-dots {
+ background: linear-gradient(to right, transparent 0%, #f8f8f8 80%);
+ padding-left: 1em;
+ }
+ }
+
+ .prop-instance-icon {
+ vertical-align: middle;
+ margin-right: 7px;
+ &.defaulticon.small {
+ background-color: @main_color_q;
+ border-radius:14px;
+ }
+ // square icons
+
+ &.icon-group {
+ .square-icon();
+ background-color: @main_color_a;
+
+ &::before {
+ content: "G";
+ }
+ }
+ &.icon-policy {
+ .square-icon();
+ background-color: @main_color_r;
+
+ &::before {
+ content: "P";
+ }
+ }
+
+ }
}
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts
index 093fae1684..da1fb82ba0 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/properties-table.component.ts
@@ -21,6 +21,7 @@
import { Component, Input, Output, EventEmitter} from "@angular/core";
import {PropertyFEModel, DerivedFEProperty, InstanceFePropertiesMap} from "app/models";
import {PropertiesService} from "../../../services/properties.service";
+import { InstanceFeDetails } from "../../../../models/instance-fe-details";
@Component({
selector: 'properties-table',
@@ -30,7 +31,7 @@ import {PropertiesService} from "../../../services/properties.service";
export class PropertiesTableComponent {
@Input() fePropertiesMap: InstanceFePropertiesMap;
- @Input() feInstanceNamesMap: Map<string, string>;
+ @Input() feInstanceNamesMap: Map<string, InstanceFeDetails>;
@Input() selectedPropertyId: string;
@Input() propertyNameSearchText:string;
@Input() searchTerm:string;
diff --git a/catalog-ui/src/app/ng2/components/logic/properties-table/property-table.module.ts b/catalog-ui/src/app/ng2/components/logic/properties-table/property-table.module.ts
index 91f33485a9..91baaf1bc1 100644
--- a/catalog-ui/src/app/ng2/components/logic/properties-table/property-table.module.ts
+++ b/catalog-ui/src/app/ng2/components/logic/properties-table/property-table.module.ts
@@ -8,6 +8,7 @@ import {HttpModule} from "@angular/http";
import {FilterChildPropertiesPipe} from "./pipes/filterChildProperties.pipe";
import {GlobalPipesModule} from "../../../pipes/global-pipes.module";
import {PropertiesService} from "../../../services/properties.service";
+import {MultilineEllipsisModule} from "../../../shared/multiline-ellipsis/multiline-ellipsis.module";
@NgModule({
imports: [
@@ -15,7 +16,8 @@ import {PropertiesService} from "../../../services/properties.service";
HttpModule,
CommonModule,
GlobalPipesModule,
- UiElementsModule
+ UiElementsModule,
+ MultilineEllipsisModule
],
declarations: [
FilterChildPropertiesPipe,
diff --git a/catalog-ui/src/app/ng2/components/logic/select-requirement-or-capability/select-requirement-or-capability.component.html b/catalog-ui/src/app/ng2/components/logic/select-requirement-or-capability/select-requirement-or-capability.component.html
index 6e0f93f750..9d570f036a 100644
--- a/catalog-ui/src/app/ng2/components/logic/select-requirement-or-capability/select-requirement-or-capability.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/select-requirement-or-capability/select-requirement-or-capability.component.html
@@ -9,7 +9,7 @@
</radio-buttons>
<label class="select-type-label">Select type:</label>
<div class="select-type">
- <ui-element-dropdown [values]="types" [(value)]="selectedType" (valueChange)="onTypeSelected($event)"></ui-element-dropdown>
+ <ui-element-dropdown [values]="types" [(value)]="selectedType" (valueChange)="onTypeSelected($event)" testId="select"></ui-element-dropdown>
</div>
<div class="table-and-list-container">
diff --git a/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.html b/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.html
index 72e083534c..af7a470495 100644
--- a/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.html
@@ -1,5 +1,5 @@
<div class="service-path-selector">
- <label>Service Paths:</label>
+ <label>Service Flows:</label>
<ui-element-dropdown
class="path-dropdown"
data-tests-id="service-path-selector"
diff --git a/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.ts b/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.ts
index be9966acef..e09001fc6c 100644
--- a/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/service-path-selector/service-path-selector.component.ts
@@ -1,4 +1,3 @@
-import * as _ from "lodash";
import {Component, Input, KeyValueDiffer, IterableDiffers, KeyValueDiffers, DoCheck} from '@angular/core';
import {Service} from "app/models/components/service";
import {TranslateService} from "app/ng2/shared/translator/translate.service";
diff --git a/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.html b/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.html
index ff7902e2b9..75f064230c 100644
--- a/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.html
@@ -1,22 +1,15 @@
<div class='service-path'>
<button class='zoom-icons create-path-button' data-tests-id="pathsMenuBtn" (click)="showServicePathMenu = !showServicePathMenu">...</button>
- <div class="service-path-menu"
- *ngIf="showServicePathMenu" >
+ <div class="service-path-menu" *ngIf="showServicePathMenu">
<div >
<ul>
- <li><div class="hand" (click)="onCreateServicePath()" data-tests-id="createPathMenuItem">
- Create Service Path
+ <li *ngIf='!isViewOnly'><div class="hand" (click)="onCreateServicePath()" data-tests-id="createPathMenuItem">
+ Create Service Flow
</div></li>
<li><div class="hand" (click)="onListServicePath()" data-tests-id="pathsListMenuItem">
- Service Paths List
+ Service Flows List
</div></li>
</ul>
</div>
</div>
- <!-- TODO - ask Orit about positioning issues and styling issues -->
- <!--
- <menu-list [open]="showServicePathMenu" [position]="menuPos" >
- <menu-item [action]="onCreateServicePath">Create Path</menu-item>
- <menu-item [action]="onListServicePath">Paths' List</menu-item>
- </menu-list> -->
</div> \ No newline at end of file
diff --git a/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.ts b/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.ts
index 4a6209fb6f..d66c5f0132 100644
--- a/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/service-path/service-path.component.ts
@@ -39,6 +39,7 @@ export class ServicePathComponent {
@Input() service: Service;
@Input() onCreate: Function;
@Input() onSave: Function;
+ @Input() isViewOnly:boolean;
constructor(private ModalServiceNg2: ModalService) {}
@@ -46,7 +47,7 @@ export class ServicePathComponent {
this.showServicePathMenu = false;
let cancelButton: ButtonModel = new ButtonModel('Cancel', 'outline white', this.ModalServiceNg2.closeCurrentModal);
let saveButton: ButtonModel = new ButtonModel('Create', 'blue', this.createPath, this.getDisabled );
- let modalModel: ModalModel = new ModalModel('l', 'Create Service Path', '', [saveButton, cancelButton], 'standard', true);
+ let modalModel: ModalModel = new ModalModel('l', 'Create Service Flow', '', [saveButton, cancelButton], 'standard', true);
this.modalInstance = this.ModalServiceNg2.createCustomModal(modalModel);
this.ModalServiceNg2.addDynamicContentToModal(this.modalInstance, ServicePathCreatorComponent, {service: this.service});
this.modalInstance.instance.open();
@@ -55,10 +56,10 @@ export class ServicePathComponent {
onListServicePath = ():void => {
this.showServicePathMenu = false;
let cancelButton: ButtonModel = new ButtonModel('Close', 'outline white', this.ModalServiceNg2.closeCurrentModal);
- let modalModel: ModalModel = new ModalModel('md', 'Service Paths List','', [cancelButton], 'standard', true);
+ let modalModel: ModalModel = new ModalModel('md', 'Service Flows List','', [cancelButton], 'standard', true);
this.modalInstance = this.ModalServiceNg2.createCustomModal(modalModel);
this.ModalServiceNg2.addDynamicContentToModal(this.modalInstance, ServicePathsListComponent, {service: this.service,
- onCreateServicePath: this.onCreateServicePath, onEditServicePath: this.onEditServicePath});
+ onCreateServicePath: this.onCreateServicePath, onEditServicePath: this.onEditServicePath, isViewOnly: this.isViewOnly});
this.modalInstance.instance.open();
};
@@ -70,14 +71,14 @@ export class ServicePathComponent {
onEditServicePath = (id:string):void => {
let cancelButton: ButtonModel = new ButtonModel('Cancel', 'outline white', this.ModalServiceNg2.closeCurrentModal);
let saveButton: ButtonModel = new ButtonModel('Save', 'blue', this.createPath, this.getDisabled );
- let modalModel: ModalModel = new ModalModel('l', 'Edit Path', '', [saveButton, cancelButton]);
+ let modalModel: ModalModel = new ModalModel('l', 'Edit Path', '', [saveButton, cancelButton], 'standard', true);
this.modalInstance = this.ModalServiceNg2.createCustomModal(modalModel);
this.ModalServiceNg2.addDynamicContentToModal(this.modalInstance, ServicePathCreatorComponent, {service: this.service, pathId: id});
this.modalInstance.instance.open();
};
getDisabled = ():boolean => {
- return !this.modalInstance.instance.dynamicContent.instance.checkFormValidForSubmit();
+ return this.isViewOnly || !this.modalInstance.instance.dynamicContent.instance.checkFormValidForSubmit();
};
}