Тип компонента Блок страницы оформления заказа

Что это за компонент

Блок страницы оформления заказа - это основной компонент экрана оформления заказа.

Если говорить совсем просто, именно здесь клиент превращает корзину в реальный заказ.

На этом экране покупатель может:

• проверить состав покупки
• заполнить или уточнить свои контактные данные
• выбрать способ доставки
• указать адрес доставки
• выбрать пункт выдачи для самовывоза
• выбрать способ оплаты
• добавить комментарий к заказу
• увидеть итоговую сумму
• отправить заказ

Это главный финальный шаг перед созданием заказа.

Когда использовать именно этот тип

Блок страницы оформления заказа подходит, если нужно:

• сделать полноценную страницу оформления заказа в клиентском приложении
• дать клиенту понятный путь от корзины к подтвержденному заказу
• управлять доступными способами оплаты
• показывать разные подсказки для доставки и самовывоза
• ограничивать доставку по нужным городам и регионам

Обычно такой компонент размещают на отдельной странице оформления заказа, на которую клиент попадает из корзины.

Как этот блок выглядит в Omnis и в клиентском приложении

Рабочая логика простая:

1. В Omnis создается компонент типа Блок страницы оформления заказа.
2. В карточке компонента настраиваются примечания, ограничения доставки, пункты выдачи и доступные способы оплаты.
3. После сохранения компонент размещается на странице оформления заказа.
4. В клиентском приложении покупатель видит форму заказа и завершает покупку.

1. Как создать компонент Блок страницы оформления заказа

Обычно сценарий такой:

1. Откройте Управление -> CMS -> Компоненты.
2. Нажмите Создать.
3. В окне выбора типа выберите Блок страницы оформления заказа.
4. Заполните название компонента.
5. При необходимости задайте код.
6. Заполните примечания для способов получения.
7. При необходимости задайте ограничения доставки.
8. При необходимости выберите пункты выдачи.
9. Настройте доступные способы оплаты.
10. Сохраните компонент.
11. Разместите его на странице оформления заказа.

2. Основные поля карточки

Сверху у Блока страницы оформления заказа используются стандартные поля CMS-компонента.

ID

Это внутренний идентификатор записи. В обычной работе он нужен редко.

Тип

Для этого документа тип всегда будет Блок страницы оформления заказа.

Он определяет:

• состав полей компонента
• внешний вид страницы оформления заказа
• сценарий клиентского экрана

Код

Это служебный код компонента.

Если код не заполнен вручную, система обычно формирует его сама после сохранения.

Наименование

Это рабочее название компонента в Omnis.

Лучше использовать понятные названия, например:

• Основное оформление заказа
• Экран оформления
• Оформление заказа клиента
• Страница оформления заказа

Приоритет

Это служебный параметр порядка. Он помогает определить положение компонента среди других блоков страницы.

Активирован

Этот переключатель помогает:

• включать рабочий экран оформления заказа
• хранить черновик
• временно скрывать компонент без удаления

3. Все поля самого компонента

У этого компонента есть собственные поля настройки, которые используются в оформлении заказа.

4. Примечания для способов получения

В верхней части карточки компонента есть три текстовых поля с подсказками для клиента.

Примечание для самовывоза

Это поясняющий текст, который клиент видит при выборе самовывоза.

Здесь удобно размещать:

• правила получения заказа
• часы работы пунктов выдачи
• особенности выдачи
• документы, которые желательно иметь при получении

Например:

• Забрать заказ можно после подтверждения менеджером.
• При получении назовите номер заказа.
• Проверьте график работы выбранного пункта выдачи.

Примечание для доставки

Это поясняющий текст, который клиент видит при выборе доставки.

Здесь удобно писать:

• общие условия доставки
• правила передачи заказа
• рекомендации по указанию адреса
• важные уточнения по срокам или зонам обслуживания

Например:

• Указывайте полный адрес с подъездом и квартирой.
• Служба доставки свяжется с вами перед выездом.
• Срок доставки зависит от подтверждения заказа.

Примечание для постаматов

Это отдельный текст для сценария постаматов.

Если компания пока не использует такой сценарий, поле можно оставить пустым.

Важно: в текущем стандартном клиентском интерфейсе постаматы не являются основным рабочим сценарием для выбора, поэтому это поле можно не заполнять без необходимости.

5. Ограничение доставки по городам

Поле ограничения доставки по городам позволяет указать города, в которых доставка доступна.

Если говорить проще, это способ заранее ограничить адреса, которые клиент сможет использовать при оформлении доставки.

Это полезно, когда компания:

• доставляет не везде
• работает только по конкретным городам
• хочет исключить лишние заказы из недоступных зон

Если ограничение не нужно, поле можно оставить пустым.

Как это выглядит для клиента

Если ограничение настроено, на экране оформления заказа клиент увидит пояснение о том, где доступна доставка.

Это снижает количество ошибок и делает оформление более понятным.

Если на экране используются адресные подсказки, они тоже работают с учетом этих ограничений. Проще говоря, клиенту будет проще выбрать адрес внутри разрешенной зоны доставки.

6. Ограничение доставки по регионам

Поле ограничения доставки по регионам работает по той же логике, но на уровне регионов.

Оно полезно, если компания:

• обслуживает только отдельные области, края или республики
• хочет ограничить географию заказов более крупными зонами
• строит доставку по региональной модели

Это поле можно использовать отдельно или вместе с ограничением по городам.

Как это выглядит для клиента

Если ограничения настроены, клиент видит пояснение прямо на экране доставки.

Таким образом он заранее понимает, где доставка доступна, а где нет.

Если на экране используются адресные подсказки, они тоже учитывают эти ограничения и помогают клиенту вводить адрес в рамках доступной зоны доставки.

7. Пункты выдачи для самовывоза

Поле Пункты выдачи (самовывоз) позволяет привязать к оформлению заказа список пунктов самовывоза.

Если самовывоз нужен, это одно из ключевых полей компонента.

Что можно сделать в этом поле

Сотрудник может:

• выбрать нужные пункты выдачи
• исключить лишние
• задать порядок показа

Порядок очень важен, потому что клиент будет видеть эти пункты именно в том порядке, который вы настроили.

Как это выглядит для клиента

Если самовывоз доступен, покупатель может:

• выбрать самовывоз как способ получения
• открыть выбор пункта выдачи
• посмотреть точки на карте
• переключиться на список
• выбрать подходящий пункт

Что важно заполнить у самих пунктов выдачи

Чтобы выбор самовывоза выглядел качественно, у самих пунктов выдачи желательно заполнить:

• название
• адрес
• телефон
• график работы
• описание

Если этих данных нет, клиенту сложнее выбрать подходящую точку.

8. Переключатели способов оплаты

Ниже находятся два важных переключателя:

• Онлайн-оплата
• Офлайн-оплата

Они определяют, какие способы оплаты будут доступны клиенту на этапе оформления заказа.

Онлайн-оплата

Если переключатель включен, клиент может увидеть и выбрать онлайн-оплату, если она доступна для приложения.

Это полезно, когда компания принимает оплату сразу при оформлении заказа.

Офлайн-оплата

Если переключатель включен, клиент может увидеть и выбрать оплату при получении или другой неонлайн-сценарий, если он доступен для приложения.

Это полезно, когда компания:

• принимает оплату наличными
• принимает оплату при выдаче
• принимает оплату вне онлайн-сценария

Как эти переключатели влияют на клиента

Если какой-то тип оплаты выключен, клиент просто не увидит его в списке выбора оплаты.

Это позволяет гибко управлять оформлением под нужный коммерческий сценарий.

9. Что клиент видит в самом оформлении заказа

На клиентском экране оформление заказа разбито на понятные блоки.

Обычно покупатель видит:

• краткую сводку по корзине
• блок данных покупателя
• блок выбора способа доставки
• блок выбора способа оплаты
• комментарий к заказу
• итоговую сумму
• кнопку оформления

10. Сводка по корзине перед оформлением

В верхней части экрана клиент видит краткое напоминание о корзине.

Обычно там показываются:

• количество товаров
• миниатюры товаров
• ссылка Изменить корзину

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

11. Данные покупателя

Первый основной блок формы - Данные покупателя.

Обычно в нем есть поля:

• Телефон
• Имя
• Фамилия
• Отчество

Что подставляется автоматически

Если система уже знает данные клиента, часть полей может подставиться автоматически.

На практике это чаще всего касается:

• телефона
• имени
• фамилии
• отчества

Это ускоряет оформление заказа и уменьшает количество ручного ввода.

Что важно для бизнеса

Чем аккуратнее заполнен этот блок, тем проще:

• связаться с клиентом
• подтвердить заказ
• передать заказ в доставку или выдачу

12. Способ доставки

Следующий блок - Способ доставки.

В текущем стандартном интерфейсе клиенту обычно доступны:

• Самовывоз
• Доставка

Сценарий постаматов пока не является основным рабочим сценарием для стандартного клиентского интерфейса.

Если выбрана доставка

Клиент видит:

• примечание для доставки, если оно заполнено
• поле адреса доставки
• ограничения по городам и регионам, если они настроены

Адрес доставки вводится в отдельном поле с подсказками, чтобы клиенту было проще указать корректный адрес.

Если для компонента настроены ограничения по городам и регионам, подсказки адреса тоже работают с учетом этих ограничений.

Если выбран самовывоз

Клиент видит:

• примечание для самовывоза, если оно заполнено
• выбранный пункт выдачи или пустое состояние
• кнопку выбора или изменения пункта выдачи

Это делает сценарий самовывоза понятным и управляемым прямо из формы заказа.

Если пунктов выдачи нет

Если пункты выдачи не настроены, самовывоз в стандартном сценарии становится недоступным, и клиент остается в сценарии доставки.

Это важно учитывать заранее при настройке компонента.

13. Способ оплаты

Следующий блок - Способ оплаты.

Клиент видит только те способы оплаты, которые одновременно:

• доступны в приложении
• разрешены в настройках этого компонента

Как выглядит онлайн-оплата

Если онлайн-оплата разрешена и доступна, клиент видит соответствующий вариант оплаты и может выбрать его как основной.

Как выглядит офлайн-оплата

Если офлайн-оплата разрешена и доступна, клиент может выбрать оплату вне онлайн-сценария.

Если оплата недоступна

Если на текущем экране не осталось доступных способов оплаты, клиент увидит сообщение о том, что оплата сейчас недоступна.

Это важный сигнал проверить настройки оплаты в приложении и в компоненте.

14. Комментарий к заказу

В блоке Комментарий к заказу покупатель может оставить пояснение для компании.

Это может быть полезно, если клиент хочет:

• уточнить время связи
• добавить детали по доставке
• оставить пожелания по заказу

15. Итоговая сумма и кнопка оформления

В нижней части экрана клиент видит:

• итоговую сумму
• при необходимости сумму товаров до скидки
• скидку
• кнопку Оформить

Когда кнопка Оформить недоступна

Кнопка оформления может быть недоступна, если:

• в корзине нет суммы к покупке
• форма заполнена не полностью
• не выбран обязательный способ получения
• не выбран обязательный пункт выдачи при самовывозе
• нет доступного способа оплаты

16. Что происходит после нажатия Оформить

После отправки формы создается реальный заказ в системе.

Дальше сценарий зависит от выбранного способа оплаты.

Если выбрана онлайн-оплата

После создания заказа клиент получает сообщение об успешном создании заказа, а затем переходит к странице оплаты.

После этого он может продолжить отслеживание заказа в личном кабинете.

Если выбрана офлайн-оплата

После создания заказа клиент получает сообщение с номером заказа и переходит в личный кабинет, где может отслеживать его статус.

17. Пустое оформление заказа

Если в корзине нет товаров, клиент увидит пустой экран с сообщением о том, что товары отсутствуют.

18. Что важно подготовить заранее

Чтобы оформление заказа работало без сбоев, полезно заранее проверить:

• есть ли рабочая корзина с товарами
• настроены ли способы оплаты
• заполнены ли примечания для клиентов
• выбраны ли пункты выдачи, если нужен самовывоз
• настроены ли ограничения доставки, если они нужны

Если эти данные не подготовлены, оформление может выглядеть незавершенным или неудобным.

19. Общие настраиваемые свойства компонента

Как и у других компонентов, у Блока страницы оформления заказа действуют общие свойства блока.

Чаще всего здесь могут пригодиться:

• padding-y - внутренние отступы сверху и снизу
• padding-x - внутренние отступы слева и справа
• margin-y - внешние отступы сверху и снизу
• margin-x - внешние отступы слева и справа

Практически это помогает:

• аккуратно встроить форму в страницу
• выдержать единый ритм интерфейса
• сделать экран визуально чище

20. Собственные настраиваемые свойства Блока страницы оформления заказа

У этого компонента в стандартной карточке нет отдельного блока пользовательских настраиваемых свойств, как у части других компонентов.

Основная настройка выполняется через рабочие поля самого компонента:

• примечания
• ограничения доставки
• пункты выдачи
• способы оплаты

Если в вашем проекте отдельно настраивается карта пунктов выдачи, такие параметры обычно относятся к отображению карты, а не к основной бизнес-настройке формы оформления заказа.

21. Практические рекомендации по настройке

Чтобы Блок страницы оформления заказа работал удобно и профессионально, полезно придерживаться нескольких правил.

Пишите примечания коротко и по делу

Клиент не должен читать длинную инструкцию на несколько экранов. Лучше коротко сообщить только самое важное.

Не включайте лишние способы оплаты

Если какой-то способ оплаты сейчас не готов для работы, лучше скрыть его, чем показывать клиенту лишний вариант.

Проверяйте оформление на реальном сценарии

После публикации полезно пройти весь путь как клиент:

• открыть корзину
• перейти к оформлению
• проверить подстановку данных
• проверить доставку
• проверить самовывоз
• проверить ограничения по географии
• проверить оплату
• создать тестовый заказ

Следите за качеством пунктов выдачи

Если самовывоз - важный сценарий, у точек выдачи должны быть аккуратно заполнены адрес, название, телефон и график работы.

Проверяйте, что заказ действительно создается

Самая важная проверка после настройки - убедиться, что клиент может довести оформление до конца и что заказ появляется в Omnis как новый заказ компании.