You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
134 lines
2.7 KiB
134 lines
2.7 KiB
3 months ago
|
<template>
|
||
|
|
<view class="main-page">
|
||
|
|
<view>
|
||
|
|
<view>
|
||
|
|
<view class="content-list" v-for="(item,index) in orderData.orderList" :key="item.id">
|
||
|
|
<view>
|
||
|
|
<view class="station-name">{{item.stationName}}</view>
|
||
|
|
<view class="station-time">{{item.createTime}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="">
|
||
|
|
<view class="orders-price">￥{{item.trRealAmt}}</view>
|
||
|
|
<view class="price-type">换电消费</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import config from '@/common/config/config.js';
|
||
|
|
import {
|
||
|
|
reactive,
|
||
|
|
ref,
|
||
|
|
} from "vue";
|
||
|
|
import {
|
||
|
|
onLoad,
|
||
|
|
onShow,
|
||
|
|
onReachBottom,
|
||
|
|
onUnload,
|
||
|
|
onHide,
|
||
|
|
onTabItemTap,
|
||
|
|
onPullDownRefresh
|
||
|
|
} from "@dcloudio/uni-app";
|
||
|
|
//
|
||
|
|
const orderData = reactive({ //请求的订单列表
|
||
|
|
orderList: [],
|
||
|
|
orderAskIng: []
|
||
|
|
})
|
||
|
|
const page = ref(1) //触底加载增加的页数
|
||
|
|
const totalPages = ref() //总页数，用于判断是否加载完
|
||
|
|
const idKey=ref()
|
||
|
|
onLoad((option)=>{
|
||
|
|
idKey.value=option.id
|
||
|
|
console.log(option,'option');
|
||
|
|
})
|
||
|
|
onShow( async () => {
|
||
|
|
page.value = 1
|
||
|
|
await getOrder(0)
|
||
|
|
})
|
||
|
|
onReachBottom(async () => {
|
||
|
|
if (page.value < totalPages.value) {
|
||
|
|
page.value += 1
|
||
|
|
await getOrder(1)
|
||
|
|
orderData.orderList = orderData.orderList.concat(orderData.orderAskIng)
|
||
|
|
} else {
|
||
|
|
uni.$u.toast('没有更多啦');
|
||
|
|
}
|
||
|
|
})
|
||
|
|
const getOrder = async (type) => {
|
||
|
|
await uni.$request({
|
||
|
|
url: config.wxUrl_pay + 'pay/invoice/orderDetail?pageNo=' +
|
||
|
|
page.value + "&pageSize=" + 10+ "&invoiceId=" + idKey.value
|
||
|
|
}).then(res => {
|
||
|
|
console.log(res, '==========>444');
|
||
|
|
if (type == 1) {
|
||
|
|
orderData.orderAskIng = res.data.data.data //触底加载的列表
|
||
|
|
} else {
|
||
|
|
orderData.orderList = res.data.data.data //渲染的列表
|
||
|
|
}
|
||
|
|
totalPages.value = res.data.data.totalPage //总页数
|
||
|
|
}).catch((err) => {
|
||
|
|
uni.showToast({
|
||
|
|
title: '加载失败',
|
||
|
|
duration: 2000,
|
||
|
|
icon: 'error'
|
||
|
|
});
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang='less' scoped>
|
||
|
|
.main-page {
|
||
|
|
/* background: #F5F7FA; */
|
||
|
|
position: relative;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.content-list {
|
||
|
|
padding: 32rpx;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
background: #FFFFFF;
|
||
|
|
box-shadow: -2px 2px 8px 0px #7AA7D026;
|
||
|
|
margin: 16rpx 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.station-name {
|
||
|
|
color: #171717;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
height: 40rpx;
|
||
|
|
line-height: 40rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.station-time {
|
||
|
|
font-size: 20rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #808080;
|
||
|
|
margin-top: 8rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.orders-price {
|
||
|
|
color: #4C91FF;
|
||
|
|
font-size: 32rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
text-align: right;
|
||
|
|
height: 40rpx;
|
||
|
|
line-height: 40rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.price-type {
|
||
|
|
font-size: 20rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #585858;
|
||
|
|
text-align: right;
|
||
|
|
margin-top: 8rpx;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<style lang="less">
|
||
|
|
page {
|
||
|
|
background-color: #F2F6F7;
|
||
|
|
}
|
||
|
|
</style>
|