179 lines
5.1 KiB
Vue
179 lines
5.1 KiB
Vue
<template>
|
||
<view>
|
||
<block v-if="publicData.length > 0">
|
||
<view class="record-list" v-for="(item, index) in publicData" :key="index">
|
||
<view class="record-top">
|
||
<view class="record-way">{{ item.name }}</view>
|
||
<view class="record-label-status">￥{{ item.bonus }}</view>
|
||
</view>
|
||
<view class="record-cont">
|
||
<view class="record-label">
|
||
<view class="record-label-name">时间</view>
|
||
<view class="record-label-time">{{ item.created_at }}</view>
|
||
</view>
|
||
<view class="record-label">
|
||
<view class="record-label-name">状态</view>
|
||
<view class="record-label-time">{{ item.order.status }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="record-source">
|
||
<view class="record-source-name">收益来源</view>
|
||
<view class="record-source-cont">
|
||
<image class="record-source-img" :src="item.source.avatar" mode="aspectFill"></image>
|
||
<view class="record-source-info">
|
||
<view class="record-source-nickname">{{ item.source.nickname }}</view>
|
||
<view class="record-source-tel">{{ item.source.username }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pagesLoding" v-if="lodingStats">
|
||
<block v-if="page.has_more">
|
||
<image class="pagesLoding-icon" src="/static/icon/refresh_loding.gif" mode="widthFix"></image>加载中...
|
||
</block>
|
||
<block v-else>
|
||
没有更多了~
|
||
</block>
|
||
</view>
|
||
</block>
|
||
<!-- 暂无内容 -->
|
||
<view class="pack-center pages-hint" v-else>
|
||
<image src="/static/img/legal_tips.png"></image>
|
||
<view>抱歉，目前暂无记录~</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { profitLogs } from '@/apis/interfaces/user'
|
||
export default {
|
||
data() {
|
||
return {
|
||
name : '', //权益名
|
||
publicData : [], //权益列表
|
||
page : {}, //下一页
|
||
lodingStats : false ,//加载状态
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
this.name = options.name
|
||
|
||
// 获取收益列表
|
||
this.profitInfo();
|
||
},
|
||
methods: {
|
||
// 收益列表
|
||
profitInfo(page) {
|
||
profitLogs({
|
||
name: this.name,
|
||
page: page
|
||
}).then(res=>{
|
||
let listArr = this.publicData,
|
||
newData = []
|
||
if(page == 1 || page == undefined) listArr = []
|
||
newData = listArr.concat(res.data)
|
||
this.publicData = newData
|
||
this.page = res.page
|
||
this.lodingStats = false
|
||
uni.stopPullDownRefresh()
|
||
}).catch(err=>{})
|
||
},
|
||
|
||
// 上拉加载
|
||
onReachBottom(){
|
||
this.lodingStats = true
|
||
let pageNumber = this.page.current
|
||
if(this.page.has_more){
|
||
pageNumber++
|
||
this.profitInfo(pageNumber)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
/* 记录列表 */
|
||
.record-list {
|
||
background-color: #fff;
|
||
border-radius: 10rpx;
|
||
margin: 30rpx;
|
||
}
|
||
|
||
.record-top {
|
||
display: flex;
|
||
padding: 30rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.record-way {
|
||
flex: 1;
|
||
}
|
||
|
||
.record-take {
|
||
font-weight: 600;
|
||
}
|
||
|
||
.record-cont {
|
||
padding: 0 30rpx;
|
||
box-sizing: border-box;
|
||
color: #999;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.record-label {
|
||
display: flex;
|
||
line-height: 70rpx;
|
||
}
|
||
|
||
.record-label-name {
|
||
flex: 1;
|
||
}
|
||
|
||
.record-label-status {
|
||
color: red;
|
||
}
|
||
|
||
.record-source {
|
||
border-top: 10rpx solid #f7f7f7;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.record-source-name {
|
||
background: #f7f7f7;
|
||
color: #000;
|
||
width: 140rpx;
|
||
text-align: center;
|
||
line-height: 60rpx;
|
||
margin: 0 auto;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.record-source-cont {
|
||
position: relative;
|
||
padding: 40rpx 30rpx 20rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.record-source-img {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.record-source-info {
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
width: 100%;
|
||
padding: 40rpx 30rpx 20rpx 120rpx;
|
||
box-sizing: border-box;
|
||
line-height: 70rpx;
|
||
display: flex;
|
||
}
|
||
|
||
.record-source-nickname {
|
||
flex: 1;
|
||
}
|
||
</style>
|