mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[AAE-12260] - fixing form field mapping (#8243)
* [AAE-12260] - reverting form field mapping to fix wrong behaivour * [AAE-12260] - fixed readonly radiobutton * [AAE-12260] - fixed valid check for rest options when multiple choice is made * [AAE-12260] - fixed name for array elements * [ci skip] * start ci
This commit is contained in:
@@ -714,8 +714,8 @@ describe('FormFieldModel', () => {
|
||||
]
|
||||
});
|
||||
field.updateForm();
|
||||
expect(form.values['dropdown_field']['fake-id-property']).toEqual('opt1');
|
||||
expect(form.values['dropdown_field']['fake-label-property']).toEqual('Option 1');
|
||||
expect(form.values['dropdown_field'].id).toEqual('opt1');
|
||||
expect(form.values['dropdown_field'].name).toEqual('Option 1');
|
||||
});
|
||||
|
||||
it('dropdown field type should be formatted on id and name properties if rest properties are not set', () => {
|
||||
@@ -760,8 +760,8 @@ describe('FormFieldModel', () => {
|
||||
]
|
||||
});
|
||||
field.updateForm();
|
||||
expect(form.values['radio_bananan_field']['banana']).toEqual('opt1');
|
||||
expect(form.values['radio_bananan_field']['banLabel']).toEqual('Option 1');
|
||||
expect(form.values['radio_bananan_field'].id).toEqual('opt1');
|
||||
expect(form.values['radio_bananan_field'].name).toEqual('Option 1');
|
||||
});
|
||||
|
||||
it('radio button field rest type should appear with id / name properties when rest properties are not configured', () => {
|
||||
|
@@ -384,14 +384,14 @@ export class FormFieldModel extends FormWidgetModel {
|
||||
|
||||
const entry: FormFieldOption[] = this.options.filter((opt) => opt.id === this.value);
|
||||
if (entry.length > 0) {
|
||||
this.setFormFieldValueOption(entry[0]);
|
||||
this.form.values[this.id] = entry[0];
|
||||
}
|
||||
}
|
||||
break;
|
||||
case FormFieldTypes.RADIO_BUTTONS:
|
||||
const radioButton: FormFieldOption[] = this.options.filter((opt) => opt.id === this.value);
|
||||
if (radioButton.length > 0) {
|
||||
this.setFormFieldValueOption(radioButton[0]);
|
||||
this.form.values[this.id] = radioButton[0];
|
||||
}
|
||||
break;
|
||||
case FormFieldTypes.UPLOAD:
|
||||
@@ -500,17 +500,4 @@ export class FormFieldModel extends FormWidgetModel {
|
||||
json.type === FormFieldTypes.BOOLEAN;
|
||||
}
|
||||
|
||||
private setFormFieldValueOption(option: FormFieldOption ) {
|
||||
if (this.optionType === 'rest' && !!this.restUrl) {
|
||||
const restEntry = {};
|
||||
const restIdProperty = this.restIdProperty || 'id';
|
||||
const restLabelProperty = this.restLabelProperty || 'name';
|
||||
restEntry[restIdProperty] = option.id;
|
||||
restEntry[restLabelProperty] = option.name;
|
||||
this.form.values[this.id] = restEntry;
|
||||
} else {
|
||||
this.form.values[this.id] = option;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -465,6 +465,96 @@ describe('DropdownCloudWidgetComponent', () => {
|
||||
{ id: 'opt_2', name: 'option_2' }
|
||||
]);
|
||||
});
|
||||
|
||||
it('should show preselected option for rest options', async () => {
|
||||
widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
|
||||
id: 'dropdown-id',
|
||||
name: 'date-name',
|
||||
type: 'dropdown',
|
||||
readOnly: 'false',
|
||||
restUrl: 'https://fake-rest-url',
|
||||
optionType : 'rest',
|
||||
selectionType: 'multiple',
|
||||
value: [
|
||||
{ id: 'opt_3', name: 'option_3' },
|
||||
{ id: 'opt_4', name: 'option_4' }
|
||||
]
|
||||
});
|
||||
spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([
|
||||
{
|
||||
id: 'opt_1',
|
||||
name: 'option_1'
|
||||
},
|
||||
{
|
||||
id: 'opt_2',
|
||||
name: 'option_2'
|
||||
},
|
||||
{
|
||||
id: 'opt_3',
|
||||
name: 'option_3'
|
||||
},
|
||||
{
|
||||
id: 'opt_4',
|
||||
name: 'option_4'
|
||||
}
|
||||
] as any));
|
||||
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
fixture.detectChanges();
|
||||
|
||||
const selectedPlaceHolder = fixture.debugElement.query(By.css('.mat-select-value-text span'));
|
||||
expect(selectedPlaceHolder.nativeElement.getInnerHTML()).toEqual('option_3, option_4');
|
||||
|
||||
await openSelect('#dropdown-id');
|
||||
|
||||
const options = fixture.debugElement.queryAll(By.css('.mat-selected span'));
|
||||
expect(Array.from(options).map(({ nativeElement }) => nativeElement.getInnerHTML().trim()))
|
||||
.toEqual(['option_3', 'option_4']);
|
||||
});
|
||||
|
||||
it('should support multiple options for rest options', async () => {
|
||||
widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
|
||||
id: 'dropdown-id',
|
||||
name: 'date-name',
|
||||
type: 'dropdown',
|
||||
readOnly: 'false',
|
||||
restUrl: 'https://fake-rest-url',
|
||||
optionType : 'rest',
|
||||
selectionType: 'multiple'
|
||||
});
|
||||
|
||||
spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([
|
||||
{
|
||||
id: 'opt_1',
|
||||
name: 'option_1'
|
||||
},
|
||||
{
|
||||
id: 'opt_2',
|
||||
name: 'option_2'
|
||||
},
|
||||
{
|
||||
id: 'opt_3',
|
||||
name: 'option_3'
|
||||
},
|
||||
{
|
||||
id: 'opt_4',
|
||||
name: 'option_4'
|
||||
}
|
||||
] as any));
|
||||
|
||||
fixture.detectChanges();
|
||||
await openSelect('#dropdown-id');
|
||||
|
||||
const optionOne = fixture.debugElement.query(By.css('[id="opt_2"]'));
|
||||
const optionTwo = fixture.debugElement.query(By.css('[id="opt_4"]'));
|
||||
optionOne.triggerEventHandler('click', null);
|
||||
optionTwo.triggerEventHandler('click', null);
|
||||
expect(widget.field.value).toEqual([
|
||||
{ id: 'opt_2', name: 'option_2' },
|
||||
{ id: 'opt_4', name: 'option_4' }
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Linked Dropdown', () => {
|
||||
|
@@ -185,7 +185,13 @@ export class DropdownCloudWidgetComponent extends WidgetComponent implements OnI
|
||||
}
|
||||
|
||||
private isSelectedValueInOptions(): boolean {
|
||||
return [...this.field.options].map(option => option.id).includes(this.fieldValue);
|
||||
if (Array.isArray(this.fieldValue)) {
|
||||
const optionIdList = [...this.field.options].map(option => option.id);
|
||||
const fieldValueIds = this.fieldValue.map(valueOption => valueOption.id);
|
||||
return fieldValueIds.every(valueOptionId => optionIdList.includes(valueOptionId));
|
||||
} else {
|
||||
return [...this.field.options].map(option => option.id).includes(this.fieldValue);
|
||||
}
|
||||
}
|
||||
|
||||
get fieldValue(): string {
|
||||
|
@@ -85,13 +85,7 @@ export class RadioButtonsCloudWidgetComponent extends WidgetComponent implements
|
||||
|
||||
isChecked(option: FormFieldOption): boolean {
|
||||
if (this.field.value && typeof this.field.value === 'object') {
|
||||
let id = 'id';
|
||||
let name = 'name';
|
||||
if (this.field.restUrl) {
|
||||
id = this.field.restIdProperty ?? 'id';
|
||||
name = this.field.restLabelProperty ?? 'name';
|
||||
}
|
||||
return this.field.value[id] === option.id || this.field.value[name] === option.name;
|
||||
return this.field.value['id'] === option.id || this.field.value['name'] === option.name;
|
||||
}
|
||||
return this.field.value === option.id;
|
||||
}
|
||||
|
Reference in New Issue
Block a user