基于Springboot + vue3實現的時尚美妝電商網站

項目描述

本系統包含管理員和用戶兩個角色。
管理員角色:
  1. 商品分類管理:新增、查看、修改、刪除商品分類。

  2. 商品信息管理:新增、查看、修改、刪除、查看評論商品信息。

  3. 用戶管理:新增、查看、修改、刪除用戶。

  4. 管理員管理:查看、修改管理員信息。

  5. 輪播圖管理:新增、查看、修改、刪除輪播圖。

  6. 訂單管理:查看全部訂單、未支付訂單、已支付訂單、已完成訂單、已取消訂單、已退款訂單、已發貨訂單,并進行物流、發貨、確認收貨等操作。

用戶角色:
  1. 地址管理:新增、查看、修改、刪除地址。

  2. 購物車管理:新增、查看、修改、刪除購物車。

  3. 我的收藏管理:新增、查看、修改、刪除我的收藏。

  4. 訂單管理:查看全部訂單、未支付訂單、已支付訂單、已完成訂單、已取消訂單、已退款訂單、已發貨訂單,并進行物流、確認收貨等操作。

  5. 商品信息管理:查看、查看評論商品信息。

技術選型

開發工具:Idea + Vscode 運行環境:JDK 1.8 + Maven + MySQL 5.7以上 + Node.js 14 服務端技術:SpringBoot + Mybatis-Plus + Maven 前端技術:Vue3 + Axios + Element-UI

系統截圖

1.首頁

圖片

2.商品信息

圖片

3.商品詳情

圖片

4.購物車

圖片

5.提交訂單

圖片

6.個人中心

圖片

7.后臺登錄

圖片

8.商品信息管理

圖片

9.用戶管理

圖片

10.管理員管理

圖片

11.輪播圖管理

圖片

12.商品訂單管理

圖片

運行步驟

準備環境

安裝JDK 1.8、Maven、Node.js 14 和 MySQL 5.7以上

創建數據庫

使用Navicat工具創建數據庫并導入SQL腳本

配置后端

修改application.yml中的數據庫連接信息(用戶名/密碼/庫名)

啟動后端服務

進入后端項目(/server_code) 執行:

mvn clean install
mvn spring-boot:run

前端依賴安裝

進入前端目錄(/manage_code或者/client_code) 執行安裝命令:

npm install

啟動前端服務

執行啟動命令:

npm run serve?

訪問系統

后端接口系統訪問地址: http://localhost:8080 后臺系統前端訪問地址: http://localhost:8081 前臺系統前端訪問地址: http://localhost:8082

常見問題

端口沖突
  • 修改后端配置文件application.yml

  • 修改前端配置文件vue.config.js

前端安裝依賴失敗
  • 刪除node_modules、package-lock.json文件
rm -rf node_modules package-lock.json
  • 清除緩存
npm cache clean --force
  • 切換npm鏡像源
npm config set registry https://registry.npmmirror.com

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/97920.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/97920.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/97920.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

網絡協議之https?

寫在前面 https協議還是挺復雜的,本人也是經過了很多次的學習,依然感覺一知半解,無法將所有的知識點串起來,本次學習呢,也是有很多的疑惑點,但是還是盡量的輸出內容,來幫助自己和在看文章的你來…

word運行時錯誤‘53’,文件未找到:MathPage.WLL,更改加載項路徑完美解決

最簡單的方法解決!!!安裝Mathtype之后粘貼顯示:運行時錯誤‘53’,文件未找到:MathPage.WLLwin11安裝mathtype后會有這個錯誤,這是由于word中加載項加載mathtype路徑出錯導致的,這時候…

React實現列表拖拽排序

本文主要介紹一下React實現列表拖拽排序方法,具體樣式如下圖首先,簡單展示一下組件的數據結構 const CodeSetting props > {const {$t, // 國際化翻譯函數vm, // 視圖模型數據vm: {CodeSet: { Enable [], …

將 MySQL 表數據導出為 CSV 文件

目錄 一、實現思路 二、核心代碼 1. 數據庫連接部分 2. 數據導出核心邏輯 3. CSV文件寫入 三、完整代碼實現 五、輸出結果 一、實現思路 建立數據庫連接 查詢目標表的數據總量和具體數據 獲取表的列名作為CSV文件的表頭 將查詢結果轉換為二維數組格式 使用Hutool工具…

一文讀懂RAG:從生活場景到核心邏輯,AI“查資料答題”原來這么簡單

一文讀懂RAG:從生活場景到核心邏輯,AI“查資料答題”原來這么簡單 要理解 RAG(Retrieval-Augmented Generation,檢索增強生成),不需要先背復雜公式,我們可以從一個生活場景切入——它本質是讓AI…

git將當前分支推送到遠端指定分支

在 Git 中&#xff0c;將當前本地分支推送到遠程倉庫的指定分支&#xff0c;可以使用 git push 命令&#xff0c;并指定本地分支和遠程分支的映射關系。 基本語法 git push <遠程名稱> <本地分支名>:<遠程分支名><遠程名稱>&#xff1a;通常是 origin&…

【Linux】線程封裝

提示&#xff1a;文章寫完后&#xff0c;目錄可以自動生成&#xff0c;如何生成可參考右邊的幫助文檔 文章目錄 一、為什么需要封裝線程庫&#xff1f; pthread的痛點&#xff1a; 封裝帶來的好處&#xff1a; 二、線程封裝核心代碼解析 1. 頭文件定義&#xff08;Thread.hpp&a…

智慧交通管理信號燈通信4G工業路由器應用

在交通信號燈管理中傳統的有線通訊&#xff08;光纖、網線&#xff09;存在部署成本高、偏遠區域覆蓋難、故障維修慢等問題&#xff0c;而4G工業路由器憑借無線化、高穩定、強適配的特性&#xff0c;成為信號燈與管控平臺間的數據傳輸核心&#xff0c;適配多場景需求。智慧交通…

《Python Flask 實戰:構建一個可交互的 Web 應用,從用戶輸入到智能響應》

《Python Flask 實戰:構建一個可交互的 Web 應用,從用戶輸入到智能響應》 一、引言:從“Hello, World!”到“你好,用戶” 在 Web 應用的世界里,最打動人心的功能往往不是炫酷的界面,而是人與系統之間的真實互動。一個簡單的輸入框,一句個性化的回應,往往能讓用戶感受…

開發效率翻倍:資深DBA都在用的MySQL客戶端利器

MySQL 連接工具&#xff08;也稱為客戶端或圖形化界面工具&#xff0c;GUI Tools&#xff09;是數據庫開發、管理和運維中不可或缺的利器。它們比命令行更直觀&#xff0c;能極大提高工作效率。以下是一份主流的 MySQL 連接工具清單&#xff0c;并附上了它們的優缺點和適用場景…

基于Docker和Kubernetes的CI/CD流水線架構設計與優化實踐

基于Docker和Kubernetes的CI/CD流水線架構設計與優化實踐 本文分享了在生產環境中基于Docker和Kubernetes構建高效可靠的CI/CD流水線的實戰經驗&#xff0c;包括業務場景、技術選型、詳細方案、踩坑與解決方案&#xff0c;以及最終的總結與最佳實踐&#xff0c;幫助后端開發者快…

Trae x 圖片素描MCP一鍵將普通圖片轉換為多風格素描效果

目錄前言一、核心工具與優勢解析二、操作步驟&#xff1a;從安裝到生成素描效果第一步&#xff1a;獲取MCP配置代碼第二步&#xff1a;下載第三步&#xff1a;在 Trae 中導入 MCP 配置并建立連接第四步&#xff1a;核心功能調用三、三大素描風格差異化應用四.總結前言 在設計創…

2 XSS

XSS的原理 XSS&#xff08;跨站腳本攻擊&#xff09;原理 1. 核心機制 XSS攻擊的本質是惡意腳本在用戶瀏覽器中執行。攻擊者通過向網頁注入惡意代碼&#xff0c;當其他用戶訪問該頁面時&#xff0c;瀏覽器會執行這些代碼&#xff08;沒有對用戶的輸入進行過濾導致用戶輸入的…

GitHub每日最火火火項目(9.3)

1. pedroslopez / whatsapp-web.js 項目名稱&#xff1a;whatsapp-web.js項目介紹&#xff1a;基于 JavaScript 開發&#xff0c;是一個用于 Node.js 的 WhatsApp 客戶端庫&#xff0c;通過 WhatsApp Web 瀏覽器應用進行連接&#xff08;A WhatsApp client library for NodeJS …

Ansible變量

Ansible變量定義變量規則&#xff1a;由字母/數字/下劃線組成&#xff0c;變量需要以字母開頭&#xff0c;ansible內置的關鍵字不能作為變量。ansible中&#xff0c;可以將變量簡化為三個范圍&#xff1a;Global范圍&#xff08;高&#xff09;&#xff1a;從命令行和ansible配…

Elasticsearch 核心特性與應用指南

最近在準備面試&#xff0c;正把平時積累的筆記、項目中遇到的問題與解決方案、對核心原理的理解&#xff0c;以及高頻業務場景的應對策略系統梳理一遍&#xff0c;既能加深記憶&#xff0c;也能讓知識體系更扎實&#xff0c;供大家參考&#xff0c;歡迎討論。一、核心優勢 Ela…

力扣115:不同的子序列

力扣115:不同的子序列題目思路代碼題目 給你兩個字符串 s 和 t &#xff0c;統計并返回在 s 的 子序列 中 t 出現的個數。 測試用例保證結果在 32 位有符號整數范圍內。 思路 首先我們來考慮特殊情況&#xff0c;當s串的長度小于t串時s串肯定就沒有t串了。其他情況我們就需…

2004-2023年各省生活垃圾無害化處理率數據(無缺失)

2004-2023年各省生活垃圾無害化處理率數據&#xff08;無缺失&#xff09; 1、時間&#xff1a;2004-2023年 2、來源&#xff1a;國家統計局、統計年鑒 3、指標&#xff1a;生活垃圾無害化處理率 4、范圍&#xff1a;30省 5、指標解釋&#xff1a;生活垃圾無害化處理率指報…

【Python練習題】Python小白必練100題答案-第21-40題

練習題直達鏈接Python小白必練100題答案-第1-20題點我直達Python小白必練100題答案-第21-40題點我直達Python小白必練100題答案-第41-60題點我直達Python小白必練100題答案-第61-80題點我直達Python小白必練100題答案-第81-97題點我直達目錄專欄導讀循環結構 字符串操作第三部…

添加?件--場景?

添加?件–場景? 學習到這?&#xff0c;我們已經清楚了如何向倉庫中添加?件&#xff0c;并且對于?作區、暫存區、版本庫也有了?定的認識。那么我們再展??種添加?件的場景&#xff0c;能加深對?作區、暫存區、版本庫的理解&#xff0c;?例如下&#xff1a; roothcss-e…