export interface IDBMasterConfigFormField {
/** It is used to find element. */
hiddenId?: string;
label?: string;
/** This text will be displayed under control in small. HTML supported. */
helpText?: string;
path?: string;
control: EDBMasterFormControl;
/** if true, that control will take focus automatically. */
autofocus?: boolean;
/** if true, control will be disabled. If string provides, it will evaluate that string and enable/disable based on that. */
disabled?: boolean | string;
/** if true or undefined, control will be visible. If string provides, it will evaluate that string and make it visible/invisible based on that. */
visible?: boolean | string;
validations?: Pick<IPropertyValidation, 'required'>;
validationErrors?: {
required?: string;
};
textAreaSettings?: {
/** Give style object in angular style. */
style?: any;
placeholder?: string;
rows?: number;
autoResize?: boolean;
/** Maximum number of character allows in the input field. */
maxLength?: number;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterTextAreaAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
inputTextSettings?: {
/** Give style object in angular style. */
style?: any;
placeholder?: string;
/** Default is off */
autocomplete?: 'on' | 'off' | undefined;
/** Default is false */
spellcheck?: 'true' | 'false' | undefined;
/** Maximum number of character allows in the input field. */
maxLength?: number;
/** Minimum number of character allows in the input field. */
minLength?: number;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterInputTextAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
validationErrors?: {
minLength?: string;
};
};
/** Doc : https://primeng.org/inputnumber */
inputNumberSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
placeholder?: string;
min?: number;
max?: number;
minFractionDigits?: number;
mode?: 'decimal' | 'currency' | '';
/** The currency to use in currency formatting. Possible values are the ISO 4217 currency codes, such as "USD" for the US dollar, "EUR" for the euro, or "CNY" for the Chinese RMB. There is no default value; if the style is "currency", the currency property must be provided. */
currency?: string;
/** Default : 'en-US' */
locale?: string;
prefix?: string;
suffix?: string;
// buttons
showButtons?: boolean;
/** Default : stacked */
buttonLayout?: 'stacked' | 'horizontal' | 'vertical';
step?: number;
/** Whether to use grouping separators, such as thousands separators or thousand/lakh/crore separators. */
useGrouping?: boolean;
/** Maximum number of character allows in the input field. */
maxLength?: number;
/** Minimum number of character allows in the input field. */
minLength?: number;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterInputNumberAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
validationErrors?: {
minLength?: string;
};
};
inputMaskSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
/** Ex : mask="99-999999", mask="(999) 999-9999? x99999" <br/>
* Mask format can be a combination of the following definitions; <br/>
* a for alphabetic characters, <br/>
* 9 for numeric characters and <br/>
* * for alphanumeric characters. <br/>
* In addition, formatting characters like ( , ) , - are also accepted. <br/>
*
* ? is used to mark anything after the question mark optional. <br/>
* */
mask?: string;
/** Advisory information to display on input. */
placeholder?: string;
/** Ex : slotChar="mm/dd/yyyy" <br/>
* Default placeholder for a mask is underscore that can be customized using slotChar property.
* */
slotChar?: string;
/** Default : true, Clears the incomplete value on blur. */
autoClear?: boolean;
/** Maximum number of character allows in the input field. */
maxLength?: number;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterInputMaskAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
inputOtpSettings?: {
/** Give style object in angular style. */
style?: any;
/** Enable the mask option to hide the values in the input fields. */
mask?: boolean;
/** When integerOnly is present, only integers can be accepted as input. */
integerOnly?: boolean;
/** Default : 300px; */
uiControlWidth?: string;
/** Number of characters to initiate. */
length?: number;
};
inputPasswordSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
placeholder?: string;
/** Maximum number of character allows in the input field. */
maxLength?: number;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterInputPasswordAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
checkboxSettings?: {
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterCheckboxAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
radioSettings?: {
displayType?: 'inline' | 'new_line';
displayInCenter?: boolean;
options: { label: string; value: any }[];
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterRadioAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
/** It's value will be Date object. */
datePickerSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
placeholder?: string;
showSeconds?: boolean;
showTime?: boolean;
/** Default : 24 */
hourFormat?: '12' | '24';
/** ex: dd-MM-yyyy hh:mm:ss a */
dateTimeFormat?: string;
/** Whether to display timepicker only. Use hourFormat 12 to display AM/PM in UI. */
timeOnly?: boolean;
/** The minimum selectable date. */
minDate?: Date;
/** The maximum selectable date. */
maxDate?: Date;
/**
* Default : date
* Update dateTimeFormat for 'month'(MM-yyyy) & 'year'(yyyy) values.
*/
view?: 'date' | 'month' | 'year';
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterDatePickerAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
colorPickerSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
format?: 'hex' | 'rgb' | 'hsb';
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterColorPickerAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
dropdownSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
placeholder?: string;
showClear?: boolean;
dataSource: 'static_data' | 'db_data' | 'api_call'; // custom_code = We can call any API in that.
/** it will use used when dataSource is 'static_data'. */
staticData?: any[]; // { label: string; value: any; }[] works default.
/**
* it can pickup IDB values from schema also.
*/
dbData?: Partial<Pick<ICollectionIdentity, 'instance' | 'database' | 'collection' | 'table'>
& Pick<IQueryFormat, 'find' | 'select' | 'limit' | 'deep' | 'sort'>>;
/** Default : label */
optionLabel?: string;
/** Default : value */
optionValue?: string;
filter?: boolean;
/** one field or multiple comma separated fields are supported without any space in between. */
filterBy?: string;
filterMatchMode?: 'contains' | 'startsWith' | 'endsWith' | 'equals' | 'notEquals' | 'in' | 'lt' | 'lte' | 'gt' | 'gte';
/** Default : false, if true it will get latest data when form opens for add/edit operation. */
alwaysGetLatestDataOnFormOpen?: boolean;
/** Default : false, Make it true to handle huge amount of data. */
virtualScroll?: boolean;
/** on value change of current dropdown, it will change values of these dropdowns and reload them. */
reloadDropdownsOfPath?: string[];
/** API call will happen when these values of path are present in formData */
isDependentOnPath?: string[];
jsCode?: {
/**
* modifyDropdownRequest = It will run before hitting API call. So we can do whatever we want.<br/>
* onceDropdownDataLoaded = Execute code when dropdown data is loaded.<br/>
*
* Available variables:<br/>
* reqBody: IQueryFormat | any. Useful to modify apiCallOverrides also,<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* dropdownData: any[] = Latest loaded dropdown data<br/>
* reloadDropdownsOfPath: string[] = Add path to this variable to reload its dropdown data.<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent.<br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
*/
appendTo: EDBMasterDropdownAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
addNewFormConfig?: IDBMasterConfig;
apiCallOverrides?: IDBMasterAPICallOverrides;
};
autocompleteSettings?: {
dropdown?: boolean;
};
fileUploadSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
/** Default : false, When enabled, upload begins automatically after selection is completed. */
auto?: boolean;
/**
* API URL which will be used to upload files.<br/>
* API should return array of objects in below format.<br/>
* You can have other properties and below properties are required.
* [{
* originalName: string,
* uploadPath: string,
* }]
* API Maker's custom API will accept files in "files" form data field.
*
* */
uploadApiUrl: string;
/** API URL which returns content of file in base64 format. */
downloadApiUrl?: string;
removeApiUrl?: string;
/** Allow to select multiple files or not */
multiple?: boolean;
/** ex : image/* */
accept?: string;
/** Maximum file size allowed in bytes. Default : 10000000 (10MB) */
maxFileSize?: number;
/** Maximum number of files that can be uploaded. */
fileLimit?: number;
/** Internal use property to show/hide upload button on UI control. */
_showUploadButton?: boolean;
/** internal use only */
_fileSelectEvent?: any;
};
dividerSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
align?: 'center' | 'left' | 'right' | 'bottom' | 'top';
type?: 'dashed' | 'dotted' | 'solid';
dividerText?: string;
};
accordionSettings?: {
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
/** Index of the active tab or an array of indexes in multiple mode. */
activeIndex?: number | number[];
/** Default : 0, When form opens, this will be applied. */
defaultIndex?: number;
multiple?: boolean;
tabs: {
/** Give style object in angular style. */
style?: any;
/** Tab header, HTML is supported. */
header: string;
/** Give style object in angular style. */
headerStyle?: any;
/** You can provide single or multiple classes. */
headerCssClass?: string,
disabled?: boolean | string;
fields: IDBMasterConfigFormField[][];
}[];
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterAccordionAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
tabViewSettings?: {
/** Index of the active tab to change selected tab programmatically. */
activeIndex?: number;
/** Default : 0, When form opens, this will be applied. */
defaultIndex?: number;
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
tabs: {
/** Give style object in angular style. */
style?: any;
/** Tab header, HTML is supported. */
header: string;
/** Give style object in angular style. */
headerStyle?: any;
/** You can provide single or multiple classes. */
headerCssClass?: string,
disabled?: boolean;
fields: IDBMasterConfigFormField[][];
}[];
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterTabViewAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
buttonSettings?: {
/** button label text */
label: string;
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
/** Add a link style to the button. */
link?: boolean;
/** ex: pi pi-check , give icon to button */
icon?: string,
/** default : left */
iconPos?: 'left' | 'right' | 'top' | 'bottom';
/** Whether the button is in loading state. */
loading?: boolean;
/** Icon to display in loading state. */
loadingIcon?: string;
/** Defines the style of the button. */
severity?: uiMakerComponentSeverity | null | undefined;
/** Add a shadow to indicate elevation. */
raised?: boolean;
/** Add a circular border radius to the button. */
rounded?: boolean;
/** Add a textual class to the button without a background initially. */
text?: boolean;
/** Add a border class without a background initially. */
outlined?: boolean;
/** Value of the badge. */
badge?: string;
/** Style class of the badge. */
badgeClass?: string;
/** Style class of the badge. */
size?: 'small' | 'large' | undefined | null;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterButtonAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
imageSettings?: {
src: string;
/** Give style object in angular style. */
style?: any;
/** custom CSS class to assign to control */
cssClass?: string,
/** it will be assigned to span which is parent of image tag. */
imageParentSpanClass?: string,
/** Attribute of the image element. */
width?: string;
/** Attribute of the image element. */
height?: string;
/** Attribute of the preview image element. */
alt?: string;
/** Controls the preview functionality. */
preview?: boolean;
/** The source path for the preview image. */
previewImageSrc?: string;
jsCode?: {
/**
* Available variables:<br/>
* formData: any = Entire form object<br/>
* column: IDBMasterConfigFormField = Configuration of that form column. column.dropdownSettings?.dbData?.find will be query to get data. <br/>
* allDropdownDataMap: {[path: string]: any[]} = Map of all dropdown data<br/>
* globalData: any = User will send it using SET_GLOBAL_DATA_TO_USE_IN_ANY_SCRIPT event from parent. <br/>
* utils: any = Common utility functions for user to use. <br/>
* queryParams: any = Query params received from URL. <br/>
* config: IDBMasterConfigFormField <br/>
* event: any <br/>
*/
appendTo: EDBMasterImageAppendTo,
/**
* // dropdownData is available to use.
*
* // Return promise for long awaiting tasks.
* new Promise(async (resolve, reject) => {
* await new Promise(r => setTimeout(r, 3000));
* dropdownData[0].name = 'Sample data';
* resolve();
* });
*
* // Directly modify data of grid
* dropdownData[0].name = 'Sample data';
*
* // Return function
* (function setData() { dropdownData[0].name = 'Sample data'; } );
*
*/
code: string,
}[],
};
customHTMLSettings?: {
htmlCode: string;
};
}
export interface IPropertyValidation {
required?: boolean; // Allowed Types : *
min?: number; // Allowed Types : number | date
max?: number; // Allowed Types : number | date
minLength?: number; // Allowed Types : string
maxLength?: number; // Allowed Types : string
unique?: boolean;
email?: boolean; // Allowed Types : string
validatorFun?: Function;
}
export enum EDBMasterTextAreaAppendTo {
visible = 'visible',
disabled = 'disabled',
ngModelChange = 'ngModelChange',
focus = 'focus',
blur = 'blur',
keyUp = 'keyUp',
keyDown = 'keyDown',
}
export enum EDBMasterCheckboxAppendTo {
visible = 'visible',
disabled = 'disabled',
ngModelChange = 'ngModelChange',
}
export enum EDBMasterRadioAppendTo {
visible = 'visible',
disabled = 'disabled',
ngModelChange = 'ngModelChange',
}
export enum EDBMasterColorPickerAppendTo {
visible = 'visible',
disabled = 'disabled',
ngModelChange = 'ngModelChange',
}
export enum EDBMasterDatePickerAppendTo {
visible = 'visible',
disabled = 'disabled',
ngModelChange = 'ngModelChange',
focus = 'focus',
blur = 'blur',
}
export enum EDBMasterFileUploadAppendTo {
visible = 'visible',
disabled = 'disabled',
}
export enum EDBMasterGridAppendTo {
visible = 'visible',
disabled = 'disabled',
}
export enum EDBMasterConfigAppendTo {
oncePageLoad = 'oncePageLoad',
oncePageLoadWithContext = 'oncePageLoadWithContext',
gridRender = 'gridRender',
modifyGridRequest = 'modifyGridRequest',
/** run code before save & edit operation of form */
preSaveAndEdit = 'preSaveAndEdit',
beforeSaveModalOpen = 'beforeSaveModalOpen',
beforeEditModalOpen = 'beforeEditModalOpen',
beforeViewModalOpen = 'beforeViewModalOpen',
columnSelectionChanged = 'columnSelectionChanged',
}
export enum EDBMasterFormControl {
input = 'input',
inputNumber = 'inputNumber',
inputMask = 'inputMask',
inputOtp = 'inputOtp',
password = 'password',
date_picker = 'date_picker',
textarea = 'textarea',
checkbox = 'checkbox',
radio = 'radio',
color_picker = 'color_picker',
dropdown = 'dropdown',
file_upload = 'file_upload',
grid = 'grid',
divider = 'divider',
// Field holder controls
accordion = 'accordion',
tab_view = 'tab_view',
// utility controls
button = 'button',
image = 'image',
customHTML = 'customHTML',
}