This commit is contained in:
@@ -3,10 +3,14 @@ import { APP_TYPE } from '@/utils/env.js';
|
||||
|
||||
export const orderApi = {
|
||||
getList(identifier, page, page_size, payment_status) {
|
||||
const data = { identifier, page, page_size };
|
||||
if (payment_status !== undefined && payment_status !== null) {
|
||||
data.payment_status = payment_status;
|
||||
}
|
||||
return request({
|
||||
url: '/api/c/v1/orders',
|
||||
method: 'GET',
|
||||
data: { identifier, page, page_size, payment_status }
|
||||
data
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
@@ -14,8 +14,8 @@
|
||||
<view v-if="isDevice" class="tag-apple" :class="onlineStatus === '在线' ? 'tag-success' : 'tag-warning'">
|
||||
{{ onlineStatus }}
|
||||
</view>
|
||||
<view v-else class="status-text">
|
||||
{{ networkStatus === 0 ? '停机' : '正常' }}
|
||||
<view v-else class="tag-apple">
|
||||
{{ onlineStatus }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -31,8 +31,7 @@
|
||||
currentCardNo: { type: String, default: '' },
|
||||
deviceInfo: { type: Object, default: () => ({}) },
|
||||
onlineStatus: { type: String, default: '离线' },
|
||||
isDevice: { type: Boolean, default: true },
|
||||
networkStatus: { type: Number, default: 1 }
|
||||
isDevice: { type: Boolean, default: true }
|
||||
});
|
||||
|
||||
// 默认头像
|
||||
@@ -56,9 +55,5 @@
|
||||
image { width: 100%; height: 100%; object-fit: cover; }
|
||||
}
|
||||
.user-details { flex: 1; }
|
||||
.status-text {
|
||||
font-size: 24rpx;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,5 +1,17 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="filter-tabs">
|
||||
<view
|
||||
v-for="(item, index) in filterOptions"
|
||||
:key="index"
|
||||
class="tab-item"
|
||||
:class="{ active: filterIndex === index }"
|
||||
@tap="onFilterChange(index)"
|
||||
>
|
||||
{{ item.label }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="orderList.length === 0 && !loading" class="empty-state">
|
||||
<view class="empty-icon">📋</view>
|
||||
<view class="empty-title">暂无订单</view>
|
||||
@@ -53,6 +65,14 @@
|
||||
let noMore = ref(false);
|
||||
let page = ref(1);
|
||||
const pageSize = 10;
|
||||
let filterIndex = ref(0);
|
||||
let filterOptions = [
|
||||
{ label: '全部', value: null },
|
||||
{ label: '待支付', value: 1 },
|
||||
{ label: '已支付', value: 2 },
|
||||
{ label: '已取消', value: 3 },
|
||||
{ label: '已退款', value: 4 }
|
||||
];
|
||||
|
||||
const formatMoney = (amount) => {
|
||||
if (!amount && amount !== 0) return '0.00';
|
||||
@@ -61,27 +81,38 @@
|
||||
|
||||
const getStatusClass = (status) => {
|
||||
const classMap = {
|
||||
'0': 'tag-warning',
|
||||
'1': 'tag-success',
|
||||
'2': 'tag-danger'
|
||||
1: 'tag-warning',
|
||||
2: 'tag-success',
|
||||
3: 'tag-secondary',
|
||||
4: 'tag-info'
|
||||
};
|
||||
return classMap[status] || '';
|
||||
};
|
||||
|
||||
const onFilterChange = (index) => {
|
||||
filterIndex.value = index;
|
||||
page.value = 1;
|
||||
noMore.value = false;
|
||||
loadOrderList();
|
||||
};
|
||||
|
||||
const loadOrderList = async (append = false) => {
|
||||
if (loading.value || noMore.value) return;
|
||||
loading.value = true;
|
||||
|
||||
const paymentStatus = filterOptions[filterIndex.value].value;
|
||||
|
||||
try {
|
||||
const data = await orderApi.getList(
|
||||
userStore.state.identifier,
|
||||
page.value,
|
||||
pageSize
|
||||
pageSize,
|
||||
paymentStatus
|
||||
);
|
||||
|
||||
const newData = (data.items || []).map(item => ({
|
||||
...item,
|
||||
payment_status_name: item.payment_status === 1 ? '已支付' : item.payment_status === 0 ? '待支付' : '已取消',
|
||||
payment_status_name: item.payment_status === 1 ? '待支付' : item.payment_status === 2 ? '已支付' : item.payment_status === 3 ? '已取消' : item.payment_status === 4 ? '已退款' : '未知',
|
||||
created_at: item.created_at ? item.created_at.split('T').join(' ').slice(0, 19) : ''
|
||||
}));
|
||||
|
||||
@@ -115,6 +146,25 @@
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
.filter-tabs {
|
||||
display: flex;
|
||||
padding: var(--space-md) var(--space-lg);
|
||||
background: var(--bg-card);
|
||||
border-bottom: 1rpx solid var(--border-light);
|
||||
.tab-item {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: var(--text-secondary);
|
||||
padding: var(--space-sm) 0;
|
||||
&.active {
|
||||
color: var(--primary);
|
||||
font-weight: 600;
|
||||
border-bottom: 4rpx solid var(--primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
Reference in New Issue
Block a user