qd_81fang/pages/activity/memberlist.vue

<template>
    <view class="content">
        <view class="box">
			
			<block v-for="(item, index) in list" :key="index">
				<view class="orderItem" >
					<image class="goodImg" :src="item.avatar||'http://cdn.shop.weivee.com/shop/20200408/6162b21922f336ae9b320bc06582ab7f.png'" ></image>
				    <view class="orderInfo">
				        <view class="info1">
				            <view>{{item.username}}</view>
				        </view>
				        <view class="info2">
				            <view>{{ parse.filterTime(item.createtime) }}</view>
				        </view>
						
						
				    </view>
				</view>
				
			</block>
     
			
			
			
			    <view v-if="!list.length" style='color:#999;text-align:center;margin:150rpx 0;font-size:30rpx'>暂无数据</view>

        </view>
    </view>
</template>
<script module="parse" lang="wxs">
module.exports = {
	filterTime: function(time) {

		console.log(time)

		var nowDate = getDate(time * 1000);
		var year = nowDate.getFullYear();
		var month = nowDate.getMonth() + 1;
		var date = nowDate.getDate();
		var hours = nowDate.getHours();
     var minutes = nowDate.getMinutes();
     var seconds = nowDate.getSeconds();

		month = month > 9 ? month : '0' + month;
		date = date > 9 ? date : '0' + date;
		hours = hours > 9 ? hours : '0' + hours;
     minutes = minutes > 9 ? minutes : '0' + minutes;
     seconds=seconds>9?seconds:'0'+seconds;

		return year + '-' + month + '-' + date + " " + hours + ":" + minutes+ ":" + seconds;

	}
}
</script>
<script>
// pages/backstage/index/index.js
var app = getApp();
// import { request } from '../../../utils/request.js';
export default {
    data() {
        return {
            page: 1,
            list: [				
			],
            loaded: false,
activity_id:""
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
		this.activity_id = options.activity_id||''
        this.getlist();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {
        this.init();
        this.getlist();
        uni.stopPullDownRefresh();
    },
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {
        this.loaded || this.getlist();
    },
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        async getlist() {
            var that = this;
			         let res = await this.$api.request('/Activity/user_list', 'GET', {
			         	page: this.page,
						activity_id:this.activity_id
			         });
					 
					 console.log(res)
			         if (res) {
			         	if (res.user_list.length > 0) {
			         
			         		this.list = this.list.concat(res.user_list);
			         
			         		this.page++; 
			         		
			         	} else {
			         		this.loaded = true 
			         		this.$api.msg('没有更多数据');
			         	}
			         }
        },

        init() {
           this.page = 1
           this.loaded = false
           this.list = []
        }
    }
};
</script>
<style>
	page {
	    background: #fff;
	}
	
	.content {
	    margin: 26rpx;
	    background: #fff;
	    border-radius: 20rpx;
	}
	
	.orderItem {
	    display: flex;
	    align-items: center;
	    padding: 24rpx  20rpx;
	    border-bottom: 1px solid #e4e5ee;
		box-sizing: border-box;
	}
	
	
	.orderItem > image {
	    width: 110rpx;
	    height: 110rpx;
	    border-radius: 12rpx;
	}
	
	.orderInfo {
	    display: flex;
	    flex-direction: column;
	    flex: 1;
	    justify-content: space-between;
	    margin-left:30rpx;
	}
	
	.info1 {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;

	}
	
	.info1 > view:nth-child(1) {
	    font-size: 34rpx;
	    width: 300rpx;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
		color: #010101;
	}
	
	.info1 > view:nth-child(2) {
	    font-size: 28rpx;
	}
	
	.info2 {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;

	    margin-top: 26rpx;
	}
	
	.info2 > view:nth-child(1) {
	    color: #8E8E8E;
		font-size: 26rpx;
	}
	

	
	.color1 {
	    color: #EC8E02 !important;
	}
	view{
		font-size: 24rpx;
	}
		
	.goodImg{
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%!important;
	}
</style>