diff options
3 files changed, 43 insertions, 16 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.html index 7f1c9f35a..ba4fba69a 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.html @@ -83,10 +83,11 @@ <div class="form-group" *ngFor="let output of outputs"> <label for="exampleFormControlTextarea1">{{output.name}} <i [hidden]="output.required" - class="icon-required-star optional-attribute" type="button" + class="icon-required-star" type="button" aria-hidden="true"></i> - <i [hidden]="output.required" class="optional-attribute" + <i [hidden]="!output.required" class="optional-attribute" type="button" aria-hidden="true"></i> + </label> </div> </div> @@ -162,8 +163,12 @@ <button type="button" class="list-group-item list-group-item-action" (click)="setInputType('Other')">Other </button> - </div> + <input [hidden]="!isInputOtherType" type="text" class="form-control mt-2 mb-2" + id="inputPassword4" + placeholder="Add Other type name" + [(ngModel)]="inputOtherType" (change)="setInputType(inputOtherType)"> + </div> </div> <div class="form-group row"> @@ -224,8 +229,10 @@ Other </button> </div> - <input type="text" class="form-control mt-2 mb-2" id="inputPassword3" - placeholder="Add Other type name"> + <input [hidden]="!isOutputOtherType" type="text" class="form-control mt-2 mb-2" + id="inputPassword3" + placeholder="Add Other type name" + [(ngModel)]="outputOtherType" (change)="setOutputType(outputOtherType)"> </div> </div> <div class="form-group row"> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.ts index f4f74a9fd..8e8b6ad3e 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/action-attributes.component.ts @@ -13,6 +13,10 @@ export class ActionAttributesComponent implements OnInit { actionAttributesSideBar: boolean; inputActionAttribute = new InputActionAttribute(); outputActionAttribute = new OutputActionAttribute(); + isInputOtherType: boolean; + isOutputOtherType: boolean; + outputOtherType = ''; + inputOtherType = ''; constructor() { @@ -21,20 +25,23 @@ export class ActionAttributesComponent implements OnInit { ngOnInit() { } - _toggleSidebar2() { - this.actionAttributesSideBar = !this.actionAttributesSideBar; - } - addInput(input: InputActionAttribute) { - this.inputs.push(input); + if (input && input.type && input.name) { + const insertedInputActionAttribute = Object.assign({}, input); + this.inputs.push(insertedInputActionAttribute); + } } addOutput(output: OutputActionAttribute) { - this.outputs.push(output); + if (output && output.type && output.name) { + const insertedOutputActionAttribute = Object.assign({}, output); + this.outputs.push(insertedOutputActionAttribute); + } } - setInputType(type) { + setInputType(type: string) { this.inputActionAttribute.type = type; + this.isInputOtherType = this.checkIfTypeIsOther(type); } setInputRequired(isRequired) { @@ -45,14 +52,27 @@ export class ActionAttributesComponent implements OnInit { this.outputActionAttribute.required = isRequired; } - setOutputType(type) { + setOutputType(type: string) { this.outputActionAttribute.type = type; + this.isOutputOtherType = this.checkIfTypeIsOther(type); + } + + checkIfTypeIsOther(type) { + return type.includes('Other'); } submitAttributes() { console.log(this.inputActionAttribute); console.log(this.outputActionAttribute); - this.inputs.push(this.inputActionAttribute); - this.outputs.push(this.outputActionAttribute); + this.addInput(this.inputActionAttribute); + this.addOutput(this.outputActionAttribute); + this.clearFormInputs(); + } + + private clearFormInputs() { + this.inputActionAttribute = new InputActionAttribute(); + this.outputActionAttribute = new OutputActionAttribute(); + this.outputOtherType = ''; + this.inputOtherType = ''; } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/models/InputActionAttribute.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/models/InputActionAttribute.ts index 3aa370360..b4cce3484 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/models/InputActionAttribute.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/action-attributes/models/InputActionAttribute.ts @@ -8,7 +8,7 @@ export class InputActionAttribute { this.name = ''; this.description = ''; this.type = ''; - this.required = false; + this.required = true; } } |