java-mall-app/paotui/commission/lists.vue

<template>
    <view class="page">

        <scroll-view class="m-product-all" scroll-y="true" @scrolltolower="scrollbottom" style="width:100%;height:100%;position: absolute;">
            <view class="header">
                <view class="num">{{__('￥')}}{{userInfo.user_money}}<label style="font-size:34rpx"></label></view>
				<view class="num-title">{{__("当前账户余额")}}</view>
                <navigator url="/member/cash/predepositapply"  class="goshop">{{__('提现')}}</navigator>
            </view>
            <view class="detail">
                <view class="p-left">
                    <text class="highlight">{{__('今日收益')}}{{__('￥')}}{{today_income}}</text>
                </view>
				<view class="p-left">
				    <text class="highlight">{{__('累计收益')}}{{__('￥')}}{{total_income}}</text>
				</view>
            </view>
            <view v-if="(list.length>0)"  class="m-orderlist" >
                <view class="detail" v-for="(items, index) in list"  :key="index">
                    <view class="detail-left">
                        <text style="color:#000000">{{items.end_month_day}}</text>
                        <view class="time">{{items.end_year}}</view>
                    </view>

                    <view class="detail-right" >
						<label style="margin-right: 100rpx;">{{__('订单编号:')}}{{items.po_id}}</label>
                        <label class="money add pprice" v-if="(items.po_freight > 0)">+{{items.po_freight}}</label>
                        <label class="money add pprice" v-else >-{{items.po_freight}}</label>
                    </view>
                </view>
                <view class="m-loading-box">
                    <block v-if="(ispage)">
                        <view class="u-loadmore">
                            <label class="u-loading"></label>
                            <text class="u-loadmore-tips">{{__('正在加载')}}</text>
                        </view>
                    </block>
                    <block v-else>
                        <view class="u-loadmore u-loadmore-line">
                            <text class="u-loadmore-tips">{{__('没有更多数据啦！')}}</text>
                        </view>
                    </block>
                </view>
            </view>
            <view redirect="true" class="m-nullpage" v-else style="top:20%">
                <view class="m-nullpage-middle">
                    <view class="m-null-tip">
                        <text>{{__('亲~您还没有积分哦')}}</text>
                    </view>
                </view>
            </view>
        </scroll-view>


    </view>
</template>


<script>
    import {
        mapState,
        mapMutations
    } from 'vuex'

    export default {
        data: function() {
            return {
                resource: "", list: [], tapindex: 1, page: 1, ispage: false, flag: true, windowHeight: 0,
				today_income: 0,
				total_income: 0,
            }
        },
        computed: mapState(['Config', 'StateCode', 'notice', 'plantformInfo', 'shopInfo', 'userInfo', 'hasLogin']),
        onLoad: function(options) {
            uni.setNavigationBarTitle({
                title:this.__('账户余额')
            });


            this.getOrderList()
        },
        methods: {
            ...mapMutations(['login', 'logout', 'getPlantformInfo', 'forceUserInfo', 'getUserInfo']),
			
		
            getOrderList: function () {
                var that = this, params = {page: this.page,rows: 10};

                that.$.request({
                    url: this.Config.URL.city.paotui_order_list,
                    data: params,
                    success: function (data, status, msg, code) {
                        if (200 == status) {
                            if (data.order_list.page >= data.order_list.total) {
                                that.setData({
                                    flag: false,
                                    ispage: false,
                                    list: that.list.concat(data.order_list.items)
                                })
                            } else {
                                that.setData({
                                    flag: true,
                                    ispage: true,
                                    list: that.list.concat(data.order_list.items)
                                })
                            }
							
							that.setData({
								today_income: data.today_income,
								total_income: data.total_income,
							})
					
                        } else {
                            that.setData({
                                flag: false,
                                ispage: false
                            })
                        }
                    }
                });

            },
            scrollbottom: function () {
                if (this.flag)
                {
                    var that = this;
                    that.setData({flag: false}), clearTimeout(t);
                    var t = setTimeout(function () {
                        that.setData({page: that.page + 1}), that.getOrderList()
                    }, 500)
                }
            }
        }
    };
</script>

<style lang="scss">
    @import "../../styles/_variables";
	
    .header{
        // width: 100%;
        height: 340rpx;
        background: $default-skin-bg;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
		background: #6A4A23;
		    border-radius: 10px;
		
    }
    .num{
        font-size: 40rpx;
        color: #fff;
        margin-left: 40rpx
    }
    .goshop{
        font-size: 24rpx;
        color: #fff;
        margin-top: 10rpx;
        border: 1px solid #fff;
        border-radius: 20rpx;
        padding: 6rpx 16rpx;
		margin-left:40rpx;
    }
    /* .detail{
      display: flex;
      justify-content: space-between;
      padding: 24rpx 30rpx;
      align-items: center;
      border-bottom:1px solid #d9d9d9;
      background: #fff;
      font-size: 28rpx
    } */
    .detail {font-size: 28rpx;padding: 24rpx 30rpx;position: relative;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-box-align: center;-webkit-align-items: center;align-items: center;justify-content: space-between;background: #fff}
    .detail::before {content: " ";position: absolute;left: 0;top: 0;right: 0;height: 1px;border-bottom: 1px solid #ebebe7;color: #ebebe7;-webkit-transform-origin: 0 0;transform-origin: 0 0;-webkit-transform: scaleY(0.5);transform: scaleY(0.5);}
    .detail-left{
        color: #333;
    }
    .detail-left view{
        margin-top: 10rpx;
    }
    .detail-right{
        color: #505050
    }
	
	.p-left {
		width: 50%;
		height: 50rpx;
		text-align: center;
		line-height: 50rpx;
		font-size: 24rpx;
		
	}
	
	.highlight {
		color: #6A4A23;
	}
	
	.num-title {
		color: #fff;
		font-size: 24rpx;
		margin-left: 40rpx;
	}
	
	.pprice {
		color: #000000
	}
</style>