[ACA-828] Add showTitle input in TaskCloudForm component (#6318)

* [ACA-828] Add showTitle input in TaskCloudForm component

* Fixed comment
This commit is contained in:
siva kumar
2020-11-05 17:57:34 +05:30
committed by GitHub
parent 33caecad2e
commit 0ee08f7ec0
5 changed files with 39 additions and 6 deletions

View File

@@ -37,6 +37,7 @@ Save and Complete buttons get disabled when at least one of the form's inputs ar
| ------------------ | --------- | ------------- | ----------------------------------------------- |
| appName | `string` | "" | App id to fetch corresponding form and values. |
| readOnly | `boolean` | false | Toggle readonly state of the task. |
| showTitle | `boolean` | true | Toggle rendering of the form title. |
| showCancelButton | `boolean` | true | Toggle rendering of the `Cancel` button. |
| showCompleteButton | `boolean` | true | Toggle rendering of the `Complete` button. |
| showRefreshButton | `boolean` | false | Toggle rendering of the `Refresh` button. |

View File

@@ -5,7 +5,7 @@
<div *ngIf="hasForm()" class="adf-form-container">
<mat-card>
<mat-card-header>
<mat-card-header *ngIf="showTitle || showRefreshButton || showValidationIcon">
<mat-card-title>
<h4>
<div *ngIf="showValidationIcon" class="adf-form-validation-button">

View File

@@ -3,6 +3,7 @@
[appName]="appName"
[appVersion]="taskDetails.appVersion"
[taskId]="taskId"
[showTitle]="showTitle"
[processInstanceId]="taskDetails.processInstanceId"
[readOnly]="isReadOnly()"
[showRefreshButton]="showRefreshButton"
@@ -21,14 +22,11 @@
<ng-template #withoutForm>
<mat-card class="adf-task-form-container">
<mat-card-header>
<mat-card-header *ngIf="showTitle">
<mat-card-title>
<h4>
<span class="adf-form-title">
{{taskDetails.name}}
<ng-container *ngIf="!taskDetails.name">
{{'FORM.FORM_RENDERER.NAMELESS_TASK' | translate}}
</ng-container>
{{ taskDetails?.name || 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}
</span>
</h4>
</mat-card-title>

View File

@@ -416,4 +416,34 @@ describe('TaskFormCloudComponent', () => {
expect(loadingTemplate).toBeNull();
});
});
it('should display task name as title on no form template if showTitle is true', () => {
component.taskId = taskDetails.id;
fixture.detectChanges();
const noFormTemplateTitle = debugElement.query(By.css('.adf-form-title'));
expect(noFormTemplateTitle.nativeElement.innerText).toEqual('Task1');
});
it('should display default name as title on no form template if the task name empty/undefined', () => {
const mockTaskDetailsWithOutName = { id: 'mock-task-id', name: null, formKey: null };
getTaskSpy.and.returnValue(of(mockTaskDetailsWithOutName));
component.taskId = 'mock-task-id';
fixture.detectChanges();
const noFormTemplateTitle = debugElement.query(By.css('.adf-form-title'));
expect(noFormTemplateTitle.nativeElement.innerText).toEqual('FORM.FORM_RENDERER.NAMELESS_TASK');
});
it('should not display no form title if showTitle is set to false', () => {
component.taskId = taskDetails.id;
component.showTitle = false;
fixture.detectChanges();
const noFormTemplateTitle = debugElement.query(By.css('.adf-form-title'));
expect(noFormTemplateTitle).toBeNull();
});
});

View File

@@ -41,6 +41,10 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
@Input()
taskId: string;
/** Toggle rendering of the form title. */
@Input()
showTitle: boolean = true;
/** Toggle rendering of the `Refresh` button. */
@Input()
showRefreshButton = false;