H5_module/match/activity/activity.vue

<template>
	<view :style="[mainStyle]" 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>报名截止时间：{{ item.enlistEndTime.replace(/\-/g, ".") }}</block> -->
								活动结束时间：{{ getTimeText(item.endTime,'',true) }}
							</view>
							<view class="money" v-if="userinfovip.levelGrade>0&& !userinfovip.end"><text v-if="item.vipMoney > 0">￥</text>{{item.vipMoney > 0 ? item.vipMoney : '免费'}}</view>
							<view class="money" v-else><text v-if="item.money > 0">￥</text>{{item.money > 0 ? item.money : '免费'}}</view>
						</view>
						<view class="act-btn end" @click.stop="jumpUrl('/match/activitys/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>
	</view>
</template>

<script>
const req = require('../../utils/request.js');
const api = require('../../utils/api.js');
const util = require('../../utils/util.js');
const app = getApp();
export default {
	components: {},
	data() {
		return {
			mainStyle: app.globalData.mainStyle,
			picUrlss: req.public.picUrls,
			isShow: false,
			pageList: [],
			isLoad: true,
			form: {
				page: 1,
				limit: 10
			},
			isLogin: false,
			userinfovip: {}
		};
	},
	onLoad(opt) {
		if(opt.appId) req.setStorage('appId',opt.appId);
		if(opt.title){
			uni.setNavigationBarTitle({
				title: opt.title
			})
		}
	},
	onShow() {
		this.isLogin = req.isAuth();
		this.getPageList(true);
		if (this.isLogin) {
			this.getuserVip();
		}
	},
	onReachBottom: function() {
		this.form.page++;
		this.getPageList(false);
	},
	onShareAppMessage: function() {
		let path = '';
		let isSolution = req.env[req.env.NODE_ENV].isSolution;
		let userInfo = req.getStorage('userInfo');
		if(isSolution){
			path = '/share/home/index?appId='+req.getStorage('appId')+'&userId='+userInfo.id;
		}else{
			path = '/match/activity/activity'
		}
		return {
			path: path
		};
	},
	onShareTimeline() {
	},

	methods: {
		getTimeText(startTime,endTime,isText){
			return util.getTimeText(startTime,endTime,isText);
		},
		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 './activity.css';
</style>