apply-assistant-v3/root/person/loginIndex.vue

<template>
	<view class="p-login-index">
		<!-- 15936360682 -->
		<view class="g_h_70"></view>
		<view class="g_flex_row_center g_mb_10">
			<img :src="v3BaseImg + 'bmzz.svg'" alt class="g_w_56 g_h_56 g_radius_8" />
		</view>
		<view style="font-size: 18px; font-weight: 400; color: #919191; line-height: 25px; margin-bottom: 60px; text-align: center">劳务上下游收发单工具</view>
		<view class="m-form g_mb_50 g_pl_40 g_pr_40">
			<view class="g_bg_f_5 g_radius_6 g_pl_16 g_pr_16 g_flex_column_center g_pt_10 g_pb_10 g_mb_20">
				<u-input maxlength="11" v-model="form.tel" type="number" class="g_fs_16" placeholder="请输入手机号" placeholder-style="color:#999999;font-size:32rpx;line-height:1" />
			</view>
			<view class="g_bg_f_5 g_radius_6 g_pl_16 g_flex_column_center g_position_rela" v-if="isLoginCode">
				<view class="g_flex_row_between">
					<view class="g_flex_1 g_mr_20 g_pt_10 g_pb_10">
						<u-input maxlength="4" v-model="msgCode.code" @input="hideKeyboard" type="number" class="g_fs_16" placeholder="请输入验证码" placeholder-style="color:#999999;font-size:32rpx;line-height:1" />
					</view>
					<view class="btn-text g_flex_column_center g_bg_f_5 g_radius_6 g_flex_none g_pt_8 g_pb_8" @click="handleSendMsg">
						<button :class="form.tel.length == 11 ? (msgCode.countdown > 0 ? 'g_c_9' : 'g_c_main') : 'g_c_9'" class="btn-con g_w_126 g_flex_row_center" style="font-size: 32rpx">{{ msgCode.btnText }}</button>
					</view>
				</view>
			</view>
			<view v-if="!isLoginCode" class="g_bg_f_5 g_radius_6 g_pl_16 g_pr_16 g_flex_column_center g_pt_10 g_pb_10">
				<u-input v-model="form.pwd" type="password" class="g_fs_16" placeholder="请输入密码" placeholder-style="color:#999999;font-size:32rpx;line-height:1" />
			</view>
			<view class="g_fs_14 g_pl_16 g_mt_8" style="color: #576b95" @click="isLoginCode = !isLoginCode" v-if="false">{{ isLoginCode ? "密码登录" : "验证码登录" }}</view>
		</view>
		<view>
			<view class="g_flex_row_center">
				<g-button btnText="登录/注册" type="primary" @clickBtn="goHome" width="260" height="48" />
			</view>

			<!-- #ifdef MP-WEIXIN -->
			<view class="g_flex_row_center g_mt_24 g_mb_24">
				<view class="g_flex_column_center">
					<view class="bor g_w_90 g_h_1 g_border_e_b"></view>
				</view>
				<view class="g_flex_column_center g_fs_15 g_c_9 g_ml_9 g_mr_9">或</view>
				<view class="g_flex_column_center">
					<view class="bor g_w_90 g_h_1 g_border_e_b"></view>
				</view>
			</view>
			<view class="g_mt_24 g_flex_row_center">
				<g-button width="260" height="48" btnText="一键免密登录" type="default" openType="getPhoneNumber" @clickTel="getphonenumber" />
			</view>
			<!-- #endif -->
		</view>

		<!-- <view class="g_flex_column_between g_flex_1 g_pb_24">
			<view class="g_fs_12 g_c_9 g_flex_row_center g_mb_32" style="align-items: center; margin-top: 16px">
				<radio-group class="dib">
					<radio :checked="switchChecked"  @click="switchChange" value="0" class="dib biggerSize" color="#00b666" style="transform: scale(0.7)" />
				</radio-group>
				我已阅读并同意
				<navigator url="/root/person/agreeUser" class="g_c_sub">《用户服务协议》</navigator>
				及
				<navigator url="/root/person/agreePrive" class="g_c_sub">《隐私政策》</navigator>
			</view>
		</view> -->
	</view>
</template>

<script>
export default {
	onShareAppMessage() {
		return this.G.shareFun();
	},
	data() {
		return {
			switchChecked: false,
			localBaseImg: this.G.store().localBaseImg,
			v3BaseImg: this.G.store().v3BaseImg,
			isLoginCode: false,
			form: {
				tel: "",
				pwd: "",
			},

			path: "",
			level: "",

			msgCode: {
				// 短信倒计时
				code: "",
				btnText: "获取验证码", // 6s
				countdown: 0,
				timer: null,
			},
			fromPageType: "",
			currentId: null,
		};
	},
	onLoad(options) {
		console.log("登录页：", options);
		this.path = options.path ? options.path : "";
		this.level = options.level ? options.level : "";
		if (options.type) {
			this.setOptions(options);
		}
		console.log("123");
		this.getCode((res) => {
			uni.setStorageSync("apply-code", res);
		});
	},

	onShow() {
		this.G.clearLocalStorage();
	},
	onHide() {
		if (this.msgCode.timer) {
			clearInterval(this.msgCode.timer);
		}
	},
	methods: {
		switchChange() {
			console.log("switchChecked", this.switchChecked);
			console.log(this.switchChecked);
			this.switchChecked = !this.switchChecked;
		},
		hideKeyboard(e) {
			console.log(e);
			if (e.length >= 4) {
				console.log("123123123");
				uni.hideKeyboard();
			}
		},
		setOptions(options) {
			console.log("options", options);
			this.fromPageType = options.type;
			let jsonStr = JSON.parse(options.scene);
			if (options.type == "detail") {
				this.currentId = `id%3D${jsonStr.id}`;
			} else if (options.type == "shareList") {
				if (jsonStr.i) {
					this.currentId = `i%3D${jsonStr.i},u%3D${jsonStr.u}`;
				} else {
					this.currentId = `id%3D${jsonStr.id}`;
				}
			}
		},
		goHome() {
			let that = this,
				url = "",
				params = {};
			if (that.form.tel == "") {
				uni.showToast({
					title: "请输入手机号",
					icon: "none",
				});
				return false;
			}
			if (!/^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(that.form.tel)) {
				uni.showToast({
					title: "请输入正确的手机号",
					icon: "none",
				});
				return false;
			}

			if (that.isLoginCode) {
				// 验证码登录
				if (that.msgCode.code == "") {
					uni.showToast({
						title: "请输入验证码",
						icon: "none",
					});
					return false;
				}
				url = that.api.login_code;
				params = {
					tel: that.form.tel,
					code: that.msgCode.code,
					loginType: "login",
					wxCode: "",
					createFakerAgency: 1,
				};
			} else {
				// 密码登录
				if (that.form.pwd == "") {
					uni.showToast({
						title: "请输入密码",
						icon: "none",
					});
					return false;
				}
				url = that.api.login_user;
				params = {
					tel: that.form.tel,
					password: that.form.pwd,
					loginType: "password",
					wxCode: "",
					createFakerAgency: 1,
				};
			}
			uni.showLoading({
				title: "登录中...",
				mask: true,
			});
			// #ifdef MP-WEIXIN
			uni.checkSession({
				success() {
					//session_key 未过期，并且在本生命周期一直有效
					that.loginAccount(url, params);
				},
				fail() {
					// session_key 已经失效，需要重新执行登录流程
					that.getCode((res) => {
						uni.setStorageSync("apply-code", res);
						setTimeout(() => {
							that.loginAccount(url, params);
						}, 300);
					});
				},
			});
			// #endif
			// #ifdef H5 || APP-PLUS || MP-TOUTIAO || MP-KUAISHOU
			that.loginAccount(url, params);
			// #endif
		},

		loginAccount(url, params) {
			let that = this,
				_params = {};
			params.wxCode = uni.getStorageSync("apply-code");
			_params = Object.assign(params, {
				path: that.path,
			});
			console.log("登录参数：", _params, " 获取分享参数：", uni.getStorageSync("apply-jobdetail-id"));
			that.G.Get(url, _params, (res) => {
				console.log("登录成功：", res);
				that.setToken(res);
			});
		},
		getCode(callback = () => {}) {
			uni.login({
				success(wxRes) {
					callback(wxRes.code);
				},
				fail(res) {
					console.log(res);
				},
			});
		},
		getphonenumber(e) {
			let that = this;
			if (e.detail.code) {
				// 允许授权。拿button返回信息换取token
				uni.checkSession({
					success() {
						//session_key 未过期，并且在本生命周期一直有效
						that.loginWX(e);
					},
					fail() {
						// session_key 已经失效，需要重新执行登录流程
						that.getCode((res) => {
							uni.setStorageSync("apply-code", res);
							setTimeout(() => {
								that.loginWX(e);
							}, 300);
						});
					},
				});
			} else {
				// 拒绝授权。
			}
		},
		loginWX(e) {
			let that = this;
			that.G.Get(
				that.api.login_getWxInfo,
				{
					code: uni.getStorageSync("apply-code"),
					btnCode: e.detail.code,
					iv: e.detail.iv,
					encryptedData: e.detail.encryptedData,
				},
				(wxRes) => {
					that.G.Get(
						that.api.login_wechat,
						{
							openId: wxRes.openId,
							tel: wxRes.phoneNumber,
							unionid: wxRes.unionid,
							createFakerAgency: 1,
						},
						(res) => {
							that.setToken(res);
						}
					);
				}
			);
		},
		// 处理存储token

		setToken($data) {
			let that = this;
			console.log("获取登录用户信息：", $data);
			uni.hideLoading();
			uni.setStorageSync("apply-userinfo", $data); // 获取用户信息, 参与实际逻辑
			uni.setStorageSync("apply-userinfo-copy", JSON.stringify($data)); // 仅用于查看数据，不参与实际逻辑
			uni.setStorageSync("apply-avatar", $data.imgSrc); // 单独存储 -- 头像，方便修改
			uni.setStorageSync("apply-username", $data.userName); // 单独存储 -- 用户名，方便修改
			uni.setStorageSync("apply-tel", $data.tel); // 单独存储 -- 手机号，方便修改
			uni.setStorageSync("apply-token", $data.token); // 单独存储 -- token，方便获取
			uni.setStorageSync("apply-agencyId", $data.user.agencyId); // 单独存储 -- 代理id，方便获取
			uni.setStorageSync("apply-uid", $data.user.id); // 单独存储 -- 用户名，方便修改
			uni.setStorageSync("apply-supplierAccount", $data.supplierAccount); // 单独存储 -- 是否是发单号，方便获取 0.不是发单号 1.是发单号
			uni.$emit("isGlogin", {
				uid: $data.user.id,
			});
			if (!that.path) {
				uni.switchTab({
					url: "/pages/home/index",
				});
			} else if (that.fromPageType == "detail" || that.fromPageType == "shareList") {
				console.log("that.currentId", that.currentId);
				uni.reLaunch({
					url: `${that.path}?scene=${that.currentId}`,
				});
				// uni.navigateBack({
				//   delta: 1,
				// })
				return;
			} else {
				// 固定跳首页
				uni.reLaunch({
					url: that.path,
				});
			}
			if ($data.agencyId) {
				// if ($data.agencyStatus == 1) {
				that.G.Get(that.api.login_agencyInfo, {}, (aRes) => {
					console.log("获取团队信息:", aRes);
					uni.setStorageSync("agencyInfo", aRes.agency); // 1是创建者 2是普通成员
					uni.setStorageSync("IS_CREATOR", aRes.agency.userId == $data.user.id || $data.admin == true ? 1 : 2); // 1是创建者 2是普通成员

					// 登录跳转到首页的判断
					uni.setStorageSync("SHOW_INVITE", 1);
				});
			}
		},

		// 发送验证码
		handleSendMsg() {
			let that = this;
			if (this.msgCode.countdown > 0) {
				return false;
			}
			if (that.form.tel == "") {
				uni.showToast({
					title: "请输入手机号后再获取",
					icon: "none",
				});
				return false;
			}
			if (!/^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(that.form.tel)) {
				uni.showToast({
					title: "请输入正确的手机号",
					icon: "none",
				});
				return false;
			}
			that.G.Get(
				that.api.login_sendMsg,
				{
					tel: that.form.tel,
					type: "assistant",
				},
				(res) => {
					that.msgCode.countdown = 60;
					that.msgCode.btnText = that.msgCode.countdown + "s";
					clearInterval(that.msgCode.timer);
					that.msgCode.timer = setInterval(() => {
						if (that.msgCode.countdown > 0) {
							that.msgCode.countdown--;
							that.msgCode.btnText = that.msgCode.countdown + "s";
						} else {
							clearInterval(that.msgCode.timer);
							that.msgCode.timer = null;
							that.msgCode.btnText = "获取验证码";
						}
					}, 1000);
				}
			);
		},
	},
};
</script>

<style lang="scss">
.p-login-index {
	/* #ifdef MP-TOUTIAO || MP-KUAISHOU */
	min-height: 100%;
	background-color: #fff;
	/* #endif */
	.btn-text {
		.btn-con {
			border-left: 2rpx solid #e5e5e5;
			padding: 0 32rpx;
			background-color: transparent;
			border-radius: 0;
			height: 40rpx;
			line-height: 40rpx;
		}
	}

	.tel-btn {
		width: 500rpx;
		height: 84rpx;
		border: 2rpx solid #00b666;
		left: 50%;
		transform: translateX(-50%);
		top: 0;
		border-radius: 48rpx;
		opacity: 0;
	}

	.u-input__right-icon {
		display: flex;
		display: -webkit-flex;
		flex-direction: column;
		flex-wrap: wrap;
		justify-content: center;
	}
}
</style>