172 lines
3.2 KiB
Vue
172 lines
3.2 KiB
Vue
<template>
|
||
<view class="">
|
||
<view class="head">
|
||
|
||
<view class="money">
|
||
收益明细(元)
|
||
<view class="" style="margin-top: 35rpx;font-size: 35rpx;">
|
||
¥ {{money ||0}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="cont">
|
||
<view class="tit">
|
||
收益明细
|
||
</view>
|
||
<view class="card" v-for="item,index in orderList" :key='index'>
|
||
<view class="card-top">
|
||
<view class="">
|
||
<!-- 2024-01-2 16:20:34 -->
|
||
{{item.create_time}}
|
||
</view>
|
||
<view class="" style="color: #6A92EB;">
|
||
<!-- 任务收益金额增加 -->
|
||
{{item.type_desc}}
|
||
</view>
|
||
</view>
|
||
<view class="card-top" style="margin-top: 30rpx;">
|
||
<view class="tit" style="font-size: 28rpx;">
|
||
<!-- 2024-01-2 16:20:34 -->
|
||
{{item.remark}}
|
||
</view>
|
||
<view class="">
|
||
<!-- 任务收益金额增加 -->
|
||
{{item.change_amount_desc}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-loadmore :status="status" v-if='orderList.length>0' />
|
||
|
||
<view class="" v-if='orderList.length==0'>
|
||
<u-empty icon="/static/newWork/index/empty.png" iconSize='200' width='300' height="300" marginTop='50'
|
||
textColor='#BFD7FF' text="没有更多了~"></u-empty>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
account_log,
|
||
} from "@/api/newTask.js"
|
||
export default {
|
||
data() {
|
||
return {
|
||
orderList: [],
|
||
flag: false,
|
||
status: "loadmore",
|
||
page_no: 2,
|
||
page_size: 20,
|
||
money: ""
|
||
}
|
||
},
|
||
methods: {
|
||
async getFirstOrderLogList() {
|
||
let res = await account_log({
|
||
page_no: 1,
|
||
page_size: 20
|
||
})
|
||
this.orderList = res.data.lists
|
||
}
|
||
},
|
||
mounted() {
|
||
this.getFirstOrderLogList()
|
||
},
|
||
onLoad(option) {
|
||
this.money = option.money
|
||
},
|
||
onReachBottom() {
|
||
if (this.flag) return
|
||
let {
|
||
page_no,
|
||
page_size
|
||
} = this
|
||
let that = this
|
||
this.status = "loading"
|
||
this.page_no += 1
|
||
this.flag = true
|
||
account_log({
|
||
page_no,
|
||
page_size
|
||
}).then(res => {
|
||
that.orderList = that.orderList.concat(res.data.lists)
|
||
this.flag = false
|
||
if (!res.data.lists.length) {
|
||
this.status = "nomore"
|
||
this.flag = true
|
||
}
|
||
})
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.head {
|
||
width: 750rpx;
|
||
background-color: #2B63E3;
|
||
height: 200rpx;
|
||
position: relative;
|
||
|
||
.money {
|
||
width: 670rpx;
|
||
background-color: rgba(255, 255, 255, .2);
|
||
box-shadow: 0.5rpx 0.5rpx 200rpx 0.5rpx rgba(0, 0, 0, 0.1);
|
||
height: 220rpx;
|
||
margin: 0 auto;
|
||
border-radius: 20rpx;
|
||
position: absolute;
|
||
left: 50%;
|
||
top: 100%;
|
||
transform: translate(-50%, -50%);
|
||
backdrop-filter: blur(50rpx);
|
||
color: white;
|
||
padding: 20rpx;
|
||
|
||
}
|
||
}
|
||
|
||
.cont {
|
||
// width: 690rpx;
|
||
margin: 120rpx auto;
|
||
padding: 20rpx;
|
||
|
||
.tit {
|
||
position: relative;
|
||
padding-left: 20rpx;
|
||
font-size: 30rpx;
|
||
color: #1A1A1A;
|
||
font-weight: bold;
|
||
|
||
}
|
||
|
||
.tit::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
left: 0;
|
||
width: 6rpx;
|
||
/* 左边框的宽度 */
|
||
height: 25rpx;
|
||
border-radius: 20rpx;
|
||
background-color: #2B63E3;
|
||
}
|
||
|
||
.card {
|
||
background-color: #fff;
|
||
padding: 20rpx;
|
||
border-radius: 20rpx;
|
||
margin-top: 20rpx;
|
||
|
||
.card-top {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
}
|
||
</style> |