OfficeApp/subpkg/withdrawList/withdrawList.vue

162 lines
3.8 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="">
<view class="list">
<view class="card" v-for="(item, index) in list" :key="index">
<view class="top">
<view class="tips" :class="typeList[item.status].class">{{typeList[item.status].text}}</view>
<view>提现日期{{item.create_time}}</view>
</view>
<view class="bottom">
<view class="left">
<view>提现金额()</view>
<view class="num">{{item.amount}}</view>
</view>
<view class="right">
<view>订单编号:</view>
<view>{{item.order_sn}}</view>
</view>
</view>
</view>
</view>
<u-loadmore :status="loadConfig.status" :loading-text="loadConfig.loadingText" :loadmore-text="loadConfig.loadmoreText" :nomore-text="loadConfig.nomoreText" />
</view>
</template>
<script>
import {userWithdrawList} from "@/api/pay.js"
export default {
data() {
return {
list:[],
typeList:[
{
text: '审核中',
class: 'audit'
},
{
text: '已通过',
class: 'pass'
},
{
text: '已拒绝',
class: 'no_pass'
},
{
text: '已转账',
class: 'ok'
}
],
loadConfig:{
page: 1,
limit: 15,
loadingText: '努力加载中',
loadmoreText: '轻轻上拉',
nomoreText: '没有更多记录了~~',
status: 'loadmore'
},
}
},
onLoad() {
this.loadList();
},
onShow() {},
onReachBottom() {
this.loadList()
},
methods: {
async loadList(){
if(this.loadConfig.status=="nomore")return;
this.loadConfig.status="loading"
let res = await userWithdrawList({
page: this.loadConfig.page,
limit: this.loadConfig.limit
});
this.loadConfig.status="loadmore"
if(res.data.data.length<this.loadConfig.limit){
this.loadConfig.status="nomore"
}else {
this.loadConfig.page++;
}
this.list = [...this.list, ...res.data.data];
}
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
}
}
</script>
<style lang="scss">
.list{
// background-color: #f5f5f5;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 28rpx;
.card{
padding: 28rpx;
width: 694rpx;
background-color: #fff;
margin-bottom: 21rpx;
.top{
display: flex;
align-items: center;
font-size: 25rpx;
font-weight: 400;
color: #333333FF;
line-height: 39rpx;
.tips{
width: 137rpx;
height: 49rpx;
background: #0122c7;
border-radius: 26rpx 26rpx 26rpx 26rpx;
font-size: 25rpx;
font-weight: 400;
color: #FFFFFF;
line-height: 39rpx;
display: flex;
justify-content: center;
align-items: center;
margin-right: 28rpx;
}
.pass{
background-color: #FF8C1A;
}
.no_pass{
background-color: #F02828;
}
.ok{
background-color: #47B347;
}
}
.bottom{
display: flex;
justify-content: space-between;
align-items: center;
height: 160rpx;
.left{
flex: 1;
text-align: center;
font-size: 25rpx;
font-weight: 400;
color: #666666;
line-height: 39rpx;
.num{
font-size: 39rpx;
font-weight: 500;
color: #F02828;
line-height: 39rpx;
}
}
.right{
flex: 1;
font-size: 25rpx;
font-weight: 400;
color: #666666;
line-height: 39rpx;
}
}
}
}
</style>