<template>
	<view class="page">
		<!-- <dpupop :show="showLsPop" dtitle="LS会员标签" /> -->

		<view class="top">
			<navBar title="" :back="true" color="white" background="rgba(0,0,0,0)" />

			<view class="title">
				{{type=='vip'?'邀约用户成为VIP':type=='ls'?'邀约用户成为L会员':type=='dg'?'邀约用户成为产业电工':type=='hy'?'邀约用户成为会员':'邀约活动用户'}}
			</view>
			<view class="vipBox">
				<view class="top">
					<view class="txt">
						{{type=='vip'?'CUSTOMIZED LIGHTING':type=='ls'?'CUSTOMIZED LIGHTING':type=='dg'?'CUSTOMIZED LIGHTING':'CUSTOMIZED LIGHTING'}}
					</view>
					<view class="con">
						{{type=='vip'?'邀约VIP':type=='ls'?'邀约L会员':type=='dg'?'邀约电工':type=='hy'?'邀约会员':'活动商品'}}
					</view>
				</view>
				<view class="bot">
					<view class="price">
						{{type=='vip'?'邀约用户查看VIP价':type=='ls'?'邀约用户临时查看会员价格':type=='dg'?'邀约用户成为产业电工':type=='hy'?'邀约用户查看会员价格':'邀约用户查看团购活动商品'}}
					</view>
					<view class="btnG" v-if="type=='vip'">
						<view class="main">
							<view class="btn" @click="showVipPop=true">
								邀约S-VIP
							</view>
							<view class="btn" @click="showVipPop=true">
								邀约G-VIP
							</view>
						</view>
						<!-- <image src="/static/index/img1.png" mode="" class="water" style="width: 288rpx;
height: 140rpx;"></image> -->

					</view>
					<view class="btnG" v-else-if="type=='ls'">
						<view class="main">
							<view class="btn1" @click="showLsPop=true">
								邀约L会员
							</view>
						</view>
						<!-- <image src="/static/index/img1.png" mode="" class="water" style="width: 288rpx;
					height: 140rpx;"></image> -->

					</view>

					<view class="btnG" v-else-if="type=='dg'">
						<view class="main">
							<view class="btn1" @click="showDgPop=true">
								邀约电工
							</view>
						</view>
						<!-- <image src="/static/index/img1.png" mode="" class="water" style="width: 288rpx;
					height: 140rpx;"></image> -->

					</view>

					<view class="btnG" v-if="type=='yh'">
						<view class="main">
							<view class="btn1">
								邀约活动用户
							</view>
						</view>
						<!-- <image src="/static/index/img1.png" mode="" class="water" style="width: 288rpx;
					height: 140rpx;"></image> -->

					</view>

					<view class="btnG" v-if="type=='hy'">
						<view class="main">
							<view class="btn1" @click="showHyPop=true">
								邀约会员
							</view>
						</view>
						<!-- <image src="/static/index/img1.png" mode="" class="water" style="width: 288rpx;
					height: 140rpx;"></image> -->

					</view>
				</view>
			</view>
		</view>

		<view class="botDes">
			<view class="tab">
				<view class="item " :class="[currTabIndex==0?'act':'']" @click="currTabIndex=0">
					邀约成功(23)
				</view>
				<view class="line">

				</view>
				<view class="item" :class="[currTabIndex==1?'act':'']" @click="currTabIndex=1">
					邀约未成功(23)
				</view>
			</view>

			<!-- 邀约成功 -->
			<view class="scroll" style="overflow-y: scroll;height: calc(100% - 104rpx);" v-if="currTabIndex==0">
				<view class="top1">
					<view class="titleL">
						<view class="item1">
							邀约时间
						</view>
						<view class="item1">
							姓名
						</view>
						<view class="item1">
							电话
						</view>
					</view>
				</view>

				<uni-collapse style="" v-if="type=='vip'||type=='ls'||type=='hy'">
					<uni-collapse-item titleBorder="none" v-for="i in 10">
						<template v-slot:title>
							<view class="list2" :style="{'margin-bottom':i==-1?'208rpx':''}">
								<view class="item1">
									2023-08-23
								</view>
								<view class="item1">
									刘佳佳
								</view>
								<view class="item1">
									<text>18209380928</text>
								</view>
							</view>
						</template>
						<view class="card">
							<view class="con" v-if="type=='vip'">
								<view class="item">
									<view class="label">
										任职公司
									</view>
									<view class="des">
										家居公司
									</view>
								</view>
								<view class="item">
									<view class="label">
										VIP
									</view>
									<view class="des">
										S-VIP
									</view>
								</view>
								<view class="item">
									<view class="label">
										备注
									</view>
									<view class="des">
										你好，现邀请你成为S-VIP，查看专属价格！
									</view>
								</view>
							</view>

							<view class="con" v-if="type=='ls'||type=='hy'" style="height: 84rpx;">
								<view class="item">
									<view class="label">
										项目名称
									</view>
									<view class="des" style="color: #333;font-weight: bold;">
										家装灯具选择
									</view>
								</view>
							</view>
						</view>
					</uni-collapse-item>
				</uni-collapse>

				<view class="list2" :style="{'margin-bottom':i==-1?'208rpx':''}" v-else>
					<view class="item1">
						2023-08-23
					</view>
					<view class="item1">
						刘佳佳
					</view>
					<view class="item1">
						<text>18209380928</text>
					</view>
				</view>
				<view class="pos" style="height:208rpx;">
				</view>

			</view>


			<!--  邀约失败 -->
			<view class="scroll" style="overflow-y: scroll;height: calc(100% - 104rpx);" v-if="currTabIndex==1">
				<view class="top1">
					<view class="titleL">
						<view class="item1" style="width: 192rpx;font-size: 28rpx;font-weight: bold;color: #333333;">
							邀约时间
						</view>
						<view class="item1" style="width: 90rpx;font-size: 28rpx;font-weight: bold;color: #333333;">
							姓名
						</view>
						<view class="item1"
							style="width: 120rpx;font-size: 28rpx;margin-left: 60rpx;font-weight: bold;color: #333333;">
							VIP类别
						</view>
					</view>
				</view>


				<view class="list2" :style="{'margin-bottom':i==-1?'208rpx':''}">
					<view class="item1" style="width: 192rpx;font-size: 28rpx;">
						2023-08-23
					</view>
					<view class="item1" style="width: 90rpx;font-size: 28rpx;">
						刘佳佳
					</view>
					<view class="item1" style="width: 120rpx;font-size: 28rpx;margin-left:60rpx;">
						<text>S-VIP</text>
					</view>

					<view class="item1 aginInvite" style="width: 120rpx;font-size: 28rpx;margin-left: 50rpx;">
						再次邀约
					</view>
				</view>

				<view class="pos" style="height:208rpx;">
				</view>

			</view>
		</view>

		<u-popup :show="showLsPop" @close="close" @open="open" round='10'>
			<view class="topBar" style="">
				<view class="left">

				</view>
				<view class="cen">
					L会员标签
				</view>
				<view class="close" @click="showLsPop=false">
					<u-icon name="close"></u-icon>
				</view>
			</view>
			<view class="pupopCon">
				<view class="item">
					<view class="label">
						*姓名
					</view>
					<u--input clearable placeholder="请输入姓名" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item">
					<view class="label">
						*电话
					</view>
					<u--input clearable placeholder="请输入电话" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item" style="margin-bottom: 24rpx;">
					<view class="label">
						项目名称
					</view>
					<u--input clearable placeholder="请输入项目名称" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<u-button text="确定" color="#333" @click="showLsPop=false"></u-button>
			</view>
		</u-popup>

		<u-popup :show="showHyPop" @close="close" @open="open" round='10'>
			<view class="topBar" style="">
				<view class="left">

				</view>
				<view class="cen">
					会员标签
				</view>
				<view class="close" @click="showHyPop=false">
					<u-icon name="close"></u-icon>
				</view>
			</view>
			<view class="pupopCon">
				<view class="item">
					<view class="label">
						*姓名
					</view>
					<u--input clearable placeholder="请输入姓名" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item">
					<view class="label">
						*电话
					</view>
					<u--input clearable placeholder="请输入电话" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item" style="margin-bottom: 24rpx;">
					<view class="label">
						项目名称
					</view>
					<u--input clearable placeholder="请输入项目名称" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<u-button text="确定" color="#333" @click="showHyPop=false"></u-button>
			</view>
		</u-popup>

		<u-popup :show="showDgPop" @close="close" @open="open" round='10'>
			<view class="topBar" style="">
				<view class="left">

				</view>
				<view class="cen">
					产业电工
				</view>
				<view class="close" @click="showDgPop=false">
					<u-icon name="close"></u-icon>
				</view>
			</view>
			<view class="pupopCon">
				<view class="item">
					<view class="label">
						*姓名
					</view>
					<u--input clearable placeholder="请输入姓名" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item">
					<view class="label">
						*电话
					</view>
					<u--input clearable placeholder="请输入电话" border="surround" v-model="value"
						@change="change"></u--input>
				</view>

				<view class="item">
					<view class="label">
						*来源
					</view>
					<uni-data-select placeholder="请选择来源" v-model="value" :localdata="range"
						@change="change"></uni-data-select>
				</view>

				<view class="item" style="margin-bottom: 24rpx;height: auto;">
					<view class="label">
						*兑奖信息
					</view>
					<u--textarea v-model="value1" placeholder="请输入兑奖信息"></u--textarea>
				</view>

				<u-button text="确定" color="#333" @click="showDgPop=false"></u-button>
			</view>
		</u-popup>

		<u-popup :show="showVipPop" @close="close" @open="open" round='10'>
			<view class="topBar" style="">
				<view class="left">

				</view>
				<view class="cen">
					VIP标签
				</view>
				<view class="close" @click="showVipPop=false">
					<u-icon name="close"></u-icon>
				</view>
			</view>
			<view class="pupopCon">
				<view class="item">
					<view class="label">
						*姓名
					</view>
					<u--input clearable placeholder="请输入姓名" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item">
					<view class="label">
						*电话
					</view>
					<u--input clearable placeholder="请输入电话" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item">
					<view class="label">
						*身份
					</view>
					<view class="sel">
						<u--input placeholder="请选择身份" border="surround" v-model="value" @change="change">
						</u--input>
						<image src="/static/index/arrDown.png" mode="" style="width: 16rpx;height: 12rpx;">
						</image>
					</view>

				</view>
				<view class="item" style="margin-bottom: 24rpx;">
					<view class="label">
						任职公司
					</view>
					<u--input clearable placeholder="请输入任职公司" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<view class="item" style="margin-bottom: 24rpx;">
					<view class="label">
						备注
					</view>
					<u--input clearable placeholder="请输入备注" border="surround" v-model="value"
						@change="change"></u--input>
				</view>
				<u-button text="确定" color="#333" @click="showVipPop=false"></u-button>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import dpupop from '@/components/popup/index.vue'
	export default {
		components: {
			dpupop
		},
		data() {
			return {
				currTabIndex: 0,
				type: '',

				showLsPop: false,
				showDgPop: false,
				showVipPop: false,
				showHyPop: false,


				// inviteSuc: true

				srcValue: 0,
				range: [{
						value: 0,
						text: "来源1"
					},
					{
						value: 1,
						text: "来源2"
					},
					{
						value: 2,
						text: "来源3"
					},
				],
			}
		},
		onLoad(o) {
			this.type = o.type
			// this.type = 'vip'
		},
		methods: {
			change(e) {
				console.log("e:", e);
			},
		}
	}
</script>

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