<template>
	<view class="p-person-marge g_w_all g_h_all g_bg_f_5 g_kuaishou">
		<view class="g_bg_f sticky" :style="{ boxShadow: '0px 4px 4px 0px rgba(218, 218, 218, 0.5)' }">
			<u-tabs bg-color="transparent" 
							:list="menuList" 
							:is-scroll="false" 
							:current="menuActive" 
							:active-color="globalData.themeColor" 
							bar-width="64" 
							bar-height="6" 
							@change="handleUpdateMenu" 
							font-size="32" 
							duration="0.05" 
							height="76"
			></u-tabs>
		</view>
		
		<!-- 收到的 -->
		<div class="m-recives-obj">
			
		</div>
		<!-- 申请/发起 -->
		<view class="m-applys-obj">
			<view class="m-aform g_flex_row_start g_h_60"
					  @click="openApply"
			>
				<view class="g_flex_none g_flex_c label">
					<i class="iconfont icon-jia1 icon"></i>
				</view>
				<view class="g_flex_1 g_flex_column_center value">申请合并</view>
			</view>
			<div class="m-alist"></div>
		</view>
		
		
		<u-popup v-model="modalApplyData.isShow" mode="bottom" border-radius="14" width="80%" :closeable='true'>
			<view style="max-height: calc(100vh - 200px);overflow-y: auto;">
				<view class="g_flex_c g_h_40 g_fs_16">申请合并</view>
				<view>
					<view>
						<view class="g_pb_8 g_pl_20 g_c_6">手机号</view>
						<view class="g_flex_row_start">
							<view class="g_flex_1 g_flex_column_center">
								<u-input v-model="modalApplyData.tel"
											   placeholder="请输入"
												 type="number"
												 maxlength="11"
												 style="width: calc(100% - 64px); z-index: 0;background-color: #ededed;border-radius: 6px;margin: 0 auto;padding: 0 16px;"
								></u-input>
							</view>
							<view class="g_flex_none g_flex_column_center g_mr_16">
								<g-button type='primary' size='mini' btnText='查询' @clickBtn='handleSearch'></g-button>
							</view>
						</view>
					</view>
					<view>
						<view class="g_pt_12 g_pb_8 g_pl_20 g_c_6">备注</view>
						<textarea class="weui-input g_flex_1 g_fs_16"
											placeholder="请输入备注" 
											v-model="modalApplyData.desp" 
											placeholder-style="color:#999" 
											auto-height 
											style="min-height: 137px; width: calc(100% - 64px); z-index: 0;background-color: #ededed;border-radius: 6px;padding: 16px;margin: 0 auto;"
						></textarea>
					</view>
					<view class="g_flex_row_center g_p_16">
						<view class="g_flex_row_center" style="width: 50%;">
							<g-button type='default' class="g_w_all" size='small' btnText='取消' @clickBtn='modalApplyData.isShow = false'></g-button>
						</view>
						<view class="g_flex_row_center" style="width: 50%;">
							<g-button type='primary' size='small' btnText='提交'></g-button>
						</view>
					</view>
					<view class="g_h_20"></view>
				</view>
			</view>
		</u-popup>
		
	</view>
</template>

<script>
export default {
	onReady() {
		this.G.setNavStyle();
	},
	onShareAppMessage() {
		return this.G.shareFun();
	},
	data() {
		return {
			globalData: getApp().globalData,
			cdnBaseImg: this.G.store().cdnBaseImg,
			localBaseImg: this.G.store().localBaseImg,
			svgBaseImg: this.G.store().svgBaseImg,
			menuList: [
				{
					name: "我收到的",
					tip: "0",
				},
				{
					name: "我发起的",
					tip: "1",
				},
			],
			menuActive: 0,
			
			modalApplyData:{
				isShow:false,
				tel:'',
				desp:'',
				result:[]
			}
		};
	},
	onShow() {
		let that = this;
		that.getList();
	},
	methods: {
		getList(){
			let that = this,
					params = {
						
					}
			that.G.Get(that.api.person_getMargeRecord,params,(res)=>{
				console.log('合并记录：',res);
			})
		},
		handleUpdateMenu(e){
			console.log(e)
			let that = this;
			that.menuActive = e;
		},
		openApply(){
			let that = this;
			that.modalApplyData = {
				isShow:true,
				tel:'',
				desp:'',
				result:[],
			}
		},
		handleSearch(){
			let that = this;
			if(!that.modalApplyData.tel){
				uni.showToast({
					icon:'none',
					title:'请输入手机号'
				})
				return false;
			}
			that.G.Get(that.api.person_getGroup,{
				tel:that.modalApplyData.tel
			},(res)=>{
				console.log('团队res',res)
			})
		}
	},
};
</script>

<style lang="less">
	.p-person-marge{
		.m-applys-obj{
			.m-aform{
				width: calc(100% - 52px);
				margin: 10px auto;
				background-color: #fff;
				padding: 0 16px;
				border-radius: 8px;
				.label{
					.icon{
						font-size: 20px;
					}
				}
				.value{
					margin-left: 10px;
					font-size: 16px;
				}
			}
		}
	}
</style>
