mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-5159] fix visibility condition for label radio box (#5974)
* fix visibility condition for label radio box * fix lint
This commit is contained in:
@@ -227,7 +227,7 @@ export class FormFieldModel extends FormWidgetModel {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private getFieldNameWithLabel(name: string): string {
|
private getFieldNameWithLabel(name: string): string {
|
||||||
return name += '_LABEL';
|
return name + '_LABEL';
|
||||||
}
|
}
|
||||||
|
|
||||||
private getProcessVariableValue(field: any, form: FormModel): any {
|
private getProcessVariableValue(field: any, form: FormModel): any {
|
||||||
|
@@ -32,7 +32,8 @@ import {
|
|||||||
fakeFormJson, fakeTaskProcessVariableModels,
|
fakeFormJson, fakeTaskProcessVariableModels,
|
||||||
formTest, formValues, complexVisibilityJsonVisible,
|
formTest, formValues, complexVisibilityJsonVisible,
|
||||||
nextConditionForm, complexVisibilityJsonNotVisible,
|
nextConditionForm, complexVisibilityJsonNotVisible,
|
||||||
headerVisibilityCond } from '../../mock/form/widget-visibility-cloud.service.mock';
|
headerVisibilityCond
|
||||||
|
} from '../../mock/form/widget-visibility-cloud.service.mock';
|
||||||
import { CoreTestingModule } from '../../testing/core.testing.module';
|
import { CoreTestingModule } from '../../testing/core.testing.module';
|
||||||
import { TranslateModule } from '@ngx-translate/core';
|
import { TranslateModule } from '@ngx-translate/core';
|
||||||
|
|
||||||
@@ -945,14 +946,18 @@ describe('WidgetVisibilityCloudService', () => {
|
|||||||
expect(contModel.isVisible).toBeFalsy();
|
expect(contModel.isVisible).toBeFalsy();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should evaluate checkbox condition', (done) => {
|
it('should evaluate radio box LABEL condition', (done) => {
|
||||||
visibilityObjTest.leftType = WidgetTypeEnum.field;
|
visibilityObjTest.leftFormFieldId = 'radioBoxField_LABEL';
|
||||||
visibilityObjTest.leftValue = 'CheckboxOne';
|
visibilityObjTest.leftRestResponseId = null;
|
||||||
visibilityObjTest.operator = '==';
|
visibilityObjTest.operator = '==';
|
||||||
visibilityObjTest.rightType = WidgetTypeEnum.field;
|
visibilityObjTest.rightValue = 'No';
|
||||||
visibilityObjTest.rightValue = 'CheckboxTwo';
|
visibilityObjTest.rightType = null;
|
||||||
|
visibilityObjTest.rightFormFieldId = '';
|
||||||
|
visibilityObjTest.rightRestResponseId = '';
|
||||||
|
visibilityObjTest.nextConditionOperator = '';
|
||||||
|
visibilityObjTest.nextCondition = null;
|
||||||
|
|
||||||
const checkboxForm = new FormModel({
|
const radioBoxForm = new FormModel({
|
||||||
id: '9999',
|
id: '9999',
|
||||||
name: 'CHECKBOX_VISIBILITY',
|
name: 'CHECKBOX_VISIBILITY',
|
||||||
processDefinitionId: 'PROCESS_TEST:9:9999',
|
processDefinitionId: 'PROCESS_TEST:9:9999',
|
||||||
@@ -971,31 +976,23 @@ describe('WidgetVisibilityCloudService', () => {
|
|||||||
fields: {
|
fields: {
|
||||||
1: [
|
1: [
|
||||||
{
|
{
|
||||||
id: 'CheckboxOne',
|
id: 'radioboxField',
|
||||||
name: 'CheckboxOne',
|
name: 'radioboxField test',
|
||||||
type: 'boolean',
|
type: 'radio-buttons',
|
||||||
required: false,
|
options: [
|
||||||
value: false,
|
{
|
||||||
colspan: 1,
|
'id': 'radioBoxYes',
|
||||||
visibilityCondition: null
|
'name': 'Yes'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'CheckboxTwo',
|
'id': 'radioBoxNo',
|
||||||
name: 'CheckboxTwo',
|
'name': 'No'
|
||||||
type: 'boolean',
|
|
||||||
required: false,
|
|
||||||
value: false,
|
|
||||||
colspan: 1,
|
|
||||||
visibilityCondition: null
|
|
||||||
}
|
}
|
||||||
],
|
]
|
||||||
2: [
|
}, {
|
||||||
{
|
id: 'textBoxTest',
|
||||||
id: 'CheckboxNotReq',
|
name: 'textbox test',
|
||||||
name: 'CheckboxNotReq',
|
type: 'people',
|
||||||
type: 'boolean',
|
|
||||||
required: false,
|
|
||||||
colspan: 1,
|
|
||||||
visibilityCondition: visibilityObjTest
|
visibilityCondition: visibilityObjTest
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
@@ -1004,10 +1001,17 @@ describe('WidgetVisibilityCloudService', () => {
|
|||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
service.refreshVisibility(checkboxForm);
|
const fieldWithVisibilityAttached = radioBoxForm.getFieldById('textBoxTest');
|
||||||
|
const radioBox = radioBoxForm.getFieldById('radioboxField');
|
||||||
|
|
||||||
const fieldWithVisibilityAttached = checkboxForm.getFieldById('CheckboxNotReq');
|
radioBox.value = 'Yes';
|
||||||
|
service.refreshVisibility(radioBoxForm);
|
||||||
|
expect(fieldWithVisibilityAttached.isVisible).toBeFalsy();
|
||||||
|
|
||||||
|
radioBox.value = 'No';
|
||||||
|
service.refreshVisibility(radioBoxForm);
|
||||||
expect(fieldWithVisibilityAttached.isVisible).toBeTruthy();
|
expect(fieldWithVisibilityAttached.isVisible).toBeTruthy();
|
||||||
|
|
||||||
done();
|
done();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@@ -27,11 +27,13 @@ import { TaskProcessVariableModel } from './../models/task-process-variable.mode
|
|||||||
import { WidgetVisibilityModel } from './../models/widget-visibility.model';
|
import { WidgetVisibilityModel } from './../models/widget-visibility.model';
|
||||||
import { WidgetVisibilityService } from './widget-visibility.service';
|
import { WidgetVisibilityService } from './widget-visibility.service';
|
||||||
import { setupTestBed } from '../../testing/setup-test-bed';
|
import { setupTestBed } from '../../testing/setup-test-bed';
|
||||||
import { fakeTaskProcessVariableModels,
|
import {
|
||||||
|
fakeTaskProcessVariableModels,
|
||||||
fakeFormJson, formTest,
|
fakeFormJson, formTest,
|
||||||
formValues, complexVisibilityJsonVisible,
|
formValues, complexVisibilityJsonVisible,
|
||||||
complexVisibilityJsonNotVisible, tabVisibilityJsonMock,
|
complexVisibilityJsonNotVisible, tabVisibilityJsonMock,
|
||||||
tabInvalidFormVisibility } from 'core/mock/form/widget-visibility.service.mock';
|
tabInvalidFormVisibility
|
||||||
|
} from 'core/mock/form/widget-visibility.service.mock';
|
||||||
import { CoreTestingModule } from '../../testing/core.testing.module';
|
import { CoreTestingModule } from '../../testing/core.testing.module';
|
||||||
import { TranslateModule } from '@ngx-translate/core';
|
import { TranslateModule } from '@ngx-translate/core';
|
||||||
|
|
||||||
@@ -931,6 +933,75 @@ describe('WidgetVisibilityService', () => {
|
|||||||
expect(fakeFormField.isVisible).toBeFalsy();
|
expect(fakeFormField.isVisible).toBeFalsy();
|
||||||
expect(fakeFormField.value).toEqual('FAKE_FORM_FIELD_VALUE');
|
expect(fakeFormField.value).toEqual('FAKE_FORM_FIELD_VALUE');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should evaluate radio box LABEL condition', (done) => {
|
||||||
|
visibilityObjTest.leftFormFieldId = 'radioBoxField_LABEL';
|
||||||
|
visibilityObjTest.leftRestResponseId = null;
|
||||||
|
visibilityObjTest.operator = '==';
|
||||||
|
visibilityObjTest.rightValue = 'No';
|
||||||
|
visibilityObjTest.rightType = null;
|
||||||
|
visibilityObjTest.rightFormFieldId = '';
|
||||||
|
visibilityObjTest.rightRestResponseId = '';
|
||||||
|
visibilityObjTest.nextConditionOperator = '';
|
||||||
|
visibilityObjTest.nextCondition = null;
|
||||||
|
|
||||||
|
const radioBoxForm = new FormModel({
|
||||||
|
id: '9999',
|
||||||
|
name: 'CHECKBOX_VISIBILITY',
|
||||||
|
processDefinitionId: 'PROCESS_TEST:9:9999',
|
||||||
|
processDefinitionName: 'PROCESS_TEST',
|
||||||
|
processDefinitionKey: 'PROCESS_TEST',
|
||||||
|
taskId: '999',
|
||||||
|
taskName: 'TEST',
|
||||||
|
fields: [
|
||||||
|
{
|
||||||
|
fieldType: 'ContainerRepresentation',
|
||||||
|
id: '000000000000000000',
|
||||||
|
name: 'Label',
|
||||||
|
type: 'container',
|
||||||
|
value: null,
|
||||||
|
numberOfColumns: 2,
|
||||||
|
fields: {
|
||||||
|
1: [
|
||||||
|
{
|
||||||
|
id: 'radioboxField',
|
||||||
|
name: 'radioboxField test',
|
||||||
|
type: 'radio-buttons',
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
'id': 'radioBoxYes',
|
||||||
|
'name': 'Yes'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'id': 'radioBoxNo',
|
||||||
|
'name': 'No'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}, {
|
||||||
|
id: 'textBoxTest',
|
||||||
|
name: 'textbox test',
|
||||||
|
type: 'people',
|
||||||
|
visibilityCondition: visibilityObjTest
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
const fieldWithVisibilityAttached = radioBoxForm.getFieldById('textBoxTest');
|
||||||
|
const radioBox = radioBoxForm.getFieldById('radioboxField');
|
||||||
|
|
||||||
|
radioBox.value = 'Yes';
|
||||||
|
service.refreshVisibility(radioBoxForm);
|
||||||
|
expect(fieldWithVisibilityAttached.isVisible).toBeFalsy();
|
||||||
|
|
||||||
|
radioBox.value = 'No';
|
||||||
|
service.refreshVisibility(radioBoxForm);
|
||||||
|
expect(fieldWithVisibilityAttached.isVisible).toBeTruthy();
|
||||||
|
|
||||||
|
done();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('Visibility based on form variables', () => {
|
describe('Visibility based on form variables', () => {
|
||||||
|
@@ -20,7 +20,13 @@ import { LogService } from '../../services/log.service';
|
|||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import moment from 'moment-es6';
|
import moment from 'moment-es6';
|
||||||
import { Observable, from, throwError } from 'rxjs';
|
import { Observable, from, throwError } from 'rxjs';
|
||||||
import { FormFieldModel, FormModel, TabModel, ContainerModel, FormOutcomeModel } from '../components/widgets/core/index';
|
import {
|
||||||
|
FormFieldModel,
|
||||||
|
FormModel,
|
||||||
|
TabModel,
|
||||||
|
ContainerModel,
|
||||||
|
FormOutcomeModel
|
||||||
|
} from '../components/widgets/core/index';
|
||||||
import { TaskProcessVariableModel } from '../models/task-process-variable.model';
|
import { TaskProcessVariableModel } from '../models/task-process-variable.model';
|
||||||
import { WidgetVisibilityModel, WidgetTypeEnum } from '../models/widget-visibility.model';
|
import { WidgetVisibilityModel, WidgetTypeEnum } from '../models/widget-visibility.model';
|
||||||
import { map, catchError } from 'rxjs/operators';
|
import { map, catchError } from 'rxjs/operators';
|
||||||
@@ -148,11 +154,11 @@ export class WidgetVisibilityService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getFieldValue(valueList: any, fieldId: string): any {
|
getFieldValue(valueList: any, fieldId: string): any {
|
||||||
let dropDownFilterByName, valueFound;
|
let labelFilterByName, valueFound;
|
||||||
if (fieldId && fieldId.indexOf('_LABEL') > 0) {
|
if (fieldId && fieldId.indexOf('_LABEL') > 0) {
|
||||||
dropDownFilterByName = fieldId.substring(0, fieldId.length - 6);
|
labelFilterByName = fieldId.substring(0, fieldId.length - 6);
|
||||||
if (valueList[dropDownFilterByName]) {
|
if (valueList[labelFilterByName]) {
|
||||||
valueFound = valueList[dropDownFilterByName].name;
|
valueFound = valueList[labelFilterByName].name;
|
||||||
}
|
}
|
||||||
} else if (valueList[fieldId] && valueList[fieldId].id) {
|
} else if (valueList[fieldId] && valueList[fieldId].id) {
|
||||||
valueFound = valueList[fieldId].id;
|
valueFound = valueList[fieldId].id;
|
||||||
@@ -167,8 +173,7 @@ export class WidgetVisibilityService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getFormFieldById(form: FormModel, fieldId: string): FormFieldModel {
|
getFormFieldById(form: FormModel, fieldId: string): FormFieldModel {
|
||||||
return form.getFormFields().
|
return form.getFormFields().find((formField: FormFieldModel) => this.isSearchedField(formField, fieldId));
|
||||||
find( (formField: FormFieldModel) => this.isSearchedField(formField, fieldId));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
searchValueInForm(formField: FormFieldModel, fieldId: string): string {
|
searchValueInForm(formField: FormFieldModel, fieldId: string): string {
|
||||||
@@ -245,7 +250,8 @@ export class WidgetVisibilityService {
|
|||||||
return optionValue;
|
return optionValue;
|
||||||
}
|
}
|
||||||
|
|
||||||
private isSearchedField(field: FormFieldModel, fieldToFind: string): boolean {
|
private isSearchedField(field: FormFieldModel, fieldId: string): boolean {
|
||||||
|
const fieldToFind = fieldId?.indexOf('_LABEL') > 0 ? fieldId.replace('_LABEL', '') : fieldId;
|
||||||
return (field.id && fieldToFind) ? field.id.toUpperCase() === fieldToFind.toUpperCase() : false;
|
return (field.id && fieldToFind) ? field.id.toUpperCase() === fieldToFind.toUpperCase() : false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user