diff options
Diffstat (limited to 'catalog-ui/src/app/ng2')
12 files changed, 73 insertions, 19 deletions
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 eeba590046..d3db53aa43 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 @@ -29,6 +29,9 @@ <span *ngIf="sortBy === 'type'" class="table-header-sort-arrow" [ngClass]="{'down': reverse, 'up':!reverse}"> </span> </div> + <div class="table-cell col4" (click)="sort('required')" *ngIf="componentType == 'SERVICE'"> + <span tooltip="Required in Runtime" tooltipDelay="400">Req. in RT</span> + </div> <div class="table-cell valueCol">Value</div> </div> <div class="table-body"> @@ -37,7 +40,9 @@ <div class="table-row" *ngFor="let input of inputs" (click)="selectedInputId = input.path" [ngClass]="{'selected': selectedInputId && selectedInputId === input.path}"> <!-- Property Name --> <div class="table-cell col1"> - <div class="inner-cell-div" tooltip="{{input.name}}"><span class="property-name">{{input.name}}</span></div> + <div class="inner-cell-div"> + <span class="property-name" tooltip="{{input.name}}">{{input.name}}</span> + </div> <span *ngIf="input.description" class="property-description-icon sprite-new show-desc" tooltip="{{input.description}}" tooltipDelay="0"></span> @@ -54,6 +59,12 @@ <span>{{input.type | contentAfterLastDot}}</span> </div> </div> + <!-- Required in runtime --> + <div class="table-cell col4" *ngIf="componentType == 'SERVICE'"> + <sdc-checkbox [(checked)]="input.required" + (checkedChange)="onRequiredChanged(input, $event)" + [disabled]="readonly"></sdc-checkbox> + </div> <!-- Value --> <div class="table-cell valueCol input-value-col" [class.inner-table-container]="input.childrenProperties || !input.isSimpleType"> <dynamic-element class="value-input" 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 72e19f3f51..77c002c899 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 @@ -101,9 +101,11 @@ &:last-child { border-right:#d2d2d2 solid 1px; } + + // Column: Property Name &.col1 { flex: 1 0 130px; - max-width:130px; + max-width: 250px; justify-content: space-between; @@ -118,16 +120,27 @@ flex: 0 0 auto; } } + + // Column: Type &.col2 { flex: 0 0 140px; - max-width:140px; + max-width: 140px; } + // Column: From Instance &.col3 { - flex:0 0 120px; - max-width:120px; + flex: 0 0 120px; + max-width: 120px; + } + + // Column: Required in Runtime + &.col4 { + flex: 0 0 80px; + max-width: 80px; + text-align: center; } + // Column: Value &.valueCol { .value-input { flex: 1; 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 f45d5a85c7..682a3e2463 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 @@ -40,6 +40,7 @@ export class InputsTableComponent { @Input() instanceNamesMap: Map<string, InstanceFeDetails>; @Input() readonly: boolean; @Input() isLoading: boolean; + @Input() componentType: string; @Output() inputChanged: EventEmitter<any> = new EventEmitter<any>(); @Output() deleteInput: EventEmitter<any> = new EventEmitter<any>(); @@ -47,7 +48,7 @@ export class InputsTableComponent { sortBy: String; reverse: boolean; - selectedInputToDelete: InputFEModel; + selectedInputToDelete: InputFEModel; sort = (sortBy) => { this.reverse = (this.sortBy === sortBy) ? !this.reverse : true; @@ -88,6 +89,10 @@ export class InputsTableComponent { this.inputChanged.emit(input); }; + onRequiredChanged = (input: InputFEModel, event) => { + this.inputChanged.emit(input); + } + onDeleteInput = () => { this.deleteInput.emit(this.selectedInputToDelete); this.modalService.closeCurrentModal(); 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 89b85d3578..af7a61204c 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 @@ -27,7 +27,7 @@ <span *ngIf="sortBy === 'type'" class="table-header-sort-arrow" [ngClass]="{'down': reverse, 'up':!reverse}"> </span> </div> - <div class="table-cell col3" (click)="sort('schema.property.type')" *ngIf="!hidePropertyType">ES + <div class="table-cell col3" (click)="sort('schema.property.type')" *ngIf="!hidePropertyType">EntrySchema <span *ngIf="sortBy === 'schema.property.type'" class="table-header-sort-arrow" [ngClass]="{'down': reverse, 'up':!reverse}"> </span> </div> 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 86832e57f0..8c2c6ce940 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 @@ -129,8 +129,10 @@ &:last-child { border-right:#d2d2d2 solid 1px; } + + // Column: Property Name &.col1 { - flex: 1 0 210px; + flex: 1 0 190px; max-width:300px; display: flex; @media @smaller-screen { flex: 0 0 25%;} @@ -149,20 +151,24 @@ flex: 0 0 auto; } } + + // Column: Type &.col2 { flex: 0 0 150px; max-width:150px; @media @smaller-screen { flex: 0 0 20%;} } + // Column: ES &.col3 { flex:0 0 120px; max-width:120px; @media @smaller-screen { flex: 0 0 15%;} } + // Column: Value &.valueCol { - flex: 2 0 300px; + flex: 2 0 250px; display: flex; @media @smaller-screen { flex: 1 0 40%;} } diff --git a/catalog-ui/src/app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component.ts b/catalog-ui/src/app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component.ts index b8fdeaf659..c752f9a042 100644 --- a/catalog-ui/src/app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component.ts +++ b/catalog-ui/src/app/ng2/components/ui/forms/unsaved-changes/unsaved-changes.component.ts @@ -12,6 +12,4 @@ export class UnsavedChangesComponent { constructor(){ } - - }
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.html index c0bcc7885e..187ffa6efe 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.html +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.html @@ -56,6 +56,15 @@ [ngModelOptions]="{ debounce: 200 }"> </div> + <!-- Required in Runtime --> + <div class="i-sdc-form-item"> + <sdc-checkbox + [(checked)]="propertyModel.required" + label="Required in Runtime" + data-tests-id="property-required"> + </sdc-checkbox> + </div> + <!-- Properties --> <div class="i-sdc-form-item"> <label class="i-sdc-form-label">Properties</label> diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.ts index fe3106649b..8ca4f44116 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.component.ts @@ -57,6 +57,7 @@ export class DeclareListComponent { this.propertyModel = new PropertyBEModel(); this.propertyModel.type = ''; this.propertyModel.schema.property.type = ''; + this.propertyModel.required = false; const types: string[] = PROPERTY_DATA.TYPES; // All types - simple type + map + list this.dataTypes = this.dataTypeService.getAllDataTypes(); // Get all data types in service const nonPrimitiveTypes: string[] = _.filter(Object.keys(this.dataTypes), (type: string) => { diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.module.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.module.ts index 97667f9261..82e9b6ff8b 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.module.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/declare-list/declare-list.module.ts @@ -25,6 +25,7 @@ import { FormElementsModule } from 'app/ng2/components/ui/form-components/form-e import { UiElementsModule } from 'app/ng2/components/ui/ui-elements.module'; import { TranslateModule } from '../../../shared/translator/translate.module'; import { DeclareListComponent } from './declare-list.component'; +import { SdcUiComponentsModule } from 'onap-ui-angular'; @NgModule({ declarations: [ @@ -35,7 +36,8 @@ import { DeclareListComponent } from './declare-list.component'; FormsModule, FormElementsModule, UiElementsModule, - TranslateModule + TranslateModule, + SdcUiComponentsModule ], exports: [], entryComponents: [ diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts index f5500d42ae..3def63e0d2 100644 --- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts +++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.module.ts @@ -34,6 +34,8 @@ import {HierarchyNavService} from "./services/hierarchy-nav.service"; import {PropertiesUtils} from "./services/properties.utils"; import {InputsUtils} from "./services/inputs.utils"; import {ComponentModeService} from "../../services/component-services/component-mode.service"; +import {SdcUiComponentsModule} from "onap-ui-angular"; +import {ModalFormsModule} from "app/ng2/components/ui/forms/modal-forms.module"; @NgModule({ declarations: [ @@ -48,7 +50,9 @@ import {ComponentModeService} from "../../services/component-services/component- GlobalPipesModule, PropertyTableModule, PoliciesTableModule, - UiElementsModule], + UiElementsModule, + SdcUiComponentsModule, + ModalFormsModule], entryComponents: [PropertiesAssignmentComponent], exports: [ 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 8d4215aaec..6856ae8358 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 @@ -47,6 +47,7 @@ [inputs]="inputs | searchFilter:'name':searchQuery" [instanceNamesMap]="componentInstanceNamesMap" [isLoading]="loadingInputs" + [componentType]="component.componentType" (deleteInput)="deleteInput($event)" (inputChanged)="dataChanged($event)"> </inputs-table> 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 4b84f0e66f..725847bc6d 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 @@ -348,7 +348,7 @@ export class PropertiesAssignmentComponent { if (this.isPropertiesTabSelected && item instanceof PropertyFEModel) { itemHasChanged = item.hasValueObjChanged(); } else if (this.isInputsTabSelected && item instanceof InputFEModel) { - itemHasChanged = item.hasDefaultValueChanged(); + itemHasChanged = item.hasChanged(); } else if (this.isPoliciesTabSelected && item instanceof InputFEModel) { itemHasChanged = item.hasDefaultValueChanged(); } @@ -574,16 +574,17 @@ export class PropertiesAssignmentComponent { let typelist: any = PROPERTY_TYPES.LIST; let uniID: any = insId; let boolfalse: any = false; + let required: any = content.propertyModel.required; let schem :any = { "empty": boolfalse, "property": { "type": content.propertyModel.simpleType, - "required": boolfalse + "required": required } } let schemaProp :any = { "type": content.propertyModel.simpleType, - "required": boolfalse + "required": required } reglistInput.description = content.propertyModel.description; @@ -592,7 +593,7 @@ export class PropertiesAssignmentComponent { reglistInput.schemaType = content.propertyModel.simpleType; reglistInput.instanceUniqueId = uniID; reglistInput.uniqueId = uniID; - reglistInput.required =boolfalse; + reglistInput.required = required; reglistInput.schema = schem; reglistInput.schemaProperty = schemaProp; @@ -789,6 +790,8 @@ export class PropertiesAssignmentComponent { response.forEach((resInput) => { const changedInput = <InputFEModel>this.changedData.shift(); this.inputsUtils.resetInputDefaultValue(changedInput, resInput.defaultValue); + changedInput.required = resInput.required; + changedInput.requiredOrig = resInput.required; }); console.log("updated the component inputs and got this response: ", response); } @@ -842,6 +845,7 @@ export class PropertiesAssignmentComponent { handleReverseItem = (changedItem) => { changedItem = <InputFEModel>changedItem; this.inputsUtils.resetInputDefaultValue(changedItem, changedItem.defaultValue); + changedItem.required = changedItem.requiredOrig; }; } @@ -906,8 +910,8 @@ export class PropertiesAssignmentComponent { {id: 'cancelButton', text: 'Cancel', type: SdcUiCommon.ButtonType.secondary, size: 'xsm', closeModal: true, callback: () => reject()}, {id: 'discardButton', text: 'Discard', type: SdcUiCommon.ButtonType.secondary, size: 'xsm', closeModal: true, callback: () => { this.reverseChangedData(); resolve()}}, {id: 'saveButton', text: 'Save', type: SdcUiCommon.ButtonType.primary, size: 'xsm', closeModal: true, disabled: !this.isValidChangedData, callback: () => this.doSaveChangedData(resolve, reject)} - ] as SdcUiCommon.IModalButtonComponent[] - } as SdcUiCommon.IModalConfig, UnsavedChangesComponent, {isValidChangedData: this.isValidChangedData}); + ] as SdcUiCommon.IModalButtonComponent[] + } as SdcUiCommon.IModalConfig, UnsavedChangesComponent, {isValidChangedData: this.isValidChangedData}); }); } |