WindowBird/HomeLease
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

订单页面分页加载的完善

Browse Source
This commit is contained in:
WindowBird 2025-08-25 14:12:27 +08:00
parent 8f2434e592
commit 757777de50
3 changed files with 129 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
pages/myOrder/OrderDetail.vue
View File

@ -8,14 +8,14 @@ const loading = ref(false)
const orderId = ref('') const orderId = ref('')
// 页面加载时获取参数 // 页面加载时获取参数
onLoad((options) => { onLoad(options => {
if (options.id) { if (options.id) {
orderId.value = options.id orderId.value = options.id
loadOrderDetail() loadOrderDetail()
} else { } else {
uni.showToast({ uni.showToast({
title: '订单ID不能为空', title: '订单ID不能为空',
icon: 'none' icon: 'none',
}) })
setTimeout(() => { setTimeout(() => {
uni.navigateBack() uni.navigateBack()
@ -32,20 +32,20 @@ onLoad((options) => {
function mapOrderStatus(type, value) { function mapOrderStatus(type, value) {
const maps = { const maps = {
status: { status: {
'1': '未支付', 1: '未支付',
'2': '支付成功', 2: '支付成功',
'3': '退款', 3: '退款',
'未支付': '1', 未支付: '1',
'支付成功': '2', 支付成功: '2',
'退款': '3', 退款: '3',
}, },
logistic: { logistic: {
'1': '未签收', 1: '未签收',
'2': '已签收', 2: '已签收',
'3': '已归还', 3: '已归还',
'未签收': '1', 未签收: '1',
'已签收': '2', 已签收: '2',
'已归还': '3', 已归还: '3',
}, },
} }
@ -59,9 +59,9 @@ function mapOrderStatus(type, value) {
*/ */
function getStatusClass(status) { function getStatusClass(status) {
const statusMap = { const statusMap = {
'1': 'status-pending', 1: 'status-pending',
'2': 'status-success', 2: 'status-success',
'3': 'status-refund' 3: 'status-refund',
} }
return statusMap[status] || 'status-unknown' return statusMap[status] || 'status-unknown'
} }
@ -73,9 +73,9 @@ function getStatusClass(status) {
*/ */
function getLogisticClass(status) { function getLogisticClass(status) {
const statusMap = { const statusMap = {
'1': 'logistic-pending', 1: 'logistic-pending',
'2': 'logistic-success', 2: 'logistic-success',
'3': 'logistic-returned' 3: 'logistic-returned',
} }
return statusMap[status] || 'logistic-unknown' return statusMap[status] || 'logistic-unknown'
} }
@ -158,7 +158,7 @@ const loadOrderDetail = async () => {
<view class="status-card"> <view class="status-card">
<view class="status-header"> <view class="status-header">
<text class="status-title">订单状态</text> <text class="status-title">订单状态</text>
<text class="status-value" :class="getStatusClass(orderDetail.status)"> <text :class="getStatusClass(orderDetail.status)" class="status-value">
{{ mapOrderStatus('status', orderDetail.status) }} {{ mapOrderStatus('status', orderDetail.status) }}
</text> </text>
</view> </view>
@ -215,7 +215,7 @@ const loadOrderDetail = async () => {
<text class="label">安装地址：</text> <text class="label">安装地址：</text>
<text class="value">{{ orderDetail.address || '--' }}</text> <text class="value">{{ orderDetail.address || '--' }}</text>
</view> </view>
<view class="info-item" v-if="orderDetail.detailed"> <view v-if="orderDetail.detailed" class="info-item">
<text class="label">详细地址：</text> <text class="label">详细地址：</text>
<text class="value">{{ orderDetail.detailed }}</text> <text class="value">{{ orderDetail.detailed }}</text>
</view> </view>
@ -234,17 +234,17 @@ const loadOrderDetail = async () => {
</view> </view>
<view class="info-item"> <view class="info-item">
<text class="label">支付状态：</text> <text class="label">支付状态：</text>
<text class="value" :class="getStatusClass(orderDetail.status)"> <text :class="getStatusClass(orderDetail.status)" class="value">
{{ mapOrderStatus('status', orderDetail.status) }} {{ mapOrderStatus('status', orderDetail.status) }}
</text> </text>
</view> </view>
<view class="info-item"> <view class="info-item">
<text class="label">物流状态：</text> <text class="label">物流状态：</text>
<text class="value" :class="getLogisticClass(orderDetail.logisticStatus)"> <text :class="getLogisticClass(orderDetail.logisticStatus)" class="value">
{{ mapOrderStatus('logistic', orderDetail.logisticStatus) }} {{ mapOrderStatus('logistic', orderDetail.logisticStatus) }}
</text> </text>
</view> </view>
<view class="info-item" v-if="orderDetail.payId"> <view v-if="orderDetail.payId" class="info-item">
<text class="label">支付单号：</text> <text class="label">支付单号：</text>
<text class="value">{{ orderDetail.payId }}</text> <text class="value">{{ orderDetail.payId }}</text>
</view> </view>
@ -265,7 +265,7 @@ const loadOrderDetail = async () => {
<text class="label">是否续租：</text> <text class="label">是否续租：</text>
<text class="value">{{ orderDetail.renew ? '是' : '否' }}</text> <text class="value">{{ orderDetail.renew ? '是' : '否' }}</text>
</view> </view>
<view class="info-item" v-if="orderDetail.remark"> <view v-if="orderDetail.remark" class="info-item">
<text class="label">备注信息：</text> <text class="label">备注信息：</text>
<text class="value">{{ orderDetail.remark }}</text> <text class="value">{{ orderDetail.remark }}</text>
</view> </view>
@ -331,7 +331,7 @@ const loadOrderDetail = async () => {
.detail-content { .detail-content {
.status-card { .status-card {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); background: linear-gradient(135deg, #f15a04 0%, #f15a04 100%);
border-radius: 16rpx; border-radius: 16rpx;
padding: 40rpx 30rpx; padding: 40rpx 30rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;

46
pages/myOrder/myOrder.vue
View File

@ -17,7 +17,7 @@
<view class="order-header"> <view class="order-header">
<view class="order-title"> <view class="order-title">
<text class="title-text">{{ item.typeName || '订单详情' }}</text> <text class="title-text">{{ item.typeName || '订单详情' }}</text>
<text class="status-text" :class="getStatusClass(item.status)"> <text :class="getStatusClass(item.status)" class="status-text">
{{ mapOrderStatus('status', item.status) }} {{ mapOrderStatus('status', item.status) }}
</text> </text>
</view> </view>
@ -45,7 +45,7 @@
</view> </view>
<view class="detail-item"> <view class="detail-item">
<text class="label">物流状态：</text> <text class="label">物流状态：</text>
<text class="value" :class="getLogisticClass(item.logisticStatus)"> <text :class="getLogisticClass(item.logisticStatus)" class="value">
{{ mapOrderStatus('logistic', item.logisticStatus) }} {{ mapOrderStatus('logistic', item.logisticStatus) }}
</text> </text>
</view> </view>
@ -79,20 +79,20 @@ const loading = ref(false)
function mapOrderStatus(type, value) { function mapOrderStatus(type, value) {
const maps = { const maps = {
status: { status: {
'1': '未支付', 1: '未支付',
'2': '支付成功', 2: '支付成功',
'3': '退款', 3: '退款',
'未支付': '1', 未支付: '1',
'支付成功': '2', 支付成功: '2',
'退款': '3', 退款: '3',
}, },
logistic: { logistic: {
'1': '未签收', 1: '未签收',
'2': '已签收', 2: '已签收',
'3': '已归还', 3: '已归还',
'未签收': '1', 未签收: '1',
'已签收': '2', 已签收: '2',
'已归还': '3', 已归还: '3',
}, },
} }
@ -106,9 +106,9 @@ function mapOrderStatus(type, value) {
*/ */
function getStatusClass(status) { function getStatusClass(status) {
const statusMap = { const statusMap = {
'1': 'status-pending', 1: 'status-pending',
'2': 'status-success', 2: 'status-success',
'3': 'status-refund' 3: 'status-refund',
} }
return statusMap[status] || 'status-unknown' return statusMap[status] || 'status-unknown'
} }
@ -120,9 +120,9 @@ function getStatusClass(status) {
*/ */
function getLogisticClass(status) { function getLogisticClass(status) {
const statusMap = { const statusMap = {
'1': 'logistic-pending', 1: 'logistic-pending',
'2': 'logistic-success', 2: 'logistic-success',
'3': 'logistic-returned' 3: 'logistic-returned',
} }
return statusMap[status] || 'logistic-unknown' return statusMap[status] || 'logistic-unknown'
} }
@ -198,7 +198,7 @@ const getList = async () => {
list.value = [...list.value, ...newData] list.value = [...list.value, ...newData]
} }
if (newData.length < queryParams.pageSize) { if (queryParams.pageNum * queryParams.pageSize >= res.total) {
noData.value = true noData.value = true
} }
@ -215,11 +215,11 @@ const getList = async () => {
} }
// 点击订单卡片 // 点击订单卡片
const onClick = (item) => { const onClick = item => {
console.log('点击订单:', item) console.log('点击订单:', item)
// 跳转到订单详情页 // 跳转到订单详情页
uni.navigateTo({ uni.navigateTo({
url: `/pages/myOrder/orderDetail?id=${item.id}` url: `/pages/myOrder/orderDetail?id=${item.id}`,
}) })
} }

17
pages/profile/profile.vue
View File

@ -98,13 +98,13 @@
</view> </view>
<text class="function-text">申请代理</text> <text class="function-text">申请代理</text>
</view> </view>
<view class="function-item" @click="goToAgentBenefits"> <view class="function-item" @click="goToMyOrderList">
<view class="function-icon"> <view class="function-icon">
<image :src="commonEnum.AGENCY_INTERESTS" class="function-img" mode="aspectFit"></image> <image :src="commonEnum.AGENCY_INTERESTS" class="function-img" mode="aspectFit"></image>
</view> </view>
<text class="function-text">我的订单</text> <text class="function-text">我的订单</text>
</view> </view>
<view class="function-item" @click="goToCustomerService"> <view class="function-item" @click="goToMyOrderList">
<view class="function-icon"> <view class="function-icon">
<image <image
:src="commonEnum.ONLINE_CUSTOMER_SERVICE" :src="commonEnum.ONLINE_CUSTOMER_SERVICE"
@ -287,16 +287,9 @@ export default {
url: '/pages/agents/agents', url: '/pages/agents/agents',
}) })
}, },
goToAgentBenefits() { goToMyOrderList() {
uni.showToast({ uni.navigateTo({
title: '我的订单', url: '/pages/myOrder/myOrder',
icon: 'none',
})
},
goToCustomerService() {
uni.showToast({
title: '在线客服',
icon: 'none',
}) })
}, },
goToIncomeExpense() { goToIncomeExpense() {