Files
movecheck/API使用说明.md

289 lines
6.9 KiB
Markdown
Raw Normal View History

# API接口封装使用说明
## 📋 概述
已为您封装了完整的HTTP请求工具和API接口包括您需要的历史数据接口。
## 🛠️ 封装内容
### 1. HTTP请求工具 (`src/utils/http.js`)
- 基于uni.request封装的通用HTTP工具类
- 支持GET、POST、PUT、DELETE请求
- 支持文件上传和下载
- 统一的错误处理和日志记录
- 可配置的基础URL、超时时间、请求头
### 2. API接口封装 (`src/utils/api.js`)
- 统一管理所有API接口
- 包含历史数据、设备、环境参数、报警、日志、用户等接口
- 模块化设计,便于维护和扩展
### 3. 全局注册 (`src/main.js`)
- 将HTTP服务和API注册为全局属性
- 在Vue组件中可直接使用`this.$http``this.$api`
## 🎯 历史数据接口
### 接口信息
- **URL**: `http://110.40.171.179:7999/api/data/history`
- **方法**: POST
- **入参**:
```json
{
"startTime": "2025-09-30 06:51:40",
"endTime": "2025-09-30 23:51:40"
}
```
### 使用方式
#### 方式1: 直接使用API
```javascript
import { dataHistoryApi } from '@/utils/api.js'
// 获取历史数据
const getHistoryData = async () => {
try {
const response = await dataHistoryApi.getHistory({
startTime: "2025-09-30 06:51:40",
endTime: "2025-09-30 23:51:40"
})
console.log('历史数据:', response)
} catch (error) {
console.error('获取失败:', error)
}
}
```
#### 方式2: 在Vue组件中使用
```javascript
export default {
data() {
return {
historyData: []
}
},
methods: {
async loadHistoryData() {
try {
uni.showLoading({
title: '加载历史数据中...'
})
const response = await this.$api.dataHistory.getHistory({
startTime: "2025-09-30 06:51:40",
endTime: "2025-09-30 23:51:40"
})
if (response.code === 200) {
this.historyData = response.data
uni.showToast({
title: '数据加载成功',
icon: 'success'
})
}
} catch (error) {
console.error('加载失败:', error)
uni.showToast({
title: error.message || '数据加载失败',
icon: 'error'
})
} finally {
uni.hideLoading()
}
}
}
}
```
#### 方式3: 使用HTTP服务
```javascript
// 直接使用HTTP服务
const response = await this.$http.post('/api/data/history', {
startTime: "2025-09-30 06:51:40",
endTime: "2025-09-30 23:51:40"
})
```
## 📚 其他API接口
### 设备相关接口
```javascript
// 获取设备详情
const device = await this.$api.device.getDetail('deviceId')
// 获取设备列表
const devices = await this.$api.device.getList({ page: 1, size: 10 })
// 更新设备状态
await this.$api.device.updateStatus('deviceId', 'online')
```
### 环境参数接口
```javascript
// 获取环境参数
const params = await this.$api.environment.getParams()
// 获取环境参数历史
const history = await this.$api.environment.getHistory({
startTime: "2025-09-30 06:51:40",
endTime: "2025-09-30 23:51:40"
})
```
### 报警相关接口
```javascript
// 获取报警记录
const alarms = await this.$api.alarm.getRecords({ page: 1, size: 10 })
// 获取报警统计
const statistics = await this.$api.alarm.getStatistics()
// 处理报警
await this.$api.alarm.handleAlarm('alarmId', 'resolved')
```
### 系统日志接口
```javascript
// 获取系统日志
const logs = await this.$api.log.getLogs({ page: 1, size: 10 })
// 获取日志统计
const statistics = await this.$api.log.getStatistics()
```
### 用户相关接口
```javascript
// 用户登录
const loginResult = await this.$api.user.login({
username: 'admin',
password: 'password'
})
// 获取用户信息
const userInfo = await this.$api.user.getUserInfo()
// 更新用户信息
await this.$api.user.updateUserInfo({ name: '新用户名' })
```
## ⚙️ 配置选项
### 修改基础URL
```javascript
// 在main.js中或组件中修改
this.$http.setBaseURL('https://your-api-domain.com')
```
### 修改超时时间
```javascript
this.$http.setTimeout(15000) // 15秒
```
### 添加默认请求头
```javascript
this.$http.setDefaultHeaders({
'Authorization': 'Bearer your-token',
'X-Custom-Header': 'custom-value'
})
```
## 🔧 错误处理
### 统一错误处理
```javascript
try {
const response = await this.$api.dataHistory.getHistory(params)
// 处理成功响应
} catch (error) {
// 统一错误处理
console.error('API请求失败:', error.message)
// 显示用户友好的错误信息
uni.showToast({
title: error.message || '请求失败',
icon: 'error'
})
}
```
### 自定义错误处理
```javascript
// 在http.js中可以自定义错误处理逻辑
// 例如:根据错误码显示不同的提示信息
```
## 📝 使用示例
### 完整的使用示例
```javascript
export default {
data() {
return {
historyData: [],
loading: false
}
},
async onLoad() {
await this.loadHistoryData()
},
methods: {
async loadHistoryData() {
this.loading = true
try {
// 获取今天的数据
const today = new Date()
const startTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0)
const endTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59)
const response = await this.$api.dataHistory.getHistory({
startTime: this.formatDateTime(startTime),
endTime: this.formatDateTime(endTime)
})
if (response.code === 200) {
this.historyData = response.data
} else {
throw new Error(response.message || '数据加载失败')
}
} catch (error) {
console.error('加载历史数据失败:', error)
uni.showModal({
title: '提示',
content: error.message || '数据加载失败,请重试',
showCancel: false
})
} finally {
this.loading = false
}
},
formatDateTime(date) {
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
const hours = String(date.getHours()).padStart(2, '0')
const minutes = String(date.getMinutes()).padStart(2, '0')
const seconds = String(date.getSeconds()).padStart(2, '0')
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
}
}
}
```
## 🎉 总结
现在您可以在项目中使用封装好的API接口
1. **历史数据接口**: `this.$api.dataHistory.getHistory(params)`
2. **其他业务接口**: 设备、环境、报警、日志、用户等
3. **HTTP服务**: `this.$http` 用于自定义请求
4. **统一错误处理**: 自动处理网络错误和业务错误
5. **日志记录**: 自动记录请求和响应日志
所有接口都已经配置好基础URL `http://110.40.171.179:7999`,您可以直接使用!