Available only in PRO Edition
Эта функциональность доступна только в PRO версии.
Расширение gantt.ext.formatters предлагает два удобных метода для форматирования:
Вы также можете создать пользовательский форматтер, используя предоставленные в качестве основы.
Метод gantt.ext.formatters.durationFormatter(config) создает новый экземпляр DurationFormatter.
Примеры:
Как настроить Форматтер Длительности с настройками по умолчанию:
const formatter = gantt.ext.formatters.durationFormatter();
// создает экземпляр объекта форматтера с использованием фабричного метода
formatter.parse("1"); // обрабатывает значение как 1 день, если enter:"day" (по умолчанию)
formatter.parse("1"); // обрабатывает значение как 1 час, если enter:"hour"
formatter.parse("1 day"); // хранит значение как 8, если store:"hour"
formatter.parse("1 day"); // хранит значение как 480, если store:"minute"
gantt.ext.formatters.durationFormatter({
format: ["hour", "minute"], store:"minute"
}).format(260); // 4 hours 20 minutes
gantt.ext.formatters.durationFormatter({
format: "hour", store:"minute"
}).format(260); // 4.33 hours
gantt.ext.formatters.durationFormatter({
format: ["week", "hour", "minute"],
store:"minute",
short: false }).format(10021); // "4 weeks 7 hours 1 minute"
gantt.ext.formatters.durationFormatter({
format: ["week", "hour", "minute"],
store:"minute",
short: true }).format(10021); // "4wk 7h 1min"
Пример полной конфигурации:
const formatter = gantt.ext.formatters.durationFormatter({
// значения по умолчанию
enter: "day",
store: "hour",
format: "auto",
short: false,
minutesPerHour: 60,
hoursPerDay: 8,
hoursPerWeek: 40,
daysPerMonth: 30,
daysPerYear: 365,
labels: {
minute: {
full: "minute",
plural: "minutes",
short: "min"
},
hour: {
full: "hour",
plural: "hours",
short: "h"
},
day: {
full: "day",
plural: "days",
short: "d"
},
week: {
full: "week",
plural: "weeks",
short: "wk"
},
month: {
full: "month",
plural: "months",
short: "mon"
},
year: {
full: "year",
plural: "years",
short: "y"
}
}
});
Экземпляр DurationFormatter предоставляет следующие методы:
const formatter = gantt.ext.formatters.durationFormatter();
console.log(formatter.canParse("1 day"));
// true
console.log(formatter.canParse("abc"));
// false
const formatter = gantt.ext.formatters.durationFormatter();
console.log(formatter.format(24));
// 3 days
const formatter = gantt.ext.formatters.durationFormatter();
console.log(formatter.parse("1 day"));
// 8
Для получения более подробной информации обратитесь к статье durationFormatter в Расчет Рабочего Времени.
Метод gantt.ext.formatters.linkFormatter(config) создает новый экземпляр LinkFormatter. Он делится некоторыми методами и опциями конфигурации с Форматтером Длительности.
Примеры:
Как настроить Форматтер Ссылок с настройками по умолчанию:
const formatter = gantt.ext.formatters.linkFormatter();
// создает экземпляр объекта форматтера с использованием фабричного метода
gantt.ext.formatters.linkFormatter()
.format({id:1, type:"1", source: 1, target: 2, lag: 5});
// "1SS+5 days"
var durationFormatter = gantt.ext.formatters.durationFormatter({
short: true
});
gantt.ext.formatters.linkFormatter({durationFormatter: durationFormatter})
.format({id:1, type:"2", source: 1, target: 2, lag: -1});
// "1FF-1d"
const formatter = gantt.ext.formatters.linkFormatter({
// значения по умолчанию
durationFormatter: gantt.ext.formatters.durationFormatter(),
labels: {
finish_to_start: "FS",
start_to_start: "SS",
finish_to_finish: "FF",
start_to_finish: "SF"
}
});
Экземпляр LinkFormatter предоставляет следующие методы:
const formatter = gantt.ext.formatters.linkFormatter();
console.log(formatter.canParse("1FS + 1 day"));
// true
console.log(formatter.canParse("abc"));
// false
const formatter = gantt.ext.formatters.linkFormatter();
formatter.format({id:1, type:"1", source: 1, target: 2, lag: 5});
// "1SS+5 days"
const formatter = gantt.ext.formatters.linkFormatter();
formatter.parse("1SS+5 days");
// {id:1, type:"1", source: 1, target: null, lag: 5}
LinkFormatter поддерживает два формата ссылок:
const formatter = gantt.ext.formatters.linkFormatter();
console.log(formatter.parse("1.1"));
// {id:1, type:"0", source: 2, target: 3, lag: 0}
console.log(formatter.format({id:2, type:"0", source: 1, target: 3, lag: 0}));
// 1.1
const formatter = gantt.ext.formatters.linkFormatter();
console.log(formatter.parse("1.1SS + 1 day"));
// {id:1, type:"1", source: 2, target: null, lag: 1}
console.log(formatter.format({id:1, type:"1", source: 2, target: 3, lag: 1}));
// 1.1SS + 1 day
Ссылки типа "Finish-To-Start" без задержки или преимущества форматируются с использованием короткого формата, в то время как другие типы ссылок используют полный формат. Аналогично, если в метод parse передан только код WBS, форматтер предполагает тип "Finish-to-Start" с нулевой задержкой.
Для получения более подробной информации о методе linkFormatter, обратитесь к статье Редактирование в гриде.
Гантт позволяет создавать пользовательские форматтеры на основе существующих. Эти пользовательские форматтеры могут быть добавлены в встроенный редактор. Внутренне, Гантт будет хранить данные в своем стандартном формате, но при открытии встроенного редактора он будет отображать значение в нужном формате.
Пользовательские форматтеры — это объекты, содержащие две функции: format() и parse().
Вот как выглядят пользовательские форматтеры:
const customDurationFormatter = {
format: function (duration) {
let formattedDuration;
// логика преобразования числа в нужный формат
return formattedDuration;
},
parse: function (formattedValue) {
let duration;
// логика преобразования нужного формата обратно в число
return duration;
}
};
const customLinkFormatter = {
format: function (link) {
let formattedLink;
// логика преобразования объекта ссылки в нужный формат
return formattedLink;
},
parse: function (formattedValue) {
let link;
// логика преобразования нужного формата обратно в объект ссылки
return link;
}
};
Существующие форматтеры также могут быть включены в пользовательские форматтеры, с модификацией их вывода по мере необходимости.
Для назначения пользовательских форматтеров встроенным редакторам процесс такой же, как и для стандартных форматтеров. Например:
const durationEditor = {
type: "duration", map_to: "duration", formatter: customDurationFormatter
};
Вот пример того, как могут быть реализованы пользовательские форматтеры длительности и ссылок:
Related sample: Custom duration and link formatters
Конфигурация по умолчанию для Форматтера Длительности поддерживает только одну множественную форму для существительных, что хорошо работает для английского языка, так как множественное число обычно образуется добавлением суффикса или изменением существительного.
Однако в других языках может быть несколько множественных форм с различными правилами их использования. Чтобы решить эту проблему, можно создать пользовательский форматтер, который определяет соответствующие правила для конкретного языка. Например, вот как можно применить пользовательские правила образования множественного числа для японского языка:
Related sample: Custom duration formatter with different plural values for Japanese locale
К началу