Separating schema and resource names in frontend for more genericity

This commit is contained in:
2023-01-28 14:27:52 +01:00
parent 8951826e8e
commit 6f19f75a0b
6 changed files with 48 additions and 23 deletions

View File

@@ -35,7 +35,7 @@ class Employee(BaseModel):
entity_id: str = Field(foreignKey={
"reference": {
"resource": "entity",
"displayName": "_id",
"schema": "Entity",
"condition": "entity_data.type=individual"
}
})

View File

@@ -8,23 +8,24 @@ import { getStyle, rgbToHex } from '@coreui/utils/src';
export class BaseEntitiesComponent {
protected resource: string = "Entity";
protected resource: string = "entity";
protected schema: string = "Entity";
}
@Component({
template: '<crud-list [resource]="this.resource"></crud-list>'
template: '<crud-list [resource]="this.resource" [schema]="this.schema"></crud-list>'
})
export class EntityListComponent extends BaseEntitiesComponent{
}
@Component({
template: '<crud-card [resource]="this.resource"></crud-card>'
template: '<crud-card [resource]="this.resource" [schema]="this.schema"></crud-card>'
})
export class EntityNewComponent extends BaseEntitiesComponent {
}
@Component({
template: '<crud-card [resource]="this.resource" [resource_id]="this.resource_id"></crud-card>'
template: '<crud-card [resource]="this.resource" [resource_id]="this.resource_id" [schema]="this.schema"></crud-card>'
})
export class EntityCardComponent extends BaseEntitiesComponent implements OnInit {

View File

@@ -1,6 +1,6 @@
<div>
<form cForm [formGroup]="form" (ngSubmit)="onSubmit(model)">
<span class="col col-form-label" *ngIf="loading$ | async">Loading...</span>
<span class="col col-form-label" *ngIf="formLoading$ || modelLoading$ | async">Loading...</span>
<formly-form [form]="form" [fields]="fields" [model]="model"></formly-form>
<button class="btn btn-success btn-lg" type="submit" [disabled]="!form.valid">
{{ this.isCreateForm() ? "Create" : "Update" }}

View File

@@ -19,6 +19,7 @@ export interface Model {
export class CardComponent implements OnInit {
@Input() resource: string | undefined;
@Input() resource_id: string | null = null;
@Input() schema: string | undefined;
@Input() is_modal: Boolean = false;
@Output() resourceCreated: EventEmitter<string> = new EventEmitter();
@@ -31,11 +32,16 @@ export class CardComponent implements OnInit {
schemas = JSON.parse(`{}`);
private _loading$ = new BehaviorSubject<boolean>(true);
private _formLoading$ = new BehaviorSubject<boolean>(true);
private _modelLoading$ = new BehaviorSubject<boolean>(true);
get loading$() {
return this._loading$.asObservable();
}
get formLoading$() {
return this._formLoading$.asObservable();
}
get modelLoading$() {
return this._modelLoading$.asObservable();
}
constructor(private crudService: CrudService,
private formlyJsonschema: CrudFormlyJsonschemaService,
@@ -44,28 +50,31 @@ export class CardComponent implements OnInit {
) { }
ngOnInit(): void {
this._loading$.next(true);
this._formLoading$.next(true);
this._modelLoading$.next(true);
let fields$;
if (this.isCreateForm()) {
fields$ = this.formlyJsonschema.getCreateFields(this.resource!);
this._modelLoading$.next(false);
fields$ = this.formlyJsonschema.getCreateFields(this.schema!);
} else {
this.crudService.get(this.resource!, this.resource_id!).subscribe((model: any) => {
this.model = model
this._loading$.next(false);
this.model = model;
this._modelLoading$.next(false);
});
fields$ = this.formlyJsonschema.getUpdateFields(this.resource!);
fields$ = this.formlyJsonschema.getUpdateFields(this.schema!);
}
fields$.subscribe((fields: any) => {
this.fields = [fields]
this._formLoading$.next(false);
});
}
onSubmit(model: any) {
this._loading$.next(true);
this._modelLoading$.next(true);
if (this.isCreateForm()) {
this.crudService.create(this.resource!, model).subscribe((response: any) => {
this._loading$.next(false);
this._modelLoading$.next(false);
if (! this.is_modal) {
this.router.navigate([`../${response.id}`], {relativeTo: this.route});
} else {
@@ -75,15 +84,15 @@ export class CardComponent implements OnInit {
} else {
this.crudService.update(this.resource!, model).subscribe((model: any) => {
this.model = model;
this._loading$.next(false);
this._modelLoading$.next(false);
});
}
}
onDelete() {
this._loading$.next(true);
this._modelLoading$.next(true);
this.crudService.delete(this.resource!, this.model).subscribe((model: any) => {
this._loading$.next(false);
this._modelLoading$.next(false);
if (! this.is_modal) {
this.router.navigate(['../'], {relativeTo: this.route});
} else {

View File

@@ -27,6 +27,7 @@ interface State {
export class ListComponent implements OnInit {
@Input() resource: string = "";
@Input() columns: string[] = [];
@Input() schema: string | undefined;
public displayedColumns: string[] = [];
@@ -41,7 +42,7 @@ export class ListComponent implements OnInit {
) { }
ngOnInit(): void {
this.jsonSchemasService.getUpdateResource(this.resource!).subscribe((schemas: any) => {
this.jsonSchemasService.getUpdateResource(this.schema!).subscribe((schemas: any) => {
if (this.columns.length == 0) {
for (let param_name in schemas.properties) {
if (param_name != "_id") {

View File

@@ -55,8 +55,19 @@ import {formatDate} from "@angular/common";
(click)="modal.dismiss('Cross click')"></button>
</div>
<div class="modal-body">
<crud-card *ngIf="this.hasValue()" [resource]="this.foreignResource" [resource_id]="this.foreignModel._id" [is_modal]="true" (resourceDeleted)="onResourceDeleted($event)"></crud-card>
<crud-card *ngIf="! this.hasValue()" [resource]="this.foreignResource" [is_modal]="true" (resourceCreated)="onResourceCreated($event)"></crud-card>
<crud-card *ngIf="this.hasValue()"
[resource]="this.foreignResource"
[resource_id]="this.foreignModel._id"
[schema]="this.foreignSchema"
[is_modal]="true"
(resourceDeleted)="onResourceDeleted($event)">
</crud-card>
<crud-card *ngIf="! this.hasValue()"
[resource]="this.foreignResource"
[schema]="this.foreignSchema"
[is_modal]="true"
(resourceCreated)="onResourceCreated($event)">
</crud-card>
</div>
<div class="modal-footer">
</div>
@@ -68,6 +79,7 @@ export class ForeignkeyTypeComponent extends FieldType<FieldTypeConfig> implemen
public foreignModel: any = {}
public foreignLabel: string = ""
public foreignResource : string = "";
public foreignSchema : string = "";
public errorMsg: string = "";
public displayModal = false;
@@ -85,6 +97,8 @@ export class ForeignkeyTypeComponent extends FieldType<FieldTypeConfig> implemen
ngOnInit() {
// @ts-ignore
this.foreignResource = this.field.foreignKey.reference.resource;
// @ts-ignore
this.foreignSchema = this.field.foreignKey.reference.schema;
if (this.hasValue()) {
this.getResource(this.formControl.value)
}