<template>
	<!-- 活动参与 -->
	<view class="page">
		<view class="more page-box">
			<u-section :bold="false" title="我的活动申请" sub-title='' :show-line="false" color="#0FBB59" @click="toMyAdd">
				<view slot="right">
					<u-icon name="arrow-rightward" color="#0FBB59" size="28"></u-icon>
				</view>
			</u-section>
		</view>
		<!-- 搜索 -->
		<view class="head-search">
			<u-search bg-color="#fff" placeholder="请输入关键词" v-model="keyword" :show-action="false" @search="search"></u-search>
			<u-button type="success" @click="search">搜索</u-button>
		</view>
		<view class="screen-list">
			<view class="list">
				<text>默认排序</text>
				<image :src="$imgUrl('/down.png')"></image>
			</view>
			<view class="list">
				<text>进行中</text>
				<image :src="$imgUrl('/down.png')"></image>
			</view>
			<!-- <view class="list">
				<text>区域</text>
				<image :src="$imgUrl('/down.png')"></image>	
			</view>
			<view class="list">
				<text>租金</text>
				<image :src="$imgUrl('/down.png')" ></image>
			</view>
			<view class="list">
				<text>筛选</text>
				<image :src="$imgUrl('/down.png')" ></image>
			</view> -->
		</view>
		<!-- 订单列表 -->
		<view class="goods-data">
			<u-row gutter="16" class="goods-list">
				<u-col span="6" v-for="(item,index) in list" :key="index">
					<view class="demo-layout good-item">
						<image :src="$imgUrl('/img/2.jpg')" style="width: 315rpx; height: 315rpx; border-radius: 10rpx;"></image>
						<view class="info">
							<view class="title">绿道好物节</view>
							<view class="name">绿道好物节</view>
							<u-tag text="进行中" type="success" mode="dark" />
						</view>
					</view>
				</u-col>
				<u-loadmore :status="status" @loadmore='loading' style="width: 100%; text-align: center;"/>
			</u-row>
		</view>
		<view style="height: 120rpx;"></view>
		<view class="page-footer">
			<u-button type="success" @click="toAdd">活动申请</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				keyword: '', // 搜索项
				status: 'loadmore',
				list: 1,
				page: 0,
				total: 1,
			};
		},
		onLoad() {
			this.status = 'nomore';
		},
		onPullDownRefresh(e) {
			let that = this
			that.status = 'loading';
			this.page = 0;
			setTimeout(() => {
				that.list = 1;
				that.status = that.list >= that.total ? 'nomore' : 'loadmore';
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onReachBottom(e) {
			this.loading();
		},
		methods: {
			toMyAdd() {
				// 跳转我的活动申请
			},
			search() {
				// 搜索
			},
			loading() {
				let that = this
				if(that.status == 'nomore') return;
				that.status = 'loading';
				that.page = ++that.page;
				setTimeout(() => {
					that.list += 10;
					that.status = that.list >= that.total ? 'nomore' : 'loadmore';
				}, 300)
			},
			myativity() {
				uni.navigateTo({
					url: '/pages/mycreated/mycreated'
				})
			},
			join(){
				uni.navigateTo({
					url: '/pages/mycreated/mycreated?id=1'
				})
			},
			toAdd() {
				uni.navigateTo({
					url: '/pages/activityAdd/activityAdd'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	@import 'participation.scss';
</style>
