|
@@ -0,0 +1,162 @@
|
|
|
+
|
|
|
+ * MetaData models for Form Fields
|
|
|
+ * -------------------------------
|
|
|
+ * Keep in one file for now, but maybe split if this grows too large
|
|
|
+ **********************************************************************************************************************/
|
|
|
+
|
|
|
+import { ValidatorFn, AsyncValidatorFn } from '@angular/forms';
|
|
|
+import { ValueTransformer } from '@components/dropdown-modified-input/dropdown-modified-input.component';
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+type Option = {
|
|
|
+ label: string,
|
|
|
+ value: string
|
|
|
+}
|
|
|
+
|
|
|
+interface BasicFieldMetaData {
|
|
|
+ name: string
|
|
|
+ origin?: string
|
|
|
+ type?: string
|
|
|
+ label?: string
|
|
|
+ value?: string
|
|
|
+ placeholder?: string
|
|
|
+ class?: string | Array<string>
|
|
|
+ id?: string
|
|
|
+ isDisabled?: boolean
|
|
|
+ validators?: Array<ValidatorFn>
|
|
|
+ asyncValidators?: Array<AsyncValidatorFn>
|
|
|
+ valFailureMsgs?: StringMap
|
|
|
+}
|
|
|
+
|
|
|
+interface OptionsFieldMetaData extends BasicFieldMetaData {
|
|
|
+ options: Option[]
|
|
|
+}
|
|
|
+
|
|
|
+interface DropdownModifiedInputFieldMetaData extends OptionsFieldMetaData {
|
|
|
+ modifiers: string[]
|
|
|
+ transform: ValueTransformer
|
|
|
+}
|
|
|
+
|
|
|
+interface TimePickerFieldMetaData extends BasicFieldMetaData {
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+class BasicField
|
|
|
+{
|
|
|
+ name: string;
|
|
|
+ origin?: string;
|
|
|
+ type: string = 'Basicinput';
|
|
|
+ label?: string;
|
|
|
+ value: string = '';
|
|
|
+ placeholder: string = '';
|
|
|
+ class?: string | Array<string>;
|
|
|
+ isDisabled?: boolean;
|
|
|
+ validators: Array<ValidatorFn> = [];
|
|
|
+ asyncValidators: Array<AsyncValidatorFn> = [];
|
|
|
+ valFailureMsgs: StringMap = {};
|
|
|
+
|
|
|
+ constructor(meta: BasicFieldMetaData) {
|
|
|
+ Object.assign(this, meta);
|
|
|
+ if (!this.origin) {
|
|
|
+
|
|
|
+ this.origin = this.name;
|
|
|
+ }
|
|
|
+ if (!this.label) {
|
|
|
+
|
|
|
+
|
|
|
+ this.label = this.name.replace(/([A-Z])/g, ' $1').replace(/^./, s => s.toUpperCase());
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+class OptionsField extends BasicField
|
|
|
+{
|
|
|
+ options: Option[];
|
|
|
+ constructor(meta: OptionsFieldMetaData) {
|
|
|
+ super(meta);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+class DropdownModifiedInputField extends OptionsField
|
|
|
+{
|
|
|
+ modifiers: string[]
|
|
|
+ transform: ValueTransformer;
|
|
|
+ constructor(meta: DropdownModifiedInputFieldMetaData) {
|
|
|
+ super(meta);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+class TimePickerField extends BasicField
|
|
|
+{
|
|
|
+
|
|
|
+ constructor(meta: TimePickerFieldMetaData) {
|
|
|
+ super(meta);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+export { BasicField, OptionsField, DropdownModifiedInputField, TimePickerField };
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ * Usage
|
|
|
+ * Just ideas here for reference at the moment
|
|
|
+ **********************************************************************************************************************/
|
|
|
+
|
|
|
+
|
|
|
+ (1) Approach 1: Loop through model and 'lazily generate' the metadata. Something like...
|
|
|
+
|
|
|
+ overrides = {
|
|
|
+ field3: {
|
|
|
+ type: Chechkbutton,
|
|
|
+ label: 'Friendly Name'
|
|
|
+ }
|
|
|
+ }
|
|
|
+modeledMeta = {};
|
|
|
+for (field in model) {
|
|
|
+ if (field in overrides) {
|
|
|
+ Object.assign(modeledMeta, FieldFactory(model, overrides[field]));
|
|
|
+ } else {
|
|
|
+ Object.assign(modeledMeta, new BasicField(field));
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ (2) Apprach 2: Meta-data fully specified (not lazily-generated), so loop through metadata genetating field models
|
|
|
+ metaspec may be hard-coded (for now) or loaded from server and cached, as part of app boostraping
|
|
|
+
|
|
|
+ metaspac = {
|
|
|
+
|
|
|
+ }
|
|
|
+ modeledMeta = {}
|
|
|
+ for (field in metaspec) {
|
|
|
+ Object.assign(modeledMeta, FieldFactory(model, metaspec[field]));
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ ...
|
|
|
+ Then pass modeledMeta to dynamic form generator / layout, etc
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|