I have defined a column of End dates, but the current format of End Date is different from the previous format of Start/Finish. How can I make it display the same format as Start/Finish
export default class FinishColumn extends Column {
static get $name() {
return 'FinishColumn';
}
static get type() {
return 'finishcolumn';
}
static get isGanttColumn() {
return true;
}
static get defaults() {
return {
// Set your default instance config properties here
field : 'finish',
text : 'End Date',
format: 'YYYY-MM-DD',
type:'Date',
cellCls : 'b-status-column-cell',
htmlEncode : false,
// filterable : {
// filterField : {
// type : 'combo',
// items : ['Not Started', 'Started', 'Completed', 'Late']
// }
// }
};
}
//endregion
renderer({ record }) {
console.log(record)
const finish = record.finish;
return finish ? {
tag : 'i',
className : `b-fa b-fa-circle ${finish}`,
html : finish
} : '';
}
}
ColumnStore.registerColumnType(FinishColumn);
Attachments
屏幕截图 2022-09-29 095439.png (23.76 KiB) Viewed 401 times
Because I want to display a custom date, but the format should be the same as the previous one, according to this method format still does not seem to work, our data format and the previous date format is the same
I added a field in date format, schaefflerEndDate is the field name in the data, now there is a problem
When I double-click on this field to edit, it shows a different date than the actual date
import { Column, ColumnStore } from '@bryntum/gantt/gantt.lite.umd.js';
import { DateHelper } from '@bryntum/gantt/gantt.lite.umd.js';
/**
* @module StatusColumn
*/
/**
* A column showing the status of a task
*
* @extends Gantt/column/Column
* @classType statuscolumn
*/
export default class FinishColumn extends Column {
static get $name() {
return 'FinishColumn';
}
static get type() {
return 'finishcolumn';
}
static get isGanttColumn() {
return true;
}
static get defaults() {
return {
field: 'schaefflerEndDate',
text: 'Finish Date',
editor: {
type: 'DateField',
},
renderer({ value }) {
console.log(value)
},
htmlEncode: false,
};
}
//endregion
renderer({ record, ...data }) {
console.log(record.schaefflerEndDate)
const finish = DateHelper.format(new Date(record.schaefflerEndDate), 'MMM DD, YYYY');
return finish ? {
tag: 'i',
className: `b-fa ${finish}`,
html: finish
} : '';
}
}
ColumnStore.registerColumnType(FinishColumn);