<template>
	<view class="container">
		<view class="wrapper">
			<view style="padding-left:60upx;" class="margin-tb-lg">
				<view style="color:#333333;font-size:42upx;">商户登录体验更多功能</view>
				<view style="color:#999999" class="text-sm margin-top-xs">未入驻过的请先申请入驻账号</view>
			</view>

			<view class="input-content">
				<view class="cu-form-group margin-top" style="border-bottom: 1px solid #E6E6E6;">
					<!-- <view class="title text-black">账号</view> -->
					<input type="text" :value="phone" placeholder="请输入账号" maxlength="11" data-key="phone"
						@input="inputChange" />
				</view>
				<view class="cu-form-group margin-top" style="border-bottom: 1px solid #E6E6E6;">
					<!-- <view class="title text-black">密码</view> -->
					<input type="password" placeholder="请输入密码" maxlength="20" :value="password" data-key="password"
						@input="inputChange" @confirm="toLogin" />
					<!-- <text class="send-msg" @click="forget">忘记密码</text> -->
				</view>


				<view class="cu-form-group flex justify-between align-center margin-top"
					style="border-bottom: 1px solid #E6E6E6;">
					<view>
						<!-- <view class="title text-black">验证码</view> -->
						<input type="text" placeholder="请输入图片验证码" maxlength="20" :value="captcha" data-key="captcha"
							@input="inputChange" @confirm="toLogin" />
					</view>
					<view>
						<image @click="getCaptcha" :src="captchaPath" style="width:160upx;height:64upx;"></image>
					</view>
				</view>


			</view>
			<button class="confirm-btn" @click="toLogin">立即登录</button>
			<view class="flex">
				<view class="ruzhu" @click="bindchat()">联系客服</view>
				<!-- <view class="ruzhu" @click="xiupwd()">修改密码</view> -->
				<view class="ruzhu" @click="show = true" v-if="XCXIsSelect != '否'">商家入驻</view>
			</view>
			<!-- <view class="ruzhu" @click="bindRuzhu()">商家入驻</view> -->

			<!-- <view class="ruzhu" @click="show = true">商家入驻</view> -->

		</view>
		<!---->
		<!-- 入驻弹框 -->
		<u-popup v-model="show" mode="center" border-radius="14" width="500rpx" height="350rpx" closeable="true">
			<view class="padding text-center">
				<view class="padding-top margin-top-sm text-lg" @click="bindRuzhu()">商家申请入驻</view>
				<view class="padding-top  text-lg" @click="bindRuzhus()">商家信息修改</view>
				<view class="text-sm text-gray margin-top-xs">申请入驻后修改入驻信息</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import configurl from '../../common/config.js'
	export default {
		data() {
			return {
				openId:'',
				weixinPhone: true,
				phone: '',
				password: '',
				banners: [],
				invitation: '',
				loginName: '',
				sending: false,
				sendTime: '获取验证码',
				count: 60,
				captcha: '',
				captchaPath: '',
				uuid: '',
				show: false,
				open: true,
				XCXIsSelect: '是',
			}
		},
		onLoad() {
			this.getCaptcha()
			this.XCXIsSelect = this.$queue.getData("XCXIsSelect");
		},
		methods: {
			//登录
			login() {
				let that = this;
				// 1.wx获取登录用户code
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						console.log(loginRes, '************')
						let data = {
							code: loginRes.code,
						}
						that.$Request.get('/app/Login/wxShopLogin', data).then(res => {
							if (res.code == 0) {
								uni.hideLoading()
								that.openId = res.data.open_id;
								that.xcxtoLogin();
								// uni.setStorageSync('openId', res.data.open_id)
								// uni.setStorageSync('unionId', res.data.unionId)
							} else {
								uni.showToast({
									icon: 'none',
									title: res.msg,
									duration: 2000
								});
								console.log(res, '失败')
							}
						})
					}
				});
			},
			//修改密码
			xiupwd() {
				uni.navigateTo({
					url: '/pages/my/pwd'
				})
			},
			// 商家入驻引导弹框
			bindshangjia() {
				uni.showModal({
					title: '提示',
					content: '请前往同城外卖用户端【我的-商家入驻】进行入驻，再返回商家登录',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							// #ifdef MP-WEIXIN
							wx.navigateToMiniProgram({
								appId: 'wxd6a3bf45c999d9cd',
								path: '/pages/index/index',
								envVersion: 'release', // 打开正式版
								success(res) {
									// 打开成功
								},
								fail: function(err) {
									console.log(err);
								}
							})
							// #endif
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			//联系客服
			bindchat() {
				uni.navigateTo({
					url: '/my/other/customer'
				})
			},
			//申请商户入驻
			bindRuzhu() {
				this.show = false;
				uni.navigateTo({
					url: '/my/publish/index'
				})
			},
			bindRuzhus() {
				this.show = false;
				uni.navigateTo({
					url: '/pages/my/phoneSettled'
				})
			},
			// 获取验证码
			getCaptcha() {
				this.uuid = this.$queue.getUUID()

				// this.captchaPath = this.$http.adornUrl(`/captcha.jpg?uuid=${this.uuid}`)
				// this.captchaPath = this.$Request.getA('/captcha.jpg?uuid='+this.uuid).then(res => {

				// });
				console.log(this.uuid)
				uni.downloadFile({
					// url: 'https://diancanshop.xianmxkj.com/sqx_fast/captcha.jpg?uuid=' + this.uuid,
					// url: 'https://tcwm.xianmaxiong.com/sqx_fast/captcha.jpg?uuid=' + this.uuid,
					url: configurl.APIHOST + '/captcha.jpg?uuid=' + this.uuid,
					success: (res) => {
						console.log(res)
						this.captchaPath = res.tempFilePath
					}
				})
			},
			forget() {
				uni.navigateTo({
					url: '/pages/my/forgetPwd'
				});
			},
			register() {
				uni.navigateTo({
					url: '/pages/public/register'
				});
			},
			inputChange(e) {
				const key = e.currentTarget.dataset.key;
				this[key] = e.detail.value;
			},
			navBack() {
				uni.navigateBack();
			},
			xcxtoLogin() {
				let that = this
				that.$queue.loginClear();
				let openid = that.$queue.getData("openid");
				const {
					phone,
					password,
					captcha
				} = that;
				if (!phone) {
					that.$queue.showToast("请输入门店管理员账号");
				} else if (!password) {
					that.$queue.showToast("请输入门店管理员密码");
				} else if (!captcha) {
					that.$queue.showToast("请输入图片验证码");
				} else {
					that.$queue.showLoading("正在登录中...");
					that.$Request.postJsonA("/sys/login", {
						password: password,
						username: phone,
						captcha: captcha,
						uuid: that.uuid,
						openId: that.openId
					}).then(res => {
						if (res.code == 0) {
							that.$queue.setData("shopToken", res.token);
							uni.hideLoading()

							setTimeout(function() {
								that.getUserInfo()
							}, 10)
						} else {
							that.getCaptcha()
							uni.hideLoading();
							that.$queue.showToast(res.msg);
						}
					});
				}
			},
			toLogin() {
				let that = this
				that.$queue.loginClear();
				let openid = that.$queue.getData("openid");
				const {
					phone,
					password,
					captcha
				} = that;
				if (!phone) {
					that.$queue.showToast("请输入门店管理员账号");
				} else if (!password) {
					that.$queue.showToast("请输入门店管理员密码");
				} else if (!captcha) {
					that.$queue.showToast("请输入图片验证码");
				} else {
					// #ifdef MP-WEIXIN
					that.login();
					// #endif
					// #ifndef MP-WEIXIN
					that.$queue.showLoading("正在登录中...");
					that.$Request.postJsonA("/sys/login", {
						password: password,
						username: phone,
						captcha: captcha,
						uuid: that.uuid,
					}).then(res => {
						if (res.code == 0) {
							that.$queue.setData("shopToken", res.token);
							uni.hideLoading()

							setTimeout(function() {
								that.getUserInfo()
							}, 10)
						} else {
							that.getCaptcha()
							uni.hideLoading();
							that.$queue.showToast(res.msg);
						}
					});
					// #endif
				}
			},
			getUserInfo() {
				this.$Request.getA("/sys/user/info").then(res => {
					if (res.code == 0) {
						this.$queue.setData("userId", res.user.userId);
						this.$queue.setData("shopId", res.user.shopList[0].shopId);
						this.$queue.setData("mobile", res.user.mobile);
						if (res.user.userEntity && res.user.userEntity.openId) {
							this.$queue.setData("openId", res.user.userEntity.openId);
						}
						// #ifdef APP-PLUS
						if (uni.getSystemInfoSync().platform == 'android') {
							let clientid = plus.push.getClientInfo().clientid;
						
							let userId = this.$queue.getData('userId');
							if (userId) {
								this.$Request.postT('/user/updateShopClientId?clientId=' + clientid).then(
									red => {});
							}
						}
						//#endif
						// uni.navigateBack()
						// this.$queue.setData("avatar", res.user.avatar);
						// this.$queue.setData("invitationCode", res.user.invitationCode);
						this.$queue.setData("open", this.open);
						uni.switchTab({
							url: '/pages/my/index'
						})
					}
				});
			},
			// getIsVip() {
			// 	this.$Request.get("/app/UserVip/isUserVip").then(res => {
			// 		if (res.code == 0) {
			// 			// this.isVip = res.data
			// 			console.log(res.data)
			// 			this.$queue.setData("isVip", res.data);
			// 		}
			// 	});
			// }
		},

	}
</script>

<style lang='scss'>
	page {
		height: 100%;
		background: #FFFFFF !important;
	}

	.send-msg {
		border-radius: 30px;
		/* color: black; */
		background: white;
		height: 30px;
		font-size: 14px;
		line-height: 30px;
	}

	.container {
		top: 0;
		padding-top: 32upx;
		position: relative;
		width: 100%;
		height: 100%;
		overflow: hidden;
		/* background: #1E1F31 !important; */
	}

	.wrapper {
		position: relative;
		z-index: 90;
		/* background: #1E1F31; */
		padding-bottom: 32upx;
	}


	.input-content {
		/* margin-top: 300upx; */
		/* padding-top: 300upx; */
		padding: 40upx 60upx;

	}


	.confirm-btn {
		width: 600upx;
		line-height: 88upx;
		height: 88upx;
		border-radius: 10upx;
		margin-top: 32upx;
		background: #FCD202;
		/* color: #fff; */
		font-size: 32upx;

		&:after {
			border-radius: 10px;
		}
	}

	.ruzhu {
		width: 100%;
		text-align: center;
		color: #999999;
		margin-top: 20upx;
	}

	.padding-top {
		margin: 32upx 0;
		background: #FCD202;
		height: 72rpx;
		/* line-height: 80rpx; */
		padding: 13rpx 0;
		font-size: 34rpx;
	}

	.margin-top-sm {
		margin-top: 50rpx;
	}
</style>
