MIGX: простая таблица часов работы

Чтобы вывести часы работы в гибком табличном виде, можно использовать MIGX.

Настройка MIGX TV¶

Предположим, нам нужна простая таблица с днём недели, временем открытия и временем закрытия.

Создайте новую TV (мы назвали её operatingHours) с типом ввода MIGX TV (это предполагает установку пакета через Система → Менеджер пакетов) и используйте следующий код для Form Tabs. JSON можно записывать иначе, чем у автора MIGX. Главное, чтобы синтаксис был корректным.

Для Form Tabs:

[{
  "caption": "Operating Hours",
  "fields": [{
      "field": "day",
      "caption": "Day"
    },
    {
      "field": "from",
      "caption": "From"
    },
    {
      "field": "until",
      "caption": "Until"
    }
  ]
}]

Мы задаём одной вкладке заголовок «Operating Hours» и добавляем три поля: день, время «с» и время «до». Так как тип ввода не указан, будет использовано обычное текстовое поле.

Чтобы показать данные в панели ресурса, настройте также Grid Columns:

[{
    "header": "Day",
    "width": "60",
    "sortable": "false",
    "dataIndex": "day"
  },
  {
    "header": "From",
    "width": "50",
    "sortable": "false",
    "dataIndex": "from"
  },
  {
    "header": "Until",
    "width": "50",
    "sortable": "false",
    "dataIndex": "until"
  }
]

Мы задаём три столбца («Day», «From» и «Until»), указываем ширину, правильный dataIndex (он должен совпадать со значением «field» в форме) и отключаем сортировку.

Наконец, задайте «Add Item» Replacement. У нас это «Add new line».

Теперь в Менеджере должна появиться такая сетка (на скриншоте подписи на голландском).

Разбор данных¶

На фронтенде выведите таблицу с помощью сниппета getImageList из пакета MIGX.

Вставьте вызов сниппета в шаблон там, где нужна таблица:

<table>
[[getImageList?
  &tvname=`operatingHours`
  &tpl=`operatingHoursTpl`
]]
</table>

Сниппет прочитает TV operatingHours и обработает значения через чанк operatingHoursTpl.

Вот использованный чанк:

<tr>
  <td>[[+day]]</td>
  [[+from:notempty=`<td>[[+from]]</td><td>[[+until]]</td>`:default=`<td colspan="2">Closed</td>`]]
</tr>

Что здесь происходит?

Для каждой строки TV выводится строка таблицы с днём. Затем проверяется, заполнено ли поле «from», то есть указано ли время открытия. Если значение есть (не пустое), выводятся ещё две ячейки: время открытия и время закрытия.

Если значения нет, срабатывает модификатор по умолчанию: одна ячейка на две колонки с текстом «Closed».

Результат¶

См. изображение ниже (тексты заменены на голландский, таблице добавлены стили). Ещё один пример возможностей MIGX. Можно пойти дальше: добавить столбцы, несколько форм и т.д.