Пример бронирования заказа для кафе в приложении Glide

ГлавнаяНовое кафе → Бронирование заказа

Блюда выбраны и теперь надо отправить уведомление администратору о заказе.




Формирование и бронирование заказа в приложении Glide

Здесь мы сформируем заявку о заказе, укажем время бронирования, сумму заказа, дадим комментарий с нашими пожеланиями (при необходимости), и рассмотрим, как послать уведомление о заказе.

Ранее мы определили , что в заказе должны присутствовать: идентифицировать пользователя (это у нас есть - имя и email), время заполнения заявки, на какое время мы делаем заказ, сумма заказа и комментарий (пожелания пользователя) к заказу.
Можно конечно указать и перечень блюд. Здесь всё зависит от конкретного случая. Скорее всего в заказе присутствует не полный перечень, а только основные блюда (которые имеют большее время приготовления или более значимые), или это небольшое кафе с ограниченным числом блюд. Если же количество блюд очень большое, то возможно он будет лишним. Надо учесть, что все выбранные блюда администратор может видеть в корзине заказов (но надо помнить, что пользователь может удалять блюда из корзины заказов, если не задать ему ограничение по времени).

Перейдём на вкладку Data и создадим новую таблицу, которую назовём Заказы. По умолчанию Glide создал нам таблицу с одним столбцом Name. Оставим его. Создадим ещё несколько столбцов: Email типа «Email», Время заполнения типа «Date & Time», На время типа «Date & Time», “Комментарий” типа «Text», Стоимость заказа типа «Text» и дополнительно создадим столбец Order ID типа «Row ID» (Рис.1).

Table Booking
Рис.1


Form orders
Рис.2
Теперь нам надо сделать кнопку для отправки заказа. Для этого откроем вкладку “Layout” и нажмём кнопку добавить компонент (+). Кнопки Form Button, что была ранее здесь нет. Здесь для заполнения формы, Glide предлагает нам компонент Form Container, им и воспользуемся. Выбираем его и нам Glide, по умолчанию, создал форму Добавить в заказ, и мы справа в окне свойств во вкладке «General» в строке Target table меняем таблицу «Лист1» на таблицу Заказы. Теперь в нашем приложении отображена форма со всеми столбцами таблицы Заказы (Рис. 2). Additional Columns
Рис.3
Для начала в компоненте «Form Container» выберем строку Title и в свойствах «Title» поменяем «Добавить в заказ» на Забронировать.
Далее можно поиграться со свойством Background, но мне не хочется тёмного фона, и я оставляю всё как есть.

Рассмотрим блок ADDITIONAL COLUMNS, здесь отображены теже столбцы из таблицы Заказы. Мы здесь значение для столбца «Name» - это имя пользователя (заказчика) можем взять из профиля пользователя User Profile → Name (и пользователю нет необходимости его заполнять), также для следующего столбца зададим его «Email» - User Profile → Email. Вряемя заполнения выбираем из списка: Current date/time. Ещё мы можем взять «Стоимость закакза», которая у нас есть в корзине, это Roll_сумма заказа. Теперь пользователю останется заполнить столбец На время и Комментарий (рисю 3). По этому, мы возвращаемся на левое окно и в Form Container удаляем все строки, оставляя только строки типа Date Time - На время и Text Entry – Комментарий.
Выберем мышью в левом окне компонент ‘Date Time’, перейдём в правое окно на вкладку ‘General’ и в разделе OPTIONS установим птичку в окошке Required (т.е. этот компонент сделаем обязательным для заполнения).

App Booking
Рис.4

Теперь перейдём в правое окно и во вкладке «General» в AFTER SUBMIT ACTION видим, что Glide по умолчанию создал нам действия Show notification и у нас ещё есть здесь запись к таблице Заказы. Это действие переименуем на Забронировать заказ

Проверяем. Нажимаем на экране на строку «На время» и устанавливаем требуемое время бронирования. Дальше выбираем строку «Комментарий» и пишем свои пожелания: Столик на двоих, возле оркестра.

И нажимаем кнопку Отправить, всплывающее сообщение с надписью «Отправлено», извещает нам, что действие выполнено.

Входим в наше приложение под именем Виктор и делаем ещё один заказ, и нажимаем кнопку «Отправить».
Переходим на вкладку «Data» и открываем таблицу «Заказы» и видим, что в нашей таблице появились две строки с заказами от Александра и Виктора. Всё работает отлично (Рис. 5). Table Oredrs
Рис.5

Но предположим что мы всё же хотим в бронировании и записи в таблицу Заказы, указать и наименование всех блюд заказанных одним клиентом (пользователем), например, Александром.

Для этого войдём в таблицу Заказы, и создадим новый столбец типа “Relation”и назовём его Rl_orders, где свяжем столбец “Email” со столбцом “Look_user_name” тваблицы “Корзина”, и не забудем поставить ‘птичку’ в окошке “Match multiple”. Затем создадим ещё один столбец типа “Lookup” и назовём его Look_menu_name, где в качестве столбца отношения укажем Rl_orders * SV_название блюда. Теперь, когда мы сделаем заказ, то мы можем видеть наименование всех блюд в заказе сделанных одним пользователем, например, Александром (Рис. 6). Не знаю, какое ограничение на количество наименований есть у Glide в одной ячейке таблицы. Но пока всё работает великолепно! Заказ выбран и отправлен администратору кафе. Table Oredrs Menu
Рис.6

Просмотр заказов в приложении Glide

Давайте дадим администратору возможность просматривать таблицу поступивших заказов, а также иметь возможность редактировать и удалять заказ после его выполнения (или например, ставить отметку о выполнении). Для этого перейдём на вкладку ‘Layout’ и создадим новую вкладку “Заказы”, где в качестве источника укажем таблицу Заказы, и после создания вкладки я сразу поменяю стиль на List. В блоке ITEMS DATA в строке «Title» оставлю Name, а в строке «Dascription» выберу На время (наверное это более важный параметр для администратора, чтобы иметь возможность приготовиться). В строке «Meta» можно выбрать Стоимость заказа, а можно оставить строку пустой. А строку «Image» сделаю пустой (здесь мне фото не нужны).

Во вкладке “Options” я сниму флажок у Show Search bar. Это здесь лишнее и только уменьшает расположение нужной информации.

App Booking
Рис.7
App Edit and Delete
Рис.8


Я хочу, чтобы эти заказы можно было удалять и корректировать в части изменения статуса заказа. Для этого войду на вкладку “Actions” и нажму на кнопку Allow user to delete items и отключу кнопку Allow user to add items. В результате я получу экран как на рисунке 7. И ещё нам надо сделать так, чтобы эту корзину и все действия с корзиной могли просматривать и редактировать только администратор и повар. В окне NAVIGATION выберем Заказы и откроем вкладку Options, и в блоке VISIBILITY нажмём + Add condition. Первое условие у нас будет: “User Profile > Role – is – Admin”, а второе “User Profile > Role – is – повар”. И не забудем между ними выбрать Or

Если теперь нажать на три точечки справа от заказа то откроется меню с двумя действиями: редактировать и удалить. По первому администратор может скорректировать статус заказа (например, в работе, выполнен, оплачен и т.д.), по второму удалить его после выполнения из корзины заказов (Рис. 8).

Нажмём на строку с заказом и у нас откроется новое окно Заказы → Details. Здесь у меня будет два компонента, это компонент Title → Simple, где я оставлю только Name. И компонент Field, где я пункт “Name” я уберу совсем, т.к. он у меня отображён в компоненте Title, и ещё как более важный, пункт На время перенесу в заголовок (можно убрать этот пункт иp компонента, но я его оставлю). У меня получился экран как представлено на рисунке 9. App Cart Details
Рис.9
App List Orders
Рис.10


Все, в общем, то не плохо, но я ещё хочу, чтобы администратор мог видеть состав заказа (перечень блюд), ведь чаще всего заказывают сначала основные и более дорогие блюда, а потом добавляюn по желанию ещё, например, кофе, чай, пироженое.
У меня перечень этих блюд находится в столбце “Look_menu_name” таблицы “Заказы”. Но Glide не позволяет в пунктах компонета “Fields” отобразить столбец типа “Lookup”, тогда я создам новый столбец типа Single Value и назову его SV_наименование, но элемент типа “Single Value” также не отбражается в пунктах “Fields”. Поэтому чтобы отразить перечень блюд я добавлю новый компонент COLLECTIONS → Table, где в качестве источника выберу Rl_orders. В ITEMS DATA я выберу SV_название блюда и Look_menu_name, а стальные пункты оставлю пустыми (хотя эдесь можно задать количество блюд каждого типа).

Ещё уберу ‘птичку’ из поиска и кнопки редактирования и удаления. И чтобы озаглавить список добавлю ещё один компонент Title → Simple, который назову Перечень блюд заказа и перетяну выше списка блюд. Все другие пункты у меня будут исключены. В итоге у меня получилась неплохая страничка заказа для администратора, представленная на рисунке 10.

И ещё проведём небольшой эксперимент, от пользователя “Саша”. Сделаем заказ на 21 блюдо (Рис. 11) и посмотрим, как будет выглядеть экран нашего приложения (Рис.12). Надо отметить, что никаких проблем не возникло. App Cart Details
Рис.12
List Orders
Рис.11




.

Что ещё можно реализовать в приложении “Кафе”? Можно в заказе ввести количество однотипных блюд, посчитать стоимость однотипных блюд, ввести отображение состояния заказа, дать возможность клиенту (пользователю) просматривать свой заказ с ограничением по времени, отправлять письма по Email, и так далее. здесь нужна только ваша фонтазия, а Glide даёт нам много возможностей.


Но а если сравнивать, что изменилось? То все основные принципы. таблицы, типы столбцов и компоненты или не изменились или претерпели улучшения. Если ранее добавление новых компонентов было возможно только в стиле "Details", то сейчас это возможно во всех стилях. Немного проще стало создавать новые вкладки. Вместо "Form Button" есть компонент "Form Container", которым, на мой взгляд, пользоваться удобнее. И вообще лично мне стало как-то легче работать . Также появилось много интересных компонентов, но их использование возможно в тарифах PRO и выше. Но, а численного увеличения для небольших приложений заметить трудно. Увеличилось число ACTIONS, но с ними ещё надо поработать.





Последние комментарии:
Вячеслав
0
# 46
(11:42:56 08.12.2023 г.)
Когда удаляю блюда из корзины, они исчезают из заказа, как это исправить?
Ответить



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

Закрыть
Имя:
199 + 23 =  
Добавить комментарий:
Имя:
199 + 23 =  

Перед публикацией все комментарии проходят обязательную модерацию!