Browse Source

feat: 更新订单状态显示和页面功能优化

- 修改订单状态显示逻辑,增加状态文本映射
- 调整订单列表页的滚动和刷新功能
- 更新服务介绍页面标题和导航栏样式
- 优化产品名称和订单服务项的显示顺序
- 增加订单详情页的列表反转功能
- 调整新订单页面的服务数量上限
master
前端-胡立永 2 months ago
parent
commit
7764b6ef79
8 changed files with 136 additions and 120 deletions
  1. +9
    -10
      pages.json
  2. +8
    -8
      pages/index.vue
  3. +1
    -1
      pages/newOrder/serviceNew2.vue
  4. +1
    -1
      pages_order/components/order/ServiceItems.vue
  5. +2
    -0
      pages_order/order/orderDetail.vue
  6. +111
    -98
      pages_order/order/orderList.vue
  7. +2
    -2
      utils/getUrl.js
  8. +2
    -0
      utils/serviceTime.js

+ 9
- 10
pages.json View File

@ -98,13 +98,11 @@
}, { }, {
"path": "pages/details/feed", "path": "pages/details/feed",
"style": { "style": {
"navigationBarTitleText": "专业喂养",
"navigationBarTitleText": "服务介绍",
"navigationBarBackgroundColor": "#FFBF60", "navigationBarBackgroundColor": "#FFBF60",
"enablePullDownRefresh": false, "enablePullDownRefresh": false,
"navigationBarTextStyle": "white" "navigationBarTextStyle": "white"
} }
}, { }, {
"path": "pages/common/kefu", "path": "pages/common/kefu",
"style": { "style": {
@ -372,7 +370,7 @@
"style": { "style": {
"navigationBarTitleText": "订单列表", "navigationBarTitleText": "订单列表",
"navigationBarBackgroundColor": "#FFBF60", "navigationBarBackgroundColor": "#FFBF60",
"enablePullDownRefresh": false,
"enablePullDownRefresh": true,
"navigationBarTextStyle": "white" "navigationBarTextStyle": "white"
} }
}, },
@ -438,14 +436,15 @@
"pagePath": "pages/details/feed", "pagePath": "pages/details/feed",
"iconPath": "./static/images/tabBar/cat.png", "iconPath": "./static/images/tabBar/cat.png",
"selectedIconPath": "./static/images/tabBar/cat_.png", "selectedIconPath": "./static/images/tabBar/cat_.png",
"text": "喂养"
"text": "服务介绍"
}, },
// {
// "pagePath": "pages/details/walk",
// "iconPath": "./static/images/tabBar/dog.png",
// "selectedIconPath": "./static/images/tabBar/dog_.png",
// "text": "遛狗"
// },
{ {
"pagePath": "pages/details/walk",
"iconPath": "./static/images/tabBar/dog.png",
"selectedIconPath": "./static/images/tabBar/dog_.png",
"text": "遛狗"
}, {
"pagePath": "pages/personalCenter/index", "pagePath": "pages/personalCenter/index",
"iconPath": "./static/images/tabBar/mine.png", "iconPath": "./static/images/tabBar/mine.png",
"selectedIconPath": "./static/images/tabBar/mine_.png", "selectedIconPath": "./static/images/tabBar/mine_.png",


+ 8
- 8
pages/index.vue View File

@ -82,7 +82,7 @@
</uni-card> </uni-card>
</view> </view>
<view class="coupon-list">
<!-- <view class="coupon-list">
<uni-card :is-shadow="false" padding=0 margin="10px"> <uni-card :is-shadow="false" padding=0 margin="10px">
<view class="coupon-title" slot="title"> <view class="coupon-title" slot="title">
<view class="coupon-title-left"> <view class="coupon-title-left">
@ -133,7 +133,7 @@
</view> </view>
</view> </view>
</uni-card> </uni-card>
</view>
</view> -->
<view class="companion-list"> <view class="companion-list">
<uni-card :is-shadow="false" padding=0 margin="10px"> <uni-card :is-shadow="false" padding=0 margin="10px">
@ -637,13 +637,13 @@
longitude: this.position.longitude, longitude: this.position.longitude,
} }
if(!data.latitude){
let res = await this.getLocation()
data.latitude = res.latitude
data.longitude = res.longitude
}
// if(!data.latitude){
// let res = await this.getLocation()
// data.latitude = res.latitude
// data.longitude = res.longitude
// }
getTeacherList(data).then(response => {
getTeacherList({}).then(response => {
if (response.code == 200) { if (response.code == 200) {
this.companionList = response.rows this.companionList = response.rows
this.calculateTeacherListDistance() this.calculateTeacherListDistance()


+ 1
- 1
pages/newOrder/serviceNew2.vue View File

@ -186,7 +186,7 @@
@change="customServiceCountChange" @change="customServiceCountChange"
step="1" step="1"
:min="0" :min="0"
:max="3"
:max="10"
> >
<view slot="minus" class="minus"> <view slot="minus" class="minus">
<u-icon name="minus-circle-fill" size="20" color="#FFBF60"></u-icon> <u-icon name="minus-circle-fill" size="20" color="#FFBF60"></u-icon>


+ 1
- 1
pages_order/components/order/ServiceItems.vue View File

@ -11,10 +11,10 @@
<view class="item-id">{{item.day}}</view> <view class="item-id">{{item.day}}</view>
<text style="margin: 0 10rpx;">|</text> <text style="margin: 0 10rpx;">|</text>
<view class="item-name"> <view class="item-name">
<text>{{ item.itemsText[0] }}</text>
<text v-if="item.itemsText.length >= 2"> <text v-if="item.itemsText.length >= 2">
{{ item.itemsText[0] }}+{{ item.itemsText[item.itemsText.length - 1] }}{{ item.itemsText.length }} {{ item.itemsText[0] }}+{{ item.itemsText[item.itemsText.length - 1] }}{{ item.itemsText.length }}
</text> </text>
<text v-else>{{ item.itemsText[0] }}</text>
</view> </view>
<view class="item-price-action"> <view class="item-price-action">
<view class="item-price">¥{{item.price.toFixed(2)}}</view> <view class="item-price">¥{{item.price.toFixed(2)}}</view>


+ 2
- 0
pages_order/order/orderDetail.vue View File

@ -154,6 +154,8 @@
pet.serviceList.forEach(item => { pet.serviceList.forEach(item => {
itemList.push(...(data.orderItemList.filter(n => n.orderServiceId == item.id))) itemList.push(...(data.orderItemList.filter(n => n.orderServiceId == item.id)))
}) })
itemList = itemList.reverse();
itemList.forEach(p => { itemList.forEach(p => {
price += p.salePrice * p.quantity price += p.salePrice * p.quantity


+ 111
- 98
pages_order/order/orderList.vue View File

@ -9,13 +9,13 @@
</view> </view>
<!-- 订单列表 --> <!-- 订单列表 -->
<scroll-view scroll-y class="order-list-scroll" @scrolltolower="loadMore" @refresherrefresh="refresh"
:refresher-enabled="true" :refresher-triggered="refreshing">
<!-- <scroll-view scroll-y class="order-list-scroll" @scrolltolower="loadMore" @refresherrefresh="refresh"
:refresher-enabled="true" :refresher-triggered="refreshing"> -->
<view class="order-list"> <view class="order-list">
<!-- 订单卡片 --> <!-- 订单卡片 -->
<view class="order-card" v-for="(order, index) in orderList" :key="index"> <view class="order-card" v-for="(order, index) in orderList" :key="index">
<view class="order-header"> <view class="order-header">
<text>{{ tabs[order.status + 1].name }}</text>
<text>{{ getOrderStatusText(order.status) }}</text>
<view class="order-status"> <view class="order-status">
<text v-if="order.teacherId">指定伴宠师下单</text> <text v-if="order.teacherId">指定伴宠师下单</text>
<text v-else>系统下单</text> <text v-else>系统下单</text>
@ -45,7 +45,8 @@
</view> </view>
</view> </view>
<text class="pet-service"> <text class="pet-service">
{{ handleText(pet.productNameText) }} | {{ pet.orderServiceText.length }} {{ handleText(pet.orderServiceText) }}</text>
{{ handleText(pet.productNameText) }} | {{ pet.orderServiceText.length }}
{{ handleText(pet.orderServiceText) }}</text>
</view> </view>
</view> </view>
@ -100,15 +101,15 @@
<image src="/static/images/personal/no-data.png" mode="aspectFit" class="no-data-image"></image> <image src="/static/images/personal/no-data.png" mode="aspectFit" class="no-data-image"></image>
<text>暂无订单</text> <text>暂无订单</text>
</view> </view>
<!-- 首次加载状态 --> <!-- 首次加载状态 -->
<view class="initial-loading" v-if="orderList.length === 0 && loading"> <view class="initial-loading" v-if="orderList.length === 0 && loading">
<view class="loading-spinner large"></view> <view class="loading-spinner large"></view>
<text>正在加载订单...</text> <text>正在加载订单...</text>
</view> </view>
</view> </view>
</scroll-view>
<!-- </scroll-view> -->
<!-- 全屏加载遮罩 (仅首次加载显示) --> <!-- 全屏加载遮罩 (仅首次加载显示) -->
<!-- <view class="loading-overlay" v-if="loading && page === 1 && orderList.length === 0 && isFirstLoad"> <!-- <view class="loading-overlay" v-if="loading && page === 1 && orderList.length === 0 && isFirstLoad">
<view class="loading-content"> <view class="loading-content">
@ -125,7 +126,7 @@
<!-- 伴宠师选择弹窗 --> <!-- 伴宠师选择弹窗 -->
<companion-select-popup ref="companionSelectPopup" /> <companion-select-popup ref="companionSelectPopup" />
<!-- 支付加载遮罩 --> <!-- 支付加载遮罩 -->
<view class="loading-overlay" v-if="isPaying"> <view class="loading-overlay" v-if="isPaying">
<view class="loading-content"> <view class="loading-content">
@ -150,7 +151,10 @@
} from '@/utils/auth' } from '@/utils/auth'
import CancelOrderPopup from '@/pages_order/components/order/CancelOrderPopup.vue' import CancelOrderPopup from '@/pages_order/components/order/CancelOrderPopup.vue'
import CompanionSelectPopup from '@/pages_order/components/order/CompanionSelectPopup.vue' import CompanionSelectPopup from '@/pages_order/components/order/CompanionSelectPopup.vue'
import { getOrderServiceText, getProductNameText } from '@/utils/serviceTime.js'
import {
getOrderServiceText,
getProductNameText
} from '@/utils/serviceTime.js'
export default { export default {
components: { components: {
Kefu, Kefu,
@ -168,13 +172,17 @@
value: 0 value: 0
}, },
{ {
name: '接单',
name: '接单',
value: 1 value: 1
}, },
{ {
name: '服务中',
name: '已接单',
value: 2 value: 2
}, },
{
name: '服务中',
value: 3
},
{ {
name: '已完成', name: '已完成',
value: 3 value: 3
@ -188,60 +196,75 @@
loading: false, loading: false,
refreshing: false, refreshing: false,
currentOrder: null, currentOrder: null,
isPaying : false,
isPaying: false,
requestId: 0, // requestId: 0, //
switchTabTimer: null, // switchTabTimer: null, //
loadMoreTimer: null, // loadMoreTimer: null, //
isFirstLoad: true, // isFirstLoad: true, //
// API
exampleData: [{
id: '1',
status: '0',
statusText: '待付款',
amount: '264',
pets: [{
name: '小咪',
avatar: '/static/images/personal/pet.png',
tag: '猫',
gender: '女生',
serviceTime: '专业喂养2天: 03-20,03-22'
},
{
name: '小汪',
avatar: '/static/images/personal/pet.png',
tag: '狗',
gender: '男生',
serviceTime: '专业喂养2天: 03-20,03-22'
}
],
orderTime: '2025-12-14 18:23:06',
companionName: '张三',
companionNote: '伴宠师名称暂不可见'
}]
};
}
},
onPullDownRefresh() {
this.refreshing()
},
onReachBottom() {
this.loadMore()
}, },
methods: { methods: {
// //
switchTab(tabValue) { switchTab(tabValue) {
if (this.currentTab === tabValue) return; // if (this.currentTab === tabValue) return; //
this.currentTab = tabValue; this.currentTab = tabValue;
this.orderList = []; this.orderList = [];
this.page = 1; this.page = 1;
this.hasMore = true; this.hasMore = true;
this.isFirstLoad = false; // this.isFirstLoad = false; //
// //
if (this.switchTabTimer) { if (this.switchTabTimer) {
clearTimeout(this.switchTabTimer); clearTimeout(this.switchTabTimer);
} }
// //
this.switchTabTimer = setTimeout(() => { this.switchTabTimer = setTimeout(() => {
this.getOrderList(); this.getOrderList();
}, 100); }, 100);
}, },
getOrderStatusText(status) {
// switch (status) {
// case 0:
// return '';
// case 1:
// return '';
// case 2:
// return '';
// case 3:
// return '';
// case 4:
// return '';
// case 5:
// return '';
// }
switch (status) {
case 0:
return '待付款';
case 1:
return '待接单';
case 2:
return '已接单';
case 3:
return '已完成';
case 4:
return '已关闭';
case 5:
return '无效订单';
case 11:
return '服务中';
}
},
// //
refresh() { refresh() {
this.refreshing = true; this.refreshing = true;
@ -257,18 +280,18 @@
}, },
handleCancelOrder() { handleCancelOrder() {
this.refresh()
this.refresh()
}, },
// //
loadMore() { loadMore() {
if (this.loading || !this.hasMore) return; if (this.loading || !this.hasMore) return;
// //
if (this.loadMoreTimer) { if (this.loadMoreTimer) {
clearTimeout(this.loadMoreTimer); clearTimeout(this.loadMoreTimer);
} }
this.loadMoreTimer = setTimeout(() => { this.loadMoreTimer = setTimeout(() => {
this.page++; this.page++;
this.getOrderList(); this.getOrderList();
@ -321,7 +344,10 @@
}, },
// //
goToReview({teacherId, orderId}) {
goToReview({
teacherId,
orderId
}) {
uni.navigateTo({ uni.navigateTo({
url: `/pages_order/order/orderReview?id=${teacherId}&orderId=${orderId}` url: `/pages_order/order/orderReview?id=${teacherId}&orderId=${orderId}`
}); });
@ -331,7 +357,7 @@
getOrderList() { getOrderList() {
if (this.loading) return Promise.reject(); if (this.loading) return Promise.reject();
this.loading = true; this.loading = true;
// ID // ID
const currentRequestId = ++this.requestId; const currentRequestId = ++this.requestId;
@ -339,32 +365,11 @@
const params = { const params = {
status: this.currentTab, status: this.currentTab,
openId: getOpenIdKey(), openId: getOpenIdKey(),
pageNumber: this.page,//pageNumber
pageNumber: this.page, //pageNumber
pageSize: this.size pageSize: this.size
}; };
// API
// return new Promise((resolve, reject) => {
// // API使API
// setTimeout(() => {
// try {
// // API
// if (this.page === 1) {
// this.orderList = [...this.exampleData];
// } else if (this.page < 3) {
// this.orderList = [...this.orderList, ...this.exampleData];
// } else {
// this.hasMore = false;
// }
// this.loading = false;
// resolve();
// } catch (err) {
// this.loading = false;
// reject(err);
// }
// }, 500);
// });
// API // API
return getOrderList(params).then(res => { return getOrderList(params).then(res => {
// //
@ -372,7 +377,7 @@
console.log('忽略过期的请求结果'); console.log('忽略过期的请求结果');
return Promise.reject('过期的请求'); return Promise.reject('过期的请求');
} }
if (res.content) { if (res.content) {
const newList = res.content || []; const newList = res.content || [];
if (this.page === 1) { if (this.page === 1) {
@ -381,19 +386,22 @@
this.orderList = [...this.orderList, ...newList]; this.orderList = [...this.orderList, ...newList];
} }
this.hasMore = newList.length === this.size; this.hasMore = newList.length === this.size;
this.orderList.forEach(item => { this.orderList.forEach(item => {
item.petVOList.forEach(pet => { item.petVOList.forEach(pet => {
pet.orderServiceText = getOrderServiceText(pet.id, item.orderServiceList || []) || []
pet.productNameText = getProductNameText(pet.id, item.orderItemList, item.orderServiceList || []) || []
pet.orderServiceText = getOrderServiceText(pet.id, item
.orderServiceList || []) || []
pet.productNameText = getProductNameText(pet.id, item
.orderItemList, item.orderServiceList || []) || []
}) })
}) })
} else { } else {
this.hasMore = false; this.hasMore = false;
} }
@ -407,8 +415,8 @@
} }
}); });
}, },
handleText(list){
handleText(list) {
return list && (list.length > 2 ? `${list[0]}...${list[list.length - 1]}` : list.join(',')) return list && (list.length > 2 ? `${list[0]}...${list[list.length - 1]}` : list.join(','))
}, },
@ -417,12 +425,12 @@
this.currentOrder = order; this.currentOrder = order;
this.$refs.companionSelectPopup.open(); this.$refs.companionSelectPopup.open();
}, },
// //
modifyOrder(order) { modifyOrder(order) {
uni.navigateTo({
url: `/pages_order/order/orderModify?orderId=${order.orderId}`
});
uni.navigateTo({
url: `/pages_order/order/orderModify?orderId=${order.orderId}`
});
}, },
}, },
@ -430,7 +438,7 @@
// //
this.getOrderList(); this.getOrderList();
}, },
onUnload() { onUnload() {
// //
if (this.switchTabTimer) { if (this.switchTabTimer) {
@ -581,9 +589,9 @@
font-size: 24rpx; font-size: 24rpx;
color: #666; color: #666;
margin-top: 4rpx; margin-top: 4rpx;
overflow:hidden; //
text-overflow:ellipsis; //
white-space:nowrap; //
overflow: hidden; //
text-overflow: ellipsis; //
white-space: nowrap; //
} }
} }
} }
@ -646,7 +654,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.initial-loading { .initial-loading {
text-align: center; text-align: center;
padding: 100rpx 0; padding: 100rpx 0;
@ -657,7 +665,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.loading-overlay { .loading-overlay {
position: fixed; position: fixed;
top: 0; top: 0;
@ -670,7 +678,7 @@
justify-content: center; justify-content: center;
z-index: 999; z-index: 999;
} }
.loading-content { .loading-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -681,13 +689,13 @@
border-radius: 20rpx; border-radius: 20rpx;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1); box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
} }
.loading-text { .loading-text {
color: #666; color: #666;
font-size: 28rpx; font-size: 28rpx;
margin-top: 20rpx; margin-top: 20rpx;
} }
.loading-spinner { .loading-spinner {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
@ -696,17 +704,22 @@
border-radius: 50%; border-radius: 50%;
animation: spin 1s linear infinite; animation: spin 1s linear infinite;
margin-bottom: 16rpx; margin-bottom: 16rpx;
&.large { &.large {
width: 60rpx; width: 60rpx;
height: 60rpx; height: 60rpx;
border-width: 6rpx; border-width: 6rpx;
} }
} }
@keyframes spin { @keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
} }
.no-order { .no-order {


+ 2
- 2
utils/getUrl.js View File

@ -1,7 +1,7 @@
let current ="develop";
let current ="trial";
const accountInfo = wx.getAccountInfoSync(); const accountInfo = wx.getAccountInfoSync();
// current = accountInfo.miniProgram.envVersion;
current = accountInfo.miniProgram.envVersion;
const api={ const api={


+ 2
- 0
utils/serviceTime.js View File

@ -35,6 +35,8 @@ export function getProductNameText(petId, productList, orderServiceList) {
let list = (productList let list = (productList
.filter(product => orderService.filter(service => service.id == product.orderServiceId).length > 0) .filter(product => orderService.filter(service => service.id == product.orderServiceId).length > 0)
.map(product => product.productName)) .map(product => product.productName))
list = list.reverse();
return [...new Set(list)] return [...new Set(list)]
} }


Loading…
Cancel
Save