Локализация Gantt

По умолчанию все ярлыки Gantt на английском языке. Некоторые из них можно перевести на желаемый язык:

  • названия операций (edit, delete);
  • ярлыки кнопок;
  • сообщения о подтверждении.

В пакете Gantt присутствует только en-US локаль. Ознакомьтесь с нашим репозиторием. Здесь вы можете найти интересующую вас локаль или же создать свою.

Структура локалей

Названия хранятся в объекте:

export default {
    Edit: "Edit",
    Done: "Done",
    "Delete task": "Delete task",
    "Delete link": "Delete link",
    "The task will be deleted permanently, are you sure?":
        "The task will be deleted permanently, are you sure?",
    "The link will be deleted permanently, are you sure?":
        "The link will be deleted permanently, are you sure?",
    Predecessors: "Predecessors",
    Successors: "Successors",
 
    Title: "Title",
    "Start date": "Start date",
    "End date": "End date",
    Duration: "Duration",
    Progress: "Progress",
    Notes: "Notes",
    Type: "Type",
    Project: "Project",
    Milestone: "Milestone",
    "Add task": "Add task",
    "Add project": "Add project",
    "(no title)": "(no title)",
    "Save changes?": "Save changes?",
 
    "Related tasks": "Related tasks",
    Task: "Task",
    Link: "Link",
    "End to start": "End to start",
    "Start to start": "Start to start",
    "End to end": "End to end",
    "Start to end": "Start to end",
 
    Lasts: "Lasts",
    day: "day",
    days: "days",
 
    "Add assignment": "Add assignment",
    Assignments: "Assignments",
    Assigned: "Assigned",
    "Delete assignment": "Delete assignment",
    "Are you sure to delete this assignment?":
        "Are you sure to delete this assignment?",
    "No resources to add": "No resources to add",
    Unassigned: "Unassigned",
 
    hour: "h",
    "Hours per": "Hours per",
    "Tasks per": "Tasks per",
    Name: "Name",
    Hours: "Hours",
    Tasks: "Tasks",
    month: "month",
    week: "week",
    quarter: "quarter",
    year: "year",
};

Как задать свою локаль

Чтобы изменить локаль по умолчанию, необходимо:

  • создать локаль с переводами внутри объекта gantt.locales следующим образом:
// Перевод на русский
gantt.locales.ru = {
  "Add task": "Добавить задачу",
  "Add project": "Добавить проект",
};
  • задать текущую локаль для Gantt с помощью свойства locale внутри конструктора:
// настройка скролла (необязательно)
if (!webix.env.touch && webix.env.scrollSize) 
  webix.CustomScroll.init();
 
webix.ui({
  view: "gantt",
  locale: {
    lang: "ru",
    webix: {
      // переводим все виджеты Webix в данную локаль
      ru: "ru-RU"
    },
  },
  url:"https://docs.webix.com/gantt-backend/"
});

Related sample:  Gantt: Custom Locale

Как менять локали динамически

Вы можете менять языки динамически, например, при клике по соответствующим кнопкам на панели инструментов.

  • создайте локали с переводом желаемых ярлыков:
gantt.locales.ru = {  // Русский
  Edit: "Править", ...
};
 
gantt.locales.zh = {  // Китайский
  Edit: "编辑", ...
};
  • меняйте языки с помощью метода setLang сервиса "locale":
{
  view: "segmented",
  options: ["en", "ru", "zh"],
  width: 250,
  click: function() {
    const locale = $$("myGantt").getService("locale");
    locale.setLang(this.getValue());
  }
}

Related sample:  Gantt: Switching Locales

Как синхронизировать Gantt и Webix локали

Маркеры Webix компонентов внутри Gantt, а также локализация дат и чисел зависят от текущей локали Webix. Чтобы синхронизировать локализацию Gantt и Webix, создайте объект webix внутри свойства locale:

{
  view:"gantt",
  url:"https://docs.webix.com/gantt-backend/",
  locale: {
    lang: "en",
    webix: {
      // переводим Webix в выбранную локаль
      en: "en-US",
      zh: "zh-CN"
    }
  }
}
Наверх