From 024ecb282784cc21786a7e8cfeb27d619bf8bafd Mon Sep 17 00:00:00 2001
From: WindowBird <13870814+windows-bird@user.noreply.gitee.com>
Date: Thu, 21 Aug 2025 18:12:21 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9A=82=E5=AD=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
api/lease/lease.js | 24 ++
api/order/README.md | 216 +++++++++++++
components/renew-modal/renew-modal.vue | 425 +++++++++++++++++++++++++
config/dev.js | 2 +-
examples/order-api-usage.js | 252 +++++++++++++++
examples/order-api-usage.vue | 320 +++++++++++++++++++
pages/index/index.vue | 151 ++++++++-
7 files changed, 1380 insertions(+), 10 deletions(-)
create mode 100644 api/order/README.md
create mode 100644 components/renew-modal/renew-modal.vue
create mode 100644 examples/order-api-usage.js
create mode 100644 examples/order-api-usage.vue
diff --git a/api/lease/lease.js b/api/lease/lease.js
index 8bcb3f9..0a4331a 100644
--- a/api/lease/lease.js
+++ b/api/lease/lease.js
@@ -52,3 +52,27 @@ export function createLeaseOrder(orderData) {
loadingText: '创建订单中...',
})
}
+
+/**
+ * 设备续费API
+ * @param {Object} data 续费参数
+ * @param {string} data.suitId 套餐ID
+ * @param {string} data.appId 应用ID
+ * @param {string} data.payAmount 支付金额
+ * @param {string} data.channelId 渠道ID
+ * @param {string} data.devId 设备ID
+ * @returns {Promise} API响应
+ */
+export function renewDevice(data) {
+ return request({
+ url: '/app/order/renew',
+ method: 'POST',
+ data: {
+ suitId: data.suitId,
+ appId: data.appId,
+ payAmount: data.payAmount,
+ channelId: data.channelId,
+ devId: data.devId,
+ },
+ })
+}
diff --git a/api/order/README.md b/api/order/README.md
new file mode 100644
index 0000000..397adfb
--- /dev/null
+++ b/api/order/README.md
@@ -0,0 +1,216 @@
+# 订单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** - 初始版本，包含基础的订单管理功能
+- 设备续费接口
+- 订单创建、查询、取消、支付功能
\ No newline at end of file
diff --git a/components/renew-modal/renew-modal.vue b/components/renew-modal/renew-modal.vue
new file mode 100644
index 0000000..765cbfc
--- /dev/null
+++ b/components/renew-modal/renew-modal.vue
@@ -0,0 +1,425 @@
+
+
+
+
+
+
+
+
+
+
+
+ {{ device.name }}
+
+ {{ getStatusText(device.status) }}
+
+
+ 到期时间: {{ formatTime(device.endTime) }}
+
+
+
+
+
+
+
+ 选择续费套餐
+
+
+
+ 加载中...
+
+
+
+
+
+
+ {{ item.name || `套餐${index + 1}` }}
+ {{ item.description || item.period || '暂无描述' }}
+
+
+ ¥
+ {{ item.price || item.amount || '0.00' }}
+
+
+ ✓
+
+
+
+
+
+
+ 暂无可用套餐
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/config/dev.js b/config/dev.js
index f9ea76c..d1b8de7 100644
--- a/config/dev.js
+++ b/config/dev.js
@@ -2,7 +2,7 @@
export const DEV_CONFIG = {
// 临时token，用于开发测试
TEMP_TOKEN:
- 'eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6ImZjMDRiYWQ0LWVjMGQtNDJiMi05NGJkLTQxZGVhMmNmZGE3OCJ9.YyzEJIfPuy2ZrmKRuoWWWHArGxpY9U5kmAM1CFHHrOietHfjWN3rsK0WNxOWTkIDvRiWyAqkTrNwDtWP3ClyQA',
+ 'eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6ImRhNmJhNmU0LTc5MmEtNGQ0ZC1iZWE5LTdiYjY2MTllODNjYiJ9.wx0jcmrYQ0FXVEFFBEwhRXtvkJmv5DTQhBJt7mg0udgp8jHbNueZlUIeAIN39HFKjOcA6PupdPOFb9NSaIpT1g',
// 是否使用临时token
USE_TEMP_TOKEN: true,
diff --git a/examples/order-api-usage.js b/examples/order-api-usage.js
new file mode 100644
index 0000000..371aee3
--- /dev/null
+++ b/examples/order-api-usage.js
@@ -0,0 +1,252 @@
+import {
+ renewDevice,
+ createLeaseOrder,
+ getOrderList,
+ getOrderDetail,
+ cancelOrder,
+ confirmReceive,
+ applyRefund
+} from '@/api/order/order.js'
+
+/**
+ * 设备续费示例
+ */
+export async function renewDeviceExample() {
+ try {
+ const renewData = {
+ suitId: "3", // 套餐ID
+ appId: "1", // 应用ID
+ payAmount: "365", // 支付金额
+ channelId: "2", // 渠道ID
+ devId: "1" // 设备ID
+ }
+
+ const response = await renewDevice(renewData)
+
+ if (response.code === 200) {
+ console.log('续费成功:', response.data)
+ uni.showToast({
+ title: '续费成功',
+ icon: 'success'
+ })
+ } else {
+ throw new Error(response.message || '续费失败')
+ }
+ } catch (error) {
+ console.error('续费失败:', error)
+ uni.showToast({
+ title: error.message || '续费失败',
+ icon: 'error'
+ })
+ }
+}
+
+/**
+ * 创建租赁订单示例
+ */
+export async function createLeaseOrderExample(formData) {
+ try {
+ const orderData = {
+ name: formData.name,
+ phone: formData.phone,
+ address: formData.address,
+ detailAddress: formData.detailAddress,
+ equipmentId: formData.equipmentId,
+ periodId: formData.periodId,
+ amount: formData.amount
+ }
+
+ const response = await createLeaseOrder(orderData)
+
+ if (response.code === 200) {
+ console.log('订单创建成功:', response.data)
+ uni.showToast({
+ title: '订单创建成功',
+ icon: 'success'
+ })
+ return response.data
+ } else {
+ throw new Error(response.message || '订单创建失败')
+ }
+ } catch (error) {
+ console.error('订单创建失败:', error)
+ uni.showToast({
+ title: error.message || '订单创建失败',
+ icon: 'error'
+ })
+ throw error
+ }
+}
+
+/**
+ * 获取订单列表示例
+ */
+export async function getOrderListExample() {
+ try {
+ const params = {
+ page: 1,
+ size: 10,
+ status: 'all' // 可选: pending, paid, shipped, completed, cancelled
+ }
+
+ const response = await getOrderList(params)
+
+ if (response.code === 200) {
+ console.log('订单列表:', response.data)
+ return response.data
+ } else {
+ throw new Error(response.message || '获取订单列表失败')
+ }
+ } catch (error) {
+ console.error('获取订单列表失败:', error)
+ uni.showToast({
+ title: error.message || '获取订单列表失败',
+ icon: 'error'
+ })
+ throw error
+ }
+}
+
+/**
+ * 获取订单详情示例
+ */
+export async function getOrderDetailExample(orderId) {
+ try {
+ const response = await getOrderDetail(orderId)
+
+ if (response.code === 200) {
+ console.log('订单详情:', response.data)
+ return response.data
+ } else {
+ throw new Error(response.message || '获取订单详情失败')
+ }
+ } catch (error) {
+ console.error('获取订单详情失败:', error)
+ uni.showToast({
+ title: error.message || '获取订单详情失败',
+ icon: 'error'
+ })
+ throw error
+ }
+}
+
+/**
+ * 取消订单示例
+ */
+export async function cancelOrderExample(orderId) {
+ try {
+ const response = await cancelOrder(orderId)
+
+ if (response.code === 200) {
+ console.log('订单取消成功:', response.data)
+ uni.showToast({
+ title: '订单取消成功',
+ icon: 'success'
+ })
+ return response.data
+ } else {
+ throw new Error(response.message || '订单取消失败')
+ }
+ } catch (error) {
+ console.error('订单取消失败:', error)
+ uni.showToast({
+ title: error.message || '订单取消失败',
+ icon: 'error'
+ })
+ throw error
+ }
+}
+
+/**
+ * 确认收货示例
+ */
+export async function confirmReceiveExample(orderId) {
+ try {
+ const response = await confirmReceive(orderId)
+
+ if (response.code === 200) {
+ console.log('确认收货成功:', response.data)
+ uni.showToast({
+ title: '确认收货成功',
+ icon: 'success'
+ })
+ return response.data
+ } else {
+ throw new Error(response.message || '确认收货失败')
+ }
+ } catch (error) {
+ console.error('确认收货失败:', error)
+ uni.showToast({
+ title: error.message || '确认收货失败',
+ icon: 'error'
+ })
+ throw error
+ }
+}
+
+/**
+ * 申请退款示例
+ */
+export async function applyRefundExample(orderId, reason, amount) {
+ try {
+ const refundData = {
+ orderId: orderId,
+ reason: reason,
+ amount: amount
+ }
+
+ const response = await applyRefund(refundData)
+
+ if (response.code === 200) {
+ console.log('退款申请成功:', response.data)
+ uni.showToast({
+ title: '退款申请成功',
+ icon: 'success'
+ })
+ return response.data
+ } else {
+ throw new Error(response.message || '退款申请失败')
+ }
+ } catch (error) {
+ console.error('退款申请失败:', error)
+ uni.showToast({
+ title: error.message || '退款申请失败',
+ icon: 'error'
+ })
+ throw error
+ }
+}
+
+/**
+ * 在租赁页面中使用API的示例
+ */
+export function useInLeasePage() {
+ // 在租赁页面的支付按钮点击事件中调用
+ async function handlePayment() {
+ try {
+ // 1. 创建租赁订单
+ const orderResult = await createLeaseOrderExample({
+ name: '张三',
+ phone: '13800138000',
+ address: '北京市朝阳区',
+ detailAddress: '某某小区1号楼101室',
+ equipmentId: '1',
+ periodId: '3',
+ amount: '365.00'
+ })
+
+ // 2. 如果订单创建成功，可以进行支付
+ if (orderResult) {
+ console.log('订单创建成功，订单号:', orderResult.orderId)
+ // 这里可以调用支付接口
+ }
+
+ } catch (error) {
+ console.error('支付流程失败:', error)
+ }
+ }
+
+ return {
+ handlePayment
+ }
+}
\ No newline at end of file
diff --git a/examples/order-api-usage.vue b/examples/order-api-usage.vue
new file mode 100644
index 0000000..fff7481
--- /dev/null
+++ b/examples/order-api-usage.vue
@@ -0,0 +1,320 @@
+
+
+
+
+
+
+ 设备续费
+
+ 套餐ID:
+
+
+
+ 应用ID:
+
+
+
+ 支付金额:
+
+
+
+ 渠道ID:
+
+
+
+ 设备ID:
+
+
+
+
+
+
+
+ 创建订单
+
+ 设备类型:
+
+
+
+ 租赁周期:
+
+
+
+ 金额:
+
+
+
+
+
+
+
+ 获取订单列表
+
+ 页码:
+
+
+
+ 每页数量:
+
+
+
+
+
+
+
+ API返回结果:
+ {{ JSON.stringify(result, null, 2) }}
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 3b36c9a..383b401 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -30,6 +30,17 @@
@equipment-click="onEquipmentClick"
/>
+
+
+
@@ -39,15 +50,18 @@ import commonEnum from '../../enum/commonEnum'
import AnnouncementBar from '../../components/announcement-bar/announcement-bar.vue'
import BannerSwiper from '../../components/banner-swiper/banner-swiper.vue'
import EquipmentList from '../../components/equipment-list/equipment-list.vue'
+import RenewModal from '../../components/renew-modal/renew-modal.vue'
import { getNewAnnouncement } from '../../api/article/article.js'
import { getBannerList } from '../../api/banner/banner.js'
import { getDeviceList } from '../../api/device/device.js'
+import { renewDevice, getPeriodPackages } from '../../api/lease/lease.js'
export default {
components: {
AnnouncementBar,
BannerSwiper,
EquipmentList,
+ RenewModal,
},
data() {
return {
@@ -72,6 +86,13 @@ export default {
// 设备列表数据
equipmentList: [],
+
+ // 续费相关数据
+ showRenewModal: false,
+ selectedDevice: null,
+ packageList: [],
+ packageLoading: false,
+ selectedPackage: null,
}
},
@@ -170,6 +191,9 @@ export default {
isOnline: isOnline,
powerStatus: device.powerStatus,
iotExpireTime: device.iotExpireTime,
+ // 保留原始数据用于API调用
+ typeId: device.typeId || device.deviceTypeId,
+ originalData: device,
}
})
@@ -187,6 +211,7 @@ export default {
endTime: '2026-07-25 13:23:59',
image: commonEnum.TEMP2,
isOnline: true,
+ typeId: '1', // 添加默认类型ID
},
{
id: 'default2',
@@ -196,6 +221,7 @@ export default {
endTime: '2026-07-25 13:23:59',
image: commonEnum.TEMP3,
isOnline: true,
+ typeId: '2', // 添加默认类型ID
},
]
}
@@ -214,7 +240,7 @@ export default {
if (this.currentAnnouncement) {
// 显示公告详情
uni.navigateTo({
- url:'/pages/announcementList/announcementList'
+ url: '/pages/announcementList/announcementList',
})
} else {
uni.showToast({
@@ -242,17 +268,124 @@ export default {
// 设备点击事件
onEquipmentClick(equipment) {
// 跳转到设备详情页面，传递设备信息
- uni.navigateTo({
- url: `/pages/device-detail/device-detail?id=${equipment.id}&name=${encodeURIComponent(equipment.name)}`,
- })
},
// 续费事件
- onRenew(equipment) {
- // 跳转到续费页面，传递设备信息
- uni.navigateTo({
- url: `/pages/renew/renew?id=${equipment.id}&name=${encodeURIComponent(equipment.name)}&endTime=${encodeURIComponent(equipment.endTime)}`,
- })
+ async onRenew(equipment) {
+ try {
+ this.selectedDevice = equipment
+
+ this.packageLoading = true
+
+ // 根据设备ID查询套餐
+ await this.fetchPackageList(equipment.id)
+ this.showRenewModal = true
+ } catch (error) {
+ console.error('打开续费弹窗失败:', error)
+ uni.showToast({
+ title: '打开续费弹窗失败',
+ icon: 'error',
+ })
+ }
+ },
+
+ // 获取套餐列表
+ async fetchPackageList(deviceId) {
+ try {
+ // 根据设备ID获取设备类型ID
+ const device = this.equipmentList.find(d => d.id === deviceId)
+ if (!device) {
+ throw new Error('设备不存在')
+ }
+
+ // 使用设备的类型ID获取套餐
+ const typeId = device.typeId || device.originalData?.typeId || device.originalData?.deviceTypeId || '1'
+ console.log('设备类型ID:', typeId)
+
+ const response = await getPeriodPackages(typeId)
+
+ if (response.code === 200) {
+ this.packageList = response.data || []
+ console.log('套餐列表:', this.packageList)
+ } else {
+ throw new Error(response.message || '获取套餐列表失败')
+ }
+ } catch (error) {
+ console.error('获取套餐列表失败:', error)
+ uni.showToast({
+ title: error.message || '获取套餐列表失败',
+ icon: 'error',
+ })
+ } finally {
+ this.packageLoading = false
+ }
+ },
+
+ // 关闭续费弹窗
+ closeRenewModal() {
+ this.showRenewModal = false
+ this.selectedDevice = null
+ this.selectedPackage = null
+ this.packageList = []
+ },
+
+ // 选择套餐
+ onSelectPackage(combo) {
+ this.selectedPackage = combo
+ console.log('选择的套餐:', combo)
+ },
+
+ // 确认续费
+ async onConfirmRenew() {
+ if (!this.selectedPackage) {
+ uni.showToast({
+ title: '请选择套餐',
+ icon: 'none',
+ })
+ return
+ }
+
+ try {
+ uni.showLoading({
+ title: '续费中...',
+ })
+
+ const renewData = {
+ suitId: this.selectedPackage.id,
+ appId: '1', // 应用ID，根据实际情况调整
+ payAmount: this.selectedPackage.price || this.selectedPackage.amount,
+ channelId: '2', // 渠道ID，根据实际情况调整
+ devId: this.selectedDevice.id,
+ }
+
+ console.log('续费数据:', renewData)
+
+ const response = await renewDevice(renewData)
+
+ uni.hideLoading()
+
+ if (response.code === 200) {
+ uni.showToast({
+ title: '续费成功',
+ icon: 'success',
+ })
+
+ // 关闭弹窗
+ this.closeRenewModal()
+
+ // 刷新设备列表
+ this.fetchDeviceList()
+ } else {
+ throw new Error(response.message || '续费失败')
+ }
+ } catch (error) {
+ uni.hideLoading()
+ console.error('续费失败:', error)
+ uni.showToast({
+ title: error.message || '续费失败',
+ icon: 'error',
+ })
+ }
},
// 底部导航点击事件