1.⠀Раздел «Ресторан и точки»
Раздел предназначен для создания и управления ресторанами и точками. В разделе можно создавать новые рестораны, добавлять точки к существующим ресторанам, редактировать информацию о ресторанах и точках, настраивать время работы (с поддержкой круглосуточного графика и выходных дней), а также удалять рестораны и связанные с ними точки.
Раздел состоит из страницы «Управление ресторанами», на которой отображаются все созданные рестораны в виде карточек, отсортированных в алфавитном порядке по названию (от А до Я).
Чтобы создать или отредактировать ресторан или точку, найдите в боковой панели навигации раздел «Рестораны» (рис. 1).
Раздел состоит из страницы «Управление ресторанами», на которой отображаются все созданные рестораны в виде карточек, отсортированных в алфавитном порядке по названию (от А до Я).
Чтобы создать или отредактировать ресторан или точку, найдите в боковой панели навигации раздел «Рестораны» (рис. 1).
Рисунок 1. Раздел «Рестораны» в панели навигации
Рисунок 2. Раздел «Рестораны»
На каждой карточке ресторана отображается:
Если ранее не было создано ни одного ресторана, на странице отображается заголовок «Управление ресторанами» и кнопка «Добавить».
- Название ресторана
- Описание
- Изображение
- Контакты
- Количество точек
- Иконка редактирования карточки ресторана
- Кнопка «Добавить точку» / выпадающий список с точками ресторана (название, адрес, время работы, иконка редактирования точки)
Если ранее не было создано ни одного ресторана, на странице отображается заголовок «Управление ресторанами» и кнопка «Добавить».
2.⠀Создание ресторана и точек
Для создания нового ресторана нажмите кнопку «Добавить» (рис. 3-4). Откроется форма создания на отдельной веб-странице.
Рисунок 3. Кнопка добавления ресторана
Рисунок 4. Кнопка добавления точки
Форма создания ресторана
«Название ресторана» является обязательным для заполнения. Допустимая длина — от 2 до 50 символов. Можно использовать буквы кириллицы и латиницы, цифры и пробелы (рис. 5).
«Описание» является необязательным и представляет собой текстовое поле без ограничений по длине.
В поле «Изображение» необходимо загрузить файл в форматах JPG, JPEG и PNG. Максимальный размер файла — 5 мегабайт. Минимально допустимое разрешение изображения — 800 на 800 пикселей.
«Телефон» является обязательным, введите официальный номер телефона ресторана, по которому клиенты смогут дозвониться до ресторана. В полях «VK», «WhatsApp», «Telegram» и «Сайт» можно указать ссылки на соответствующие страницы или контакты, с помощью которых клиенты ресторана смогут связаться с рестораном для бронирования или оформления заказа.
Кнопка «Сохранить» становится активной только после заполнения всех обязательных полей. Если обязательные поля не заполнены, кнопка неактивна, а при попытке сохранить появляется всплывающее уведомление: «Заполните обязательные поля ввода».
Если пользователь заполнил часть полей, но не сохранил ресторан и пытается закрыть страницу, система отображает модальное окно с текстом: «Вы уверены, что хотите покинуть страницу? Внесённые изменения не сохранятся». В окне доступны кнопки «Отмена» (остаться на странице) и «Покинуть без сохранения» (закрыть страницу с потерей всех введённых данных). Модальное окно не появляется, если пользователь не вносил никаких изменений в форму.
При успешном сохранении появляется уведомление о создании ресторана, и новая карточка отображается на странице «Управление ресторанами».
«Название ресторана» является обязательным для заполнения. Допустимая длина — от 2 до 50 символов. Можно использовать буквы кириллицы и латиницы, цифры и пробелы (рис. 5).
«Описание» является необязательным и представляет собой текстовое поле без ограничений по длине.
В поле «Изображение» необходимо загрузить файл в форматах JPG, JPEG и PNG. Максимальный размер файла — 5 мегабайт. Минимально допустимое разрешение изображения — 800 на 800 пикселей.
«Телефон» является обязательным, введите официальный номер телефона ресторана, по которому клиенты смогут дозвониться до ресторана. В полях «VK», «WhatsApp», «Telegram» и «Сайт» можно указать ссылки на соответствующие страницы или контакты, с помощью которых клиенты ресторана смогут связаться с рестораном для бронирования или оформления заказа.
Кнопка «Сохранить» становится активной только после заполнения всех обязательных полей. Если обязательные поля не заполнены, кнопка неактивна, а при попытке сохранить появляется всплывающее уведомление: «Заполните обязательные поля ввода».
Если пользователь заполнил часть полей, но не сохранил ресторан и пытается закрыть страницу, система отображает модальное окно с текстом: «Вы уверены, что хотите покинуть страницу? Внесённые изменения не сохранятся». В окне доступны кнопки «Отмена» (остаться на странице) и «Покинуть без сохранения» (закрыть страницу с потерей всех введённых данных). Модальное окно не появляется, если пользователь не вносил никаких изменений в форму.
При успешном сохранении появляется уведомление о создании ресторана, и новая карточка отображается на странице «Управление ресторанами».
Рисунок 5. Форма добавления ресторана
Создание точки
Форма создания точки предназначена для добавления новой точки к существующему ресторану. Форма открывается при нажатии кнопки «Добавить точку» на карточке ресторана. Форма представляет собой визард из 5 шагов. Переход к следующему шагу возможен только после заполнения всех обязательных полей текущего шага.
Шаг 1. Основная информация (рис.6):
Форма создания точки предназначена для добавления новой точки к существующему ресторану. Форма открывается при нажатии кнопки «Добавить точку» на карточке ресторана. Форма представляет собой визард из 5 шагов. Переход к следующему шагу возможен только после заполнения всех обязательных полей текущего шага.
Шаг 1. Основная информация (рис.6):
- «Название ресторана» является обязательным. Максимально допустимое количество символов — 50.
- «Адрес» является обязательным. Оно включает в себя страну, область, город, улицу и дом. Пользователь последовательно заполняет все составляющие адреса.
- «Почтовый индекс» является обязательным, но заполняется автоматически после выбора адреса.
- «Часовой пояс» определяется автоматически на основе выбранного адреса.
- «Доступен для доставки» является необязательным. При установке этого чекбокса созданная точка ресторана попадает на страницу настроек точек самовывоза.
Рисунок 6. Форма добавления точки
На первом шаге доступна кнопка «Далее», которая переводит пользователя на следующий шаг. Кнопка становится активной только после заполнения всех обязательных полей шага.
Шаг 2. Время работы (рис.7).
Шаг 2. Время работы (рис.7).
Рисунок 7. Форма добавления точки
Второй шаг посвящён настройке времени работы точки. Это обязательное поле для заполнения.
На этом шаге отображается таблица с днями недели от понедельника до воскресенья. Для каждого дня предусмотрен чекбокс «Доступен», а также поля «Со скольки» и «До скольки» для указания времени работы в формате ЧЧ:ММ.
Поля «Со скольки» и «До скольки» являются зависимыми: если пользователь заполнил одно поле, второе становится обязательным. При отключении чекбокса доступности дня оба поля времени автоматически очищаются.
Если пользователь включил доступность дня (поставил чекбокс), он обязательно должен указать время работы — система не позволит перейти к следующему шагу без заполнения полей времени.
Если для дня указано время с 00:00 до 00:00, в клиентском приложении этот день будет отображаться как «Круглосуточно». Если день недоступен (чекбокс снят), в приложении он отображается как «Выходной». При двух недоступных днях подряд система объединяет их в диапазон, например «сб–вс: выходной».
Над таблицей времени работы расположены две кнопки. Кнопка «24/7» при клике автоматически включает доступность для всех дней недели и устанавливает время работы с 00:00 до 00:00. Кнопка «Применить ко всем» становится активной, когда пользователь включил доступность хотя бы для одного дня и указал для него время работы. При клике на эту кнопку настроенные параметры применяются ко всем дням недели.
На втором шаге доступны две кнопки навигации. Кнопка «Назад» возвращает пользователя к первому шагу — она всегда активна. Кнопка «Далее» переводит на третий шаг и становится активной только после того, как для всех включённых дней указано время работы.
Шаг 3. Контакты (рис.8).
На этом шаге отображается таблица с днями недели от понедельника до воскресенья. Для каждого дня предусмотрен чекбокс «Доступен», а также поля «Со скольки» и «До скольки» для указания времени работы в формате ЧЧ:ММ.
Поля «Со скольки» и «До скольки» являются зависимыми: если пользователь заполнил одно поле, второе становится обязательным. При отключении чекбокса доступности дня оба поля времени автоматически очищаются.
Если пользователь включил доступность дня (поставил чекбокс), он обязательно должен указать время работы — система не позволит перейти к следующему шагу без заполнения полей времени.
Если для дня указано время с 00:00 до 00:00, в клиентском приложении этот день будет отображаться как «Круглосуточно». Если день недоступен (чекбокс снят), в приложении он отображается как «Выходной». При двух недоступных днях подряд система объединяет их в диапазон, например «сб–вс: выходной».
Над таблицей времени работы расположены две кнопки. Кнопка «24/7» при клике автоматически включает доступность для всех дней недели и устанавливает время работы с 00:00 до 00:00. Кнопка «Применить ко всем» становится активной, когда пользователь включил доступность хотя бы для одного дня и указал для него время работы. При клике на эту кнопку настроенные параметры применяются ко всем дням недели.
На втором шаге доступны две кнопки навигации. Кнопка «Назад» возвращает пользователя к первому шагу — она всегда активна. Кнопка «Далее» переводит на третий шаг и становится активной только после того, как для всех включённых дней указано время работы.
Шаг 3. Контакты (рис.8).
Рисунок 8. Форма добавления точки
Третий шаг содержит контактную информацию точки.
Поле «Телефон» является обязательным. Поле ввода имеет маску +7 XXX XXX-XX-XX для удобства заполнения.
Поля «Telegram», «WhatsApp», «ВК» и «Сайт» являются необязательными. В них можно указать соответствующие контакты или ссылки.
На третьем шаге доступны две кнопки навигации. Кнопка «Назад» возвращает пользователя ко второму шагу — она всегда активна. Кнопка «Далее» переводит на четвертый шаг и становится активной только после того, как для всех включённых дней указано время работы.
Шаг 4. Схема зала
На четвертом шаге необходимо настроить схему залов и расстановку столов (при необходимости данный этап можно пропустить нажав “Далее”).
Поле «Телефон» является обязательным. Поле ввода имеет маску +7 XXX XXX-XX-XX для удобства заполнения.
Поля «Telegram», «WhatsApp», «ВК» и «Сайт» являются необязательными. В них можно указать соответствующие контакты или ссылки.
На третьем шаге доступны две кнопки навигации. Кнопка «Назад» возвращает пользователя ко второму шагу — она всегда активна. Кнопка «Далее» переводит на четвертый шаг и становится активной только после того, как для всех включённых дней указано время работы.
Шаг 4. Схема зала
На четвертом шаге необходимо настроить схему залов и расстановку столов (при необходимости данный этап можно пропустить нажав “Далее”).
Рисунок 9. Схема зала
Для расстановки столов необходимо создать хотя бы 1 зал, для создания зала нажмите кнопку “Добавить зал”, в ответ откроется модальное окно в котором необходимо указать название зала.
После сохранения названия, зал отобразиться в поле с выпадающим списком (рис.8), а также откроется форма для создания стола. В форме необходимо выбрать вид формы стола (прямоугольный, квадратный, круглый или овальный), после выбора введите название стола. Номер стола проставляется автоматически, но при необходимости нумерацию можно поменять. Также необходимо указать вместимость стола, на сколько персон он расчитан, после заполнения формы необходимо нажать “Создать столик”, он отобразится на схеме зала.
Созданный стол можно перемещать, менять угол поворота и размер в соответствии с реальным расположением стола в зале. После установки стола нажмите “Сохранить изменения”.
Создание остальных столов и залов происходит аналогичным образом.
После создания столов, под картой зала отобразится список всех созданных столов.
Что бы массово скачать QR коды или удалить столы необходимо поставить чекбокс у необходимых столов, кнопки скачивания и удаления активируются (рис.10).
После сохранения названия, зал отобразиться в поле с выпадающим списком (рис.8), а также откроется форма для создания стола. В форме необходимо выбрать вид формы стола (прямоугольный, квадратный, круглый или овальный), после выбора введите название стола. Номер стола проставляется автоматически, но при необходимости нумерацию можно поменять. Также необходимо указать вместимость стола, на сколько персон он расчитан, после заполнения формы необходимо нажать “Создать столик”, он отобразится на схеме зала.
Созданный стол можно перемещать, менять угол поворота и размер в соответствии с реальным расположением стола в зале. После установки стола нажмите “Сохранить изменения”.
Создание остальных столов и залов происходит аналогичным образом.
После создания столов, под картой зала отобразится список всех созданных столов.
Что бы массово скачать QR коды или удалить столы необходимо поставить чекбокс у необходимых столов, кнопки скачивания и удаления активируются (рис.10).
Рисунок 10. Функции столов
Для каждого стола создается свой URL-адрес, для каждого стола предусмотрена функция копирования URL-адреса.
Для редактирования стола нажмите на иконку карандаша, в ответ на схеме зала выделится редактируемый стол и откроется форма редактирования информации о столе, внесите необходимый изменения и сохраните их нажатием кнопки “Сохранить изменения”.
Также стол можно удалить без массового выбора, достаточно в строке необходимого стола нажать на иконку корзины.
Важно! Удалить единственный стол в зале невозможно.
После ввода корректных данных во всех полях, нажмите кнопку «Далее».
Шаг 5. QR меню (рис.11).
Для редактирования стола нажмите на иконку карандаша, в ответ на схеме зала выделится редактируемый стол и откроется форма редактирования информации о столе, внесите необходимый изменения и сохраните их нажатием кнопки “Сохранить изменения”.
Также стол можно удалить без массового выбора, достаточно в строке необходимого стола нажать на иконку корзины.
Важно! Удалить единственный стол в зале невозможно.
После ввода корректных данных во всех полях, нажмите кнопку «Далее».
Шаг 5. QR меню (рис.11).
Рисунок 11. Настройка разделов QR
На пятом шаге необходимо настроить разделы QR, по умолчанию установлена функция просмотра меню, но также присутствует возможность включения бонусной программы.
В настройке разделов QR обязательно должен быть включен хотя бы 1 раздел, либо просмотр меню, либо бонусная программа, возможно включение 2х разделов.
После настройки заведения нажмите кнопку “Сохранить”, созданная точка отобразится в реестре заведений.
В настройке разделов QR обязательно должен быть включен хотя бы 1 раздел, либо просмотр меню, либо бонусная программа, возможно включение 2х разделов.
После настройки заведения нажмите кнопку “Сохранить”, созданная точка отобразится в реестре заведений.
3.⠀Редактирование ресторана и точки
Редактирование ресторана предназначено для изменения информации о существующем ресторане. Перейти в режим редактирования можно с главной страницы «Управление ресторанами». На карточке нужного ресторана расположена иконка карандаша. При клике на эту иконку открывается форма редактирования ресторана с предзаполненными данными (рис.12).
Рисунок 12. Функция редактирования в карточке
Форма редактирования ресторана полностью повторяет структуру формы создания. Она содержит те же блоки и поля: название, описание, изображение, телефон, VK, WhatsApp, Telegram, сайт. Все поля доступны для изменения (рис.13).
Рисунок 13. Редактирование ресторана
Редактирование точки
Пользователь может изменить название точки, но при сохранении система проверит новое название на дубликаты в рамках одной организации (рис.14).
Поле «Описание» можно изменить или полностью очистить — оно является необязательным.
Поле «Изображение» позволяет загрузить новое изображение взамен старого. Требования к новому изображению остаются прежними: формат JPG, JPEG или PNG, размер не более 5 мегабайт, минимальное разрешение 800 на 800 пикселей. Если пользователь не загружает новое изображение, сохраняется текущее.
Поле «Телефон» является обязательным. Пользователь может изменить номер телефона на новый. Поле ввода имеет маску +7 XXX XXX-XX-XX.
Пользователь может изменить название точки, но при сохранении система проверит новое название на дубликаты в рамках одной организации (рис.14).
Поле «Описание» можно изменить или полностью очистить — оно является необязательным.
Поле «Изображение» позволяет загрузить новое изображение взамен старого. Требования к новому изображению остаются прежними: формат JPG, JPEG или PNG, размер не более 5 мегабайт, минимальное разрешение 800 на 800 пикселей. Если пользователь не загружает новое изображение, сохраняется текущее.
Поле «Телефон» является обязательным. Пользователь может изменить номер телефона на новый. Поле ввода имеет маску +7 XXX XXX-XX-XX.
Рисунок 14. Форма редактирование точки
При сохранении отредактированного ресторана и точки система выполняет те же проверки, что и при создании. Проверяется заполнение всех обязательных полей.
Если пользователь внёс изменения в любые поля формы редактирования, но не сохранил их и пытается закрыть страницу (перейти по другому адресу, закрыть вкладку или браузер), система отображает модальное окно с текстом: «Вы уверены, что хотите покинуть страницу? Внесённые изменения не сохранятся». В окне доступны кнопки «Отмена» (остаться на странице и продолжить редактирование) и «Покинуть без сохранения» (закрыть страницу без сохранения изменений). Модальное окно не появляется, если пользователь не вносил никаких изменений в форму (рис.15).
Если пользователь внёс изменения в любые поля формы редактирования, но не сохранил их и пытается закрыть страницу (перейти по другому адресу, закрыть вкладку или браузер), система отображает модальное окно с текстом: «Вы уверены, что хотите покинуть страницу? Внесённые изменения не сохранятся». В окне доступны кнопки «Отмена» (остаться на странице и продолжить редактирование) и «Покинуть без сохранения» (закрыть страницу без сохранения изменений). Модальное окно не появляется, если пользователь не вносил никаких изменений в форму (рис.15).
Рисунок 15. Выход из режима редактирования
При успешном сохранении изменений система показывает всплывающее уведомление об успешном обновлении ресторана и точки. Обновлённые данные отображаются в карточке ресторана на главной странице «Управление ресторанами». Форма редактирования закрывается, и пользователь возвращается к списку ресторанов и точек.
4.⠀Удаление точек и ресторана
Удалить ресторан можно только в режиме редактирования. Для этого откройте карточку нужного ресторана и нажмите на иконку карандаша, чтобы перейти в форму редактирования. В верхней части формы находится кнопка «Удалить» (рис.16).
Рисунок 16. Удаление ресторана
При клике на эту кнопку система отображает модальное окно с текстом: «Это действие приведет к безвозвратному удалению ресторана и всех привязанных к нему точек из системы. Вы уверены, что хотите продолжить?»
В окне доступны две кнопки. Кнопка «Да» — после нажатия ресторан и все связанные с ним точки безвозвратно удаляются из системы, карточка ресторана перестаёт отображаться на интерфейсе. Кнопка «Отмена» — модальное окно закрывается, удаление не происходит, пользователь возвращается к редактированию ресторана.
В окне доступны две кнопки. Кнопка «Да» — после нажатия ресторан и все связанные с ним точки безвозвратно удаляются из системы, карточка ресторана перестаёт отображаться на интерфейсе. Кнопка «Отмена» — модальное окно закрывается, удаление не происходит, пользователь возвращается к редактированию ресторана.
Рисунок 17. Удаление точки ресторана
Удалить точку можно только в режиме редактирования точки. Для этого на карточке ресторана в выпадающем списке точек нажмите на иконку карандаша рядом с нужной точкой, чтобы открыть визард редактирования. Кнопка «Удалить» находится на первом шаге визарда («Основная информация»).
При клике на кнопку система отображает модальное окно с текстом: «Вы собираетесь удалить точку: «Название точки». Это приведет к: безвозвратному удалению точки из системы, прекращению приема заказов в этой точке, удалению истории заказов точки, деактивации всех сотрудников точки. Вы действительно хотите удалить точку?».
В окне доступны две кнопки. Кнопка «Да» — точка безвозвратно удаляется из системы, все сотрудники точки деактивируются. Кнопка «Отмена» — модальное окно закрывается, удаление не происходит, пользователь возвращается к редактированию точки.
При клике на кнопку система отображает модальное окно с текстом: «Вы собираетесь удалить точку: «Название точки». Это приведет к: безвозвратному удалению точки из системы, прекращению приема заказов в этой точке, удалению истории заказов точки, деактивации всех сотрудников точки. Вы действительно хотите удалить точку?».
В окне доступны две кнопки. Кнопка «Да» — точка безвозвратно удаляется из системы, все сотрудники точки деактивируются. Кнопка «Отмена» — модальное окно закрывается, удаление не происходит, пользователь возвращается к редактированию точки.