Создание Чат-Бот-Магазин в Телеграм с нуля. Часть третья

Продолжение: (Часть 1, Часть 2, Часть 4)

В предпоследней статье по созданию магазина в Телеграм рассмотрим пользовательский интерфейс - это вывод категорий, отображение товара, добавление товара в корзину, управление корзиной, оформление покупки пошагово, вывод всех заказов.

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

* * *

Интерфейс пользователя

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

<?php
    /** Выводим приветственное слово
     * @param $chat_id
     */
    private function startBot($chat_id, $data)
    {
        // достаем пользователя из базы
        $user = $this->pdo->prepare("SELECT * FROM bot_shop_profile WHERE user_id = :user_id");
        $user->execute(['user_id' => $chat_id]);
        // если такого пользователя нет в базе то пишем его туда
        if ($user->rowCount() == 0) {
            // добавляем пользователя
            $newUser = $this->pdo->prepare("INSERT INTO bot_shop_profile SET 
                                 user_id = :user_id, 
                                 first_name = :first_name, 
                                 last_name = :last_name, 
                                 phone = :phone, 
                                 adress = :adress, 
                                 action = 'start'");
            $newUser->execute([
                'user_id' => $chat_id,
                'first_name' => $data['message']['chat']['first_name'],
                'last_name' => $data['message']['chat']['last_name'],
                'phone' => '',
                'adress' => '',
            ]);
        } else {
            // если пользователь есть то меняем ему действие
            @$this->setActionUser("start", $chat_id);
        }
        // определяем приветственный текст
        $text = $this->helloText;
        // проверяем пользователя на админа
        if ($this->isAdmin($chat_id)) {
            $text .= "\n\n/admin";
        }
        // получаем категории из базы где категории не скрыты
        $category = $this->pdo->query('SELECT * FROM bot_shop_category WHERE hide = 0');
        // проверяем на количество категорий
        if ($category->rowCount() > 0) {
            // проходим циклом по полученным данным из базы
            while ($row = $category->fetch()) {
                // Добавляем кнопки для категорий
                $buttons[][] = $this->buildInlineKeyBoardButton($row['name'], "showUserCategory_" . $row['id']);
            }
        } else {
            // выводим инфу
            $buttons = NULL;
            $text .= "\nВ магазине ничего нет";
        }
        // отправляем привет
        $this->sendMessage($chat_id, $text, $buttons);
    }
?>

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

* * *

Управление корзиной

Самое интересное было это создавать управление корзиной. Необходимо было на одном экране учесть возможность:

1. Добавить\убавить количество товара
2. Возможность видеть количество выведенного на экран товара в корзине
3. Возможность видеть расчет итого по выведенному на экран товару
4. Удалить выведенный на экран товар из корзины
5. Листать товары корзины если их больше одного
6. Возможность перейти к оформлению заказа
7. Возможность видеть сколько товаров в корзине и их общую стоимость

По итогу получилось 4 ряда кнопок. 

* * *

Оформление заказа

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

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

CREATE TABLE IF NOT EXISTS `bot_shop_order` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `user_id` bigint(20) DEFAULT NULL,
  `date` datetime DEFAULT NULL,
  `status` int(1) DEFAULT '0',
  `name` varchar(100) CHARACTER SET utf8 COLLATE utf8_unicode_ci DEFAULT NULL,
  `phone` varchar(15) CHARACTER SET utf8 COLLATE utf8_unicode_ci DEFAULT NULL,
  `adress` varchar(255) CHARACTER SET utf8 COLLATE utf8_unicode_ci DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

-- --------------------------------------------------------

CREATE TABLE IF NOT EXISTS `bot_shop_order_product` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `parent_id` int(11) DEFAULT NULL,
  `product_id` int(11) DEFAULT NULL,
  `product_count` int(3) DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

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

* * *

Подводим итоги

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