mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ACA-3273] - fix start process empty message (#5689)
* [ACA-3273] - fix start process empty message * revert licenses changes Co-authored-by: Silviu Popa <p3701014@L3700101120.ness.com>
This commit is contained in:
Silviu Popa
GitHub
@@ -3,73 +3,75 @@
|
||||
<mat-card-title class="adf-title">{{'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.TITLE' | translate}}
|
||||
</mat-card-title>
|
||||
|
||||
<mat-card-content *ngIf="!isProcessDefinitionsEmpty(); else emptyProcessDefinitionsList">
|
||||
<mat-card-content>
|
||||
<mat-card-subtitle id="error-message" *ngIf="errorMessageId">
|
||||
{{ errorMessageId | translate }}
|
||||
</mat-card-subtitle>
|
||||
|
||||
<form [formGroup]="processForm">
|
||||
<mat-form-field class="adf-process-input-container" [floatLabel]="'always'">
|
||||
<mat-label>{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate }}</mat-label>
|
||||
<input
|
||||
#inputAutocomplete
|
||||
matInput
|
||||
formControlName="processDefinition"
|
||||
[matAutocomplete]="auto"
|
||||
id="processDefinitionName">
|
||||
<div class="adf-process-input-autocomplete">
|
||||
<mat-autocomplete #auto="matAutocomplete" id="processDefinitionOptions" [displayWith]="displayProcessNameOnDropdown" (optionSelected)="setProcessDefinitionOnForm($event.option.value)" >
|
||||
<mat-option *ngFor="let processDef of filteredProcesses" [value]="getProcessDefinitionValue(processDef)"
|
||||
(click)="processDefinitionSelectionChanged(processDef)">
|
||||
{{ getProcessDefinitionValue(processDef) }}
|
||||
</mat-option>
|
||||
</mat-autocomplete>
|
||||
<button id="adf-select-process-dropdown" *ngIf="showSelectProcessDropdown" mat-icon-button (click)="displayDropdown($event)">
|
||||
<mat-icon>arrow_drop_down</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<mat-error *ngIf="processDefinition.hasError('required')" class="adf-error-pb">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_DEFINITION_REQUIRED' | translate }}
|
||||
<div *ngIf="!isProcessDefinitionsEmpty(); else emptyProcessDefinitionsList">
|
||||
<form [formGroup]="processForm">
|
||||
<mat-form-field class="adf-process-input-container" [floatLabel]="'always'">
|
||||
<mat-label>{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate }}</mat-label>
|
||||
<input
|
||||
#inputAutocomplete
|
||||
matInput
|
||||
formControlName="processDefinition"
|
||||
[matAutocomplete]="auto"
|
||||
id="processDefinitionName">
|
||||
<div class="adf-process-input-autocomplete">
|
||||
<mat-autocomplete #auto="matAutocomplete" id="processDefinitionOptions" [displayWith]="displayProcessNameOnDropdown" (optionSelected)="setProcessDefinitionOnForm($event.option.value)" >
|
||||
<mat-option *ngFor="let processDef of filteredProcesses" [value]="getProcessDefinitionValue(processDef)"
|
||||
(click)="processDefinitionSelectionChanged(processDef)">
|
||||
{{ getProcessDefinitionValue(processDef) }}
|
||||
</mat-option>
|
||||
</mat-autocomplete>
|
||||
<button id="adf-select-process-dropdown" *ngIf="showSelectProcessDropdown" mat-icon-button (click)="displayDropdown($event)">
|
||||
<mat-icon>arrow_drop_down</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<mat-error *ngIf="processDefinition.hasError('required')" class="adf-error-pb">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_DEFINITION_REQUIRED' | translate }}
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="adf-process-input-container" [floatLabel]="'always'">
|
||||
<mat-label>{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.NAME' | translate }}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="processInstanceName"
|
||||
id="processName">
|
||||
<mat-error id="adf-start-process-required-error" *ngIf="processInstanceName.hasError('required')">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_NAME_REQUIRED' | translate }}
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-error id="adf-start-process-maxlength-error" *ngIf="processInstanceName.hasError('maxlength')">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.MAXIMUM_LENGTH' | translate : { characters : maxNameLength } }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="processInstanceName.hasError('pattern')">
|
||||
{{ 'ADF_PROCESS_LIST.START_PROCESS.ERROR.SPACE_VALIDATOR' | translate }}
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
</form>
|
||||
|
||||
<mat-form-field class="adf-process-input-container" [floatLabel]="'always'">
|
||||
<mat-label>{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.NAME' | translate }}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="processInstanceName"
|
||||
id="processName">
|
||||
<mat-error id="adf-start-process-required-error" *ngIf="processInstanceName.hasError('required')">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.PROCESS_NAME_REQUIRED' | translate }}
|
||||
</mat-error>
|
||||
<mat-error id="adf-start-process-maxlength-error" *ngIf="processInstanceName.hasError('maxlength')">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.ERROR.MAXIMUM_LENGTH' | translate : { characters : maxNameLength } }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="processInstanceName.hasError('pattern')">
|
||||
{{ 'ADF_PROCESS_LIST.START_PROCESS.ERROR.SPACE_VALIDATOR' | translate }}
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
</form>
|
||||
|
||||
<ng-container *ngIf="hasForm() else taskFormCloudButtons">
|
||||
<adf-cloud-form
|
||||
[appName]="appName"
|
||||
[appVersion]="processDefinitionCurrent.appVersion"
|
||||
[data]="values"
|
||||
[formId]="processDefinitionCurrent.formKey"
|
||||
[showSaveButton]="false"
|
||||
[showCompleteButton]="false"
|
||||
[showRefreshButton]="false"
|
||||
[showValidationIcon]="false"
|
||||
[showTitle]="false"
|
||||
(formContentClicked)="onFormContentClicked($event)"
|
||||
(formLoaded)="onFormLoaded($event)">
|
||||
<adf-cloud-form-custom-outcomes>
|
||||
<ng-template [ngTemplateOutlet]="taskFormCloudButtons">
|
||||
</ng-template>
|
||||
</adf-cloud-form-custom-outcomes>
|
||||
</adf-cloud-form>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="hasForm() else taskFormCloudButtons">
|
||||
<adf-cloud-form
|
||||
[appName]="appName"
|
||||
[appVersion]="processDefinitionCurrent.appVersion"
|
||||
[data]="values"
|
||||
[formId]="processDefinitionCurrent.formKey"
|
||||
[showSaveButton]="false"
|
||||
[showCompleteButton]="false"
|
||||
[showRefreshButton]="false"
|
||||
[showValidationIcon]="false"
|
||||
[showTitle]="false"
|
||||
(formContentClicked)="onFormContentClicked($event)"
|
||||
(formLoaded)="onFormLoaded($event)">
|
||||
<adf-cloud-form-custom-outcomes>
|
||||
<ng-template [ngTemplateOutlet]="taskFormCloudButtons">
|
||||
</ng-template>
|
||||
</adf-cloud-form-custom-outcomes>
|
||||
</adf-cloud-form>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
</mat-card-content>
|
||||
|
||||
@@ -86,7 +88,7 @@
|
||||
</ng-template>
|
||||
|
||||
<ng-template #emptyProcessDefinitionsList>
|
||||
<mat-card-content>
|
||||
<mat-card-content *ngIf="processDefinitionLoaded">
|
||||
<mat-card-subtitle class="error-message" id="no-process-message">
|
||||
{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.NO_PROCESS_DEFINITIONS' | translate | uppercase}}
|
||||
</mat-card-subtitle>
|
||||
|
||||
@@ -736,5 +736,18 @@ describe('StartProcessCloudComponent', () => {
|
||||
fixture.detectChanges();
|
||||
selectOptionByName(fakeProcessDefinitions[0].name);
|
||||
});
|
||||
|
||||
it('should wait for process definition to be loaded before showing the empty process definition message', () => {
|
||||
component.processDefinitionLoaded = false;
|
||||
fixture.detectChanges();
|
||||
let noProcessElement = fixture.nativeElement.querySelector('#no-process-message');
|
||||
expect(noProcessElement).toBeNull();
|
||||
getDefinitionsSpy.and.returnValue(of([]));
|
||||
|
||||
component.loadProcessDefinitions();
|
||||
fixture.detectChanges();
|
||||
noProcessElement = fixture.nativeElement.querySelector('#no-process-message');
|
||||
expect(noProcessElement).not.toBeNull();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -104,6 +104,7 @@ export class StartProcessCloudComponent implements OnChanges, OnInit, OnDestroy
|
||||
disableStartButton: boolean = true;
|
||||
|
||||
protected onDestroy$ = new Subject<boolean>();
|
||||
processDefinitionLoaded = false;
|
||||
|
||||
constructor(private startProcessCloudService: StartProcessCloudService,
|
||||
private formBuilder: FormBuilder) {
|
||||
@@ -233,7 +234,9 @@ export class StartProcessCloudComponent implements OnChanges, OnInit, OnDestroy
|
||||
this.resetErrorMessage();
|
||||
|
||||
this.startProcessCloudService.getProcessDefinitions(this.appName)
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.pipe(
|
||||
tap(() => this.processDefinitionLoaded = true),
|
||||
takeUntil(this.onDestroy$))
|
||||
.subscribe((processDefinitionRepresentations: ProcessDefinitionCloud[]) => {
|
||||
this.processDefinitionList = processDefinitionRepresentations;
|
||||
if (processDefinitionRepresentations.length === 1) {
|
||||
|
||||
Reference in New Issue
Block a user