<template>
	<view class="page">
		<u-navbar title="合伙人管理" :border-bottom="false" :background="bgc" title-color='#000' back-icon-color="#000" title-size='36' height='50'></u-navbar>
        <view class="box">
			<view class="list" v-for="(item,index) in wateringList" :key="index" @click="btnxq(index)">
				<view class="top">
					<view class="lt" style="display: flex;align-items: center;">
					    <image style="margin-right: 10rpx;width: 32rpx;
						height: 32rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uSjKq6xJU3oPNzMRfaYp" mode=""></image> 
						<view style="font-weight: 500;font-size: 24rpx;color: #3D3D3D;">{{item.realName == null ? '--' : item.realName}}-合伙人</view>
					</view> 
					<view class="rt" >
						<text style="width: 9rpx;height: 9rpx;border-radius: 50%;margin-right: 5rpx;display: inline-block;background-color: #575B66;"></text>
						<text style="width: 9rpx;height: 9rpx;border-radius: 50%;margin-right: 5rpx;display: inline-block;background-color: #575B66;"></text>
						<text style="width: 9rpx;height: 9rpx;border-radius: 50%;margin-right: 5rpx;display: inline-block;background-color: #575B66;"></text>
					</view>
					<view class="bianji" style="display: none;" :id="tabindex == index ? 'active' : ''">
						<view class="" @click="btnedit(item)">编辑合伙人</view>
						<view class="" style="border: 0;color: #FF1C1C;" @click="btnshanchu(item.userId)">删除合伙人</view>
					</view>
				</view>
				<view class="" style="width: 680rpx;height: 1px;background: #F0F0F0;margin-left: -30rpx;margin-top: 14rpx;"></view>
				<view class="list_val">
					<view class="list_shop">
						<view class="" style="font-size: 24rpx;color: #808080;">绑定店铺</view>
						<view class="" style="font-weight: 600;font-size: 28rpx;color: #3D3D3D;margin-top:18rpx;">{{item.storeName == null ? '--' : item.storeName}}</view>
					</view>
					<view class="list_shebei">
						<view class="" style="font-size: 24rpx;color: #808080;">月收入</view>
						<view class="" style="font-weight: 600;font-size: 28rpx;color: #3D3D3D;margin-top:18rpx;">{{item.monthIncome == null ? '--'  : item.monthIncome}}</view>
					</view>
					<view class="list_shebei">
						<view class="" style="font-size: 24rpx;color: #808080;">分成比例</view>
						<view class="" style="font-weight: 600;font-size: 28rpx;color: #3D3D3D;margin-top:18rpx;">{{item.dividendProportion == null ? '--'  : item.dividendProportion * 100}}</view>
					</view>
				</view>
				<view class="">
					联系电话：{{item.phonenumber}}
				</view>
				<view class="" style="width: 680rpx;height: 1px;background: #F0F0F0;margin-left: -30rpx;margin-top: 14rpx;"></view>
				<view class="" style="font-size: 24rpx;color: #3D3D3D;margin-top: 10rpx;width: 100%;display: flex;justify-content: space-between;">
					<text>{{item.createTime == null ? '--' : item.createTime}}</text>  <text></text>
				</view>
			</view>
			<view class="" style="width: 448rpx;height: 448rpx;margin: auto;margin-top: 100rpx;text-align: center;">
				<view class="" style="font-size: 30rpx;color: #ccc;margin-top: 30rpx;">没有更多合伙人啦...</view>
			</view>
        </view>
		<view class="xinjian" @click="btnadd">
			新建合伙人
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                bgc: {
                	backgroundColor: "#fff"
                }, 
				wateringList: [],
				keyword:'',
				tabindex:-1,
			}
		},
		onLoad() {
			
		},
		onShow() {
			this.tabindex = -1
			this.getlist()
		},
		methods: {
			// 点击删除合伙人
			btnshanchu(userId){
				let employids = userId
				let that = this
				uni.showModal({
				    title: '温馨提示',
				    content: '您确定要删除此合伙人吗？',
				    showCancel: true,
				    success: function(res) {
				        if (res.confirm) { 
				            that.$u.delete(`/app/user/${userId}`).then(res => {
				            	if (res.code == 200) {
									that.tabindex = -1
									that.getlist()
				                    uni.showToast({
				                    	title: '删除成功',
				                    	icon: 'success',
				                    	duration: 2000
				                    })
				            	}else{
									uni.showToast({
										title: res.msg,
										icon: 'none',
										duration: 2000
									})
								}
				            })
				        } else if (res.cancel) {
				            
				        }
				    }
				})
			},
			// 点击跳转编辑合伙人
			btnedit(item){
				uni.navigateTo({
					url:'/page_moban/hehuorenadd?item=' + JSON.stringify(item)
				})
			},
           btnxq(index){
			   if(this.tabindex == index){
				   this.tabindex = -1
			   }else{
				   this.tabindex = index
			   }
		   },
		   btnadd(){
			  uni.navigateTo({
			  	url:'/page_moban/hehuorenadd'
			  })  
		   },
		   getlist() {
		   	    this.$u.get(`/app/user/list?userType=05`).then(res => {
		   	    	if (res.code == 200) {
		                this.wateringList = res.data
		   	    	}
		   	    })
		   },
		   
		}
	}
</script>

<style lang="scss">
	#active{
		display: block !important;
	}
	/deep/ .u-title,
	/deep/ .uicon-nav-back {
		padding-bottom: 22rpx;
	}
	page {
			background: #F4F5F7;
	}
	.serch{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 36rpx;
		box-sizing: border-box;
		padding-top: 20rpx;
		padding-bottom: 22rpx;
		background-color: #fff;
		.lt{
			display: flex;
			align-items: center;
			width: 100%;
			height: 68rpx;
			border: 2rpx solid #48893B;
			border-radius: 24rpx;
			padding-left: 30rpx;
			box-sizing: border-box;
			.sousuo{
				width: 140rpx;
				height: 66rpx;
				text-align: center;
				line-height: 66rpx;
				font-size: 32rpx;
				color: #FFFFFF;
				background: #48893B;
				border: 2rpx solid #48893B;
				border-radius: 0 20rpx 20rpx 0;
			}
			image{
				width: 46rpx;
				height: 46rpx;
			}
			input{
				width: 460rpx;
				margin-left: 30rpx;
				height: 68rpx;
				line-height: 68rpx;
			}
		}
	}
	.imgewmflag {
		width: 750rpx;
		height: 100vh;
		background: #fff;
		// opacity: .8;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		z-index: 1;
		position: fixed;
		top: 0;
		left: 0;
	}
	
	.imgewm { 
		width: 700rpx;
		height:700rpx;
		margin: auto;
		margin-top: 104rpx;
		z-index: 2;
		position: fixed;
		top: 20%;
		left: 50%;
		transform: translateX(-50%);
	}
    .xinjian{
		width: 680rpx;
		height: 90rpx;
		background: #48893B;
		border-radius: 49rpx 49rpx 49rpx 49rpx;
		font-weight: 600;
		font-size: 36rpx;
		color: #FFFFFF;
		text-align: center;
		line-height: 90rpx;
		border-radius: 50rpx;
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		bottom: 56rpx;
	}
	.xinjians{
		width: 680rpx;
		height: 90rpx;
		background: #48893B;
		border-radius: 49rpx 49rpx 49rpx 49rpx;
		font-weight: 600;
		font-size: 36rpx;
		color: #FFFFFF;
		text-align: center;
		line-height: 90rpx;
		border-radius: 50rpx;
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		bottom: 56rpx;
		z-index: 2;
	}
	.page {
		width: 750rpx;
		.box{
			width: 750rpx;
			height:100%;
			background: #F4F5F7;
			border-radius: 0rpx 0rpx 0rpx 0rpx;
			padding-bottom: 200rpx;
			.list{
				width: 680rpx;
				max-height: 350rpx;
				margin-top: 30rpx !important;
				margin: auto;
				background: #FFFFFF;
				border-radius: 24rpx 24rpx 24rpx 24rpx;
				padding: 20rpx 30rpx;
				box-sizing: border-box;
				.top{
					display: flex;
					justify-content: space-between;
					position: relative;
					.bianji{
						position: absolute;
						top: 50rpx;
						right: 0;
						width: 194rpx;
						height: 132rpx;
						background: #FFFFFF;
						box-shadow: 0rpx 6rpx 16rpx 0rpx rgba(0,0,0,0.15);
						border-radius: 10rpx 10rpx 10rpx 10rpx;
						text-align: center;
						// display: none;
						view{
							border-bottom: 1px solid #ccc;
							height: 66rpx;
							line-height: 66rpx;
						}
					}
				}
				.list_val{
					display: flex;
					justify-content: space-between;
					padding: 32rpx 50rpx;
					box-sizing: border-box;
					text-align: center;
				}
			}
			.nav {
				margin-bottom: 30rpx;
				.top {
					width: 750rpx;
					height: 136rpx;
					background: #FFFFFF;
					padding: 32rpx 36rpx;
					box-sizing: border-box;
			        position: fixed;
					top: 200rpx;
					/deep/ .u-content {
						border: 1px solid #ccc;
						border-radius: 50rpx 0 0 50rpx !important;
					}
			
					/deep/ .u-action {
						border-radius: 0 50rpx 50rpx 0 !important;
						width: 112rpx;
						height: 65rpx;
						line-height: 65rpx;
						border: 2rpx solid #ccc;
						margin-left: 0;
						color: #3D3D3D;
						background-color: #f2f2f2;
					}
				}
			
				.date {
					padding-left: 80rpx;
					padding-right: 80rpx;
					box-sizing: border-box;
					display: flex;
					justify-content: space-between;
					width: 750rpx;
					height: 70rpx;
					background: #FFFFFF;
					margin-bottom: 36rpx;
			
					text {
						padding: 6rpx 18rpx;
						box-sizing: border-box;
						background: #eee;
						height: 46rpx;
						border-radius: 10rpx 10rpx 10rpx 10rpx;
						font-size: 24rpx;
						color: #808080;
					}
				}
			}
		}
	}
</style>