1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/undraw-seckill

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Клонировать/Скачать
README.md 9.5 КБ
Копировать Редактировать Web IDE Исходные данные Просмотреть построчно История
Отправлено 02.03.2025 18:33 dcbbc54

Секундная распродажа

В этом проекте исходный код разделён между клиентской и серверной частью. Серверная часть создана с использованием Spring Boot и управлена через Spring Security. Клиентская часть реализована с помощью Vue3, Element Plus и Axios, а API полностью используют стиль RESTful.

Магазин "Секундная Распродажа" состоит из двух страниц — для пользователей и администраторов. Основной рабочий процесс пользователя начинается с входа в систему. После того как пользователь вводит имя пользователя и пароль, он может войти в систему. Пользователи могут просматривать товары, выбирать товары, покупать их и участвовать в акциях по распродаже. Они также могут зайти в свой профиль, чтобы изменить свои данные, пароли, выйти из системы или управлять заказами.

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

Инструкции по использованию

Среда: idea + node + maven + jdk8

  1. Создайте базу данных seckill с помощью файла seckill.sql в папке sql.

  2. Запустите проект store-provider.

  3. Откройте терминал правым кликом мыши в папке vue, перейдите в папку admin.

  4. Запустите административную часть:

// Установка зависимостей (в папке admin)
npm install
// Запуск проекта
npm run dev
  1. Перейдите в папку shop и запустите клиентскую часть:
// Установка зависимостей (в папке shop)
npm install
// Запуск проекта
npm run dev
  1. Войдите в систему
    • Логин: root, Пароль: root (пароль совпадает с логином!)

1.3 Вход в магазин

Проверка происходит путём сравнения введённого имени пользователя и пароля с данными в базе данных. При успешном соответствии вход считается успешным, при неудаче — нет. Интерфейсы входа и регистрации показаны на рисунке 2-1 и 2-2 соответственно.

img

Рисунок 2-1: Интерфейс входа в магазин

img

Рисунок 2-2: Интерфейс регистрации в магазине

Для удобства управления магазином и обеспечения лучшего пользовательского опыта система разделена на две роли: пользователи и администраторы. Оба имеют одинаковый интерфейс входа и регистрации.

2.1.1 Выбор товаров

Выбор товаров является обязательным компонентом для онлайн-магазина. Интерфейс выбора товаров представлен на рисунке 3-1.

img

Рисунок 3-1: Интерфейс выбора товаров

2.1.2 Поиск товаров

Пользователи могут ввести название товара, и система покажет результаты поиска. Интерфейс поиска товаров представлен на рисунке 3-2.

img

Рисунок 3-2: Интерфейс поиска товаров

2.1.3 Добавление товаров в корзину

Пользователи могут просмотреть товары, выбрать те, которые хотят купить, и добавить их в корзину. Интерфейс добавления товаров в корзину представлен на рисунке 3-3.

img

Рисунок 3-3: Интерфейс добавления товаров в корзину

2.1.4 Функция "Распродажа"

Пользователи могут участвовать в акциях по распродаже, согласно установленному времени. Интерфейс распродажи представлен на рисунке 3-4.

img

Рисунок 3-4: Интерфейс распродажи

2.1.5 Покупка товаров

Компонент покупки товаров является основной и ключевой функцией системы. Он позволяет выбрать товары, указать количество и создать заказ. Интерфейсы покупки товаров представлены на рисунке 3-5.

img

img

Рисунок 3-5: Интерфейсы покупки товаров

2.1.6 Редактирование профиля

Пользователи могут использовать интерфейс редактирования профиля для изменения аватара и псевдонима. Интерфейс редактирования профиля представлен на рисунке 3-10.

img

img

Рисунок 3-10: Интерфейс редактирования профиля

2.1.7 Управление заказами

Интерфейс управления заказами доступен в разделе "Корзина". Интерфейс управления заказами представлен на рисунке 3-11.

img

Рисунок 3-11: Интерфейс управления заказами

3.2 Функционал административной части

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

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

img

Рисунок 3-1: Главная страница административной части

3.2.2 Управление товарами

Администраторы могут добавлять, редактировать и удалять информацию о товарах. Интерфейс добавления деталей товаров представлен на рисунке 3-2.

img

Рисунок 3-2: Интерфейс добавления деталей товаров

3.2.3 Управление заказами

Администраторы могут проверять, контролировать и управлять заказами пользователей. Интерфейс управления заказами представлен на рисунке 3-3.

img

Рисунок 3-3: Интерфейс управления заказами

3.2.4 Управление пользователями

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

img

Рисунок 3-4: Интерфейс управления пользователями

Поддержка автора


Поддержите автора чашечкой кофе! (телефон: hellobook1)

Опубликовать ( 0 )

Вы можете оставить комментарий после Вход в систему

1
https://api.gitlife.ru/oschina-mirror/undraw-seckill.git
git@api.gitlife.ru:oschina-mirror/undraw-seckill.git
oschina-mirror
undraw-seckill
undraw-seckill
master