Enhancements for datatables datetime fields
This commit is contained in:
Jose Alberto Hernandez
committed by
Arnold Gálovics
Arnold Gálovics
parent
287f1f37e0
commit
dce82fa92d
@@ -10,15 +10,12 @@ import { DeleteDialogComponent } from '../../../../shared/delete-dialog/delete-d
|
||||
|
||||
/** Custom Models */
|
||||
import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
|
||||
import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
|
||||
import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
|
||||
import { CheckboxBase } from 'app/shared/form-dialog/formfield/model/checkbox-base';
|
||||
import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base';
|
||||
|
||||
/** Custom Services */
|
||||
import { GroupsService } from '../../../groups.service';
|
||||
import { SettingsService } from 'app/settings/settings.service';
|
||||
import { Dates } from 'app/core/utils/dates';
|
||||
import { Datatables } from 'app/core/utils/datatables';
|
||||
|
||||
/**
|
||||
* Group Multi Row Data Tables
|
||||
@@ -54,12 +51,14 @@ export class MultiRowComponent implements OnInit, OnChanges {
|
||||
* @param {GroupsService} groupsService Groups Service.
|
||||
* @param {MatDialog} dialog Mat Dialog.
|
||||
* @param {SettingsService} settingsService SettingsService
|
||||
* @param {Datatables} datatables Datatable utils
|
||||
*/
|
||||
constructor(private route: ActivatedRoute,
|
||||
private dateUtils: Dates,
|
||||
private groupsService: GroupsService,
|
||||
private dialog: MatDialog,
|
||||
private settingsService: SettingsService) {
|
||||
private settingsService: SettingsService,
|
||||
private datatables: Datatables) {
|
||||
this.groupId = this.route.parent.parent.snapshot.paramMap.get('groupId');
|
||||
}
|
||||
|
||||
@@ -93,56 +92,7 @@ export class MultiRowComponent implements OnInit, OnChanges {
|
||||
const columns = this.dataObject.columnHeaders.filter((column: any) => {
|
||||
return ((column.columnName !== 'id') && (column.columnName !== 'group_id'));
|
||||
});
|
||||
const formfields: FormfieldBase[] = columns.map((column: any) => {
|
||||
switch (column.columnDisplayType) {
|
||||
case 'INTEGER':
|
||||
case 'STRING':
|
||||
case 'DECIMAL':
|
||||
case 'TEXT': return new InputBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: (column.columnDisplayType === 'INTEGER' || column.columnDisplayType === 'DECIMAL') ? 'number' : 'text',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
case 'BOOLEAN': return new CheckboxBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: 'checkbox',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
case 'CODELOOKUP': return new SelectBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
options: { label: 'value', value: 'id', data: column.columnValues },
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
case 'DATE': {
|
||||
dateTransformColumns.push(column.columnName);
|
||||
dataTableEntryObject.dateFormat = 'yyyy-MM-dd';
|
||||
return new DatepickerBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: 'date',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
}
|
||||
case 'DATETIME': {
|
||||
dateTransformColumns.push(column.columnName);
|
||||
dataTableEntryObject.dateFormat = 'yyyy-MM-dd HH:mm';
|
||||
return new DatepickerBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: 'datetime-local',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
const formfields: FormfieldBase[] = this.datatables.getFormfields(columns, dateTransformColumns, dataTableEntryObject);
|
||||
const data = {
|
||||
title: 'Add ' + this.datatableName,
|
||||
formfields: formfields
|
||||
|
||||
@@ -9,15 +9,12 @@ import { DeleteDialogComponent } from '../../../../shared/delete-dialog/delete-d
|
||||
|
||||
/** Custom Models */
|
||||
import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
|
||||
import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
|
||||
import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base';
|
||||
import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
|
||||
import { CheckboxBase } from 'app/shared/form-dialog/formfield/model/checkbox-base';
|
||||
|
||||
/** Custom Services */
|
||||
import { GroupsService } from '../../../groups.service';
|
||||
import { SettingsService } from 'app/settings/settings.service';
|
||||
import { Dates } from 'app/core/utils/dates';
|
||||
import { Datatables } from 'app/core/utils/datatables';
|
||||
|
||||
/**
|
||||
* Groups Single Row Data Tables
|
||||
@@ -44,12 +41,14 @@ export class SingleRowComponent implements OnInit {
|
||||
* @param {GroupsService} groupsService Groups Service.
|
||||
* @param {MatDialog} dialog Mat Dialog.
|
||||
* @param {SettingsService} settingsService SettingsService
|
||||
* @param {Datatables} datatables Datatable utils
|
||||
*/
|
||||
constructor(private route: ActivatedRoute,
|
||||
private dateUtils: Dates,
|
||||
private dialog: MatDialog,
|
||||
private groupsService: GroupsService,
|
||||
private settingsService: SettingsService) {
|
||||
private settingsService: SettingsService,
|
||||
private datatables: Datatables) {
|
||||
this.groupId = this.route.parent.parent.snapshot.paramMap.get('groupId');
|
||||
}
|
||||
|
||||
@@ -70,9 +69,9 @@ export class SingleRowComponent implements OnInit {
|
||||
let dataTableEntryObject: any = { locale: this.settingsService.language.code };
|
||||
const dateTransformColumns: string[] = [];
|
||||
const columns = this.dataObject.columnHeaders.filter((column: any) => {
|
||||
return ((column.columnName !== 'id') && (column.columnName !== 'group_id'));
|
||||
return ((column.columnName !== 'id') && (column.columnName !== 'group_id') && (column.columnName !== 'created_at') && (column.columnName !== 'updated_at'));
|
||||
});
|
||||
const formfields: FormfieldBase[] = this.getFormfields(columns, dateTransformColumns, dataTableEntryObject);
|
||||
const formfields: FormfieldBase[] = this.datatables.getFormfields(columns, dateTransformColumns, dataTableEntryObject);
|
||||
const data = {
|
||||
title: 'Add ' + this.datatableName,
|
||||
formfields: formfields
|
||||
@@ -102,7 +101,7 @@ export class SingleRowComponent implements OnInit {
|
||||
const columns = this.dataObject.columnHeaders.filter((column: any) => {
|
||||
return ((column.columnName !== 'id') && (column.columnName !== 'group_id'));
|
||||
});
|
||||
let formfields: FormfieldBase[] = this.getFormfields(columns, dateTransformColumns, dataTableEntryObject);
|
||||
let formfields: FormfieldBase[] = this.datatables.getFormfields(columns, dateTransformColumns, dataTableEntryObject);
|
||||
formfields = formfields.map((formfield: FormfieldBase, index: number) => {
|
||||
formfield.value = (this.dataObject.data[0].row[index + 1]) ? this.dataObject.data[0].row[index + 1] : '';
|
||||
return formfield;
|
||||
@@ -147,63 +146,4 @@ export class SingleRowComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Maps API response to data table form fields.
|
||||
* @param {any} columns Data Table Columns.
|
||||
* @param {string[]} dateTransformColumns Columns transformed with Date Utils.
|
||||
* @param {any} dataTableEntryObject Additional data table details.
|
||||
*/
|
||||
getFormfields(columns: any, dateTransformColumns: string[], dataTableEntryObject: any) {
|
||||
return columns.map((column: any) => {
|
||||
switch (column.columnDisplayType) {
|
||||
case 'INTEGER':
|
||||
case 'STRING':
|
||||
case 'DECIMAL':
|
||||
case 'TEXT': return new InputBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: (column.columnDisplayType === 'INTEGER' || column.columnDisplayType === 'DECIMAL') ? 'number' : 'text',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
case 'BOOLEAN': return new CheckboxBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: 'checkbox',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
case 'CODELOOKUP': return new SelectBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
options: { label: 'value', value: 'id', data: column.columnValues },
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
case 'DATE': {
|
||||
dateTransformColumns.push(column.columnName);
|
||||
dataTableEntryObject.dateFormat = 'yyyy-MM-dd';
|
||||
return new DatepickerBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: 'date',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
}
|
||||
case 'DATETIME': {
|
||||
dateTransformColumns.push(column.columnName);
|
||||
dataTableEntryObject.dateFormat = 'yyyy-MM-dd HH:mm';
|
||||
return new DatepickerBase({
|
||||
controlName: column.columnName,
|
||||
label: column.columnName,
|
||||
value: '',
|
||||
type: 'datetime-local',
|
||||
required: (column.isColumnNullable) ? false : true
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user