inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACA-3359]Disable processName/ProcessDefintions drop down if no application selected. (#5736)

Browse Source
This commit is contained in:
siva kumar 2020-05-29 04:44:44 +05:30 committed by GitHub
parent a9a801c34d
commit 84607de277
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 103 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
lib/process-services/src/lib/process-list/components/start-process.component.html
View File

@ -14,7 +14,7 @@
<mat-option
*ngFor="let application of applications"
[value]="application"
[attr.data-automation-id]="'adf-start-process-apps-option' + application.name">
[attr.data-automation-id]="'adf-start-process-apps-option-' + application.name">
{{ application.name }}
</mat-option>
</mat-select>
@ -38,13 +38,18 @@
{{ processDef.name }}
</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>
<ng-container *ngIf="!isProcessDefinitionsLoading ; else showProcessDefLoadingTemplate">
<button
id="adf-select-process-dropdown"
*ngIf="showSelectProcessDropdown"
mat-icon-button
(click)="displayDropdown($event)">
<mat-icon>arrow_drop_down</mat-icon>
</button>
</ng-container>
<ng-template #showProcessDefLoadingTemplate>
<mat-spinner id="adf-select-process-spinner" [diameter]="20"></mat-spinner>
</ng-template>
</div>
</mat-form-field>
</div>

5
lib/process-services/src/lib/process-list/components/start-process.component.scss
View File

@ -33,6 +33,11 @@
right: -14px;
top: 0;
}
mat-spinner {
position: absolute;
right: -1px;
top: 0;
}
}
&-start-form-container {
.mat-card {

60
lib/process-services/src/lib/process-list/components/start-process.component.spec.ts
View File

@ -686,5 +686,65 @@ describe('StartFormComponent', () => {
const appsSelector = fixture.nativeElement.querySelector('[data-automation-id="adf-start-process-apps-drop-down"]');
expect(appsSelector).toBeNull();
});
it('Should be able to disable process name and definitions inputs if there is no application selected by default', () => {
component.appId = 12345;
const change = new SimpleChange(null, 12345, true);
component.ngOnChanges({ 'appId': change });
fixture.detectChanges();
expect(getDeployedApplicationsSpy).toHaveBeenCalled();
expect(component.applications.length).toEqual(6);
expect(component.selectedApplication).toBeUndefined();
const processDefinitionSelectInput = fixture.nativeElement.querySelector('#processDefinitionName');
const processNameInput = fixture.nativeElement.querySelector('#processName');
expect(processDefinitionSelectInput.disabled).toEqual(true);
expect(processNameInput.disabled).toEqual(true);
});
it('Should be able to enable process name and definitions inputs if the application selected by given appId', () => {
component.appId = 2;
const change = new SimpleChange(null, 2, true);
component.ngOnChanges({ 'appId': change });
fixture.detectChanges();
expect(getDeployedApplicationsSpy).toHaveBeenCalled();
expect(component.applications.length).toEqual(6);
expect(component.selectedApplication.id).toEqual(component.appId);
const processDefinitionSelectInput = fixture.nativeElement.querySelector('#processDefinitionName');
const processNameInput = fixture.nativeElement.querySelector('#processName');
expect(processDefinitionSelectInput.disabled).toEqual(false);
expect(processNameInput.disabled).toEqual(false);
});
it('Should be able to enable process name and definitions inputs when the application selected from the apps drop-down', () => {
component.appId = 12345;
const change = new SimpleChange(null, 12345, true);
component.ngOnChanges({ 'appId': change });
fixture.detectChanges();
expect(getDeployedApplicationsSpy).toHaveBeenCalled();
expect(component.applications.length).toEqual(6);
expect(component.selectedApplication).toBeUndefined();
const appsSelectElement = fixture.nativeElement.querySelector('[data-automation-id="adf-start-process-apps-drop-down"]');
const processDefinitionSelectInput = fixture.nativeElement.querySelector('#processDefinitionName');
const processNameInput = fixture.nativeElement.querySelector('#processName');
expect(processDefinitionSelectInput.disabled).toEqual(true);
expect(processNameInput.disabled).toEqual(true);
appsSelectElement.click();
fixture.detectChanges();
const sortOptions = document.querySelector('[data-automation-id="adf-start-process-apps-option-App2"]');
sortOptions.dispatchEvent(new Event('click'));
fixture.detectChanges();
expect(component.selectedApplication.id).toBe(2);
expect(component.selectedApplication.name).toBe('App2');
expect(processDefinitionSelectInput.disabled).toEqual(false);
expect(processNameInput.disabled).toEqual(false);
});
});
});

26
lib/process-services/src/lib/process-list/components/start-process.component.ts
View File

@ -123,7 +123,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
alfrescoRepositoryName: string;
applications: AppDefinitionRepresentationModel[] = [];
selectedApplication: AppDefinitionRepresentationModel;
isProcessDefinitionsLoading = true;
private onDestroy$ = new Subject<boolean>();
constructor(private activitiProcess: ProcessService,
private activitiContentService: ActivitiContentService,
@ -217,6 +217,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
}
loadProcessDefinitions(appId: any): void {
this.isProcessDefinitionsLoading = true;
this.resetSelectedProcessDefinition();
this.resetErrorMessage();
@ -245,9 +246,11 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
this.selectedProcessDef = filteredProcessDefinitions.currentProcessDef;
this.processDefinitionInput.setValue(this.selectedProcessDef ? this.selectedProcessDef.name : '');
this.processDefinitionSelection.emit(this.selectedProcessDef);
this.isProcessDefinitionsLoading = false;
},
() => {
this.errorMessageId = 'ADF_PROCESS_LIST.START_PROCESS.ERROR.LOAD_PROCESS_DEFS';
this.isProcessDefinitionsLoading = false;
});
}
@ -260,6 +263,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
if (filteredProcessDef) {
this.selectedProcessDef = filteredProcessDef;
this.processDefinitionInput.setValue(this.selectedProcessDef ? this.selectedProcessDef.name : '');
this.processDefinitionSelection.emit(this.selectedProcessDef);
}
}
}
@ -288,6 +292,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
this.applications = filteredApps.applications;
this.selectedApplication = filteredApps.currentApplication;
this.applicationSelection.emit(this.selectedApplication);
this.toggleProcessNameAndDefinitionsDropdown();
this.loadProcessDefinitions(this.selectedApplication ? this.selectedApplication.id : null);
},
err => {
@ -300,9 +305,14 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
onAppSelectionChange(selectedApplication: any) {
this.selectedApplication = selectedApplication.value;
this.applicationSelection.emit(this.selectedApplication);
this.toggleProcessNameAndDefinitionsDropdown();
this.loadProcessDefinitions(this.selectedApplication.id);
}
private isAppSelected(): boolean {
return !!(this.selectedApplication && this.selectedApplication.id);
}
private removeDefaultApps(apps: AppDefinitionRepresentationModel []): AppDefinitionRepresentationModel[] {
return apps.filter((app) => app.id);
@ -425,6 +435,20 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
return this.processNameInput;
}
get processDefinitionController(): AbstractControl {
return this.processDefinitionInput;
}
private toggleProcessNameAndDefinitionsDropdown() {
if (!this.isAppSelected()) {
this.processDefinitionController.disable();
this.nameController.disable();
} else {
this.processDefinitionController.enable();
this.nameController.enable();
}
}
processDefinitionSelectionChanged(processDefinition) {
this.selectedProcessDef = processDefinition;
this.processDefinitionSelection.emit(this.selectedProcessDef);