添加订单卡片
This commit is contained in:
WindowBird
parent
756c105399
commit
5fc98a2007
|
|
@ -1,216 +0,0 @@
|
|||
# 订单API使用说明
|
||||
|
||||
## 概述
|
||||
|
||||
订单API提供了完整的订单管理功能，包括设备续费、订单创建、查询、取消和支付等功能。
|
||||
|
||||
## API接口列表
|
||||
|
||||
### 1. 设备续费 (renewDevice)
|
||||
|
||||
**接口地址:** `POST /app/order/renew`
|
||||
|
||||
**功能描述:** 为指定设备进行续费操作
|
||||
|
||||
**请求参数:**
|
||||
```javascript
|
||||
{
|
||||
"suitId": "3", // 套餐ID
|
||||
"appId": "1", // 应用ID
|
||||
"payAmount": "365", // 支付金额
|
||||
"channelId": "2", // 渠道ID
|
||||
"devId": "1" // 设备ID
|
||||
}
|
||||
```
|
||||
|
||||
**使用示例:**
|
||||
```javascript
|
||||
import { renewDevice } from '@/api/order/order.js'
|
||||
|
||||
// 设备续费
|
||||
const renewData = {
|
||||
suitId: '3',
|
||||
appId: '1',
|
||||
payAmount: '365',
|
||||
channelId: '2',
|
||||
devId: '1'
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await renewDevice(renewData)
|
||||
console.log('续费成功:', response)
|
||||
} catch (error) {
|
||||
console.error('续费失败:', error)
|
||||
}
|
||||
```
|
||||
|
||||
### 2. 创建订单 (createOrder)
|
||||
|
||||
**接口地址:** `POST /app/order/create`
|
||||
|
||||
**功能描述:** 创建新的订单
|
||||
|
||||
**请求参数:**
|
||||
```javascript
|
||||
{
|
||||
"deviceType": "设备类型",
|
||||
"period": "租赁周期",
|
||||
"amount": "订单金额",
|
||||
// 其他订单相关参数...
|
||||
}
|
||||
```
|
||||
|
||||
### 3. 获取订单列表 (getOrderList)
|
||||
|
||||
**接口地址:** `GET /app/order/list`
|
||||
|
||||
**功能描述:** 获取订单列表，支持分页和状态筛选
|
||||
|
||||
**请求参数:**
|
||||
```javascript
|
||||
{
|
||||
"page": 1, // 页码
|
||||
"size": 10, // 每页数量
|
||||
"status": "" // 订单状态（可选）
|
||||
}
|
||||
```
|
||||
|
||||
### 4. 获取订单详情 (getOrderDetail)
|
||||
|
||||
**接口地址:** `GET /app/order/detail/{orderId}`
|
||||
|
||||
**功能描述:** 获取指定订单的详细信息
|
||||
|
||||
**路径参数:**
|
||||
- `orderId`: 订单ID
|
||||
|
||||
### 5. 取消订单 (cancelOrder)
|
||||
|
||||
**接口地址:** `POST /app/order/cancel/{orderId}`
|
||||
|
||||
**功能描述:** 取消指定订单
|
||||
|
||||
**路径参数:**
|
||||
- `orderId`: 订单ID
|
||||
|
||||
### 6. 支付订单 (payOrder)
|
||||
|
||||
**接口地址:** `POST /app/order/pay`
|
||||
|
||||
**功能描述:** 为指定订单进行支付
|
||||
|
||||
**请求参数:**
|
||||
```javascript
|
||||
{
|
||||
"orderId": "订单ID",
|
||||
"payMethod": "支付方式"
|
||||
}
|
||||
```
|
||||
|
||||
## 完整使用示例
|
||||
|
||||
```javascript
|
||||
import {
|
||||
renewDevice,
|
||||
createOrder,
|
||||
getOrderList,
|
||||
getOrderDetail,
|
||||
cancelOrder,
|
||||
payOrder
|
||||
} from '@/api/order/order.js'
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
// 设备续费
|
||||
async handleRenew() {
|
||||
try {
|
||||
const renewData = {
|
||||
suitId: '3',
|
||||
appId: '1',
|
||||
payAmount: '365',
|
||||
channelId: '2',
|
||||
devId: '1'
|
||||
}
|
||||
|
||||
const response = await renewDevice(renewData)
|
||||
console.log('续费成功:', response)
|
||||
|
||||
uni.showToast({
|
||||
title: '续费成功',
|
||||
icon: 'success'
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('续费失败:', error)
|
||||
uni.showToast({
|
||||
title: error.message || '续费失败',
|
||||
icon: 'error'
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
// 创建订单
|
||||
async handleCreateOrder() {
|
||||
try {
|
||||
const orderData = {
|
||||
deviceType: '设备类型',
|
||||
period: '租赁周期',
|
||||
amount: '订单金额'
|
||||
}
|
||||
|
||||
const response = await createOrder(orderData)
|
||||
console.log('创建订单成功:', response)
|
||||
} catch (error) {
|
||||
console.error('创建订单失败:', error)
|
||||
}
|
||||
},
|
||||
|
||||
// 获取订单列表
|
||||
async handleGetOrderList() {
|
||||
try {
|
||||
const params = {
|
||||
page: 1,
|
||||
size: 10,
|
||||
status: ''
|
||||
}
|
||||
|
||||
const response = await getOrderList(params)
|
||||
console.log('订单列表:', response)
|
||||
} catch (error) {
|
||||
console.error('获取订单列表失败:', error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 错误处理
|
||||
|
||||
所有API接口都使用统一的错误处理机制：
|
||||
|
||||
```javascript
|
||||
try {
|
||||
const response = await apiFunction(params)
|
||||
// 处理成功响应
|
||||
} catch (error) {
|
||||
// 处理错误
|
||||
console.error('API调用失败:', error)
|
||||
uni.showToast({
|
||||
title: error.message || '操作失败',
|
||||
icon: 'error'
|
||||
})
|
||||
}
|
||||
```
|
||||
|
||||
## 注意事项
|
||||
|
||||
1. 所有API调用都需要确保网络连接正常
|
||||
2. 请求参数需要按照接口文档要求进行传递
|
||||
3. 建议在调用API前进行参数验证
|
||||
4. 错误处理应该包含用户友好的提示信息
|
||||
5. 敏感操作（如支付）建议增加二次确认
|
||||
|
||||
## 更新日志
|
||||
|
||||
- **v1.0.0** - 初始版本，包含基础的订单管理功能
|
||||
- 设备续费接口
|
||||
- 订单创建、查询、取消、支付功能
|
||||
27
api/order/myOrder.js
Normal file
27
api/order/myOrder.js
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
/**
|
||||
* 获取我的订单列表
|
||||
* @returns {Promise} 返回订单列表数据
|
||||
*/
|
||||
export function getMyOrder(data) {
|
||||
return request({
|
||||
url: '/app/order/list',
|
||||
method: 'GET',
|
||||
loadingText: '加载用户订单中...',
|
||||
data,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取订单详情
|
||||
* @param {string} id - 订单ID
|
||||
* @returns {Promise} 返回订单详情数据
|
||||
*/
|
||||
export function getOrderDetail(id) {
|
||||
return request({
|
||||
url: `/app/order/${id}`,
|
||||
method: 'GET',
|
||||
loadingText: '加载订单详情中...',
|
||||
})
|
||||
}
|
||||
12
pages.json
12
pages.json
|
|
@ -98,6 +98,18 @@
|
|||
"style": {
|
||||
"navigationBarTitleText": "图片上传"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/myOrder/myOrder",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的订单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/myOrder/orderDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单详细"
|
||||
}
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
|
|
|
|||
5
pages/myOrder/OrderDetail.vue
Normal file
5
pages/myOrder/OrderDetail.vue
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<script setup></script>
|
||||
|
||||
<template></template>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
76
pages/myOrder/myOrder.vue
Normal file
76
pages/myOrder/myOrder.vue
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
<view v-for="item in list" :key="item.id" class="item">
|
||||
<uni-card :extra="item.createTime" :title="item.typeName" @click="detail(item)"></uni-card>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { getMyOrder } from '@/api/order/myOrder.js'
|
||||
|
||||
import { onUnload, onReachBottom } from '@dcloudio/uni-app'
|
||||
|
||||
const list = ref([])
|
||||
const noData = ref(false)
|
||||
|
||||
//定义data参数
|
||||
const queryParams = {
|
||||
pageNum: 1,
|
||||
pageSize: 12,
|
||||
}
|
||||
|
||||
// 页面加载时获取数据
|
||||
onMounted(() => {
|
||||
getList()
|
||||
})
|
||||
|
||||
onReachBottom(() => {
|
||||
if (noData.value) return
|
||||
queryParams.pageNum++
|
||||
getList()
|
||||
})
|
||||
|
||||
// 获取列表
|
||||
const getList = async () => {
|
||||
try {
|
||||
let res = await getMyOrder(queryParams)
|
||||
|
||||
// 确保 res.data 存在且是数组
|
||||
const newData = res?.rows || []
|
||||
list.value = [...list.value, ...newData]
|
||||
|
||||
if (queryParams.pageSize > newData.length) noData.value = true
|
||||
uni.setStorageSync('storyList', list.value)
|
||||
console.log(list.value)
|
||||
} catch (error) {
|
||||
console.error('获取订单列表失败:', error)
|
||||
uni.showToast({
|
||||
title: '获取订单列表失败',
|
||||
icon: 'none',
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
onUnload(() => {
|
||||
uni.removeStorageSync('storyList')
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
overflow: hidden;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.uni-body {
|
||||
font-size: 28rpx;
|
||||
line-height: 1.6;
|
||||
color: #666;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user