Moving customization to json level
This commit is contained in:
@@ -33,16 +33,22 @@ class ProvisionTemplate(CrudDocument):
|
|||||||
|
|
||||||
|
|
||||||
class ProvisionReference(BaseModel):
|
class ProvisionReference(BaseModel):
|
||||||
provision_template_id: str = Field(foreignKey={
|
provision_template_id: str = Field(
|
||||||
|
foreignKey={
|
||||||
"reference": {
|
"reference": {
|
||||||
"resource": "template/provision",
|
"resource": "template/provision",
|
||||||
"schema": "ProvisionTemplate",
|
"schema": "ProvisionTemplate",
|
||||||
}
|
},
|
||||||
})
|
},
|
||||||
|
props={"test": "test"}
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
class ContractTemplate(CrudDocument):
|
class ContractTemplate(CrudDocument):
|
||||||
name: str
|
name: str
|
||||||
parties: List[PartyTemplate] = []
|
parties: List[PartyTemplate] = []
|
||||||
provisions: List[ProvisionReference] = []
|
provisions: List[ProvisionReference] = Field(
|
||||||
|
default=[],
|
||||||
|
props={"items-per-row": "1"}
|
||||||
|
)
|
||||||
|
|
||||||
|
|||||||
@@ -1,17 +1,9 @@
|
|||||||
import { Component, OnInit, } from '@angular/core';
|
import { Component, OnInit, } from '@angular/core';
|
||||||
import { ActivatedRoute, ParamMap } from '@angular/router';
|
import { ActivatedRoute, ParamMap } from '@angular/router';
|
||||||
import { FieldCustomizer } from '@common/crud/card/card.component'
|
|
||||||
|
|
||||||
export class Customizer extends FieldCustomizer {
|
|
||||||
override customizers = {
|
|
||||||
"provisions": { props: { width: "col-sm-12" }},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class BaseContractTemplateComponent {
|
export class BaseContractTemplateComponent {
|
||||||
protected resource: string = "template/contract";
|
protected resource: string = "template/contract";
|
||||||
protected schema: string = "ContractTemplate";
|
protected schema: string = "ContractTemplate";
|
||||||
protected field_customizer: FieldCustomizer = new Customizer();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
@@ -21,13 +13,13 @@ export class ContractTemplateListComponent extends BaseContractTemplateComponent
|
|||||||
}
|
}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
template: '<crud-card [resource]="this.resource" [schema]="this.schema" [field_customizer]="this.field_customizer"></crud-card>'
|
template: '<crud-card [resource]="this.resource" [schema]="this.schema"></crud-card>'
|
||||||
})
|
})
|
||||||
export class ContractTemplateNewComponent extends BaseContractTemplateComponent {
|
export class ContractTemplateNewComponent extends BaseContractTemplateComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
template: '<crud-card [resource]="this.resource" [resource_id]="this.resource_id" [schema]="this.schema" [field_customizer]="this.field_customizer"></crud-card>'
|
template: '<crud-card [resource]="this.resource" [resource_id]="this.resource_id" [schema]="this.schema"></crud-card>'
|
||||||
})
|
})
|
||||||
export class ContractTemplateCardComponent extends BaseContractTemplateComponent implements OnInit {
|
export class ContractTemplateCardComponent extends BaseContractTemplateComponent implements OnInit {
|
||||||
resource_id: string | null = null;
|
resource_id: string | null = null;
|
||||||
|
|||||||
@@ -7,45 +7,6 @@ import { CrudService } from '../crud.service'
|
|||||||
import {BehaviorSubject, NotFoundError} from "rxjs";
|
import {BehaviorSubject, NotFoundError} from "rxjs";
|
||||||
import { CrudFormlyJsonschemaService } from "../crud-formly-jsonschema.service";
|
import { CrudFormlyJsonschemaService } from "../crud-formly-jsonschema.service";
|
||||||
|
|
||||||
export class FieldCustomizer {
|
|
||||||
protected customizers = {};
|
|
||||||
|
|
||||||
applyCustomizers(form: FormlyFieldConfig[]): FormlyFieldConfig[] {
|
|
||||||
for (const [property, customizer] of Object.entries(this.customizers)) {
|
|
||||||
const f = this.getFieldByPath(form, property);
|
|
||||||
this.apply(f, customizer)
|
|
||||||
}
|
|
||||||
return form
|
|
||||||
}
|
|
||||||
|
|
||||||
apply(field: FormlyFieldConfig, customizer: any) {
|
|
||||||
if (customizer.hasOwnProperty("props")) {
|
|
||||||
for (const [property, value] of Object.entries(customizer.props)) {
|
|
||||||
field.props![property] = value;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
getFieldByPath(form: FormlyFieldConfig[], path: string): FormlyFieldConfig {
|
|
||||||
let field = form[0];
|
|
||||||
let array = path.split('.');
|
|
||||||
for (const k in array) {
|
|
||||||
field = this.getFieldByKey(field, array[k])
|
|
||||||
}
|
|
||||||
|
|
||||||
return field;
|
|
||||||
}
|
|
||||||
|
|
||||||
getFieldByKey(field: FormlyFieldConfig, key: string): FormlyFieldConfig {
|
|
||||||
for (let i=0; i < field.fieldGroup!.length; i++) {
|
|
||||||
if (field.fieldGroup![i].key == key) {
|
|
||||||
return field.fieldGroup![i]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
throw new NotFoundError(`field ${key} not found in fieldgroup`)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'crud-card',
|
selector: 'crud-card',
|
||||||
templateUrl: './card.component.html',
|
templateUrl: './card.component.html',
|
||||||
@@ -55,7 +16,6 @@ export class CardComponent implements OnInit {
|
|||||||
@Input() resource: string | undefined;
|
@Input() resource: string | undefined;
|
||||||
@Input() resource_id: string | null = null;
|
@Input() resource_id: string | null = null;
|
||||||
@Input() schema: string | undefined;
|
@Input() schema: string | undefined;
|
||||||
@Input() field_customizer: FieldCustomizer = new FieldCustomizer();
|
|
||||||
@Input() is_modal: Boolean = false;
|
@Input() is_modal: Boolean = false;
|
||||||
|
|
||||||
@Output() resourceCreated: EventEmitter<string> = new EventEmitter();
|
@Output() resourceCreated: EventEmitter<string> = new EventEmitter();
|
||||||
@@ -101,7 +61,7 @@ export class CardComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
fields$.subscribe((fields: any) => {
|
fields$.subscribe((fields: any) => {
|
||||||
this.fields = this.field_customizer.applyCustomizers([fields]);
|
this.fields = [fields];
|
||||||
this._formLoading$.next(false);
|
this._formLoading$.next(false);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -47,6 +47,10 @@ export class CrudFormlyJsonschemaOptions implements FormlyJsonschemaOptions {
|
|||||||
field.type = "hidden";
|
field.type = "hidden";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (schema.hasOwnProperty('props')) {
|
||||||
|
field.props = {...field.props, ...schema.props}
|
||||||
|
}
|
||||||
|
|
||||||
return field;
|
return field;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -32,8 +32,8 @@ import { FieldArrayType } from '@ngx-formly/core';
|
|||||||
export class ArrayTypeComponent extends FieldArrayType implements OnInit {
|
export class ArrayTypeComponent extends FieldArrayType implements OnInit {
|
||||||
colSm: string = "col-sm-6"
|
colSm: string = "col-sm-6"
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
if (this.field.props.hasOwnProperty('width')) {
|
if (this.field.props.hasOwnProperty('items-per-row')) {
|
||||||
this.colSm = this.field.props['width'];
|
this.colSm = `col-sm-${12 / this.field.props['items-per-row']}`
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user