312 lines
7.0 KiB
Markdown
312 lines
7.0 KiB
Markdown
|
|
# 商品寄卖服务系统管理后台 - 项目启动说明
|
|||
|
|
|
|||
|
|
## ✅ 环境配置完成
|
|||
|
|
|
|||
|
|
已成功解决 Node.js 兼容性问题,项目可以正常启动。
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🔧 已完成的修复
|
|||
|
|
|
|||
|
|
### 1. Node.js 兼容性问题
|
|||
|
|
- ✅ 修改 `package.json` 添加 `--openssl-legacy-provider` 配置
|
|||
|
|
- ✅ 安装 `cross-env@7.0.3`(兼容 Node.js v16)
|
|||
|
|
|
|||
|
|
### 2. 商品寄卖服务模块
|
|||
|
|
- ✅ API 接口文件:`src/api/consignment.js`
|
|||
|
|
- ✅ 视图页面:`src/views/consignment/`
|
|||
|
|
- ✅ 路由配置:`src/router/modules/consignment.js`
|
|||
|
|
- ✅ 已注册到主路由
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🚀 启动项目
|
|||
|
|
|
|||
|
|
### 开发环境启动
|
|||
|
|
```bash
|
|||
|
|
cd /Users/a123/Documents/UthinkH5V2/single_admin22miao
|
|||
|
|
npm run dev
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
启动成功后,浏览器会自动打开:
|
|||
|
|
- **地址**:http://localhost:9527
|
|||
|
|
- **登录账号**:根据实际配置
|
|||
|
|
- **登录密码**:根据实际配置
|
|||
|
|
|
|||
|
|
### 生产环境构建
|
|||
|
|
```bash
|
|||
|
|
npm run build:prod
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📊 当前环境信息
|
|||
|
|
|
|||
|
|
### Node.js 版本
|
|||
|
|
```
|
|||
|
|
Node.js: v16.18.0
|
|||
|
|
npm: v8.19.4
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 关键依赖版本
|
|||
|
|
```json
|
|||
|
|
{
|
|||
|
|
"vue": "2.6.10",
|
|||
|
|
"element-ui": "2.13.0",
|
|||
|
|
"vue-router": "3.0.2",
|
|||
|
|
"vuex": "3.1.0",
|
|||
|
|
"axios": "^0.24.0",
|
|||
|
|
"cross-env": "7.0.3"
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🎯 商品寄卖服务模块访问路径
|
|||
|
|
|
|||
|
|
### 菜单路由
|
|||
|
|
- **主菜单**:商品寄卖服务 `/consignment`
|
|||
|
|
- **寄售商品管理**:`/consignment/merchandise`
|
|||
|
|
- **寄售商品详情**:`/consignment/merchandise/detail?id=xxx`
|
|||
|
|
- **提现管理**:`/consignment/withdraw`
|
|||
|
|
- **提现详情**:`/consignment/withdraw/detail?id=xxx`
|
|||
|
|
- **财务日志管理**:`/consignment/financial-log`
|
|||
|
|
|
|||
|
|
### 完整URL示例
|
|||
|
|
```
|
|||
|
|
http://localhost:9527/consignment/merchandise
|
|||
|
|
http://localhost:9527/consignment/withdraw
|
|||
|
|
http://localhost:9527/consignment/financial-log
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📝 项目脚本说明
|
|||
|
|
|
|||
|
|
### package.json scripts
|
|||
|
|
|
|||
|
|
```json
|
|||
|
|
{
|
|||
|
|
"dev": "cross-env NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve --open",
|
|||
|
|
"build:prod": "cross-env NODE_OPTIONS=--openssl-legacy-provider vue-cli-service build",
|
|||
|
|
"build:stage": "cross-env NODE_OPTIONS=--openssl-legacy-provider vue-cli-service build --mode staging"
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
**说明**:
|
|||
|
|
- `cross-env`:跨平台环境变量设置工具
|
|||
|
|
- `NODE_OPTIONS=--openssl-legacy-provider`:启用旧版 OpenSSL 提供程序
|
|||
|
|
- `--open`:自动打开浏览器
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🔍 常见问题
|
|||
|
|
|
|||
|
|
### 1. 端口被占用
|
|||
|
|
**错误**:`Error: listen EADDRINUSE: address already in use :::9527`
|
|||
|
|
|
|||
|
|
**解决方案**:
|
|||
|
|
```bash
|
|||
|
|
# macOS/Linux 查找并杀掉占用端口的进程
|
|||
|
|
lsof -ti:9527 | xargs kill -9
|
|||
|
|
|
|||
|
|
# 或者修改 vue.config.js 中的端口号
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 2. 模块找不到
|
|||
|
|
**错误**:`Cannot find module 'xxx'`
|
|||
|
|
|
|||
|
|
**解决方案**:
|
|||
|
|
```bash
|
|||
|
|
# 删除 node_modules 重新安装
|
|||
|
|
rm -rf node_modules package-lock.json
|
|||
|
|
npm install
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 3. 编译错误
|
|||
|
|
**错误**:`Syntax Error` 或其他编译错误
|
|||
|
|
|
|||
|
|
**解决方案**:
|
|||
|
|
1. 检查代码语法
|
|||
|
|
2. 清除缓存:`npm cache clean --force`
|
|||
|
|
3. 重启开发服务器
|
|||
|
|
|
|||
|
|
### 4. 热更新不生效
|
|||
|
|
**解决方案**:
|
|||
|
|
1. 检查 vue.config.js 配置
|
|||
|
|
2. 重启开发服务器
|
|||
|
|
3. 清除浏览器缓存
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📂 项目结构
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
single_admin22miao/
|
|||
|
|
├── docs/ # 文档目录
|
|||
|
|
│ ├── Node.js版本兼容性-问题修复.md
|
|||
|
|
│ ├── 商品寄卖服务模块-开发说明.md
|
|||
|
|
│ ├── 商品寄卖服务模块-文件清单.md
|
|||
|
|
│ ├── 商品寄卖服务模块-路由配置说明.md
|
|||
|
|
│ ├── 商品寄卖服务系统管理后台API接口PRD-完整版.md
|
|||
|
|
│ ├── 数据库设计说明.md
|
|||
|
|
│ └── 项目启动说明.md (本文件)
|
|||
|
|
├── src/
|
|||
|
|
│ ├── api/
|
|||
|
|
│ │ └── consignment.js # 商品寄卖服务API接口
|
|||
|
|
│ ├── views/
|
|||
|
|
│ │ └── consignment/ # 商品寄卖服务页面
|
|||
|
|
│ │ ├── merchandise/ # 寄售商品管理
|
|||
|
|
│ │ ├── withdraw/ # 提现管理
|
|||
|
|
│ │ └── financial-log/ # 财务日志
|
|||
|
|
│ └── router/
|
|||
|
|
│ ├── index.js # 主路由配置
|
|||
|
|
│ └── modules/
|
|||
|
|
│ └── consignment.js # 商品寄卖服务路由
|
|||
|
|
├── package.json # 项目配置
|
|||
|
|
└── vue.config.js # Vue CLI 配置
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🎨 开发规范
|
|||
|
|
|
|||
|
|
### API 接口调用
|
|||
|
|
```javascript
|
|||
|
|
import { merchandiseListApi } from '@/api/consignment';
|
|||
|
|
|
|||
|
|
async getList() {
|
|||
|
|
try {
|
|||
|
|
const res = await merchandiseListApi({
|
|||
|
|
page: 1,
|
|||
|
|
limit: 10
|
|||
|
|
});
|
|||
|
|
this.tableData = res.data.data;
|
|||
|
|
} catch (e) {
|
|||
|
|
this.$message.error(e.message);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 路由跳转
|
|||
|
|
```javascript
|
|||
|
|
// 跳转到详情页
|
|||
|
|
this.$router.push({
|
|||
|
|
path: '/consignment/merchandise/detail',
|
|||
|
|
query: { id: row.id }
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 返回上一页
|
|||
|
|
this.$router.go(-1);
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 权限控制
|
|||
|
|
```vue
|
|||
|
|
<el-button
|
|||
|
|
v-hasPermi="['admin:merchandise:update']"
|
|||
|
|
@click="handleEdit"
|
|||
|
|
>
|
|||
|
|
编辑
|
|||
|
|
</el-button>
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📚 相关文档
|
|||
|
|
|
|||
|
|
### 开发文档
|
|||
|
|
1. [商品寄卖服务模块-开发说明.md](./商品寄卖服务模块-开发说明.md)
|
|||
|
|
2. [商品寄卖服务模块-文件清单.md](./商品寄卖服务模块-文件清单.md)
|
|||
|
|
3. [商品寄卖服务模块-路由配置说明.md](./商品寄卖服务模块-路由配置说明.md)
|
|||
|
|
|
|||
|
|
### API文档
|
|||
|
|
1. [商品寄卖服务系统管理后台API接口PRD-完整版.md](./商品寄卖服务系统管理后台API接口PRD-完整版.md)
|
|||
|
|
2. [数据库设计说明.md](./数据库设计说明.md)
|
|||
|
|
|
|||
|
|
### 问题修复
|
|||
|
|
1. [Node.js版本兼容性-问题修复.md](./Node.js版本兼容性-问题修复.md)
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## ✅ 验证清单
|
|||
|
|
|
|||
|
|
启动项目前,请确认:
|
|||
|
|
- [x] Node.js v16.x 已安装
|
|||
|
|
- [x] npm 依赖已安装
|
|||
|
|
- [x] cross-env@7.0.3 已安装
|
|||
|
|
- [x] package.json 已配置 NODE_OPTIONS
|
|||
|
|
- [x] 路由模块已注册
|
|||
|
|
- [ ] 后端API服务已启动
|
|||
|
|
- [ ] 数据库连接正常
|
|||
|
|
|
|||
|
|
启动后,请验证:
|
|||
|
|
- [ ] 项目成功启动,无报错
|
|||
|
|
- [ ] 浏览器自动打开
|
|||
|
|
- [ ] 可以正常登录
|
|||
|
|
- [ ] 商品寄卖服务菜单显示正常
|
|||
|
|
- [ ] 各个页面可以正常访问
|
|||
|
|
- [ ] API接口调用正常
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🚀 快速开始
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
# 1. 进入项目目录
|
|||
|
|
cd /Users/a123/Documents/UthinkH5V2/single_admin22miao
|
|||
|
|
|
|||
|
|
# 2. 启动项目(如果还没启动)
|
|||
|
|
npm run dev
|
|||
|
|
|
|||
|
|
# 3. 等待编译完成,浏览器自动打开
|
|||
|
|
|
|||
|
|
# 4. 登录系统
|
|||
|
|
|
|||
|
|
# 5. 在左侧菜单找到"商品寄卖服务"模块
|
|||
|
|
|
|||
|
|
# 6. 开始使用功能
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 💡 开发建议
|
|||
|
|
|
|||
|
|
### 1. 代码编辑器
|
|||
|
|
推荐使用 **VS Code** 并安装以下插件:
|
|||
|
|
- Vetur(Vue 语法支持)
|
|||
|
|
- ESLint(代码检查)
|
|||
|
|
- Prettier(代码格式化)
|
|||
|
|
|
|||
|
|
### 2. 浏览器开发工具
|
|||
|
|
推荐使用 **Chrome** 并安装:
|
|||
|
|
- Vue Devtools(Vue 调试工具)
|
|||
|
|
|
|||
|
|
### 3. Git 版本控制
|
|||
|
|
```bash
|
|||
|
|
# 查看修改
|
|||
|
|
git status
|
|||
|
|
|
|||
|
|
# 提交代码
|
|||
|
|
git add .
|
|||
|
|
git commit -m "feat: 添加商品寄卖服务模块"
|
|||
|
|
git push
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📞 技术支持
|
|||
|
|
|
|||
|
|
如遇到问题,请:
|
|||
|
|
1. 查看相关文档
|
|||
|
|
2. 检查控制台错误信息
|
|||
|
|
3. 查看网络请求是否正常
|
|||
|
|
4. 确认后端API服务状态
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
**创建日期**: 2025-11-13
|
|||
|
|
**版本**: V1.0
|
|||
|
|
**状态**: ✅ 项目配置完成,可以正常启动
|
|||
|
|
**维护团队**: 开发团队
|
|||
|
|
|