json import ui
This commit is contained in:
amentis
parent
6fca0402fb
commit
0c1c68372f
|
|
@ -1,7 +1,7 @@
|
|||
import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { IsActive } from '@app/core/common/enum/is-active.enum';
|
||||
import { DmpBlueprint, DmpBlueprintDefinitionSection, DmpBlueprintPersist, NewVersionDmpBlueprintPersist } from '@app/core/model/dmp-blueprint/dmp-blueprint';
|
||||
import { DescriptionTemplatesInSection, DmpBlueprint, DmpBlueprintDefinition, DmpBlueprintDefinitionSection, DmpBlueprintPersist, NewVersionDmpBlueprintPersist } from '@app/core/model/dmp-blueprint/dmp-blueprint';
|
||||
import { DmpBlueprintLookup } from '@app/core/query/dmp-blueprint.lookup';
|
||||
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
||||
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
|
||||
|
|
@ -18,13 +18,15 @@ import { BaseHttpV2Service } from '../http/base-http-v2.service';
|
|||
import { DmpBlueprintStatus } from '@app/core/common/enum/dmp-blueprint-status';
|
||||
import { error } from 'console';
|
||||
import { DmpBlueprintVersionStatus } from '@app/core/common/enum/dmp-blueprint-version-status';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
|
||||
@Injectable()
|
||||
export class DmpBlueprintService {
|
||||
|
||||
private headers = new HttpHeaders();
|
||||
|
||||
constructor(private http: BaseHttpV2Service, private httpClient: HttpClient, private configurationService: ConfigurationService, private filterService: FilterService) {
|
||||
constructor(private http: BaseHttpV2Service, private httpClient: HttpClient, private configurationService: ConfigurationService, private filterService: FilterService, private language: TranslateService,
|
||||
) {
|
||||
}
|
||||
|
||||
private get apiBase(): string { return `${this.configurationService.server}dmp-blueprint`; }
|
||||
|
|
@ -141,6 +143,41 @@ export class DmpBlueprintService {
|
|||
return lookup;
|
||||
}
|
||||
|
||||
// Finalized Blueprint with definitions Single AutoComplete
|
||||
singleAutocompleteBlueprintConfiguration: SingleAutoCompleteConfiguration = {
|
||||
initialItems: (data?: any) => this.query(this.buildAutocompleteWithDefinitonLookup(null, null, null, [DmpBlueprintStatus.Finalized])).pipe(map(x => x.items)),
|
||||
filterFn: (searchQuery: string, data?: any) => this.query(this.buildAutocompleteWithDefinitonLookup(searchQuery, null, null, [DmpBlueprintStatus.Finalized])).pipe(map(x => x.items)),
|
||||
getSelectedItem: (selectedItem: any) => this.query(this.buildAutocompleteWithDefinitonLookup(null, null, [selectedItem])).pipe(map(x => x.items[0])),
|
||||
displayFn: (item: DmpBlueprint) => item.label,
|
||||
subtitleFn: (item: DmpBlueprint) => this.language.instant('DMP-EDITOR.FIELDS.DMP-BLUEPRINT-VERSION') + ' '+ item.version,
|
||||
titleFn: (item: DmpBlueprint) => item.label,
|
||||
valueAssign: (item: DmpBlueprint) => item.id,
|
||||
};
|
||||
|
||||
public buildAutocompleteWithDefinitonLookup(like?: string, excludedIds?: Guid[], ids?: Guid[], statuses?: DmpBlueprintStatus[]): DmpBlueprintLookup {
|
||||
const lookup: DmpBlueprintLookup = new DmpBlueprintLookup();
|
||||
lookup.page = { size: 100, offset: 0 };
|
||||
if (excludedIds && excludedIds.length > 0) { lookup.excludedIds = excludedIds; }
|
||||
if (ids && ids.length > 0) { lookup.ids = ids; }
|
||||
lookup.isActive = [IsActive.Active];
|
||||
lookup.statuses = statuses;
|
||||
lookup.project = {
|
||||
fields: [
|
||||
nameof<DmpBlueprint>(x => x.id),
|
||||
nameof<DmpBlueprint>(x => x.label),
|
||||
nameof<DmpBlueprint>(x => x.version),
|
||||
[nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.id)].join('.'),
|
||||
[nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.label)].join('.'),
|
||||
[nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.hasTemplates)].join('.'),
|
||||
[nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.descriptionTemplateGroupId)].join('.'),
|
||||
]
|
||||
};
|
||||
lookup.order = { items: [nameof<DmpBlueprint>(x => x.label)] };
|
||||
lookup.versionStatuses = [DmpBlueprintVersionStatus.Previous, DmpBlueprintVersionStatus.Current];
|
||||
if (like) { lookup.like = this.filterService.transformLike(like); }
|
||||
return lookup;
|
||||
}
|
||||
|
||||
//
|
||||
//
|
||||
// UI Helpers
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ import { AuthService } from '../auth/auth.service';
|
|||
import { ConfigurationService } from '../configuration/configuration.service';
|
||||
import { BaseHttpV2Service } from '../http/base-http-v2.service';
|
||||
import { DmpValidationResult } from '@app/ui/dmp/dmp-finalize-dialog/dmp-finalize-dialog.component';
|
||||
import { DmpCommonModelConfig, PreprocessingDmpModel } from '@app/core/model/dmp/dmp-import';
|
||||
|
||||
@Injectable()
|
||||
export class DmpService {
|
||||
|
|
@ -197,26 +198,25 @@ export class DmpService {
|
|||
catchError((error: any) => throwError(error)));;
|
||||
}
|
||||
|
||||
uploadJson(file: File, label: string, repositoryId: string, format: string, reqFields: string[] = []): Observable<Dmp> {
|
||||
const url = `${this.apiBase}/json/import`;
|
||||
preprocessingDmp(fileId: Guid, repositoryId: string): Observable<PreprocessingDmpModel> {
|
||||
const url = `${this.apiBase}/json/preprocessing`;
|
||||
const params = new BaseHttpParams();
|
||||
|
||||
params.interceptorContext = {
|
||||
excludedInterceptors: [InterceptorType.JSONContentType]
|
||||
};
|
||||
const formData = new FormData();
|
||||
formData.append('file', file);
|
||||
formData.append('label', label);
|
||||
formData.append('fileId', fileId.toString());
|
||||
formData.append('repositoryId', repositoryId);
|
||||
formData.append('format', format);
|
||||
|
||||
if (reqFields.length > 0){
|
||||
for (var i = 0; i < reqFields.length; i++) {
|
||||
formData.append('field[]', reqFields[i]);
|
||||
}
|
||||
}
|
||||
return this.http.post<PreprocessingDmpModel>(url, formData, { params: params }).pipe(catchError((error: any) => throwError(error)));
|
||||
}
|
||||
|
||||
uploadJson(item: DmpCommonModelConfig, reqFields: string[] = []): Observable<Dmp> {
|
||||
const url = `${this.apiBase}/json/import`;
|
||||
|
||||
return this.http.post<Dmp>(url, item).pipe(catchError((error: any) => throwError(error)));
|
||||
|
||||
return this.http.post<Dmp>(url, formData, { params: params }).pipe(catchError((error: any) => throwError(error)));
|
||||
}
|
||||
|
||||
//
|
||||
|
|
|
|||
|
|
@ -79,8 +79,8 @@ export class StartNewDmpDialogComponent extends BaseComponent {
|
|||
},
|
||||
(error) => this.onCallbackImportFail(error.error)
|
||||
);
|
||||
} else if (file?.type.includes('/json')){
|
||||
this.dmpService.uploadJson(result.fileList[0], result.dmpTitle, 'rda-file-transformer', 'json')
|
||||
} else if (file?.type.includes('/json') && result.dmpCommonModelConfig){
|
||||
this.dmpService.uploadJson(result.dmpCommonModelConfig)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(
|
||||
(complete) => {
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
</div>
|
||||
<div class="">
|
||||
<div class="upload-form col-12 pr-0 pl-0">
|
||||
<mat-form-field class="w-100">
|
||||
<input class="uploadInput" [(ngModel)]="dmpTitle" matInput placeholder="{{'DMP-UPLOAD.PLACEHOLDER' | translate}}" name="uploadFileInput">
|
||||
<mat-form-field class="w-100" *ngIf="files?.length == 0 || files[0].type.includes('/xml')">
|
||||
<input [(ngModel)]="dmpTitle" matInput placeholder="{{'DMP-UPLOAD.PLACEHOLDER' | translate}}">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="col-12 pr-0 pl-0">
|
||||
|
|
@ -30,14 +30,38 @@
|
|||
<input class="hidden" #fileInput type="file" onClick="this.form.reset()" (change)="uploadFile($event)" accept="text/xml, application/json">
|
||||
</form>
|
||||
</div>
|
||||
<!-- <div class="upload-form col-sm-12 col-md-12">
|
||||
<mat-form-field>
|
||||
<mat-label>{{'DMP-EDITOR.FIELDS.DATASET-TEMPLATES' | translate}}</mat-label>
|
||||
<app-multiple-auto-complete [(ngModel)]="dmpBlueprints" [configuration]="profilesAutoCompleteConfiguration" (optionActionClicked)="onPreviewTemplate($event)">
|
||||
<app-multiple-auto-complete required='true' [(ngModel)]="dmpBlueprints" placeholder="{{'DMP-EDITOR.FIELDS.DATASET-TEMPLATES' | translate}}" [configuration]="profilesAutoCompleteConfiguration" (optionActionClicked)="onPreviewTemplate($event)">
|
||||
</app-multiple-auto-complete>
|
||||
<div class="upload-form col-12 pr-0 pl-0" *ngIf="formGroup && files.length > 0 && files[0].type.includes('/json')">
|
||||
<mat-form-field class="w-100">
|
||||
<input [formControl]="formGroup.get('label')" matInput placeholder="{{'DMP-UPLOAD.PLACEHOLDER' | translate}}">
|
||||
</mat-form-field>
|
||||
</div> -->
|
||||
<mat-form-field class="w-100">
|
||||
<app-single-auto-complete [required]="true" [formControl]="formGroup.get('blueprintId')" placeholder="{{'DMP-UPLOAD.FIELDS.BLUEPRINT-PLACEHOLDER' | translate}}" [configuration]="dmpBlueprintService.singleAutocompleteBlueprintConfiguration" (optionSelected)="selectedBlueprintChanged($event)">
|
||||
</app-single-auto-complete>
|
||||
</mat-form-field>
|
||||
<ng-container *ngIf="formGroup.get('blueprintId').value">
|
||||
<div *ngFor="let description of formGroup.get('descriptions').controls; let fieldIndex=index;" class="row mb-3">
|
||||
<span *ngIf="description.get('label').value" style="font-size: 1rem;">
|
||||
{{ description.get('label').value }}
|
||||
</span>
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-UPLOAD.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
|
||||
<app-single-auto-complete placeholder="{{'DMP-UPLOAD.FIELDS.DESCRIPTION-TEMPLATE-PLACHOLDER' | translate}}" [formControl]="description.get('templateId')" [configuration]="descriptionTemplateSingleAutocompleteConfiguration"></app-single-auto-complete>
|
||||
<mat-error *ngIf="description.get('templateId').hasError('backendError')">{{description.get('templateId').getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="description.get('templateId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="w-100">
|
||||
<mat-label>{{'DMP-UPLOAD.FIELDS.SECTION' | translate}}</mat-label>
|
||||
<mat-select [formControl]="description.get('sectionId')" placeholder="{{'DMP-UPLOAD.FIELDS.SECTION-PLACEHOLDER' | translate}}">
|
||||
<mat-option *ngFor="let section of selectedBlueprintSections" [value]="section.id">
|
||||
<span style="font-size: 1rem;">
|
||||
{{ section.label }}
|
||||
</span>
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<div></div>
|
||||
|
|
@ -46,7 +70,7 @@
|
|||
<button mat-button type="button" class="cancel-btn" (click)="cancel()">{{'DMP-UPLOAD.ACTIONS.CANCEL' | translate}}</button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button mat-button type="button" (click)="confirm()" [disabled]="data.fileList.length === 0 || files.length === 0" class="next-btn">{{'DMP-UPLOAD.ACTIONS.IMPORT' | translate}}</button>
|
||||
<button mat-button type="button" (click)="confirm()" [disabled]="disableConfirmButton()" class="next-btn">{{'DMP-UPLOAD.ACTIONS.IMPORT' | translate}}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,12 +2,22 @@ import { HttpClient } from '@angular/common/http';
|
|||
import { Component, Inject } from '@angular/core';
|
||||
import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog';
|
||||
import { DescriptionTemplate } from '@app/core/model/description-template/description-template';
|
||||
import { DmpBlueprint, DmpBlueprintDefinitionSection } from '@app/core/model/dmp-blueprint/dmp-blueprint';
|
||||
import { DmpBlueprintService } from '@app/core/services/dmp/dmp-blueprint.service';
|
||||
import { DmpService } from '@app/core/services/dmp/dmp.service';
|
||||
import { AnalyticsService } from '@app/core/services/matomo/analytics-service';
|
||||
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
||||
import { BaseComponent } from '@common/base/base.component';
|
||||
import { Observable } from 'rxjs';
|
||||
import { map } from 'rxjs/operators';
|
||||
import { map, takeUntil } from 'rxjs/operators';
|
||||
import { DmpImportRdaConfigEditorModel } from './dmp-common-model-config.editor.model';
|
||||
import { UntypedFormArray, UntypedFormGroup } from '@angular/forms';
|
||||
import { DescriptionTemplateService } from '@app/core/services/description-template/description-template.service';
|
||||
import { FormService } from '@common/forms/form-service';
|
||||
import { DmpCommonModelConfig } from '@app/core/model/dmp/dmp-import';
|
||||
import { StorageFileService } from '@app/core/services/storage-file/storage-file.service';
|
||||
import { IsActive } from '@notification-service/core/enum/is-active.enum';
|
||||
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
|
||||
|
||||
@Component({
|
||||
selector: 'dmp-upload-dialog',
|
||||
|
|
@ -18,13 +28,17 @@ export class DmpUploadDialogComponent extends BaseComponent {
|
|||
dmpTitle: string;
|
||||
dmpBlueprints: any[] = [];
|
||||
files: File[] = [];
|
||||
selectedBlueprintSections: DmpBlueprintDefinitionSection[];
|
||||
formGroup: UntypedFormGroup;
|
||||
|
||||
profilesAutoCompleteConfiguration: MultipleAutoCompleteConfiguration = {
|
||||
filterFn: this.filterProfiles.bind(this),
|
||||
initialItems: (excludedItems: any[]) => this.filterProfiles('').pipe(map(result => result.filter(resultItem => (excludedItems || []).map(x => x.id).indexOf(resultItem.id) === -1))),
|
||||
displayFn: (item) => item['label'],
|
||||
titleFn: (item) => item['label'],
|
||||
subtitleFn: (item) => item['description'],
|
||||
descriptionTemplateSingleAutocompleteConfiguration: SingleAutoCompleteConfiguration = {
|
||||
initialItems: (data?: any) => this.descriptionTemplateService.query(this.descriptionTemplateService.buildDescriptionTempalteGroupAutocompleteLookup([IsActive.Active])).pipe(map(x => x.items)),
|
||||
filterFn: (searchQuery: string, data?: any) => this.descriptionTemplateService.query(this.descriptionTemplateService.buildDescriptionTempalteGroupAutocompleteLookup([IsActive.Active], searchQuery)).pipe(map(x => x.items)),
|
||||
getSelectedItem: (selectedItem: any) => this.descriptionTemplateService.query(this.descriptionTemplateService.buildDescriptionTempalteGroupAutocompleteLookup([IsActive.Active, IsActive.Inactive], null, null, [selectedItem])).pipe(map(x => x.items[0])),
|
||||
displayFn: (item: DescriptionTemplate) => item.label,
|
||||
titleFn: (item: DescriptionTemplate) => item.label,
|
||||
subtitleFn: (item: DescriptionTemplate) => item.description,
|
||||
valueAssign: (item: DescriptionTemplate) => item.id,
|
||||
popupItemActionIcon: 'visibility'
|
||||
};
|
||||
|
||||
|
|
@ -35,6 +49,11 @@ export class DmpUploadDialogComponent extends BaseComponent {
|
|||
private dialog: MatDialog,
|
||||
private httpClient: HttpClient,
|
||||
private analyticsService: AnalyticsService,
|
||||
private formService: FormService,
|
||||
public descriptionTemplateService: DescriptionTemplateService,
|
||||
public dmpBlueprintService: DmpBlueprintService,
|
||||
private dmpService: DmpService,
|
||||
private storageFileStorage: StorageFileService,
|
||||
|
||||
@Inject(MAT_DIALOG_DATA) public data: any,
|
||||
) {
|
||||
|
|
@ -58,9 +77,20 @@ export class DmpUploadDialogComponent extends BaseComponent {
|
|||
this.data.success = true;
|
||||
this.data.dmpTitle = this.dmpTitle;
|
||||
this.data.dmpBlueprints = this.dmpBlueprints;
|
||||
|
||||
if (this.files.length > 0 && this.files[0].type.includes('/json') && this.formGroup && this.formGroup.valid){
|
||||
this.data.dmpCommonModelConfig = this.formService.getValue(this.formGroup.value) as DmpCommonModelConfig;
|
||||
this.data.dmpCommonModelConfig.file = this.files[0];
|
||||
}
|
||||
this.dialogRef.close(this.data);
|
||||
}
|
||||
|
||||
disableConfirmButton(){
|
||||
if (this.data.fileList.length === 0 || this.files.length === 0) return true;
|
||||
if (this.files.length > 0 && this.files[0].type.includes('/json') && this.formGroup && this.formGroup.invalid) return true;
|
||||
return false;
|
||||
}
|
||||
|
||||
uploadFile(event) {
|
||||
const fileList: FileList = event.target.files
|
||||
this.data.fileList = fileList;
|
||||
|
|
@ -71,6 +101,26 @@ export class DmpUploadDialogComponent extends BaseComponent {
|
|||
this.files.splice(0, 1);
|
||||
}
|
||||
this.files.push(...event.target.files);
|
||||
|
||||
if (this.files.length > 0 && this.files[0].type.includes('/json')){
|
||||
this.storageFileStorage.uploadTempFiles(fileList[0])
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(
|
||||
(storageFile) => {
|
||||
if (storageFile.length >0 ){
|
||||
this.dmpService.preprocessingDmp(storageFile[0].id, 'rda-file-transformer')
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(
|
||||
(preprocessingData) => {
|
||||
this.formGroup = new DmpImportRdaConfigEditorModel().fromModel(preprocessingData, storageFile[0].id,).buildForm();
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
selectFile(event) {
|
||||
|
|
@ -90,14 +140,14 @@ export class DmpUploadDialogComponent extends BaseComponent {
|
|||
this.dmpTitle = null;
|
||||
}
|
||||
|
||||
filterProfiles(value: string): Observable<DescriptionTemplate[]> {
|
||||
// TODO refactor
|
||||
// const request = new DataTableRequest<DatasetProfileCriteria>(null, null, { fields: ['+label'] });
|
||||
// const criteria = new DatasetProfileCriteria();
|
||||
// criteria.like = value;
|
||||
// request.criteria = criteria;
|
||||
// return this._service.searchDmpBlueprints(request);
|
||||
return null;
|
||||
selectedBlueprintChanged(item: DmpBlueprint): void{
|
||||
this.selectedBlueprintSections = item.definition?.sections?.filter(x => x.hasTemplates) || null;
|
||||
if (this.formGroup){
|
||||
const descriptionsFormArray = this.formGroup.get('descriptions') as UntypedFormArray;
|
||||
descriptionsFormArray.controls.forEach( control =>{
|
||||
control.get('sectionId').patchValue(null);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
hasFile(): boolean {
|
||||
|
|
|
|||
|
|
@ -4,12 +4,16 @@ import { CommonFormsModule } from '@common/forms/common-forms.module';
|
|||
import { CommonUiModule } from '@common/ui/common-ui.module';
|
||||
import { NgxDropzoneModule } from 'ngx-dropzone';
|
||||
import { DmpUploadDialogComponent } from './dmp-upload-dialog.component';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
import { AutoCompleteModule } from '@app/library/auto-complete/auto-complete.module';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonUiModule,
|
||||
CommonFormsModule,
|
||||
FormattingModule,
|
||||
ReactiveFormsModule,
|
||||
AutoCompleteModule,
|
||||
NgxDropzoneModule
|
||||
],
|
||||
declarations: [
|
||||
|
|
|
|||
|
|
@ -699,6 +699,13 @@
|
|||
"DMP-UPLOAD": {
|
||||
"TITLE": "Import Plan",
|
||||
"UPLOAD-SUCCESS": "Import was Successful",
|
||||
"FIELDS": {
|
||||
"BLUEPRINT-PLACEHOLDER": "Select Plan Blueprint",
|
||||
"DESCRIPTION-TEMPLATE": "Description Template",
|
||||
"DESCRIPTION-TEMPLATE-PLACHOLDER": "Select description template",
|
||||
"SECTION": "Plan Section",
|
||||
"SECTION-PLACEHOLDER": "Select plan section"
|
||||
},
|
||||
"ACTIONS": {
|
||||
"IMPORT": "Import",
|
||||
"CANCEL": "Cancel"
|
||||
|
|
|
|||
Loading…
Reference in New Issue