<template>
	<view>
		<!-- <view class="search">
			<view class="iconfont icon-sousuo1"></view>
			<input class="input" type="text" v-model="keyWords" placeholder="输入关键词" placeholder-style="fontsize:26rpx">
		</view> -->
		
		<scroll-view scroll-y="true" class="scroll">
			<view class="content">
				<view class="item" v-for="item in memberList" :key="item.id">
					<user :memberInfo="item" :isShowSelect="true" @select="select"></user>
				</view>
			</view>
		</scroll-view>
		
		<view @click="handleRecommendClick">
			<view v-if="options.is_recommend == 1" class="footer-btn">确认推荐</view>
			<view v-else class="footer-btn" style="background: #333;">确认取消</view>
		</view>
	</view>
</template>

<script>
	import App from '@/common/js/app.js';
	import user from '@/components/template/user.vue'
	import Loadlogo from '@/components/template/loadlogo.vue';
	export default {
		data() {
			return {
				loadlogo: false,
				lng: '',
				lat: '',
				options: {},
				keyWords: '',
				currentPage: 1,
				memberList: [],  //会员列表
				selectIds: [],
			}
		},
		components: {
			user,
			Loadlogo
		},
		onLoad(e) {
			let _this = this
			_this.options = e
			_this.lng = e.lng
			_this.lat = e.lat
			_this.getMemberList()
		},
		methods: {
			// 获取会员列表
			getMemberList() {
				let _this = this,
					apiUrl = `&p=dating&do=homeList&lng=${_this.lng}&lat=${_this.lat}`
				App._post_form(
					apiUrl,
					{
						page: _this.currentPage,
						..._this.options
					},
					res => {
						_this.memberList = res.data || []
					},
					false,
					() => {
					}
				);
			},
			
			// 选择
			select(type,id) {
				if(type) {
					this.selectIds.push(id)
				}else {
					let index = this.selectIds.indexOf(id)
					this.selectIds.splice(index,1)
				}
			},
			
			// 点击推荐按钮
			handleRecommendClick() {
				let _this = this
				_this.selectIds = JSON.stringify(_this.selectIds)
				App._post_form(
					`&p=dating&do=userInfoExchange`,
					{
						member_id: _this.options.member_id,
						ids: _this.selectIds,
						type: _this.options.is_recommend
					},
					res => {
						if(res.errno == 0) {
							uni.showToast({
								title: res.message,
								icon: 'none'
							})
							setTimeout(() => {
								uni.navigateBack()
							},1000)
						}
					},
					false,
					() => {
					}
				);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.search {
		width: 660rpx;
		height: 40rpx;
		border-radius: 40rpx;
		padding: 20rpx 0 20rpx 30rpx;
		background-color: #F8F8F8;
		display: flex;
		align-items: center;
		color: #333;
		font-size: 28rpx;
		position: fixed;
		left: 30rpx;
		top: 30rpx;
		.iconfont {
			margin-right: 20rpx;
			line-height: 40rpx;
		}
		.input {
			width: 580rpx;
		}
	}

	.scroll {
		height: 100vh;
		// height: calc(100vh - 130rpx);
		// margin-top: 130rpx;
	}
	
	.content {
		width: 690rpx;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 150rpx;
		.item {
			&:nth-child(2n+1) {
				margin-right: 20rpx;
			}
		}
	}

	.footer-btn {
		width: 690rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		color: #fff;
		font-size: 32rpx;
		border-radius: 20rpx;
		background: linear-gradient(270deg, #FF8E88 0%, #FDAD28 100%);
		position: fixed;
		left: 30rpx;
		bottom: 30rpx;
		z-index: 10;
	}
</style>
