204 lines
5.6 KiB
Markdown
204 lines
5.6 KiB
Markdown
<div align="center">
|
||
<h1>🛒 小程序商城后台管理系统</h1>
|
||
<p><strong>基于 Vue 3 + Ant Design Vue 的企业级小程序商城后台</strong></p>
|
||
|
||
<p>
|
||
<img src="https://img.shields.io/badge/Vue-3.x-4FC08D" alt="Vue">
|
||
<img src="https://img.shields.io/badge/Ant%20Design%20Vue-4.x-1890FF" alt="Ant Design Vue">
|
||
<img src="https://img.shields.io/badge/TypeScript-5.x-3178C6" alt="TypeScript">
|
||
<img src="https://img.shields.io/badge/Vite-8.x-646CFF" alt="Vite">
|
||
<img src="https://img.shields.io/badge/License-MIT-blue" alt="License">
|
||
</p>
|
||
</div>
|
||
|
||
## 📖 项目简介
|
||
|
||
小程序商城后台管理系统是一个基于 **Vue 3 + Ant Design Vue** 构建的现代化企业级商城管理平台,为小程序商城提供完整的后台管理能力,涵盖商品、订单、会员、经销商、门店、营销活动等核心业务模块。
|
||
|
||
- **前端框架**:Vue 3 + TypeScript + Vite
|
||
- **UI 组件库**:Ant Design Vue 4.x + EleAdmin Pro
|
||
- **状态管理**:Pinia
|
||
- **图表库**:ECharts + @antv/g2
|
||
- **工具库**:Lodash、Day.js、CryptoJS、ExcelJS
|
||
|
||
**项目域名**:[https://shop.websoft.top](https://shop.websoft.top)
|
||
|
||
**官方产品介绍**:[https://websoft.top/shop](https://websoft.top/shop)
|
||
|
||
## 🛠️ 技术栈
|
||
|
||
### 核心技术
|
||
|
||
| 技术 | 版本 | 说明 |
|
||
|------|------|------|
|
||
| Vue | 3.x | 渐进式 JavaScript 框架 |
|
||
| TypeScript | 5.x | JavaScript 的超集 |
|
||
| Vite | 8.x | 下一代前端构建工具 |
|
||
| Ant Design Vue | 4.x | 企业级 UI 设计语言 |
|
||
| EleAdmin Pro | 1.11+ | 企业级组件库 |
|
||
| Pinia | 2.x | Vue 3 状态管理库 |
|
||
|
||
### 功能组件
|
||
|
||
- **TinyMCE** - 富文本编辑器,支持图片/视频上传
|
||
- **ECharts** - 数据可视化图表库
|
||
- **CropperJS** - 图片裁剪组件
|
||
- **ExcelJS / xlsx** - Excel 文件导入导出
|
||
- **Ali OSS** - 阿里云对象存储
|
||
- **qrcode / jsbarcode** - 二维码与条形码生成
|
||
|
||
## 📋 环境要求
|
||
|
||
### 基础环境
|
||
|
||
- 🟢 **Node.js 18+**
|
||
- 📦 **npm 8+ / yarn 1.22+ / pnpm 8+**
|
||
- 🌐 **现代浏览器**(Chrome 63+、Firefox、Safari、Edge)
|
||
|
||
### 开发工具
|
||
|
||
- **推荐**:VS Code / WebStorm
|
||
- **插件**:Volar(Vue 3 支持)
|
||
|
||
## 🚀 快速开始
|
||
|
||
### 1. 克隆项目
|
||
|
||
```bash
|
||
git clone <仓库地址>
|
||
cd guilixu-admin
|
||
```
|
||
|
||
### 2. 安装依赖
|
||
|
||
```bash
|
||
# 使用 npm
|
||
npm install
|
||
|
||
# 或使用 yarn
|
||
yarn install
|
||
|
||
# 或使用 pnpm(推荐)
|
||
pnpm install
|
||
```
|
||
|
||
### 3. 配置环境变量
|
||
|
||
```bash
|
||
# 复制环境变量示例文件
|
||
cp .env.example .env
|
||
|
||
# 编辑 .env 文件,填入您的配置信息
|
||
# 注意:请不要将 .env 文件提交到版本控制系统
|
||
```
|
||
|
||
### 4. 启动开发服务器
|
||
|
||
```bash
|
||
# 开发模式
|
||
npm run dev
|
||
|
||
# 或
|
||
yarn dev
|
||
```
|
||
|
||
访问 `http://localhost:3000` 即可看到管理后台。
|
||
|
||
### 5. 构建生产版本
|
||
|
||
```bash
|
||
# 生产构建
|
||
npm run build
|
||
|
||
# 预览构建结果
|
||
npm run serve
|
||
```
|
||
|
||
## ⚙️ 环境变量配置
|
||
|
||
项目使用环境变量来管理敏感信息和配置。请按照以下步骤配置:
|
||
|
||
### 必需配置
|
||
|
||
```bash
|
||
# API 配置
|
||
VITE_API_URL=https://your-api.com/api # 后端 API 地址
|
||
VITE_SERVER_API_URL=https://your-server.com/api # 服务端 API 地址
|
||
VITE_FILE_SERVER=https://your-file-server.com # 文件服务器地址
|
||
|
||
# 应用配置
|
||
VITE_APP_SECRET=your_app_secret # 应用密钥
|
||
VITE_TENANT_ID=your_tenant_id # 租户 ID
|
||
```
|
||
|
||
### 可选配置
|
||
|
||
```bash
|
||
# 高德地图 (如需使用地图功能)
|
||
VITE_MAP_KEY=your_map_key # 高德地图 Key
|
||
VITE_MAP_CODE=your_map_security_code # 高德地图安全密钥
|
||
|
||
# EleAdmin Pro 授权 (商业版功能)
|
||
VITE_LICENSE_CODE=your_license_code # 授权码
|
||
```
|
||
|
||
## 🎯 核心功能
|
||
|
||
### 🛒 商城管理
|
||
|
||
- **商品管理**:商品信息编辑、规格设置、SKU 管理、商品分类
|
||
- **订单管理**:订单流程跟踪、订单商品管理
|
||
- **库存管理**:商品库存监控
|
||
- **优惠券管理**:优惠券创建与发放、用户优惠券管理
|
||
- **营销活动**:活动管理、活动报名、积分商品
|
||
- **礼品管理**:商城礼品配置
|
||
|
||
### 🏪 门店与经销商
|
||
|
||
- **门店管理**:门店信息、门店围栏、门店骑手、门店仓库
|
||
- **经销商体系**:经销商申请、经销商用户、经销商订单、经销商资金与提现
|
||
- **分销设置**:经销商推荐人、分销海报、分销配置
|
||
|
||
### 👥 会员管理
|
||
|
||
- **会员注册**:会员注册管理
|
||
- **会员权益**:权益包管理、权益兑换
|
||
- **会员推荐**:推荐人关系管理
|
||
|
||
### 👤 用户权限
|
||
|
||
- **用户管理**:用户信息维护、用户分组
|
||
- **角色权限**:基于角色的访问控制(RBAC)
|
||
- **菜单管理**:动态菜单配置
|
||
- **组织架构**:组织与部门管理
|
||
|
||
### ⚙️ 系统管理
|
||
|
||
- **系统配置**:商城设置、提现配置
|
||
- **支付管理**:支付配置、订单支付
|
||
- **字典管理**:数据字典维护
|
||
- **缓存管理**:缓存清理
|
||
- **域名管理**:域名白名单配置
|
||
- **操作记录**:登录记录、操作日志
|
||
|
||
## 🏗️ 项目结构
|
||
|
||
```
|
||
src/
|
||
├── components/ # 公共组件
|
||
├── views/ # 页面组件
|
||
│ ├── shop/ # 商城管理(商品、订单、门店、经销商、会员等)
|
||
│ ├── system/ # 系统管理(用户、角色、菜单、字典、支付等)
|
||
│ ├── passport/ # 登录认证
|
||
│ ├── user/ # 用户中心
|
||
│ └── result/ # 结果页
|
||
├── router/ # 路由配置
|
||
├── store/ # Pinia 状态管理
|
||
├── utils/ # 工具函数
|
||
└── assets/ # 静态资源
|
||
```
|
||
|
||
## 📄 License
|
||
|
||
[MIT](LICENSE)
|