基于Think PHP+Vue商城管理系統的設計與實現

閆嬌嬌

摘要：隨著微信小程序不斷發展，結合微信小程序進行商業服務的現象已經十分普遍。商家數量持續提升，微信商城的管理可以給用戶和商家帶來極大的便利，因此設計了基于Think PHP+Vue商城管理系統。該商城系統采用了ThinkPHP5.0 作為后端開發框架，前端采用Vue框架進行開發，使用Ajax技術與后臺進行交互，實現前后端的無感知交互。本商城系統可以幫助商家快速搭建自己的移動端商城，并實現商品展示、訂單管理、支付結算等功能。該系統以線上、線下渠道趨向深度融合為出發點，實現了一種能夠方便商家線上運營推廣、數據統計、門店以及平臺管理的后臺系統。

關鍵詞：微信小程序；PHP；Vue；商城；管理系統

中圖分類號：TP311? ? ? ?文獻標識碼：A

文章編號：1009-3044（2023）34-0059-04

開放科學（資源服務）標識碼（OSID）

0 引言

目前，中國互聯網已經從起步階段進入到高速發展階段，電子商務的興起也推動了互聯網的加速發展。互聯網、移動支付等技術的不斷普及，用戶獲取信息的方式也呈現多樣化。隨著用戶的消費習慣從線下轉移到線上[1]，傳統的商業模式在線上運營推廣、顧客反饋和流量變現等方面遇到了瓶頸。隨著互聯網的發展，用戶的購物習慣逐漸從線下轉移到微信等App平臺，人們更傾向去通過網絡進行便捷的消費。商家紛紛推出了自己的微信購物App，為了更好地提供更豐富更快捷的服務，一個商城管理系統對于商家來說很有必要。通過商城管理系統，商家可以對客戶的需求具有更清晰的了解，也可以快捷地對自己的商品進行操作。商家不僅可以提高自己的商品銷量，還可以進行更豐富的商業活動。

1 系統性能需求分析

1.1 實用性

微信小程序功能多樣，具有很高的跨平臺兼容性和互動性[2]，已經成為用戶生活和商家運營的重要工具。從用戶角度看，用戶可以直接掃碼或搜索使用微信小程序，無須下載安裝軟件，用戶就可以獲取生活、購物、社交、旅游、教育等信息，滿足了用戶日常生活中的各類需求。微信小程序內置了微信實時聊天功能[3]，方便與商家溝通，還可以定制用戶偏好，例如個人資料、關注的內容、推送通知等，提供更加個性化的體驗。從商家角度看，微信小程序可以幫助商家通過微信朋友圈、公眾號等方式進行商品推廣和宣傳。商家可以登錄后臺管理系統查看平臺使用教程、跨店收益，對商品內容、訂單、店鋪會員、分店等進行管理，可以完成優惠券推送、充值設置、數據統計等基礎功能。

1.2 實時性

用戶可以通過微信小程序與商家實時通信[4]，進行咨詢交流、確認交易，提高溝通效率；用戶無須更新應用或者重新加載頁面，及時獲取商家最新的信息和服務；用戶可以實時更新地理位置，獲取附近門店、優惠折扣活動等個性化信息；用戶還可以實時查看訂單變化狀態。商家在后臺管理平臺可以實時更新交易，將商品信息、用戶信息、充值管理、優惠券管理等信息實時同步到微信小程序，確保用戶瀏覽和購買獲取最新的信息。后臺管理平臺還為商家提供了實時的數據統計和分析功能，商家可以即時了解用戶的行為數據、使用習慣、購買偏好等，幫助商家及時調整經營策略和優化產品服務。

1.3 系統完整性

用戶通過微信號注冊、登錄微信小程序，平臺可以獲取用戶手機號、昵稱、頭像等信息，商家登錄后臺管理平臺可以查看整個后臺信息。商家后臺管理系統包含首頁、商品管理、微信小程序管理、用戶管理、店鋪管理、財務管理、優惠活動、信息統計展示八個模塊，具體商家后臺管理系統結構圖如圖1所示。

商家可以自定義微信小程序商城菜單欄的數量和展示順序，包括首頁、分類、購物車、排行榜、聯系商家、“我的”。用戶可以登錄小程序商城，瀏覽商品、加購商品、下單商品、商家完成訂單、用戶確認訂單等一系列流程確保系統具備完整的功能，可以為用戶提供良好的用戶體驗。

2 系統設計

2.1 關鍵技術實現

本商城系統采用了 ThinkPHP5.0 框架，Vue作為前端開發框架，并使用Ajax技術進行前后端交互，以及微信開發進行對接。本商城系統使用MySQL作為后臺數據庫，進行數據的存儲和管理，使用Vue框架進行開發，使用Vue提供的組件和指令，實現各種功能，如表單驗證、列表渲染、事件綁定等，通過Ajax技術與后臺進行數據交互。本商城后端系統采用Highcharts實現數據可視化，Highcharts附帶許多內置圖表類型，為用戶提供用于創建具有簡單數據配置的通用圖表，將數據以圖形、圖表或其他視覺元素的形式呈現，以幫助商家更好地理解和分析相關數據[5]。

2.2 商城系統功能設計

本商城管理系統包括用戶模塊和商家后臺管理模塊。用戶通過微信小程序實現注冊和登錄，用戶可以通過小程序商城首頁推送的商品輪播圖、分類導航欄、熱銷商品排行榜，搜索欄、相關產品推送等模塊瀏覽商品，還能實現個人資料管理、收貨地址管理、訂單管理、購物車、收藏夾、消息中心、優惠券管理和訂單售后服務等。商家后臺管理部分主要實現了商品管理、微信小程序管理、用戶管理、店鋪管理、財務管理、優惠活動、信息統計展示等功能。商家通過后臺管理部分可以自定義商鋪頁面組件，發布和管理商城的廣告、促銷活動，查看商城的銷售數據、用戶活動情況等，并查看生成的報表信息。

2.3 商城系統詳細設計

1） 首頁登錄設計

系統首頁展示店鋪信息，頁面設計采用刷雙欄布局，包括標題欄、左側樹形菜單欄、工作空間。左側樹形菜單欄包含商品管理、微信小程序管理、用戶管理、店鋪管理、財務管理、優惠活動和信息統計菜單項，并支持子菜單的展開和折疊。其中，商家成功登錄商城后臺管理系統后，首頁工作空間展示的是用戶訪問店鋪的相關具體數據。商城首頁界面如圖2所示。

2） 商品管理

商家可以通過該模塊管理小程序的商品信息，包括添加、編輯、刪除商品，設置商品屬性、庫存管理、價格管理、商品分類等功能。還可以進行商品的上架和下架操作，并提供商品搜索和篩選功能等。可以實時監控庫存量，及時補充商品，避免缺貨情況的發生。商品分類管理和商品管理如圖3和圖4所示。

3） 商家自定義界面設計

商家自定義界面設計包含界面內置組件和自定義組件兩部分。內置組件包括搜索框、分類導航、焦點圖、推薦商品、熱銷商品、新品預售。自定義組件包括焦點圖、圖片設置、自定義導航以及商品等。商家可以在后臺管理系統設計店鋪界面，還可以自定義商城菜單組件的數量和展示順序。商家自定義界面如圖5所示。

4） 用戶管理

商家可以管理小程序的用戶信息，包括注冊、登錄、權限管理、用戶列表和用戶詳情等功能。可以對用戶進行分類、搜索、禁用或刪除等操作。這個模塊用于處理小程序的客戶服務問題，包括用戶咨詢、投訴、售后問題等。商家可以對客戶的問題進行回復、處理，并記錄相關的溝通和解決過程。商家可以在訂單管理設計中，查看訂單編號、訂單金額、實際金額、訂單狀態，商家還可以點擊“查看”鏈接，跳轉到訂單詳情，點擊“查看明細”鏈接，跳轉到訂單詳情。用戶管理圖如圖6所示。

5） 店鋪管理

店鋪管理包括分店管理和店員管理兩個模塊。分店管理包括分店基本信息管理、權限管理、分店數據統計、跨店管理、基本維護信息管理等，允許總部或其他分店之間進行數據共享和交流，方便商品調撥、跨店促銷等活動。店員管理包括店員信息管理、店員權限管理、考勤打卡等，以滿足具體的業務需求。店鋪管理界面圖如圖7所示。

6） 充值設計

商家可以在后臺管理系統根據設計的充值促銷活動，吸引用戶充值。該界面提供一些預設的充值金額選項，以方便用戶快速選擇。同時也支持用戶自定義充值金額，以滿足不同用戶的需求。充值設計界面如圖8所示。

7） 數據統計

本后臺管理系統對商城數據進行多維度報表展示，包括并不僅限于訪問信息、用戶信息、商品信息和財務信息，首頁中還實現了按照天、月、季度對信息進行統計展示，幫助商家了解用戶和業務情況，方便后續做出相應的調整和優化。數據統計餅狀圖如圖9所示。

8） 優惠活動

商家可以創建和管理小程序的營銷活動，如優惠券、促銷活動、秒殺等。可以設置活動的時間、范圍、參與條件，以及查看活動的效果和統計數據。優惠活動界面設計如圖10所示。

3 數據庫設計

本商城系統涉及的主要數據庫表主要包括用戶表、分店表、購物車表、商品表和訂單表等，具體如表1、表2、表3、表4、表5所示。

4 結論

本商城系統采用了ThinkPHP5.0 作為后端開發框架，包含前端、后端、微信端三部分。前端采用Vue框架進行開發，使用Ajax技術與后臺進行交互，實現前后端的無感知交互。本商城系統可以幫助商家快速搭建自己的移動端商城，并實現商品展示、訂單管理、支付結算等功能。在開發微信小程序商城系統時，考慮用戶體驗、交互設計、性能優化等方面，確保系統的穩定性和易用性。一個成功的微信小程序商城系統不僅僅需要技術上的支持，還需要有好的營銷策略和客戶服務。只有通過不斷地完善和提升，才能獲得用戶的認可和忠誠度，達到商業價值的最大化。

參考文獻：

[1]馬靜.基于微信小程序的購物商城系統的設計與實現[J].微型電腦應用，2021，37（3）：31-34.

[2] 劉彩萍.探討基于微信小程序的網上購物系統的設計與實現[J].數字技術與應用，2023，41（8）：182-184.

[3] 杜雨荃，王曉菊，田立勤.基于微信小程序的網上購物系統的設計與實現[J].網絡安全技術與應用，2022（4）：60-62.

[4] 李常寶.基于微信小程序的電子商城的設計與開發[J].呂梁教育學院學報，2021，38（3）：133-136.

[5] 黃菊華.微信小程序商城開發：界面設計實戰[M].北京：機械工業出版社，2019.

【通聯編輯：梁書】