paopaoShop/pages/user/jiedian.vue

<template>
	<view class="contant">
		<view class="jiedian-box" v-for="(item,index) in jieList">
			<view class="box-top">
				<view class="title-top">
					<view class="img">
						<image src="../../static/img/jiedian01.png" mode=""></image>
					</view>
					<view class="title">
						响亮节点
					</view>
				</view>
				<!-- <view class="xiangqing" @click="navTo(item.id)">
					详情>
				</view> -->
				<text class="xiangqing" @click="navTo(item.id)">
						详情>
					</text>
			</view>
			<view class="box-bottom">
				<view class="shouyi">
					<view class="jiedian">
						节点收益
					</view>
					<view class="number">
						{{item.get}}
					</view>
				</view>
				<view class="shouyi">
					<view class="jiedian">
						团队人数
					</view>
					<view class="number">
						{{item.children_num}}
					</view>
				</view>
				<view class="shouyi">
					<view class="jiedian">
						参加时间
					</view>
					<view class="number">
						{{item.add_time | getTime}}
					</view>
				</view>
			</view>

		</view>
		<uni-load-more  :status="loadingType"></uni-load-more>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	// import getTime from '../../utils/rocessor.js'
	import {
		lookSubpoints,
		lookOneself
	} from '../../api/user.js'
	export default {
		data() {
			return {
				jieList: [],
				page: 1, //当前页数
				limit: 10, //每次信息条数
				loadingType: 'more',
			};
		},
		filters: {
			getTime(val) {
				let str = ''
				if(val) {
					const date = new Date(val*1000);
					const year = date.getFullYear();
					const mon = date.getMonth() + 1;
					const day = date.getDate();
					const hours = date.getHours();
					const minu = date.getMinutes();
					const sec = date.getSeconds();
					str =  year + '-' + mon + '-' + day + ' ' + hours + ':' + minu + ':' + sec;
				}
				return str
			}
		},
		// onLoad() {
		// 	this.lookMyjiedian()
		// },
		onShow() {
			this.lookMyjiedian()
		},
		onReachBottom(){
			this.lookMyjiedian()
		},
		methods: {
			lookMyjiedian() {
				let obj = this
				if(obj.loadingType=="noMore" ||obj.loadingType=='loading'){
					return
					
				}
				obj.loadingType ='loading'
				lookOneself(
				{
					page: obj.page,
					limit: obj.limit
				}).then(res => {
					
					console.log(res);
					obj.jieList = obj.jieList.concat(res.data.points)
					if(res.data.points.length!=obj.limit){
						obj.loadingType='noMore'
						
					}else{
						obj.loadingType = 'more'
						obj.page++
					}
					console.log(obj.loadingType, '2222222');
				})
			},
			navTo(id) {
				uni.navigateTo({
					url: './jiedianDetails?id=' + id
				})
			}
		}
	}
</script>

<style lang="scss">
	page,.contant {
		// background: #F3F3F3;
		
		margin: 0;
		padding: 0;
		height: 100%;
		width: 100%;
	}

	.jiedian-box {

		background: #FFFFFF;
		display: flex;
		flex-direction: column;
		padding: 30rpx;
		justify-content: space-between;
		margin: 20rpx 30rpx;
		border-radius: 15rpx;
		box-shadow: 2px 2px 0px #EBEEF5;
	}

	.box-top {
		display: flex;
		justify-content: space-between;
		text-align: center;

		.title-top {
			display: flex;
			justify-content: center;
			text-align: center;

			.img {
				width: 40rpx;
				height: 40rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.title {
				margin-left: 5rpx;
				font-size: 32rpx;
				font-weight: bold;

			}
		}

		.xiangqing {
			color: red;
			font-size: 28rpx;
			line-height: 40rpx;
		}
	}

	.box-bottom {
		margin-top: 20rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		text-align: center;
	}

	.shouyi {
		margin: 6rpx 0;
		display: flex;
		justify-content: space-between;
	}

	.jiedian {
		font-size: 26rpx;
		color: #999999;
	}

	.number {}
</style>