renshou/pages/matchList/index.vue

<template>
	<view v-if="isShow">
		<view class="act-list" v-if="pageList && pageList.length > 0">
			<view class="li" v-for="(item, index) in pageList" :key="index" @click="toActivity(item)">
				<view class="imgbox"><image :src="item.pic" mode="aspectFill"></image></view>
				<view class="infos fflex">
					<view class="act-tit tovers">{{ item.title }}</view>
					<view class="stas ddflex">
						<view class="fflex">
							<view class="tag-box tovers">{{ item.brief }}</view>
							<view class="area">
								<block v-if="item.state < 4">报名截止时间：{{ item.enlistEndTime }}</block>
								<block v-else>活动结束时间：{{ item.endTime }}</block>
							</view>
							<!-- <view class="money" v-if="userinfovip.levelGrade>0&& !userinfovip.end"><text>￥</text>{{item.vipMoney}}</view>
							<view class="money" v-else><text>￥</text>{{item.money}}</view> -->
						</view>
						<view class="act-btn" @click.stop="jumpUrl('/match/activity/activity')" v-if="item.isEnlist">我已报名</view>
						<block v-else>
							<view class="act-btn" @click.stop="toActivity(item)" v-if="item.state == 2">立即报名</view>
							<view class="act-btn" @click.stop="toActivity(item)" v-if="item.state == 3">报名结束</view>
							<view class="act-btn" @click.stop="toActivity(item)" v-if="item.state == 4">活动中</view>
							<view class="act-btn end" @click.stop="toActivity(item)" v-if="item.state == 5">活动结束</view>
						</block>
					</view>
				</view>
			</view>
		</view>
		<view class="nodata" v-else>
			<image :src="picUrlss + 'empty_dd.png'"></image>
			<text>暂无记录~</text>
		</view>
		
		<foot channel="match" :isUpdate="isUpdate"></foot>
	</view>
</template>

<script>
const req = require('../../utils/request.js');
const api = require('../../utils/api.js');
const util = require('../../utils/util.js');
const app = getApp();
import foot from '../../components/nav-bar/index';
export default {
	components: { foot },
	data() {
		return {
			picUrlss: req.public.picUrls,
			isShow: false,
			pageList: [],
			isLoad: true,
			form: {
				page: 1,
				limit: 10
			},
			isLogin: false,
			userinfovip: {}
		};
	},
	onLoad() {},
	onShow() {
		this.isLogin = req.isAuth();
		this.getPageList(true);
		if (this.isLogin) {
			this.getuserVip();
		}
	},
	onReachBottom: function() {
		this.form.page++;
		this.getPageList(false);
	},
	onShareAppMessage() {
		
	},
	onShareTimeline() {
		
	},

	methods: {
		jumpUrl(url) {
			if (!req.isLogins(true)) {
				return;
			}
			uni.navigateTo({
				url: url
			});
		},

		getPageList(isShow) {
			if (!this.isLoad) return false;
			this.isLoad = false;
			let form = this.form;
			uni.showLoading();
			req.getRequest(
				'/api/match/list',
				form,
				res => {
					this.isShow = true;
					if (res && res.length == 10) {
						this.isLoad = true;
					}
					if (this.form.page > 1) {
						res = this.pageList.concat(res);
					}
					this.pageList = res;
					uni.hideLoading();
				},
				isShow
			);
		},
		getuserVip() {
			req.getRequest('/api/user/levelDetails', {}, data => {
				let expireTime = Array;
				if (data.expireTime) {
					expireTime = data.expireTime.split(' ');
					data.expireTime = data.expireTime.replace(/-/g, '/');
				} // 解决苹果不兼容---日期
				let nowTime = new Date().getTime();
				let endTime = new Date(data.expireTime).getTime();
				let times = parseInt((endTime - nowTime) / 1000); // var expireTime= new Date(data.expireTime)
				// console.log(times, nowTime, endTime, data.expireTime);
				this.userinfovip = data;
				if (times <= 0) {
					this.userinfovip.end = true;
				} else {
					this.userinfovip.end = false;
				}
			});
		},
		toActivity(item) {
			uni.navigateTo({
				url: '/match/activityDetail/activityDetail?id=' + item.id
			});
		}
	}
};
</script>

<style>
@import './index.css';
</style>