webapp / GreenwayWeb

<template>
	<view class="page">
		<view class="tabs-box">
			<u-tabs-swiper ref="tabs" :current="current" :list="tabList" @change="tabsChange" :is-scroll="false" :font-size="24" active-color="#0FBB59" :height="70">
			</u-tabs-swiper>
		</view>
		<!-- 搜索 -->
	<!-- 	<view class="head-search">
			<u-search bg-color="#fff" placeholder="请输入关键词" v-model="pageIndex.activityName" :show-action="false" @search="search"></u-search>
			<u-button type="success" @click="search">搜索</u-button>
		</view> -->
		<view style="margin: 20rpx 0;background-color: #FFFFFF;border-radius: 18rpx;border: 2rpx solid #E8E8E8;	margin: 22rpx 24rpx;overflow: hidden;" >
			<u-search :action-style="{'background':'#19be6b','color':'#fff','height':'32px','line-height':'32px','border-radius':'18rpx'}" 
			 bg-color="#fff" placeholder="请输入关键词" v-model="pageIndex.activityName" action-text="搜索" @clear="search" @search="search" @custom="search"></u-search>
		</view>
		<view class="goods-data">
			<view class="goods-list">
				<view class="good-item" v-for="(v, i) in datalist" :key="i">
					<view class="body">
			
							  <u-image  width="260rpx" height="180rpx" :src="imgurl+v.coverImage" borderRadius="10" mode="heightFix" style="margin-top:3px;margin-right:8px;" ></u-image>
				
						<!-- <image :src="$img+v.coverImage"  style="border-raidus"></image> -->
						<view class="info">
							<view class="title">{{v.activityName}}</view>
							<view class="info-items">
								<view class="info-item">
									<view class="label">活动时间：</view>
									<text>{{v.startTime}}</text>
								</view>
								<view class="info-item">
									<view class="label">可参与人数：</view>
									<text>{{v.maxParticipants}}人</text>
								</view>
								<view class="info-item">
									<view class="label">活动状态：</view>
									<text>{{v.auditStatus =='1'?'待提交':v.auditStatus =='2'?'待审核':v.auditStatus =='3'&&v.activeState==null?'审核通过':v.auditStatus =='3'&&v.activeState==0?'未开始':v.auditStatus =='3'&&v.activeState==1?'进行中':v.auditStatus =='3'&&v.activeState==2?'已结束':v.auditStatus =='4'?'审核驳回':''}}</text>
								</view>
							</view>
						</view>
					</view>
					<!-- 海报遮罩层 -->
					<view v-if="showPosterMask" class="poster-mask" @click="closePosterMask">
					  <view class="poster-container">
					    <image v-if="posterUrl" :src="posterUrl" mode="aspectFit"></image>
					    <view class="close-btn" @click="closePosterMask">×</view>
					  </view>
					</view>

					
					<view class="footer">
						<!-- <u-button type="primary" size="mini"  v-if="v.auditStatus == '1'">编辑</u-button> -->
						<u-button type="success" size="mini" @click="tijiao('2',v.id)"  v-if="v.auditStatus == '1'"  style="margin-right: 22rpx;">提交审核</u-button>
						<u-button type="success" size="mini" @click="toDetail(v.id, '/pages/activityDetail/activityDetail')" style="margin-right: 22rpx;">查看详情</u-button>
						<u-button type="info" size="mini" @click="tijiao('1',v.id)" v-if="v.auditStatus == '2'" style="margin-right: 22rpx;">撤回</u-button>
						<u-button type="info" size="mini" @click="bianji(v.id)" v-if="v.auditStatus == '1'" style="margin-right: 22rpx;">编辑</u-button>
						<u-button type="info" size="mini" @click="generatePoster(v.id)" v-if="v.auditStatus == '3'" style="margin-right: 22rpx;">显示二维码</u-button>
						<u-button type="info" size="mini" @click="getList(v.id)" v-if="v.auditStatus == '3'" style="margin-right: 22rpx;">报名名单</u-button>
						<u-button type="info" size="mini" @click="delact(v.id)" v-if="v.auditStatus == '1'" style="margin-right: 22rpx;">删除</u-button>
					</view>
				</view>
				<!-- <u-loadmore :status="statuslist" @loadmore='loading' style="width: 100%; text-align: center;"/> -->
			</view>
		</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 {
				tabList:[
					{ name: '全部' },
					{ name: '待提交' },
					{ name: '待审核' },
					{ name: '通过' },
					{ name: '驳回' },
					{ name: '进行中' },
					{ name: '已结束' },
				],
				current: 0,
				datalist: [],
				total: 2,
				statuslist: 'loadmore',
				listIn:0,
				num:0,
				pageIndex :{
					activityName: '',
					pageNumber: 0,
					pageSize: 10,
					createUser:uni.getStorageSync('user').phone
				},
				imgurl:'',
				showPosterMask: false, // 海报遮罩层是否显示
				posterUrl: '' // 海报图片地址
			};
		},
		onLoad(option) {
			this.num = option.id;
			this.statuslist = 'nomore';
			this.imgurl = this.$img
		},
	
		// onPullDownRefresh(e) {
		// 	let that = this
		// 	that.statuslist = 'loading';
		// 	this.page = 0;
		// 	setTimeout(() => {
		// 		that.datalist = [{}];
		// 		that.statuslist = that.datalist.length >= that.total ? 'nomore' : 'loadmore';
		// 		uni.stopPullDownRefresh();
		// 	}, 1000);
		// },
		onReachBottom(e) {
			// this.loading();
		},
		mounted() {
			if(!uni.getStorageSync('user').phone){
				uni.navigateTo({
					url: '/pages/login/login'
				})
			}
			this.getAll()
		},
		methods: {
			generatePoster(id) {
				
				let obj ={
					page:"pages/activityDetail/activityDetail",
					scene:`item=${id}`
				}
			  this.$http.sendRequest(`/weixinQRcodeCreation/getUnlimited`,'POST',obj, 1).then(res => {
				 this.posterUrl =  this.$img + res.data.data
				 
				 this.showPosterMask = true;
				 
				 
			  })
			  },
			  // 关闭海报遮罩层
			  closePosterMask() {
			    this.showPosterMask = false;
			    this.posterUrl = '';
			  },
			toDetail(item, path) {
				uni.navigateTo({
					url: `${path}?flow=true&item=${item}`
				})
				
			},
			tabsChange(val) {
				this.pageIndex={
					activityName: '',
					pageNumber: 0,
					pageSize: 10,
					createUser:uni.getStorageSync('user').phone
				}
				this.current = val
				
				if(val == 0){
					this.getAll()
				}else if(val == 5){
					this.pageIndex.activeState = 1
					this.getAll()
				}else if(val==6){
					this.pageIndex.activeState = 2
					this.getAll()
				}else{
					this.getAll(val)
				}
			},
			getAll(val){
				if(val !=0){
					this.pageIndex.auditStatus = val
				}
				this.$http.sendRequest('/cereActivityApplication/queryByPage', 'POST',this.pageIndex,1).then(res => {
				   this.datalist = res.data.data.content
				})
			},
			search() {
				this.getAll(this.current)
			},
			sel(val){
				this.listIn = val
			},
			reconciliationdetail() {
	
			},
			toAdd() {
				uni.navigateTo({
					url: '/pages/activityAdd/activityAdd'
				})
			},
			bianji(ids){
				uni.navigateTo({
					url: `/pages/activityAdd/activityAdd?ids=${ids}`
				})
			},
			tijiao(val,ids){
			let pageIndex = {
				id:ids,
				auditStatus:val
			}
				this.$http.sendRequest('/cereActivityApplication/edit', 'POST',pageIndex,1).then(res => {
					this.current = 0
				    this.getAll()
				}).catch(err => {
					console.log(err)
					//请求失败
				})
			},
			delact(ids){
			 let padge = {
					id:ids	
				}
				this.$http.sendRequest('/cereActivityApplication/deleteById', 'POST',padge,1).then(res => {
					this.current = 0
				    this.getAll()
				}).catch(err => {
					console.log(err)
					//请求失败
				})
			},
			getList(ids){
				uni.navigateTo({
					url: `/pages/mycreated/actList?ids=${ids}`
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	@import 'mycreated.scss';
	
.poster-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 101;
}
.share-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 999;
}
.poster-container {
  position: relative;
  background-color: #fff;
  padding: 10px;
  border-radius: 10px;
}
.close-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 20px;
  cursor: pointer;
}
</style>