[CST-3782] possibility to configure the isDraggable feature to DynamicRowArrayModel

This commit is contained in:
Alessandro Martelli
2021-03-31 11:56:37 +02:00
parent d224333a1c
commit d47660b5c2
6 changed files with 22 additions and 3 deletions

View File

@@ -12,7 +12,7 @@
[ngClass]="[getClass('element', 'group'), getClass('grid', 'group')]"
cdkDrag
cdkDragHandle
[cdkDragDisabled]="model.groups.length === 1">
[cdkDragDisabled]="dragDisabled">
<!-- Item content -->
<div *cdkDragPreview>
<div class="alert alert-info">
@@ -20,7 +20,7 @@
</div>
</div>
<i class="drag-icon fas fa-grip-vertical fa-fw" [class.invisible]="model.groups.length === 1"></i>
<i class="drag-icon fas fa-grip-vertical fa-fw" [class.invisible]="dragDisabled"></i>
<ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: groupModel"></ng-container>
<ds-dynamic-form-control-container *ngFor="let _model of groupModel.group"
[bindId]="false"

View File

@@ -14,6 +14,7 @@ import {
} from '@ng-dynamic-forms/core';
import { Relationship } from '../../../../../../core/shared/item-relationships/relationship.model';
import { hasValue } from '../../../../../empty.util';
import { DynamicRowArrayModel } from '../ds-dynamic-row-array-model';
@Component({
selector: 'ds-dynamic-form-array',
@@ -25,7 +26,7 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent {
@Input() formLayout: DynamicFormLayout;
@Input() group: FormGroup;
@Input() layout: DynamicFormControlLayout;
@Input() model: DynamicFormArrayModel;
@Input() model: DynamicRowArrayModel;// DynamicRow?
@Input() templates: QueryList<DynamicTemplateDirective> | undefined;
/* tslint:disable:no-output-rename */
@@ -70,4 +71,11 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent {
this.onChange($event);
}
/**
* If the drag feature is disabled for this DynamicRowArrayModel.
*/
get dragDisabled(): boolean {
return this.model.groups.length === 1 || !this.model.isDraggable;
}
}

View File

@@ -9,6 +9,7 @@ export interface DynamicRowArrayModelConfig extends DynamicFormArrayModelConfig
metadataKey: string;
metadataFields: string[];
hasSelectableMetadata: boolean;
isDraggable: boolean;
}
export class DynamicRowArrayModel extends DynamicFormArrayModel {
@@ -19,6 +20,7 @@ export class DynamicRowArrayModel extends DynamicFormArrayModel {
@serializable() metadataKey: string;
@serializable() metadataFields: string[];
@serializable() hasSelectableMetadata: boolean;
@serializable() isDraggable: boolean;
isRowArray = true;
constructor(config: DynamicRowArrayModelConfig, layout?: DynamicFormControlLayout) {
@@ -30,5 +32,6 @@ export class DynamicRowArrayModel extends DynamicFormArrayModel {
this.metadataKey = config.metadataKey;
this.metadataFields = config.metadataFields;
this.hasSelectableMetadata = config.hasSelectableMetadata;
this.isDraggable = config.isDraggable;
}
}

View File

@@ -295,6 +295,7 @@ describe('FormBuilderService test suite', () => {
notRepeatable: false,
relationshipConfig: undefined,
submissionId: '1234',
isDraggable: true,
groupFactory: () => {
return [
new DynamicInputModel({ id: 'testFormRowArrayGroupInput' })

View File

@@ -50,6 +50,11 @@ export abstract class FieldParser {
if (Array.isArray(this.configData.selectableMetadata) && this.configData.selectableMetadata.length === 1) {
metadataKey = this.configData.selectableMetadata[0].metadata;
}
let isDraggable = true;
if (this.configData.input.type === ParserType.Onebox && this.configData?.selectableMetadata?.length > 1) {
isDraggable = false;
}
const config = {
id: uniqueId() + '_array',
label: this.configData.label,
@@ -61,6 +66,7 @@ export abstract class FieldParser {
metadataKey,
metadataFields: this.getAllFieldIds(),
hasSelectableMetadata: isNotEmpty(this.configData.selectableMetadata),
isDraggable,
groupFactory: () => {
let model;
if ((arrayCounter === 0)) {

View File

@@ -80,6 +80,7 @@ const rowArrayQualdropConfig = {
id: 'row_QUALDROP_GROUP',
initialCount: 1,
notRepeatable: true,
isDraggable: false,
relationshipConfig: undefined,
groupFactory: () => {
return [MockQualdropModel];