156 lines
5.1 KiB
TypeScript
156 lines
5.1 KiB
TypeScript
import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';
|
|
import { FormGroup } from '@angular/forms';
|
|
import { FormlyFieldConfig } from '@ngx-formly/core'
|
|
import { ActivatedRoute, Router } from '@angular/router';
|
|
|
|
import { CrudService } from '../crud.service'
|
|
import {BehaviorSubject, NotFoundError} from "rxjs";
|
|
import { CrudFormlyJsonschemaService } from "../crud-formly-jsonschema.service";
|
|
import {NgbModal} from "@ng-bootstrap/ng-bootstrap";
|
|
|
|
@Component({
|
|
selector: 'crud-card',
|
|
templateUrl: './card.component.html',
|
|
styleUrls: ['./card.component.css']
|
|
})
|
|
export class CardComponent implements OnInit {
|
|
@Input() resource: string | undefined;
|
|
@Input() resource_id: string | null = null;
|
|
@Input() schema: string | undefined;
|
|
@Input() is_modal: Boolean = false;
|
|
|
|
private _model: {} = {};
|
|
|
|
@Input() set model(value: any) {
|
|
this._model = value;
|
|
if (Object.keys(this.form.controls).length) {
|
|
delete value._id;
|
|
this.form.patchValue(value);
|
|
}
|
|
}
|
|
|
|
get model(): any {
|
|
return this._model;
|
|
}
|
|
|
|
@Output() resourceCreated: EventEmitter<string> = new EventEmitter();
|
|
@Output() resourceUpdated: EventEmitter<string> = new EventEmitter();
|
|
@Output() resourceDeleted: EventEmitter<string> = new EventEmitter();
|
|
@Output() error: EventEmitter<string> = new EventEmitter();
|
|
@Output() resourceReceived: EventEmitter<any> = new EventEmitter();
|
|
|
|
form = new FormGroup({});
|
|
fields: FormlyFieldConfig[] = [];
|
|
|
|
schemas = JSON.parse(`{}`);
|
|
|
|
private _formLoading$ = new BehaviorSubject<boolean>(true);
|
|
private _modelLoading$ = new BehaviorSubject<boolean>(true);
|
|
|
|
get formLoading$() {
|
|
return this._formLoading$.asObservable();
|
|
}
|
|
|
|
get modelLoading$() {
|
|
return this._modelLoading$.asObservable();
|
|
}
|
|
|
|
get submitText() {
|
|
return this.isCreateForm() ? $localize`Create` : $localize`Update`
|
|
}
|
|
|
|
constructor(private crudService: CrudService,
|
|
private formlyJsonschema: CrudFormlyJsonschemaService,
|
|
private router: Router,
|
|
private route: ActivatedRoute,
|
|
private modalService: NgbModal,
|
|
) { }
|
|
|
|
ngOnInit(): void {
|
|
this._formLoading$.next(true);
|
|
this._modelLoading$.next(true);
|
|
let fields$;
|
|
if (this.isCreateForm()) {
|
|
this._modelLoading$.next(false);
|
|
fields$ = this.formlyJsonschema.getCreateFields(this.schema!);
|
|
} else {
|
|
this.crudService.get(this.resource!, this.resource_id!).subscribe({
|
|
next :(model: any) => {
|
|
this.model = model;
|
|
this._modelLoading$.next(false);
|
|
this.resourceReceived.emit(model);
|
|
},
|
|
error: (err) => this.error.emit("Error loading the model:" + err)
|
|
});
|
|
fields$ = this.formlyJsonschema.getUpdateFields(this.schema!);
|
|
}
|
|
|
|
fields$.subscribe({
|
|
next: (fields: any) => {
|
|
this.fields = [fields];
|
|
this._formLoading$.next(false);
|
|
},
|
|
error: (err) => this.error.emit("Error loading the form:" + err)
|
|
});
|
|
}
|
|
|
|
onSubmit(model: any) {
|
|
this._modelLoading$.next(true);
|
|
if (this.isCreateForm()) {
|
|
this.crudService.create(this.resource!, model).subscribe({
|
|
next: (response: any) => {
|
|
this._modelLoading$.next(false);
|
|
if (! this.is_modal) {
|
|
this.router.navigate([`../${response.id}`], {relativeTo: this.route});
|
|
} else {
|
|
this.resourceCreated.emit(response.id)
|
|
}
|
|
},
|
|
error: (err) => this.error.emit("Error creating the entity:" + err)
|
|
});
|
|
} else {
|
|
model._id = this.resource_id;
|
|
this.crudService.update(this.resource!, model).subscribe( {
|
|
next: (model: any) => {
|
|
this.resourceUpdated.emit(model._id);
|
|
this.resourceReceived.emit(model);
|
|
this.model = model;
|
|
this._modelLoading$.next(false);
|
|
},
|
|
error: (err) => this.error.emit("Error updating the entity:" + err)
|
|
});
|
|
}
|
|
}
|
|
|
|
onDelete() {
|
|
this._modelLoading$.next(true);
|
|
this.model._id = this.resource_id;
|
|
this.crudService.delete(this.resource!, this.model).subscribe({
|
|
next: (model: any) => {
|
|
this._modelLoading$.next(false);
|
|
if (! this.is_modal) {
|
|
this.router.navigate(['../'], {relativeTo: this.route});
|
|
} else {
|
|
this.resourceDeleted.emit("")
|
|
}
|
|
},
|
|
error: (err) => this.error.emit("Error deleting the entity:" + err)
|
|
});
|
|
}
|
|
|
|
onModelDuplicated(resource_id: string) {
|
|
this.modalService.dismissAll();
|
|
}
|
|
|
|
isCreateForm() {
|
|
return this.resource_id === null;
|
|
}
|
|
|
|
open(content: any) {
|
|
this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' }).result.then(
|
|
(result) => { this.onDelete() },
|
|
(reason) => {},
|
|
);
|
|
}
|
|
}
|