<template>
	<!--同行绑定-->
	<view class="login-page">
		<view class="logo-head">
			<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1695262844000_280.png" mode="widthFix"></image>
			<view class="logo-text">旅小友</view>
		</view>
		<view class="login-form">
			<view class="login-title">同行登录</view>
			<view class="login-item">
				<input type="text" v-model="msg.account" placeholder="请输入您的同业账号" :class="{'focus':currentFocus=='account'}" @blur="changeCurrentFocus('')"
				 @focus="changeCurrentFocus('account')">
			</view>
			<view class="login-item">
				<input type="password" v-model="msg.password" placeholder="请输入您的登录密码" :class="{'focus':currentFocus=='pwd'}" @blur="changeCurrentFocus('')"
				 @focus="changeCurrentFocus('pwd')">
			</view>
			<view class="login-item">
				<view @click="loginByAccount" class="login-btn" :class="{'disable':msg.account==''||msg.password==''}">登录</view>
			</view>

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

<script>
	export default {
		data() {
			return {
				msg: {
					account: '',
					password: '',
					OpenId: ''
				},
				currentFocus: '',
				loginLoading: false
			}
		},
		mounted() {
			this.getUserProfileHandler()
		},
		methods: {
			changeCurrentFocus(val) {
				this.currentFocus = val
			},
			loginByAccount() {
				if (this.msg.account != '' && this.msg.password != '') {
					this.loginErpHandler()
				}
			},
			loginByOpenId() {
				if (this.msg.OpenId != '') {
					this.loginErpHandler(1)
				} else {
					uni.showToast({
						icon: 'none',
						title: '获取微信信息失败，请使用账号密码登录'
					})
				}
			},
			loginErpHandler(t = 0) {
				if (this.loginLoading) return;
				this.loginLoading = true
				uni.showLoading({
					title: '绑定中...'
				})
				let param = JSON.parse(JSON.stringify(this.msg))
				if (t != 0) {
					param.account = ''
					param.password = ''
				}
				this.apipost("b2b_post_LvXiaoYouBindCustomerInfo", param, (res) => {
					if (res.resultCode == 1) {
						//移除缓存=>跳转到首页重新登录
						uni.removeStorageSync('b2b_user')
						uni.removeStorageSync('mall_UserInfo')
						uni.redirectTo({
							url: '/pages/index/index'
						})
					} else {
						this.loginLoading = false
						uni.hideLoading()
					}
				}, (failed) => {
					this.loginLoading = false;
					uni.showToast({
						title: failed.message,
						icon: "none",
					});
				}, (error) => {
					this.loginLoading = false;
					uni.hideLoading()
				})
			},
			getUserProfileHandler() {
				wx.login({
					success: (res) => {
						this.getCode(res)
					},
					fail() {}
				})
			},
			getCode(obj) {
				var that = this;
				that.request2({
						url: "/api/mall/GetWeChatOpenId",
						data: {
							Code: obj.code,
						},
					},
					(res) => {
						if (res.resultCode == 1) {
							this.msg.OpenId = res.data;
						}
					}
				);
			},
		}
	}
</script>

<style>
	/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
	.login-page {
		padding: 20px;
	}

	.login-page .logo-head {
		margin-top: 20px;
		display: flex;
		align-items: center;
	}

	.login-page .logo-head image {
		width: 50px;
		height: 50px;
		margin-right: 10px;
	}

	.login-page .logo-head .logo-text {
		font-size: 32px;
		font-family: logo-font;
		font-weight: 700;
	}

	.login-page .login-form {
		margin-top: 50px;
		padding: 20px;
	}

	.login-page .login-form .login-title {
		font-size: 20px;
		font-weight: 700;
		font-family: logo-font;
		margin-bottom: 30px;
	}

	.login-page .login-form .login-item {
		margin-top: 30px;
	}

	.login-page .login-form .login-item input {
		background-color: rgba(0, 0, 0, .05);
		padding: 0 12px;
		height: 46px;
		line-height: 46px;
		border-radius: 8px;
		color: #1d1d1d;
		font-family: nav-font;
	}

	.login-page .login-form .login-item input.focus {
		background: #1d1d1d;
		color: #FFF;
	}

	.login-page .login-form .login-btn {
		height: 80rpx;
		background-color: #111111;
		text-align: center;
		line-height: 80rpx;
		color: #fff;
		/* font-weight: 600; */
		font-size: 28rpx;
		border-radius: 16rpx;
		font-family: logo-font;
		font-size: 16px;
	}

	.login-page .login-form .login-btn.disable {
		/* background-color: #ecf1f4;
	  color: #111; */
		opacity: 0.5;
	}

	.login-page .login-form .wechat-login {
		background-color: none;
		height: 40px;
		width: 40px;
		/* border-radius: 40px; */
		overflow: hidden;
		/* box-shadow: 0px 0px 20px 0px rgba(76,87,125,0.2)!important; */
		padding: 0;
	}

	.login-page .login-form .wechat-login image {
		width: 38px;
		height: 38px;
		margin: 1px;
	}

	.login-page .login-form .wechat-login::after {
		border: none !important;
		height: auto !important;
	}
</style>
