hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 01:54:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[CST-3782] Drag drop restored

Browse Source
This commit is contained in:
Alessandro Martelli
2021-02-17 17:57:29 +01:00
parent 151b02aeec
commit d208cf16fa
4 changed files with 49 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.html
View File

@@ -3,29 +3,37 @@
[formArrayName]="model.id"
[ngClass]="getClass('element', 'control')">
<div *ngFor="let groupModel of model.groups; let idx = index" role="group"
[formGroupName]="idx" [ngClass]="[getClass('element', 'group'), getClass('grid', 'group')]">
<ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: groupModel"></ng-container>
<ds-dynamic-form-control-container *ngFor="let _model of groupModel.group"
[bindId]="false"
[formGroup]="group"
[context]="groupModel"
[group]="control.get([idx])"
[hidden]="_model.hidden"
[layout]="formLayout"
[model]="_model"
[templates]="templates"
[ngClass]="[getClass('element', 'host', _model), getClass('grid', 'host', _model)]"
(dfBlur)="onBlur($event)"
(dfChange)="onChange($event)"
(dfFocus)="onFocus($event)"
(ngbEvent)="onCustomEvent($event, null, true)"></ds-dynamic-form-control-container>
<ng-container *ngTemplateOutlet="endTemplate?.templateRef; context: groupModel"></ng-container>
<!-- Draggable Container -->
<div cdkDropList cdkDropListLockAxis="y" (cdkDropListDropped)="moveSelection($event)">
<!-- Draggable Items -->
<div *ngFor="let groupModel of model.groups; let idx = index"
role="group"
[formGroupName]="idx"
[ngClass]="[getClass('element', 'group'), getClass('grid', 'group')]"
cdkDrag cdkDragHandle>
<!-- Item content -->
<i class="drag-icon fas fa-grip-vertical fa-fw"></i>
<ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: groupModel"></ng-container>
<ds-dynamic-form-control-container *ngFor="let _model of groupModel.group"
[bindId]="false"
[formGroup]="group"
[context]="groupModel"
[group]="control.get([idx])"
[hidden]="_model.hidden"
[layout]="formLayout"
[model]="_model"
[templates]="templates"
[ngClass]="[getClass('element', 'host', _model), getClass('grid', 'host', _model)]"
(dfBlur)="onBlur($event)"
(dfChange)="onChange($event)"
(dfFocus)="onFocus($event)"
(ngbEvent)="onCustomEvent($event, null, true)"></ds-dynamic-form-control-container>
<ng-container *ngTemplateOutlet="endTemplate?.templateRef; context: groupModel"></ng-container>
</div>
</div>
</div>

12
src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.ts
View File

@@ -44,9 +44,15 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent {
}
moveSelection(event: CdkDragDrop<Relationship>) {
// prevent propagating events generated releasing on the same position
if (event.previousIndex === event.currentIndex) {
return;
}
this.model.moveGroup(event.previousIndex, event.currentIndex - event.previousIndex);
const prevIndex = event.previousIndex - 1;
const index = event.currentIndex - 1;
const prevIndex = event.previousIndex;
const index = event.currentIndex;
if (hasValue(this.model.groups[index]) && hasValue((this.control as any).controls[index])) {
const $event = {
@@ -59,7 +65,7 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent {
};
this.onChange($event);
}
}
}
update(event: any, index: number) {

4
src/app/shared/form/form.component.spec.ts
View File

@@ -418,7 +418,7 @@ describe('FormComponent test suite', () => {
}));
it('should dispatch FormChangeAction when an item has been removed from an array', inject([FormBuilderService], (service: FormBuilderService) => {
formComp.removeItem(new Event('click'), formComp.formModel[0] as DynamicFormArrayModel, 1);
formComp.removeItem(new Event('click'), formComp.formModel[0] as DynamicFormArrayModel, 0);
expect(store.dispatch).toHaveBeenCalledWith(new FormChangeAction('testFormArray', service.getValueFromModel(formComp.formModel)));
}));
@@ -426,7 +426,7 @@ describe('FormComponent test suite', () => {
it('should emit removeArrayItem Event when an item has been removed from an array', inject([FormBuilderService], (service: FormBuilderService) => {
spyOn(formComp.removeArrayItem, 'emit');
formComp.removeItem(new Event('click'), formComp.formModel[0] as DynamicFormArrayModel, 1);
formComp.removeItem(new Event('click'), formComp.formModel[0] as DynamicFormArrayModel, 0);
expect(formComp.removeArrayItem.emit).toHaveBeenCalled();
}));

21
src/app/submission/sections/form/section-form.component.ts
View File

@@ -359,19 +359,16 @@ export class SubmissionSectionformComponent extends SectionModelComponent {
* the [[DynamicFormControlEvent]] emitted
*/
onChange(event: DynamicFormControlEvent): void {
// don't handle change events for things with an index < 0, those are template rows.
if (hasNoValue(event.context) || hasNoValue(event.context.index) || event.context.index >= 0) {
this.formOperationsService.dispatchOperationsFromEvent(
this.pathCombiner,
event,
this.previousValue,
this.hasStoredValue(this.formBuilderService.getId(event.model), this.formOperationsService.getArrayIndexFromEvent(event)));
const metadata = this.formOperationsService.getFieldPathSegmentedFromChangeEvent(event);
const value = this.formOperationsService.getFieldValueFromChangeEvent(event);
this.formOperationsService.dispatchOperationsFromEvent(
this.pathCombiner,
event,
this.previousValue,
this.hasStoredValue(this.formBuilderService.getId(event.model), this.formOperationsService.getArrayIndexFromEvent(event)));
const metadata = this.formOperationsService.getFieldPathSegmentedFromChangeEvent(event);
const value = this.formOperationsService.getFieldValueFromChangeEvent(event);
if (environment.submission.autosave.metadata.indexOf(metadata) !== -1 && isNotEmpty(value)) {
this.submissionService.dispatchSave(this.submissionId);
}
if (environment.submission.autosave.metadata.indexOf(metadata) !== -1 && isNotEmpty(value)) {
this.submissionService.dispatchSave(this.submissionId);
}
}