Product-matching-app

Проект Frontend для приложения "product-matching-app" - онлайн сервис для сопоставления товаров, продаваемых дилерами, с товарами в ассортименте заказчика.

Сведения о команде

Frontend-разработчики:

1. Кацнельсон Кирилл, https://t.me/Kirill_Katsnelson
2. Буторин Иван, https://t.me/algoritmi4

Backend-разработчики:

1. Аюпов Рашид, https://t.me/valentaine_ra
2. Калинина Юлия, https://t.me/good_old_user

DS:

1. Борисовский Антон, https://t.me/abv001
2. Поляков Алексей, https://t.me/alekseityler
3. Курбан Абдурахманов, https://t.me/adam_windu

Ссылка на Backend

https://github.com/deamanda/record_linkage/tree/dev/rash#установка-проекта-из-репозитория

Ссылка на страницу

https://hackathon-prosept.ddns.net/

Установка

1. установить npm по инструкции: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
2. склонировать репозиторий с github по инструкции: https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository
3. установить пакеты, используемые в проекте выполнив команду: npm ci
4. выполнить запуск ↓

Запуск

Запуск в режиме разработчика: npm run start

Запуск сборки в продакшн: npm run build

Проверка линтинга: npm run lint

Сборка в контейнере

Установить docker: https://docs.docker.com/engine/install/

В корневой папке проекта выполнить: docker build -t 'имя образа:тег' .

Возможности

Регистрация и авторизация.

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

Импорт данных.

На главной странице есть возможность загрузить данные из файлов с расширением csv. Загрузки данных о дилерах, загрузка продуктов заказчика, загрузка товаров дилера.

Главная страница.

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

Страница сопоставления.

На странице сопоставления отображаются данные выбранного для сопоставления товара дилера, а также варианты предложенные ML моделью. Количество выводимых вариантов пользователь настраивает самостоятельно, по умолчанию 2.

Сопоставленные товары.

Сопоставленные товары записываются в базу данных для дальнейшего использования. И доступны на странице сопоставленных товаров.

Статистика и аналитика.

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

Начало работы

1. Зарегистрироваться
2. Авторизоваться
3. На главной странице кликнуть по товару из таблицы, произойдет преход на страницу сопоставления выбранного товара диллера
4. Сопоставить товар диллера, если есть подходящие варианты. Выбрать вариант и нажать кнопку Да. Если нет подходящих вариантов нажать кнопку Нет. Если необходимо отложить на время решение по данному продукту, то необходимо нажать кнопку Отложить. Кнопки предыдущий и следующий открывают страницу сопоставления для предыдущего и следующего товара соответственно.
5. Вернуться на главную страницу.
6. На главной странице нажать на вкладку Статистика, произойдет преход на страницу статистики текущего пользователя.
7. Для выхода из системы необходимо нажать на кнопку Выход на главной странице.

Стек

• HTML
• CSS
• TypeScript
• React

В проекте использовались

• шрифт Ubuntu - https://design.ubuntu.com/font
• таблица Material React Table - https://www.material-react-table.com/