152 lines
2.8 KiB
Vue
152 lines
2.8 KiB
Vue
<template>
|
|
<view>
|
|
<view class="list-view" v-if="list.length > 0">
|
|
<view class="list-item" v-for="(item, index) in list" :key="index" hover-class="hover" >
|
|
<view class="content-box">
|
|
<view class="des-box">
|
|
<view class="tit">{{ item.change_type_text}}</view>
|
|
<view class="time">{{ item.createtime_text }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="green" v-if="item.change_point < 0 ">{{item.change_point}}</view>
|
|
|
|
<view class="red" v-if="item.change_point >=0">{{'+' + item.change_point}}</view>
|
|
</view>
|
|
<uni-load-more :status="loadmore" :content-text="contentText" />
|
|
</view>
|
|
<view class="zanwuimg" v-if="list.length == 0">
|
|
<image src="../../static/img/null.png" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
page:1,
|
|
ifBottomRefresh:false,
|
|
loadmore: 'more',
|
|
contentText: {
|
|
contentdown: '查看更多',
|
|
contentrefresh: '加载中',
|
|
contentnomore: '没有更多'
|
|
},
|
|
list:[],
|
|
}
|
|
},
|
|
onReachBottom() {
|
|
if (this.loadmore == 'noMore') return
|
|
this.page += 1
|
|
this.ifBottomRefresh = true
|
|
this.getdata()
|
|
},
|
|
onShow() {
|
|
},
|
|
onLoad(options) {
|
|
this.getdata()
|
|
},
|
|
methods: {
|
|
getdata(){
|
|
let data = {
|
|
page:this.page
|
|
}
|
|
this.$api.pointlist(data,res=>{
|
|
if(res.code == '1'){
|
|
this.list= this.list.concat(res.data.list.data)
|
|
this.loadmore = this.list.length < res.data.list.total ? 'more' : 'noMore'
|
|
}
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background: #fff;
|
|
}
|
|
|
|
.list-view {
|
|
position: relative;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
.list-item {
|
|
width: 100%;
|
|
padding: 30rpx 28rpx;
|
|
box-sizing: border-box;
|
|
background: #fff;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
border-bottom: 1rpx solid #eaeef1;
|
|
}
|
|
|
|
.item-last::after {
|
|
left: 0 !important;
|
|
}
|
|
|
|
.content-box {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.des-box {
|
|
min-height: 80rpx;
|
|
padding-left: 28rpx;
|
|
box-sizing: border-box;
|
|
vertical-align: top;
|
|
color: #333;
|
|
font-size: 24rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.tit {
|
|
font-size: 26rpx;
|
|
max-width: 420rpx;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.source {
|
|
margin: 12rpx 0;
|
|
}
|
|
.time {
|
|
color: #888;
|
|
}
|
|
|
|
.green {
|
|
font-size: 38rpx;
|
|
font-weight: 500;
|
|
color: #ff1e0f;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
padding-left: 20rpx;
|
|
}
|
|
|
|
.red {
|
|
color: #4caf50 !important;
|
|
font-size: 38rpx;
|
|
font-weight: 500;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
padding-left: 20rpx;
|
|
}
|
|
.tip {
|
|
margin-top: 50rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-content: center;
|
|
font-size: 24rpx;
|
|
color: #888;
|
|
}
|
|
</style>
|
|
|