<template>
	<view class="page">
		<view class="xiugai">
			微信绑定情况
		</view>
		<view v-for="(item,index) in list" :key="index" class="body">
			<view class="input-two">
				<input type="text" class="input" :value=title+item.nickName />
			</view>

			<view class="button2">
				<button type="primary" @click="delet(item.id,item.nickName)" class="button">
					<p class="p">解除绑定</p>
				</button>
			</view>
		</view>
		<view class="xiugai2">
			<button type="primary" @click="backN()" class="xiugai2">
				<p class="xiugai3">返回上一页</p>
			</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				adminId: '',
				stated:'1',
				title: "微信名:",
				list: []
			}
		},
		onUnload: function() {
			var stated = uni.getStorageSync("stated");
			if(stated!=2){
				wx.switchTab({
					url: '../User/user'
				})
			}
				
		},
		onShow() {
			var UserInfo = uni.getStorageSync("globalUser");
			this.adminId = UserInfo.id;
			var serverurl = this.serverurl;
			uni.removeStorageSync('stated');
			uni.request({
				url: serverurl + "/TWeixin/weiXinSearch",
				method: "POST",
				data: {
					adminId: this.adminId
				},
				success: (data) => {
					var list = data.data.data;
					this.list = list;
				}
			});
		},

		methods: {
			backN(){
				uni.reLaunch({
					url: '../User/user'
				});
			},
			delet(id, nickName) {
				// console.log("id==" + id);
				var serverurl = this.serverurl;
				uni.showModal({
					title: '提示',
					content: '是否取消绑定？',
					success: function(res) {
						if (res.confirm) {
							uni.request({
								url: serverurl + "/TWeixin/deleteWeixin",
								method: "POST",
								data: {
									id: id
								},
								success: (data) => {
									var list = data.data.data;
									if (list == 1) {
										uni.showModal({
											title: '提示',
											content: '解绑成功',
											success: function(res) {
												var UserInfo = uni.getStorageSync("newparm");
												uni.setStorageSync("stated",2);
												if (UserInfo.nickName == nickName) {
													uni.reLaunch({
														url: '../Login/Login',
													});
												} else {
													uni.reLaunch({
														url: '../User/user',
													});
												}
											}
										});
									}
								}
							});
						} else if (res.cancel) {
							setTimeout(function() {
								uni.startPullDownRefresh();
							}, 100);
							setTimeout(function() {
								uni.stopPullDownRefresh();
							}, 3000);
						}
					}
				});
			}
		}
	}
</script>

<style>
	.page{
		padding-bottom: 30upx;
	}
	.body {
		background-color: #FFFFFF;
		padding: 10upx 10upx 10upx 10upx;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
	}

	.input-two {
		width: 600upx;
		height: 100upx;
		padding-left: 30upx;
		padding-right: 20upx;
	}

	.p {
		/* #ifdef H5 */
		top: -13%;
		/* #endif */
		width: 120upx;
		height: 60upx;
		font-size: 30upx;
		/* #ifndef H5 */
		padding-top: 3upx;
		/* #endif */

		position: absolute;
		/* 水平居中 */
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
	}

	.input {
		/* padding: 10upx 20upx 10upx 0upx; */
		padding-left: 20upx;
		padding-top: 10upx;
		background-color: #FFFFFF;
		width: 500upx;
		height: 50upx;
		box-shadow: 0upx 0upx 20upx #D3D3D3;
		border-radius: 5upx;
	}

	.button {
		/* padding: 5upx 10upx 10upx 0upx; */
		width: 120upx;
		height: 60upx;
		border-radius: 10upx;
	}

	.button2 {
		padding-right: 120upx;
		padding-top: 2upx;
	}

	.xiugai {
		width: 92%;
		padding-top: 20upx;
		border-left: 20upx;
		border-left: 10upx solid #FFFFFF;
		padding-left: 10upx;
		height: 38upx;
		padding-bottom: 30upx;
		font-family: "PingFang-SC-Bold";
		font-weight: bold;
		margin: auto;
		font-size: 32upx;
		color: #363D44;
	}
	.xiugai2 {
		width: 100%;
		height: 80upx;
		font-family: "PingFang-SC-Bold";
		font-weight: bold;
		margin: auto;
		font-size: 50upx;
		color: #363D44;
		position:fixed;
		bottom:0;
	}
	.xiugai3 {
		height: 80upx;
		font-family: "PingFang-SC-Bold";
		font-weight: bold;
		margin: auto;
		font-size: 40upx;
		color: #363D44;
		
	}
</style>
