2025-10-24

我的订单修改
This commit is contained in:
2025-10-24 15:56:41 +08:00
parent 81dba82be3
commit 5769349d08

View File

@@ -14,15 +14,26 @@
<u-tabs bg-color="#F5F8FF" :show-bar="false" :list="tabList" :is-scroll="false" <u-tabs bg-color="#F5F8FF" :show-bar="false" :list="tabList" :is-scroll="false"
v-model="currentTab"></u-tabs> v-model="currentTab"></u-tabs>
<view class="menu-list"> <view class="menu-list">
<view class="menu-item" :class="currentMenu==0?'active':''" @click="handleChangeMenu(0)">全部订单</view> <!-- 'pending'待发货,'paid','shipped'已发货,'delivered','cancelled'已取消,'pre_order'预订单状态未选择地址和支付方式,'completed'已收货 -->
<view class="menu-item" :class="currentMenu==1?'active':''" @click="handleChangeMenu(1)">待付款</view> <view class="menu-item" :class="currentMenu==''?'active':''" @click="handleChangeMenu('')">全部订单</view>
<view class="menu-item" :class="currentMenu==2?'active':''" @click="handleChangeMenu(2)">待发货</view> <view class="menu-item" :class="currentMenu=='pending'?'active':''"
<view class="menu-item" :class="currentMenu==3?'active':''" @click="handleChangeMenu(3)"></view> @click="handleChangeMenu('pending')"></view>
<view class="menu-item" :class="currentMenu==4?'active':''" @click="handleChangeMenu(4)">退款/售后</view> <view class="menu-item" :class="currentMenu=='pre_order'?'active':''"
@click="handleChangeMenu('pre_order')">待支付</view>
<view class="menu-item" :class="currentMenu=='shipped'?'active':''"
@click="handleChangeMenu('shipped')">已发货</view>
<view class="menu-item" :class="currentMenu=='completed'?'active':''"
@click="handleChangeMenu('completed')">已完成</view>
<view class="menu-item" :class="currentMenu=='cancelled'?'active':''"
@click="handleChangeMenu('cancelled')">已取消</view>
</view> </view>
</view> </view>
<scroll-view scroll-y="true" class="scroll-view" :style="'height:'+scrollHeight+'px'" @scrolltolower="loadData"> <scroll-view scroll-y="true" class="scroll-view" :style="'height:'+scrollHeight+'px'" @scrolltolower="loadData">
<template v-if="currentTab==0">
111
</template>
<template v-if="currentTab==1">
<view class="order-list" v-for="orderItem in orderList"> <view class="order-list" v-for="orderItem in orderList">
<view class="u-m-l-20">订单号{{orderItem.order_no}}</view> <view class="u-m-l-20">订单号{{orderItem.order_no}}</view>
<view class="order-item" v-for="item in orderItem.items"> <view class="order-item" v-for="item in orderItem.items">
@@ -73,7 +84,8 @@
<template v-if="orderItem.status=='pre_order'"> <template v-if="orderItem.status=='pre_order'">
<u-button hover-class="none" class="operate-btn" <u-button hover-class="none" class="operate-btn"
@click="handelCancel(orderItem)">取消订单</u-button> @click="handelCancel(orderItem)">取消订单</u-button>
<u-button hover-class="none" class="operate-btn" @click="handlePay(orderItem)">立即支付</u-button> <u-button hover-class="none" class="operate-btn"
@click="handlePay(orderItem)">立即支付</u-button>
</template> </template>
<!-- 完成 --> <!-- 完成 -->
<!-- <template v-if="orderItem.status=='completed'"> <!-- <template v-if="orderItem.status=='completed'">
@@ -85,6 +97,10 @@
</view> </view>
<u-loadmore margin-top="20" :status="loadStatus"></u-loadmore> <u-loadmore margin-top="20" :status="loadStatus"></u-loadmore>
<view class="box-view"></view> <view class="box-view"></view>
</template>
<template v-if="currentTab==2">
222
</template>
</scroll-view> </scroll-view>
</view> </view>
@@ -117,7 +133,6 @@
<view class="info-item"> <view class="info-item">
<view class="info-name">订单状态</view> <view class="info-name">订单状态</view>
<!-- <view class="info-value">{{detailInfo.status}}</view> --> <!-- <view class="info-value">{{detailInfo.status}}</view> -->
<!-- 'pending'待发货,'paid','shipped'已发货,'delivered','cancelled'已取消,'pre_order'预订单状态未选择地址和支付方式,'completed'已收货 -->
<u-tag v-if="detailInfo.status=='pending'" text="待发货"></u-tag> <u-tag v-if="detailInfo.status=='pending'" text="待发货"></u-tag>
<u-tag v-if="detailInfo.status=='shipped'" text="已发货"></u-tag> <u-tag v-if="detailInfo.status=='shipped'" text="已发货"></u-tag>
<u-tag v-if="detailInfo.status=='cancelled'" text="已取消"></u-tag> <u-tag v-if="detailInfo.status=='cancelled'" text="已取消"></u-tag>
@@ -164,14 +179,18 @@
<view class="info-name">商品总计</view> <view class="info-name">商品总计</view>
<view class="info-value"> <view class="info-value">
<image class="icon" src="/static/icon/rongdou.png" mode=""></image> <image class="icon" src="/static/icon/rongdou.png" mode=""></image>
{{allPay}} {{detailInfo.total_rongdou}}
</view> </view>
</view> </view>
<view class="info-item"> <view class="info-item">
<view class="info-name">实付</view> <view class="info-name">实付</view>
<view class="info-value"> <view class="info-value" v-if="detailInfo.real_rongdou">
<image class="icon" src="/static/icon/rongdou.png" mode=""></image> <image class="icon" src="/static/icon/rongdou.png" mode=""></image>
{{detailInfo.total_rongdou}} {{detailInfo.real_rongdou}}
</view>
<view class="info-value" v-if="detailInfo.real_points">
<image class="icon" src="/static/icon/jifen.png" mode=""></image>
{{detailInfo.real_points}}
</view> </view>
</view> </view>
</view> </view>
@@ -185,7 +204,8 @@
ref, ref,
onMounted, onMounted,
getCurrentInstance, getCurrentInstance,
computed computed,
watch
} from 'vue'; } from 'vue';
import { import {
onLoad, onLoad,
@@ -225,7 +245,9 @@
} }
const handleSearch = () => { const handleSearch = () => {
msgRef.value.show({
title: '暂无功能,请期待~'
})
} }
const tabList = ref([{ const tabList = ref([{
@@ -235,11 +257,25 @@
}, { }, {
name: '理财产品', name: '理财产品',
}]) }])
const currentTab = ref(0) const currentTab = ref(1)
const currentMenu = ref(0) const currentMenu = ref(0)
watch(currentTab, (val) => {
if (val == 0 || val === 2) {
msgRef.value.show({
title: '暂无功能,请期待~'
})
currentTab.value = 1
return
}
loadData()
})
const handleChangeMenu = (val) => { const handleChangeMenu = (val) => {
currentMenu.value = val currentMenu.value = val
clearData()
params.value.status = val
loadData()
} }
// 取消订单 // 取消订单
@@ -308,22 +344,30 @@
page: 1, page: 1,
limit: 10, limit: 10,
search: '', search: '',
status: ''
}) })
const loadStatus = ref('loadmore') const loadStatus = ref('loadmore')
const maxPage = ref(1) const maxPage = ref(1)
const orderList = ref([]) const orderList = ref([])
const loadData = () => { const loadData = () => {
if (currentTab.value == 0) {
// 项目订单
} else if (currentTab.value == 1) {
// 商品订单
if (loadStatus.value == 'nomore') return if (loadStatus.value == 'nomore') return
mallAPI.getOrderList(params.value).then(res => { mallAPI.getOrderList(params.value).then(res => {
orderList.value = orderList.value.concat(res.data.orders) orderList.value = orderList.value.concat(res.data.orders)
maxPage.value = res.data.pagination.pages maxPage.value = res.data.pagination.pages
params.value.page++ params.value.page++
console.log(orderList.value);
if (maxPage.value < params.value.page) { if (maxPage.value < params.value.page) {
loadStatus.value = 'nomore' loadStatus.value = 'nomore'
} }
}) })
} else if (currentTab.value == 2) {
// 理财产品
}
} }
const clearData = () => { const clearData = () => {
@@ -364,15 +408,16 @@
font-weight: 400; font-weight: 400;
font-size: 26rpx; font-size: 26rpx;
line-height: 100%; line-height: 100%;
justify-content: space-between;
padding: 20rpx 20rpx; padding: 20rpx 20rpx;
overflow-x: auto;
white-space: nowrap;
.menu-item { .menu-item {
background: #DFDFDF; background: #DFDFDF;
border-radius: 12rpx; border-radius: 12rpx;
padding: 12rpx 20rpx; padding: 12rpx 20rpx;
color: #676767; color: #676767;
margin: 0 10rpx;
} }
.active { .active {