argos/dmp-frontend/src/app/ui/admin/reference-type/editor/reference-type-editor.compo...

361 lines
14 KiB
TypeScript

import { Component, OnInit } from '@angular/core';
import { FormArray, UntypedFormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Router } from '@angular/router';
import { ReferenceTypeService } from '@app/core/services/reference-type/reference-type.service';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
// import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item';
import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
import { DatePipe } from '@angular/common';
import { IsActive } from '@app/core/common/enum/is-active.enum';
import { AppPermission } from '@app/core/common/enum/permission.enum';
import { ReferenceType, ReferenceTypePersist, ResultFieldsMappingConfiguration } from '@app/core/model/reference-type/reference-type';
import { AuthService } from '@app/core/services/auth/auth.service';
import { LoggingService } from '@app/core/services/logging/logging-service';
import { QueryParamsService } from '@app/core/services/utilities/query-params.service';
import { BaseEditor } from '@common/base/base-editor';
import { FormService } from '@common/forms/form-service';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { HttpErrorHandlingService } from '@common/modules/errors/error-handling/http-error-handling.service';
import { FilterService } from '@common/modules/text-filter/filter-service';
import { Guid } from '@common/types/guid';
import { TranslateService } from '@ngx-translate/core';
import { map, takeUntil } from 'rxjs/operators';
import { ReferenceTypeEditorResolver } from './reference-type-editor.resolver';
import { ReferenceTypeEditorService } from './reference-type-editor.service';
import { QueryConfigEditorModel, ReferenceTypeEditorModel, ReferenceTypeFieldEditorModel, ReferenceTypeSourceBaseConfigurationEditorModel, ReferenceTypeStaticOptionEditorModel, ResultFieldsMappingConfigurationEditorModel } from './reference-type-editor.model';
import { ReferenceFieldDataType } from '@app/core/common/enum/reference-field-data-type';
import { ReferenceTypeSourceType } from '@app/core/common/enum/reference-type-source-type';
import { ReferenceTypeExternalApiHTTPMethodType } from '@app/core/common/enum/reference-type-external-api-http-method-type';
export interface visibleDataType {
name: string;
type: ReferenceFieldDataType;
}
export interface visibleSourceType {
name: string;
type: ReferenceTypeSourceType;
}
export interface visibleHTTPMethodType {
name: string;
type: ReferenceTypeExternalApiHTTPMethodType;
}
@Component({
selector: 'app-reference-type-editor-component',
templateUrl: 'reference-type-editor.component.html',
styleUrls: ['./reference-type-editor.component.scss'],
providers: [ReferenceTypeEditorService]
})
export class ReferenceTypeEditorComponent extends BaseEditor<ReferenceTypeEditorModel, ReferenceType> implements OnInit {
isNew = true;
isDeleted = false;
formGroup: UntypedFormGroup = null;
showInactiveDetails = false;
protected get canDelete(): boolean {
return !this.isDeleted && !this.isNew && this.hasPermission(this.authService.permissionEnum.DeleteReferenceType);
}
protected get canSave(): boolean {
return !this.isDeleted && this.hasPermission(this.authService.permissionEnum.EditReferenceType);
}
protected get canFinalize(): boolean {
return !this.isDeleted && this.hasPermission(this.authService.permissionEnum.EditReferenceType);
}
private hasPermission(permission: AppPermission): boolean {
return this.authService.hasPermission(permission) || this.editorModel?.permissions?.includes(permission);
}
constructor(
// BaseFormEditor injected dependencies
protected dialog: MatDialog,
protected language: TranslateService,
protected formService: FormService,
protected router: Router,
protected uiNotificationService: UiNotificationService,
protected httpErrorHandlingService: HttpErrorHandlingService,
protected filterService: FilterService,
protected datePipe: DatePipe,
protected route: ActivatedRoute,
protected queryParamsService: QueryParamsService,
// Rest dependencies. Inject any other needed deps here:
public authService: AuthService,
public enumUtils: EnumUtils,
private referenceTypeService: ReferenceTypeService,
private logger: LoggingService,
private referenceTypeEditorService: ReferenceTypeEditorService
) {
super(dialog, language, formService, router, uiNotificationService, httpErrorHandlingService, filterService, datePipe, route, queryParamsService);
}
visibleDataTypes: visibleDataType[] = [
{name: "Text", type: ReferenceFieldDataType.Text},
{name: "Date", type: ReferenceFieldDataType.Date},
]
visibleSourceTypes: visibleSourceType[] = [
{name: "API", type: ReferenceTypeSourceType.API},
{name: "Static", type: ReferenceTypeSourceType.STATIC},
]
visibleHTTPMethodTypes: visibleHTTPMethodType[] = [
{name: "GET", type: ReferenceTypeExternalApiHTTPMethodType.GET},
{name: "POST", type: ReferenceTypeExternalApiHTTPMethodType.POST},
]
systemFieldsMapping: string[] = ['reference_id', 'label', 'description'];
ngOnInit(): void {
super.ngOnInit();
if((this.formGroup.get('definition').get('sources') as FormArray).length == 0){
this.addSource();
}
}
getItem(itemId: Guid, successFunction: (item: ReferenceType) => void) {
this.referenceTypeService.getSingle(itemId, ReferenceTypeEditorResolver.lookupFields())
.pipe(map(data => data as ReferenceType), takeUntil(this._destroyed))
.subscribe(
data => successFunction(data),
error => this.onCallbackError(error)
);
}
prepareForm(data: ReferenceType) {
try {
this.editorModel = data ? new ReferenceTypeEditorModel().fromModel(data) : new ReferenceTypeEditorModel();
this.isDeleted = data ? data.isActive === IsActive.Inactive : false;
this.buildForm();
} catch (error) {
this.logger.error('Could not parse referenceType item: ' + data + error);
this.uiNotificationService.snackBarNotification(this.language.instant('COMMONS.ERRORS.DEFAULT'), SnackBarNotificationLevel.Error);
}
}
buildForm() {
this.formGroup = this.editorModel.buildForm(null, this.isDeleted || !this.authService.hasPermission(AppPermission.EditReferenceType));
this.referenceTypeEditorService.setValidationErrorModel(this.editorModel.validationErrorModel);
}
refreshData(): void {
this.getItem(this.editorModel.id, (data: ReferenceType) => this.prepareForm(data));
}
refreshOnNavigateToData(id?: Guid): void {
this.formGroup.markAsPristine();
let route = [];
if (id === null) {
route.push('../..');
} else if (this.isNew) {
route.push('../' + id);
} else {
route.push('..');
}
this.router.navigate(route, { queryParams: { 'lookup': this.queryParamsService.serializeLookup(this.lookupParams), 'lv': ++this.lv }, replaceUrl: true, relativeTo: this.route });
}
persistEntity(onSuccess?: (response) => void): void {
const formData = this.formService.getValue(this.formGroup.value) as ReferenceTypePersist;
console.log(formData);
this.referenceTypeService.persist(formData)
.pipe(takeUntil(this._destroyed)).subscribe(
complete => onSuccess ? onSuccess(complete) : this.onCallbackSuccess(complete),
error => this.onCallbackError(error)
);
}
formSubmit(): void {
this.formService.touchAllFormFields(this.formGroup);
if (!this.isFormValid()) {
return;
}
this.persistEntity();
}
public delete() {
const value = this.formGroup.value;
if (value.id) {
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
maxWidth: '300px',
data: {
message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CONFIRM'),
cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL')
}
});
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
if (result) {
this.referenceTypeService.delete(value.id).pipe(takeUntil(this._destroyed))
.subscribe(
complete => this.onCallbackSuccess(),
error => this.onCallbackError(error)
);
}
});
}
}
clearErrorModel() {
this.editorModel.validationErrorModel.clear();
this.formService.validateAllFormFields(this.formGroup);
}
//
//
// fields
//
//
addField(): void {
const field: ReferenceTypeFieldEditorModel = new ReferenceTypeFieldEditorModel();
(this.formGroup.get('definition').get('fields') as FormArray).push(field.buildForm());
// const fieldIndex = (this.formGroup.get('definition').get('fields') as FormArray).length - 1;
// if(((this.formGroup.get('definition').get('fields') as FormArray).at(fieldIndex) as FormArray).get('code').valid){
// }
}
removeField(fieldIndex: number): void {
(this.formGroup.get('definition').get('fields') as FormArray).removeAt(fieldIndex);
}
dropFields(event: CdkDragDrop<string[]>) {
const fieldssFormArray = (this.formGroup.get('definition').get('fields') as FormArray);
moveItemInArray(fieldssFormArray.controls, event.previousIndex, event.currentIndex);
fieldssFormArray.updateValueAndValidity();
}
submitFields(): void{
const fieldssFormArray = (this.formGroup.get('definition').get('fields') as FormArray);
if (fieldssFormArray.valid){
const sourceSize = (this.formGroup.get('definition').get('sources') as FormArray).length;
if(sourceSize && sourceSize > 0){
for(let i =0; i < sourceSize; i++){
this.addFieldMapping(i, fieldssFormArray.at(i).get('code').value);
this.addOption(i, fieldssFormArray.at(i).get('code').value);
}
}
}
}
addSource(): void{
const source: ReferenceTypeSourceBaseConfigurationEditorModel = new ReferenceTypeSourceBaseConfigurationEditorModel();
(this.formGroup.get('definition').get('sources') as FormArray).push(source.buildForm());
const sourceIndex = (this.formGroup.get('definition').get('sources') as FormArray).length - 1;
this.systemFieldsMapping.forEach(x => {
this.addFieldMapping(sourceIndex, null);
this.addOption(sourceIndex, null);
});
const fieldsSize = (this.formGroup.get('definition').get('fields') as FormArray).length;
if(fieldsSize && fieldsSize > 0){
for(let i =0; i < fieldsSize; i++){
this.addFieldMapping(sourceIndex, null);
this.addOption(sourceIndex, null);
}
}
}
removeSource(sourceIndex: number): void {
(this.formGroup.get('definition').get('sources') as FormArray).removeAt(sourceIndex);
}
//
//
// resultFieldsMapping
//
//
addFieldMapping(sourceIndex: number, code: string): void {
const fieldMapping: ResultFieldsMappingConfigurationEditorModel = new ResultFieldsMappingConfigurationEditorModel();
//((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('results').get('fieldsMapping') as FormArray).push(fieldMapping.buildForm());
const fieldMappingSize = ((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('results').get('fieldsMapping') as FormArray).length;
if (fieldMappingSize>0){
for(let i=0; i<fieldMappingSize; i++){
if(((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('results').get('fieldsMapping') as FormArray).at(i).get('code').value == code){
console.log('error');
return;
};
}
}
((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('results').get('fieldsMapping') as FormArray).push(fieldMapping.buildForm());
((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('results').get('fieldsMapping') as FormArray).at(fieldMappingSize).get('code').setValue('1');
}
removeFieldMapping(sourceIndex: number, fieldMappingIndex: number): void {
const formArray = ((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex) as FormArray);
(formArray.get('results').get('fieldsMapping') as FormArray).removeAt(fieldMappingIndex);
}
dropFieldsMapping(event: CdkDragDrop<string[]>) {
const fieldssFormArray = (this.formGroup.get('definition').get('sources').get('fieldsMapping') as FormArray);
moveItemInArray(fieldssFormArray.controls, event.previousIndex, event.currentIndex);
fieldssFormArray.updateValueAndValidity();
}
//
//
// queries
//
//
addQuery(sourceIndex: number): void {
const query: QueryConfigEditorModel = new QueryConfigEditorModel();
((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('queries') as FormArray).push(query.buildForm());
}
removeQuery(sourceIndex: number, fieldMappingIndex: number): void {
const formArray = ((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('queries') as FormArray);
formArray.removeAt(fieldMappingIndex);
}
dropQueries(event: CdkDragDrop<string[]>) {
const fieldssFormArray = (this.formGroup.get('definition').get('sources').get('queries') as FormArray);
moveItemInArray(fieldssFormArray.controls, event.previousIndex, event.currentIndex);
fieldssFormArray.updateValueAndValidity();
}
// Options
addOption(sourceIndex: number, code: string): void {
const options: ReferenceTypeStaticOptionEditorModel = new ReferenceTypeStaticOptionEditorModel();
const optionsSize = ((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('options') as FormArray).length;
if (optionsSize>0){
for(let i=0; i<optionsSize; i++){
if(((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('options') as FormArray).at(i).get('code').value == code){
console.log('error');
return;
};
}
}
((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('options') as FormArray).push(options.buildForm());
((this.formGroup.get('definition').get('sources') as FormArray).at(sourceIndex).get('options') as FormArray).at(optionsSize).get('code').setValue('1');
}
}