diff options
Diffstat (limited to 'cds-ui/designer-client')
3 files changed, 107 insertions, 54 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 5a5a05855..31d934565 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 @@ -197,6 +197,22 @@ </div> </div> <div class="form-group row"> + <label class="col-form-label col-sm-3 pt-0">Required <span>*</span></label> + <div class="col-sm-9"> + <div class="custom-control custom-radio custom-control-inline"> + <input type="radio" id="customRadioInline3" name="customRadioInline3" + class="custom-control-input" (click)="setOutputRequired(true)"> + <label class="custom-control-label" for="customRadioInline3">True</label> + </div> + <div class="custom-control custom-radio custom-control-inline"> + <input type="radio" id="customRadioInline4" name="customRadioInline3" + class="custom-control-input"> + <label class="custom-control-label" for="customRadioInline4" + (click)="setOutputRequired(false)">False</label> + </div> + </div> + </div> + <div class="form-group row"> <label class="col-form-label col-sm-3 pt-0">Type <span>*</span></label> <div class="col-sm-9"> <div class="list-group list-group-horizontal"> @@ -235,7 +251,7 @@ <div class="col"> <input type="email" class="form-control" id="inputEmail3" placeholder="Attributes"> <div class="container"> - <div *ngFor="let tempInput of tempInputs">{{tempInput}}</div> + <div *ngFor="let tempInput of steps">{{tempInput}}</div> </div> </div> </div> @@ -249,7 +265,7 @@ <a class="list-group-item list-group-item-action active" id="list-home-list" data-toggle="list" href="#list-home" role="tab" aria-controls="home"><i class="icon-resource_resolution mr-1" aria-hidden="true"></i> - {{step}} <i class="icon-next_arrow" aria-hidden="true" (click)="setInputAndOutputs( + {{step}} <i class="icon-next_arrow" aria-hidden="true" (click)="getAttributesAndOutputs( this.designerState.template.workflows[actionName]['steps'][step]['target'] )"></i></a> </div> @@ -263,20 +279,20 @@ <div class="tab-pane fade show active" id="list-home" role="tabpanel" aria-labelledby="list-home-list"> <div class="scrollWrapper"> - <div *ngIf="suggestedInputs.length>0" class="btn-group btn-group-toggle" - data-toggle="buttons"> + <div *ngIf="suggestedAttributes.length>0" class="btn-group btn-group-toggle" + data-toggle="buttons"> <label class="btn btn-secondary active" - *ngFor="let suggestedInput of suggestedInputs" - (click)="addTempInput(suggestedInput)"> - <input type="radio" name="options" [id]="suggestedInput" - autocomplete="off" (click)="addTempInput(suggestedInput)"> - {{suggestedInput}} + *ngFor="let suggestedAttribute of suggestedAttributes" + (click)="addTempOutputAttr(suggestedAttribute)"> + <input type="radio" name="options" [id]="suggestedAttribute" + autocomplete="off" (click)="addTempOutputAttr(suggestedAttribute)"> + {{suggestedAttribute}} </label> </div> - <div *ngIf="suggestedInputs.length == 0"> + <div *ngIf="suggestedAttributes.length == 0"> <p class="noAttributes">No Attributes Available</p> <!--Attribute Details <div class="nav-item dropdown helpMenu"> @@ -303,23 +319,6 @@ </div> </div> <!----> - - <div class="form-group row"> - <label class="col-form-label col-sm-3 pt-0">Required <span>*</span></label> - <div class="col-sm-9"> - <div class="custom-control custom-radio custom-control-inline"> - <input type="radio" id="customRadioInline3" name="customRadioInline3" - class="custom-control-input" (click)="setOutputRequired(true)"> - <label class="custom-control-label" for="customRadioInline3">True</label> - </div> - <div class="custom-control custom-radio custom-control-inline"> - <input type="radio" id="customRadioInline4" name="customRadioInline3" - class="custom-control-input"> - <label class="custom-control-label" for="customRadioInline4" - (click)="setOutputRequired(false)">False</label> - </div> - </div> - </div> </div> </div> </div> @@ -562,4 +561,4 @@ </div> </div> </div> -</div>
\ No newline at end of file +</div> 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 b0b6ae56d..9f96e2ccf 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 @@ -15,6 +15,8 @@ export class ActionAttributesComponent implements OnInit { inputs = []; outputs = []; + newInputs = []; + newOutputs = []; actionAttributesSideBar: boolean; inputActionAttribute = new InputActionAttribute(); outputActionAttribute = new OutputActionAttribute(); @@ -36,6 +38,9 @@ export class ActionAttributesComponent implements OnInit { functionAndAttributesInput: Map<string, string[]> = new Map<string, string[]>(); private currentTargetFunctionName: any; private functionAndAttributesOutput: Map<string, string[]> = new Map<string, string[]>(); + suggestedAttributes: string[] = []; + selectedFunctionName = ''; + selectedAttributeName = ''; constructor(private designerStore: DesignerStore, private functionsStore: FunctionsStore) { @@ -92,7 +97,7 @@ export class ActionAttributesComponent implements OnInit { addInput(input: InputActionAttribute) { if (input && input.type && input.name) { const insertedInputActionAttribute = Object.assign({}, input); - this.inputs.push(insertedInputActionAttribute); + this.newInputs.push(insertedInputActionAttribute); } } @@ -100,7 +105,7 @@ export class ActionAttributesComponent implements OnInit { console.log(output); if (output && output.type && output.name) { const insertedOutputActionAttribute = Object.assign({}, output); - this.outputs.push(insertedOutputActionAttribute); + this.newOutputs.push(insertedOutputActionAttribute); } } @@ -128,10 +133,21 @@ export class ActionAttributesComponent implements OnInit { submitAttributes() { this.addInput(this.inputActionAttribute); + if (this.selectedFunctionName && this.selectedAttributeName) { + this.outputActionAttribute.value = + '["' + this.selectedFunctionName + '","' + this.selectedAttributeName + '"]'; + } this.addOutput(this.outputActionAttribute); this.clearFormInputs(); - this.designerStore.setInputsAndOutputsToSpecificWorkflow(this.storeInputs(this.inputs) - , this.storeOutputs(this.outputs), this.actionName); + this.storeOutputs(this.newOutputs); + this.storeInputs((this.newInputs)); + this.newInputs.forEach(input => { + this.inputs.push(input); + }); + + this.newOutputs.forEach(output => { + this.outputs.push(output); + }); } private clearFormInputs() { @@ -148,28 +164,22 @@ export class ActionAttributesComponent implements OnInit { inputs += this.appendAttributes(input); }); - if (inputs.endsWith(',')) { - inputs = inputs.substr(0, inputs.length - 1); - } - return this.convertToObject('{' + inputs + '}'); + this.writeAttribute(inputs, 'inputs'); } private storeOutputs(OutputActionAttributes: OutputActionAttribute[]) { let outputs = ''; OutputActionAttributes.forEach(output => { - outputs += this.appendAttributes(output); + outputs += this.appendOutputAttributes(output); }); - if (outputs.endsWith(',')) { - outputs = outputs.substr(0, outputs.length - 1); - } - return this.convertToObject('{' + outputs + '}'); + this.writeAttribute(outputs, 'outputs'); } - private appendAttributes(output: OutputActionAttribute) { - return '"' + output.name + '" : {\n' + - ' "required" : ' + output.required + ',\n' + - ' "type" : "' + output.type + '",\n' + - ' "description" : "' + output.description + '"\n' + + private appendAttributes(inputActionAttribute: InputActionAttribute) { + return '"' + inputActionAttribute.name + '" : {\n' + + ' "required" : ' + inputActionAttribute.required + ',\n' + + ' "type" : "' + inputActionAttribute.type + '",\n' + + ' "description" : "' + inputActionAttribute.description + '"\n' + ' },'; } @@ -283,19 +293,23 @@ export class ActionAttributesComponent implements OnInit { newAttributes += '"' + attribute + '": ' + this.convertToString(attributes[attribute]) + ','; }); if (value.length > 0) { - newAttributes = this.removeTheLastComma(newAttributes); - const originalAttributes = this.convertToString(this.designerState.template.workflows[this.actionName] - [attributeType]); - console.log(originalAttributes.substr(0, originalAttributes.length - 1) + ',' + newAttributes + '}'); - this.designerState.template.workflows[this.actionName][attributeType] = - this.convertToObject(originalAttributes.substr(0, originalAttributes.length - 1) - + ',' + newAttributes + '}'); + this.writeAttribute(newAttributes, attributeType); } } }); }); } + private writeAttribute(newAttributes: string, attributeType: string) { + newAttributes = this.removeTheLastComma(newAttributes); + const originalAttributes = this.convertToString(this.designerState.template.workflows[this.actionName] + [attributeType]); + console.log(originalAttributes.substr(0, originalAttributes.length - 1) + ',' + newAttributes + '}'); + this.designerState.template.workflows[this.actionName][attributeType] = + this.convertToObject(originalAttributes.substr(0, originalAttributes.length - 1) + + ',' + newAttributes + '}'); + } + private removeTheLastComma = (newInputs: string) => { if (newInputs.endsWith(',')) { newInputs = newInputs.substr(0, newInputs.length - 1); @@ -309,4 +323,42 @@ export class ActionAttributesComponent implements OnInit { private getNodeTemplate = (value: string) => this.designerState.template.node_templates[value]; + getAttributesAndOutputs(functionName: string) { + this.suggestedAttributes = []; + console.log(functionName); + const nodeTemplate = this.designerState.template.node_templates[functionName]; + console.log(this.designerState.template.node_templates); + console.log(nodeTemplate); + /* tslint:disable:no-string-literal */ + console.log(nodeTemplate['type']); + this.functions.serverFunctions + /* tslint:disable:no-string-literal */ + .filter(currentFunction => currentFunction.modelName.includes(nodeTemplate['type'])) + .forEach(currentFunction => { + if (currentFunction.definition['attributes']) { + Object.keys(currentFunction.definition['attributes']).forEach(attribute => { + this.suggestedAttributes.push(attribute); + }); + } + console.log(this.suggestedAttributes); + this.selectedFunctionName = functionName; + }); + } + + addTempOutputAttr(suggestedOutputAndAttribute: string) { + this.selectedAttributeName = suggestedOutputAndAttribute; + } + + + private appendOutputAttributes(output: OutputActionAttribute) { + return '"' + output.name + '" : {\n' + + ' "required" : ' + output.required + ',\n' + + ' "type" : "' + output.type + '",\n' + + ' "description" : "' + output.description + '",\n' + + ' "value\" :' + '{\n' + + ' "get_attribute" : ' + output.value + '\n' + + ' }\n' + + ' },'; + + } } 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 b4cce3484..82bdb6076 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 @@ -4,14 +4,16 @@ export class InputActionAttribute { type: string; required: boolean; + constructor() { this.name = ''; this.description = ''; this.type = ''; this.required = true; + } } export class OutputActionAttribute extends InputActionAttribute { - + value = ''; } |