64 lines
1.9 KiB
Markdown
64 lines
1.9 KiB
Markdown
|
# 药店销售预测系统 - 前端界面
|
|||
|
|
|
|||
|
|
这是一个使用 Vue 3, Vite, Element Plus 和 Vue Router 构建的前端管理界面，用于与药店销售预测系统的后端API进行交互。
|
|||
|
|
|
|||
|
|
## 功能模块
|
|||
|
|
|
|||
|
|
- **首页**: 系统功能概览和快捷入口。
|
|||
|
|
- **数据管理**: 浏览产品数据，上传新的销售数据Excel文件。
|
|||
|
|
- **模型训练**: 选择产品和模型类型，启动异步训练任务，并实时查看任务状态。
|
|||
|
|
- **模型预测**: 对指定产品进行销售预测，支持单模型预测和多模型效果对比，并提供可视化图表。
|
|||
|
|
- **模型管理**: 查看、筛选、搜索、导入、导出和删除已训练的模型。
|
|||
|
|
|
|||
|
|
## 技术栈
|
|||
|
|
|
|||
|
|
- **Vue 3**: 渐进式JavaScript框架。
|
|||
|
|
- **Vite**: 下一代前端开发与构建工具。
|
|||
|
|
- **Vue Router**: Vue.js 的官方路由。
|
|||
|
|
- **Element Plus**: 基于 Vue 3 的桌面端组件库。
|
|||
|
|
- **Axios**: 一个基于 promise 的 HTTP 库。
|
|||
|
|
- **Chart.js**: 用于数据可视化的JavaScript图表库。
|
|||
|
|
|
|||
|
|
## 安装和运行
|
|||
|
|
|
|||
|
|
### 前提条件
|
|||
|
|
|
|||
|
|
- [Node.js](https://nodejs.org/) (建议使用LTS版本)
|
|||
|
|
- [pnpm](https://pnpm.io/) (可选，但推荐)
|
|||
|
|
|
|||
|
|
### 步骤
|
|||
|
|
|
|||
|
|
1. **进入UI目录**
|
|||
|
|
```bash
|
|||
|
|
cd UI
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
2. **安装依赖**
|
|||
|
|
使用 npm:
|
|||
|
|
```bash
|
|||
|
|
npm install
|
|||
|
|
```
|
|||
|
|
或者使用 pnpm:
|
|||
|
|
```bash
|
|||
|
|
pnpm install
|
|||
|
|
```
|
|||
|
|
或者使用 yarn:
|
|||
|
|
```bash
|
|||
|
|
yarn
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
3. **启动开发服务器**
|
|||
|
|
```bash
|
|||
|
|
npm run dev
|
|||
|
|
```
|
|||
|
|
该命令会启动一个本地开发服务器，你可以在浏览器中访问 `http://localhost:5173` (或终端提示的其他端口) 来查看界面。
|
|||
|
|
|
|||
|
|
**重要**:
|
|||
|
|
- 请确保后端的Flask API服务正在运行中。
|
|||
|
|
- Vite配置文件中已设置了代理，所有 `/api` 开头的请求都会被转发到 `http://127.0.0.1:5000`。
|
|||
|
|
|
|||
|
|
4. **构建生产版本**
|
|||
|
|
```bash
|
|||
|
|
npm run build
|
|||
|
|
```
|
|||
|
|
该命令会将项目打包到 `dist` 目录，用于生产环境部署。
|