changed rendering of values

This commit is contained in:
lotte
2019-12-06 17:02:57 +01:00
parent 28a0654d20
commit 6bba88019e
13 changed files with 235 additions and 302 deletions

View File

@@ -1,4 +1,5 @@
import { Inject, Injectable } from '@angular/core';
import { DSOResponseParsingService } from '../data/dso-response-parsing.service';
import { ResponseParsingService } from '../data/parsing.service';
import { RestRequest } from '../data/request.models';
@@ -76,7 +77,9 @@ export class SubmissionResponseParsingService extends BaseResponseParsingService
protected toCache = false;
constructor(@Inject(GLOBAL_CONFIG) protected EnvConfig: GlobalConfig,
protected objectCache: ObjectCacheService) {
protected objectCache: ObjectCacheService,
protected dsoParser: DSOResponseParsingService
) {
super();
}
@@ -88,6 +91,7 @@ export class SubmissionResponseParsingService extends BaseResponseParsingService
* @returns {RestResponse}
*/
parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
this.dsoParser.parse(request, data);
if (isNotEmpty(data.payload)
&& isNotEmpty(data.payload._links)
&& this.isSuccessStatus(data.statusCode)) {
@@ -162,5 +166,4 @@ export class SubmissionResponseParsingService extends BaseResponseParsingService
return normalizedDefinition;
}
}

View File

@@ -1,6 +1,6 @@
<div class="d-flex">
<div class="person-thumbnail pr-2">
<ds-thumbnail [thumbnail]="dso.getThumbnail() | async" [defaultImage]="'assets/images/person-placeholder.svg'"></ds-thumbnail>
<!-- <ds-thumbnail [thumbnail]="dso.getThumbnail() | async" [defaultImage]="'assets/images/person-placeholder.svg'"></ds-thumbnail>-->
</div>
<div class="flex-grow-1">
<ds-person-input-suggestions [suggestions]="allSuggestions" [(ngModel)]="selectedName" (clickSuggestion)="select($event)" (submitSuggestion)="selectCustom($event)"></ds-person-input-suggestions>

View File

@@ -1,41 +0,0 @@
<div class="form-group"
[formGroup]="group">
<ds-dynamic-form-control-container
*ngFor="let field of model.group"
[formId]="formId"
[group]="group"
[hasErrorMessaging]="field.hasErrorMessages"
[hidden]="field.hidden"
[layout]="layout"
[model]="field"
[templates]="inputTemplateList"
(dfBlur)="blur.emit($event)"
(dfChange)="change.emit($event)"
(dfFocus)="focus.emit($event)"></ds-dynamic-form-control-container>
<div *ngIf="hasRelationLookup" class="col-auto text-center">
<button *ngIf="model.repeatable" class="btn btn-secondary"
type="submit"
ngbTooltip="{{'form.add-help' | translate}}"
placement="top"
(click)="addValue(); $event.stopPropagation();">{{'form.add' | translate}}
</button>
<button class="btn btn-secondary"
type="submit"
ngbTooltip="{{'form.lookup-help' | translate}}"
placement="top"
(click)="openLookup(); $event.stopPropagation();">{{'form.lookup' | translate}}
</button>
</div>
<div *ngIf="hasRelationLookup" class="mt-3">
<ul class="list-unstyled" cdkDropList (cdkDropListDropped)="moveSelection($event)">
<ds-existing-metadata-list-element cdkDrag
*ngFor="let reorderable of reorderables; trackBy: trackReorderable"
[reoRel]="reorderable"
[submissionItem]="item"
[listId]="listId"
[metadataFields]="model.metadataFields"
[relationshipOptions]="model.relationship">
</ds-existing-metadata-list-element>
</ul>
</div>
</div>

View File

@@ -1,25 +0,0 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { DsDynamicFormControlContainerWrapperComponent } from './ds-dynamic-form-control-container-wrapper.component';
describe('DsDynamicFormControlContainerWrapperComponent', () => {
let component: DsDynamicFormControlContainerWrapperComponent;
let fixture: ComponentFixture<DsDynamicFormControlContainerWrapperComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ DsDynamicFormControlContainerWrapperComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(DsDynamicFormControlContainerWrapperComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@@ -1,198 +0,0 @@
import { ChangeDetectorRef, Component, ComponentFactoryResolver, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output, QueryList } from '@angular/core';
import {
DynamicFormControlContainerComponent,
DynamicFormControlEvent,
DynamicFormLayout,
DynamicFormLayoutService,
DynamicFormValidationService,
DynamicTemplateDirective
} from '@ng-dynamic-forms/core';
import { TranslateService } from '@ngx-translate/core';
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import { RelationshipService } from '../../../../../core/data/relationship.service';
import { SelectableListService } from '../../../../object-list/selectable-list/selectable-list.service';
import { ItemDataService } from '../../../../../core/data/item-data.service';
import { Store } from '@ngrx/store';
import { AppState } from '../../../../../app.reducer';
import { SubmissionObjectDataService } from '../../../../../core/submission/submission-object-data.service';
import { FormGroup } from '@angular/forms';
import { combineLatest as observableCombineLatest, Observable, of as observableOf, Subscription } from 'rxjs';
import { Reorderable, ReorderableRelationship } from '../existing-metadata-list-element/existing-metadata-list-element.component';
import { Item } from '../../../../../core/shared/item.model';
import { hasValue } from '../../../../empty.util';
import { getAllSucceededRemoteData, getRemoteDataPayload, getSucceededRemoteData } from '../../../../../core/shared/operators';
import { map, startWith, switchMap } from 'rxjs/operators';
import { SubmissionObject } from '../../../../../core/submission/models/submission-object.model';
import { RemoteData } from '../../../../../core/data/remote-data';
import { PaginatedList } from '../../../../../core/data/paginated-list';
import { Relationship } from '../../../../../core/shared/item-relationships/relationship.model';
import { ItemSearchResult } from '../../../../object-collection/shared/item-search-result.model';
import { SearchResult } from '../../../../search/search-result.model';
import { DsDynamicLookupRelationModalComponent } from '../relation-lookup-modal/dynamic-lookup-relation-modal.component';
import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
@Component({
selector: 'ds-dynamic-form-control-container-wrapper',
templateUrl: './ds-dynamic-form-control-container-wrapper.component.html',
styleUrls: ['./ds-dynamic-form-control-container-wrapper.component.scss']
})
export class DsDynamicFormControlContainerWrapperComponent implements OnInit, OnDestroy {
@Input('templates') inputTemplateList: QueryList<DynamicTemplateDirective>;
@Input() formId: string;
@Input() context: any | null = null;
@Input() group: FormGroup;
@Input() hasErrorMessaging = false;
@Input() layout = null as DynamicFormLayout;
@Input() model: any;
reorderables$: Observable<ReorderableRelationship[]>;
reorderables: ReorderableRelationship[];
hasRelationLookup: boolean;
modalRef: NgbModalRef;
item: Item;
listId: string;
searchConfig: string;
/**
* List of subscriptions to unsubscribe from
*/
private subs: Subscription[] = [];
/* tslint:disable:no-output-rename */
@Output('dfBlur') blur: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();
@Output('dfChange') change: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();
@Output('dfFocus') focus: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();
constructor(
protected componentFactoryResolver: ComponentFactoryResolver,
protected layoutService: DynamicFormLayoutService,
protected validationService: DynamicFormValidationService,
protected translateService: TranslateService,
private modalService: NgbModal,
private relationService: RelationshipService,
private selectableListService: SelectableListService,
private itemService: ItemDataService,
private relationshipService: RelationshipService,
private zone: NgZone,
private store: Store<AppState>,
private submissionObjectService: SubmissionObjectDataService,
private ref: ChangeDetectorRef
) {
}
ngOnInit(): void {
this.hasRelationLookup = hasValue(this.model.relationship);
this.reorderables = [];
if (this.hasRelationLookup) {
this.listId = 'list-' + this.model.relationship.relationshipType;
const item$ = this.submissionObjectService
.findById(this.model.submissionId).pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload(),
switchMap((submissionObject: SubmissionObject) => (submissionObject.item as Observable<RemoteData<Item>>)
.pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload()
)
)
);
this.subs.push(item$.subscribe((item) => this.item = item));
this.reorderables$ = item$.pipe(
switchMap((item) => this.relationService.getItemRelationshipsByLabel(item, this.model.relationship.relationshipType)
.pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload(),
map((relationshipList: PaginatedList<Relationship>) => relationshipList.page),
startWith([]),
switchMap((relationships: Relationship[]) =>
observableCombineLatest(
relationships.map((relationship: Relationship) =>
relationship.leftItem.pipe(
getSucceededRemoteData(),
getRemoteDataPayload(),
map((leftItem: Item) => {
return new ReorderableRelationship(relationship, leftItem.uuid !== this.item.uuid)
}),
)
)
)
),
map((relationships: ReorderableRelationship[]) =>
relationships
.sort((a: Reorderable, b: Reorderable) => {
return Math.sign(a.getPlace() - b.getPlace());
}
)
)
)
)
);
this.subs.push(this.reorderables$.subscribe((rs) => {
this.reorderables = rs;
this.ref.detectChanges();
}));
this.relationService.getRelatedItemsByLabel(this.item, this.model.relationship.relationshipType).pipe(
map((items: RemoteData<PaginatedList<Item>>) => items.payload.page.map((item) => Object.assign(new ItemSearchResult(), { indexableObject: item }))),
).subscribe((relatedItems: Array<SearchResult<Item>>) => this.selectableListService.select(this.listId, relatedItems));
}
}
openLookup() {
this.modalRef = this.modalService.open(DsDynamicLookupRelationModalComponent, {
size: 'lg'
});
const modalComp = this.modalRef.componentInstance;
modalComp.repeatable = this.model.repeatable;
modalComp.listId = this.listId;
modalComp.relationshipOptions = this.model.relationship;
modalComp.label = this.model.label;
modalComp.metadataFields = this.model.metadataFields;
modalComp.item = this.item;
}
addValue() {
// console.log(this.model.value);
// const event = { type: DynamicFormControlEventType.Change, model: this.model } as any;
// this.change.emit(event);
}
moveSelection(event: CdkDragDrop<Relationship>) {
this.zone.runOutsideAngular(() => {
moveItemInArray(this.reorderables, event.previousIndex, event.currentIndex);
const reorderables = this.reorderables.map((reo: Reorderable, index: number) => {
reo.oldIndex = reo.getPlace();
reo.newIndex = index;
return reo;
}
);
return observableCombineLatest(reorderables.map((rel: ReorderableRelationship) => {
if (rel.oldIndex !== rel.newIndex) {
return this.relationshipService.updatePlace(rel);
} else {
return observableOf(undefined);
}
})
).pipe(getSucceededRemoteData()).subscribe();
})
}
/**
* Prevent unnecessary rerendering so fields don't lose focus
*/
trackReorderable(index, reorderable: Reorderable) {
return hasValue(reorderable) ? reorderable.getId() : undefined;
}
/**
* Unsubscribe from all subscriptions
*/
ngOnDestroy(): void {
this.subs
.filter((sub) => hasValue(sub))
.forEach((sub) => sub.unsubscribe());
}
}

View File

@@ -1,13 +1,14 @@
<div [class.form-group]="(model.type !== 'GROUP' && asBootstrapFormGroup) || getClass('element', 'container').includes('form-group')"
[formGroup]="group"
[ngClass]="[getClass('element', 'container'), getClass('grid', 'container')]">
<label *ngIf="!isCheckbox && hasLabel"
[for]="model.id"
[innerHTML]="(model.required && model.label) ? (model.label | translate) + ' *' : (model.label | translate)"
[ngClass]="[getClass('element', 'label'), getClass('grid', 'label')]"></label>
<ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: model"></ng-container>
<div [ngClass]="{'form-row': model.hasLanguages }">
<!-- Should be *ngIf instead of class d-none, but that breaks the #componentViewContainer reference-->
<div [ngClass]="{'form-row': model.hasLanguages || hasRelationLookup, 'd-none': hasRelationLookup && model.value}">
<div [ngClass]="getClass('grid', 'control')">
<ng-container #componentViewContainer></ng-container>
@@ -34,8 +35,41 @@
<option *ngFor="let lang of model.languageCodes" [value]="lang.code">{{lang.display}}</option>
</select>
</div>
<div *ngIf="hasRelationLookup" class="col-auto text-center">
<button class="btn btn-secondary"
type="submit"
ngbTooltip="{{'form.lookup-help' | translate}}"
placement="top"
(click)="openLookup(); $event.stopPropagation();">{{'form.lookup' | translate}}
</button>
</div>
</div>
<ng-container *ngTemplateOutlet="endTemplate?.templateRef; context: model"></ng-container>
<ng-container *ngIf="hasRelationLookup && model.value && reorderable">
<ds-existing-metadata-list-element cdkDrag
[reoRel]="reorderable"
[submissionItem]="item"
[listId]="listId"
[metadataFields]="model.metadataFields"
[relationshipOptions]="model.relationship">
</ds-existing-metadata-list-element>
</ng-container>
<ng-content></ng-content>
<!-- <div *ngIf="hasRelationLookup" class="mt-3">-->
<!-- <ul class="list-unstyled" cdkDropList (cdkDropListDropped)="moveSelection($event)">-->
<!-- <ds-existing-metadata-list-element cdkDrag-->
<!-- *ngFor="let reorderable of reorderables; trackBy: trackReorderable"-->
<!-- [reoRel]="reorderable"-->
<!-- [submissionItem]="item"-->
<!-- [listId]="listId"-->
<!-- [metadataFields]="model.metadataFields"-->
<!-- [relationshipOptions]="model.relationship">-->
<!-- </ds-existing-metadata-list-element>-->
<!-- </ul>-->
<!-- </div>-->
</div>

View File

@@ -1,12 +1,14 @@
import {
ChangeDetectionStrategy,
ChangeDetectionStrategy, ChangeDetectorRef,
Component,
ComponentFactoryResolver,
ContentChildren,
EventEmitter,
Input,
NgZone,
OnChanges,
OnDestroy,
OnInit,
Output,
QueryList,
SimpleChanges,
@@ -48,6 +50,10 @@ import {
DynamicNGBootstrapTimePickerComponent
} from '@ng-dynamic-forms/ui-ng-bootstrap';
import { TranslateService } from '@ngx-translate/core';
import {
Reorderable,
ReorderableRelationship
} from './existing-metadata-list-element/existing-metadata-list-element.component';
import { DYNAMIC_FORM_CONTROL_TYPE_TYPEAHEAD } from './models/typeahead/dynamic-typeahead.model';
import { DYNAMIC_FORM_CONTROL_TYPE_SCROLLABLE_DROPDOWN } from './models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
@@ -56,7 +62,7 @@ import { DYNAMIC_FORM_CONTROL_TYPE_DSDATEPICKER } from './models/date-picker/dat
import { DYNAMIC_FORM_CONTROL_TYPE_LOOKUP } from './models/lookup/dynamic-lookup.model';
import { DynamicListCheckboxGroupModel } from './models/list/dynamic-list-checkbox-group.model';
import { DynamicListRadioGroupModel } from './models/list/dynamic-list-radio-group.model';
import { isNotEmpty, isNotUndefined } from '../../../empty.util';
import { hasValue, isNotEmpty, isNotUndefined } from '../../../empty.util';
import { DYNAMIC_FORM_CONTROL_TYPE_LOOKUP_NAME } from './models/lookup/dynamic-lookup-name.model';
import { DsDynamicTagComponent } from './models/tag/dynamic-tag.component';
import { DsDatePickerComponent } from './models/date-picker/date-picker.component';
@@ -69,12 +75,30 @@ import { DsDynamicFormArrayComponent } from './models/array-group/dynamic-form-a
import { DsDynamicRelationGroupComponent } from './models/relation-group/dynamic-relation-group.components';
import { DYNAMIC_FORM_CONTROL_TYPE_RELATION_GROUP } from './models/relation-group/dynamic-relation-group.model';
import { DsDatePickerInlineComponent } from './models/date-picker-inline/dynamic-date-picker-inline.component';
import { map } from 'rxjs/operators';
import { Observable } from 'rxjs';
import { map, startWith, switchMap, take } from 'rxjs/operators';
import { combineLatest as observableCombineLatest, Observable, of as observableOf, Subscription } from 'rxjs';
import { SearchResult } from '../../../search/search-result.model';
import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import { RelationshipService } from '../../../../core/data/relationship.service';
import { SelectableListService } from '../../../object-list/selectable-list/selectable-list.service';
import { DsDynamicDisabledComponent } from './models/disabled/dynamic-disabled.component';
import { DYNAMIC_FORM_CONTROL_TYPE_DISABLED } from './models/disabled/dynamic-disabled.model';
import { DsDynamicLookupRelationModalComponent } from './relation-lookup-modal/dynamic-lookup-relation-modal.component';
import { getAllSucceededRemoteData, getRemoteDataPayload, getSucceededRemoteData } from '../../../../core/shared/operators';
import { RemoteData } from '../../../../core/data/remote-data';
import { Item } from '../../../../core/shared/item.model';
import { ItemDataService } from '../../../../core/data/item-data.service';
import { Store } from '@ngrx/store';
import { AppState } from '../../../../app.reducer';
import { SubmissionObjectDataService } from '../../../../core/submission/submission-object-data.service';
import { SubmissionObject } from '../../../../core/submission/models/submission-object.model';
import { PaginatedList } from '../../../../core/data/paginated-list';
import { ItemSearchResult } from '../../../object-collection/shared/item-search-result.model';
import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
import { Relationship } from '../../../../core/shared/item-relationships/relationship.model';
import { MetadataValue } from '../../../../core/shared/metadata.models';
import { DynamicRowArrayModel } from './models/ds-dynamic-row-array-model';
export function dsDynamicFormControlMapFn(model: DynamicFormControlModel): Type<DynamicFormControl> | null {
switch (model.type) {
@@ -145,7 +169,7 @@ export function dsDynamicFormControlMapFn(model: DynamicFormControlModel): Type<
templateUrl: './ds-dynamic-form-control-container.component.html',
changeDetection: ChangeDetectionStrategy.Default
})
export class DsDynamicFormControlContainerComponent extends DynamicFormControlContainerComponent implements OnChanges {
export class DsDynamicFormControlContainerComponent extends DynamicFormControlContainerComponent implements OnInit, OnChanges, OnDestroy {
@ContentChildren(DynamicTemplateDirective) contentTemplateList: QueryList<DynamicTemplateDirective>;
// tslint:disable-next-line:no-input-rename
@Input('templates') inputTemplateList: QueryList<DynamicTemplateDirective>;
@@ -158,6 +182,18 @@ export class DsDynamicFormControlContainerComponent extends DynamicFormControlCo
@Input() hasErrorMessaging = false;
@Input() layout = null as DynamicFormLayout;
@Input() model: any;
reorderable$: Observable<ReorderableRelationship>;
reorderable: ReorderableRelationship;
hasRelationLookup: boolean;
modalRef: NgbModalRef;
item: Item;
listId: string;
searchConfig: string;
/**
* List of subscriptions to unsubscribe from
*/
private subs: Subscription[] = [];
/* tslint:disable:no-output-rename */
@Output('dfBlur') blur: EventEmitter<DynamicFormControlEvent> = new EventEmitter<DynamicFormControlEvent>();
@@ -178,11 +214,97 @@ export class DsDynamicFormControlContainerComponent extends DynamicFormControlCo
protected layoutService: DynamicFormLayoutService,
protected validationService: DynamicFormValidationService,
protected translateService: TranslateService,
private modalService: NgbModal,
private relationService: RelationshipService,
private selectableListService: SelectableListService,
private itemService: ItemDataService,
private relationshipService: RelationshipService,
private zone: NgZone,
private store: Store<AppState>,
private submissionObjectService: SubmissionObjectDataService,
private ref: ChangeDetectorRef
) {
super(componentFactoryResolver, layoutService, validationService);
}
ngOnInit(): void {
if (this.model.type === 'ARRAY') {
console.log((this.model as DynamicRowArrayModel).get(1));
}
this.hasRelationLookup = hasValue(this.model.relationship);
if (this.hasRelationLookup) {
this.listId = 'list-' + this.model.relationship.relationshipType;
const item$ = this.submissionObjectService
.findById(this.model.submissionId).pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload(),
switchMap((submissionObject: SubmissionObject) => (submissionObject.item as Observable<RemoteData<Item>>)
.pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload()
)
)
);
this.subs.push(item$.subscribe((item) => this.item = item));
const value = Object.assign(new MetadataValue(), this.model.value);
if (hasValue(value) && value.isVirtual) {
this.reorderable$ = this.relationshipService.findById(value.virtualValue)
.pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload(),
switchMap((relationship: Relationship) =>
relationship.leftItem.pipe(
getSucceededRemoteData(),
getRemoteDataPayload(),
map((leftItem: Item) => {
return new ReorderableRelationship(relationship, leftItem.uuid !== this.item.uuid)
}),
)
)
);
this.subs.push(this.reorderable$.subscribe((rs) => {
this.reorderable = rs;
this.ref.detectChanges();
}));
}
// this.reorderable$ =
// item$.pipe(
// switchMap((item) => this.relationService.getItemRelationshipsByLabel(item, this.model.relationship.relationshipType)
// .pipe(
// getAllSucceededRemoteData(),
// getRemoteDataPayload(),
// map((relationshipList: PaginatedList<Relationship>) => relationshipList.page),
// startWith([]),
// switchMap((relationships: Relationship[]) =>
// observableCombineLatest(
// relationships.map((relationship: Relationship) =>
// relationship.leftItem.pipe(
// getSucceededRemoteData(),
// getRemoteDataPayload(),
// map((leftItem: Item) => {
// return new ReorderableRelationship(relationship, leftItem.uuid !== this.item.uuid)
// }),
// )
// ))),
// map((relationships: ReorderableRelationship[]) =>
// relationships
// .sort((a: Reorderable, b: Reorderable) => {
// return Math.sign(a.getPlace() - b.getPlace());
// })
// )
// )
// )
// );
this.relationService.getRelatedItemsByLabel(this.item, this.model.relationship.relationshipType).pipe(
map((items: RemoteData<PaginatedList<Item>>) => items.payload.page.map((item) => Object.assign(new ItemSearchResult(), { indexableObject: item }))),
).subscribe((relatedItems: Array<SearchResult<Item>>) => this.selectableListService.select(this.listId, relatedItems));
}
}
ngOnChanges(changes: SimpleChanges) {
if (changes) {
@@ -224,4 +346,53 @@ export class DsDynamicFormControlContainerComponent extends DynamicFormControlCo
public hasResultsSelected(): Observable<boolean> {
return this.model.value.pipe(map((list: Array<SearchResult<DSpaceObject>>) => isNotEmpty(list)));
}
openLookup() {
this.modalRef = this.modalService.open(DsDynamicLookupRelationModalComponent, {
size: 'lg'
});
const modalComp = this.modalRef.componentInstance;
modalComp.repeatable = this.model.repeatable;
modalComp.listId = this.listId;
modalComp.relationshipOptions = this.model.relationship;
modalComp.label = this.model.label;
modalComp.metadataFields = this.model.metadataFields;
modalComp.item = this.item;
}
// moveSelection(event: CdkDragDrop<Relationship>) {
// this.zone.runOutsideAngular(() => {
// moveItemInArray(this.reorderables, event.previousIndex, event.currentIndex);
// const reorderables = this.reorderables.map((reo: Reorderable, index: number) => {
// reo.oldIndex = reo.getPlace();
// reo.newIndex = index;
// return reo;
// }
// );
// return observableCombineLatest(reorderables.map((rel: ReorderableRelationship) => {
// if (rel.oldIndex !== rel.newIndex) {
// return this.relationshipService.updatePlace(rel);
// } else {
// return observableOf(undefined);
// }
// })
// ).pipe(getSucceededRemoteData()).subscribe();
// })
// }
/**
* Unsubscribe from all subscriptions
*/
ngOnDestroy(): void {
this.subs
.filter((sub) => hasValue(sub))
.forEach((sub) => sub.unsubscribe());
}
/**
* Prevent unnecessary rerendering so fields don't lose focus
*/
trackReorderable(index, reorderable: Reorderable) {
return hasValue(reorderable) ? reorderable.getId() : undefined;
}
}

View File

@@ -1,4 +1,4 @@
<ds-dynamic-form-control-container-wrapper *ngFor="let model of formModel; trackBy: trackByFn"
<ds-dynamic-form-control-container *ngFor="let model of formModel; trackBy: trackByFn"
[formId]="formId"
[group]="formGroup"
[hasErrorMessaging]="model.hasErrorMessages"
@@ -8,5 +8,5 @@
[ngClass]="[getClass(model, 'element', 'host'), getClass(model, 'grid', 'host')]"
[templates]="templates"
(dfBlur)="onEvent($event, 'blur')"
(dfChange)="onEvent($event, 'change'); test($event);"
(dfFocus)="onEvent($event, 'focus')"></ds-dynamic-form-control-container-wrapper>
(dfChange)="onEvent($event, 'change')"
(dfFocus)="onEvent($event, 'focus')"></ds-dynamic-form-control-container>

View File

@@ -14,7 +14,6 @@ import { SelectableListService } from '../../../../object-list/selectable-list/s
import { Store } from '@ngrx/store';
import { AppState } from '../../../../../app.reducer';
import { ItemSearchResult } from '../../../../object-collection/shared/item-search-result.model';
import { Metadata } from '../../../../../core/shared/metadata.utils';
export abstract class Reorderable {
constructor(public oldIndex?: number, public newIndex?: number) {

View File

@@ -44,19 +44,18 @@ export class DynamicConcatModel extends DynamicFormGroupModel {
this.required = config.required;
this.metadataFields = config.metadataFields;
this.submissionId = config.submissionId;
this.valueUpdates = new Subject<string>();
this.valueUpdates.subscribe((value: string) => this.value = value);
}
get value() {
const firstValue = (this.get(0) as DsDynamicInputModel).value;
const secondValue = (this.get(1) as DsDynamicInputModel).value;
const firstValue = (this.get(0) as DsDynamicInputModel).value as any;
const secondValue = (this.get(1) as DsDynamicInputModel).value as any;
if (isNotEmpty(firstValue) && isNotEmpty(secondValue)) {
return new FormFieldMetadataValueObject(firstValue + this.separator + secondValue);
return Object.assign(new FormFieldMetadataValueObject(), firstValue, firstValue.value + this.separator + secondValue.value);
} else if (isNotEmpty(firstValue)) {
return new FormFieldMetadataValueObject(firstValue);
return Object.assign(new FormFieldMetadataValueObject(), firstValue, firstValue.value);
} else {
return null;
}
@@ -71,12 +70,7 @@ export class DynamicConcatModel extends DynamicFormGroupModel {
} else {
tempValue = value.value;
}
if (tempValue.includes(this.separator)) {
values = tempValue.split(this.separator);
} else {
values = [tempValue, null];
}
values = [...tempValue.split(this.separator), null].map((v) => Object.assign(new FormFieldMetadataValueObject(), value, { value: v }));
if (values[0]) {
(this.get(0) as DsDynamicInputModel).valueUpdates.next(values[0]);

View File

@@ -14,6 +14,7 @@ import { setLayout } from './parser.utils';
import { AuthorityOptions } from '../../../../core/integration/models/authority-options.model';
import { ParserOptions } from './parser-options';
import { RelationshipOptions } from '../models/relationship-options.model';
import { relationship } from '../../../../core/cache/builders/build-decorators';
export const SUBMISSION_ID: InjectionToken<string> = new InjectionToken<string>('submissionId');
export const CONFIG_DATA: InjectionToken<FormFieldModel> = new InjectionToken<FormFieldModel>('configData');
@@ -39,7 +40,6 @@ export abstract class FieldParser {
&& (this.configData.input.type !== 'list')
&& (this.configData.input.type !== 'tag')
&& (this.configData.input.type !== 'group')
&& isEmpty(this.configData.selectableRelationship)
) {
let arrayCounter = 0;
let fieldArrayCounter = 0;
@@ -48,10 +48,11 @@ export abstract class FieldParser {
id: uniqueId() + '_array',
label: this.configData.label,
initialCount: this.getInitArrayIndex(),
notRepeatable: !this.configData.repeatable,
notRepeatable: !this.configData.repeatable || hasValue(this.configData.selectableRelationship),
required: isNotEmpty(this.configData.mandatory),
groupFactory: () => {
let model;
console.log(arrayCounter);
if ((arrayCounter === 0)) {
model = this.modelFactory();
arrayCounter++;
@@ -85,7 +86,7 @@ export abstract class FieldParser {
} else {
const model = this.modelFactory(this.getInitFieldValue());
if (model.hasLanguages) {
if (model.hasLanguages || isNotEmpty(model.relationship)) {
setLayout(model, 'grid', 'control', 'col');
}
return model;

View File

@@ -48,10 +48,7 @@ import { LogOutComponent } from './log-out/log-out.component';
import { FormComponent } from './form/form.component';
import { DsDynamicTypeaheadComponent } from './form/builder/ds-dynamic-form-ui/models/typeahead/dynamic-typeahead.component';
import { DsDynamicScrollableDropdownComponent } from './form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component';
import {
DsDynamicFormControlContainerComponent,
dsDynamicFormControlMapFn
} from './form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component';
import { DsDynamicFormControlContainerComponent, dsDynamicFormControlMapFn } from './form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component';
import { DsDynamicFormComponent } from './form/builder/ds-dynamic-form-ui/ds-dynamic-form.component';
import { DYNAMIC_FORM_CONTROL_MAP_FN, DynamicFormsCoreModule } from '@ng-dynamic-forms/core';
import { DynamicFormsNGBootstrapUIModule } from '@ng-dynamic-forms/ui-ng-bootstrap';
@@ -176,7 +173,6 @@ import { MetadataRepresentationListComponent } from '../+item-page/simple/metada
import { SelectableListItemControlComponent } from './object-collection/shared/selectable-list-item-control/selectable-list-item-control.component';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { ExistingMetadataListElementComponent } from './form/builder/ds-dynamic-form-ui/existing-metadata-list-element/existing-metadata-list-element.component';
import { DsDynamicFormControlContainerWrapperComponent } from './form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container-wrapper/ds-dynamic-form-control-container-wrapper.component';
const MODULES = [
// Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -438,8 +434,7 @@ const DIRECTIVES = [
...ENTRY_COMPONENTS,
...SHARED_ITEM_PAGE_COMPONENTS,
PublicationSearchResultListElementComponent,
ExistingMetadataListElementComponent,
DsDynamicFormControlContainerWrapperComponent
ExistingMetadataListElementComponent
],
providers: [
...PROVIDERS