zx_flk_app/pages/login/login.vue

<template>
	<view class="container">
		<view class="bg-img">
			<view>欢迎来到{{appConfig.app_name}}</view>
		</view>
		<view class="content-box">
			<view @tap="clickGetLoginInfo">手机号快捷登录</view>
			<view @tap="navToPage" data-url="/pages/phoneLogin/phoneLogin">其他手机号登录</view>
			<view class="contract-item flex-row">
				<view @tap="bindContractInfo">
					<img class="check-icon"
						:src="contract_id==1?'https://qiniu.bms16.com/FjLudtM29xwqgJh5kUKR9kyhK0Lu':'https://qiniu.bms16.com/FuQZipm9g7wX6CyGQBCjK2RTXfbW'" />
				</view>
				<view @tap="bindContractInfo" style="padding-left: 8rpx;">已阅读并同意
					<text style="color:#0074FF"
						@click.native.stop="bindContractToAgreement">{{'《' + appConfig.app_name + '电动车租赁用户协议》'}}</text>和
					<text style="color:#0074FF" @click.native.stop="bindContractToPrivacy">《隐私协议》</text>
				</view>
			</view>
		</view>

		<view v-if="openUser" class="modal-group-view">
			<view class="content_view">
				<view class="flex-row">
					<img :src="appConfig.app_logo" class="mini_logo_img" mode="widthFix" />
					<view class="mini_app_name">{{appConfig.app_name}}</view>
				</view>
				<view class="mark_view">申请获取并验证你的手机号</view>
				<view class="mark_lable">快捷登录</view>
				<view @tap="clickFastLogin" class="mark_btn">
					<view class="last_phone">{{openUser.maskPhone}}</view>
					<view class="last_phone_mark">上次提供</view>
				</view>
				<view @tap="clickNoAllow" class="mark_btn_no">不允许</view>
				<view @tap="clickOtherPhone" class="other_text">使用其他号码</view>
			</view>
		</view>
	</view>
</template>

<script>
	var config = require('../../common/config.js');
	var common = require('../../common/common.js');
	var http = require('../../common/http.js');
	var storage = require('../../common/storage.js');
	var encryption = require('../../common/encryption.js')
	export default {
		data() {
			return {
				app_name: '',
				appConfig: null,
				codeGetting: false,
				curTime: 60,
				phone: '',
				verify_code: '',
				timer: null,
				contract_id: 0,
				app_version: '',
				accountsData: {},
				isSDK: 0, // 0初始化未授权 1 已授权
				needAuthorization: false,
				openUser: null
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			const me = this
			let appConfig = storage.getAppConfig()
			console.log(appConfig,'appConfig');
			me.setData({
				appConfig: appConfig
			})
		},
		methods: {
			bindContractInfo() {
				if (this.contract_id == 1) {
					this.setData({
						contract_id: 0
					})
				} else {
					this.setData({
						contract_id: 1
					})
				}
			},

			bindContractToAgreement() {
				uni.navigateTo({
					url: '/pages/contract/contract?contract_id=270',
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {},
				})
			},

			bindContractToPrivacy() {
				uni.navigateTo({
					url: '/pages/contract/contract?contract_id=102',
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {},
				})
			},

			navToPage(e) {
				const url = e.currentTarget.dataset.url;
				if (!url) {
					return;
				}
				uni.navigateTo({
					url: url
				});
			},

			clickGetLoginInfo() {
				if (this.contract_id === 0) {
					common.simpleToast('请查阅隐私和协议')
					return;
				}
				const me = this
				common.loading()
				uni.login({
					success: function(res) {
						const pData = {
							code: res.code
						}
						http.postApi(config.API_OPENID_GET_PHONE, pData, function(resp) {
							uni.hideLoading()
							if (resp.data.code == 200) {
								if (resp.data.data.user === null) {
									common.simpleToast('一键授权失败,请使用手机号登录')
									uni.navigateTo({
										url: '/pages/phoneLogin/phoneLogin',
									})
								} else {
									var user = resp.data.data.user
									user.maskPhone = common.maskPhoneNumber(user.phone)
									me.setData({
										openUser: user
									})
								}
							} else {
								common.simpleToast('一键授权失败,请使用手机号登录')
								uni.navigateTo({
									url: '/pages/phoneLogin/phoneLogin',
								})
							}
						})
					},
				})
			},

			clickFastLogin() {
				const me = this
				uni.login({
					success: function(res) {
						const accountInfo = wx.getAccountInfoSync()
						const currentTimeStamp = parseInt(new Date().getTime() / 1000).toString();
						var encryptionData = currentTimeStamp + ',' + me.openUser.phone
						var encryptionCode = encryption.fastLoginEncryption(encryptionData)
						const pData = {
							code: res.code,
							open_data: encryptionCode
						}
						http.postApi(config.API_OPENID_LOGIN, pData, function(response) {
							if (response.data.code == 200) {
								me.headimg = response.data.data.baseInfo.headimg;
								me.user_name = response.data.data.baseInfo.user_name;
								const accountsData2 = {
									code: res.code,
									appid: accountInfo.miniProgram.appId,
									headimg: me.headimg,
									user_name: me.user_name,
									phone: me.openUser.phone,
									open_data: encryptionCode
								}
								storage.setUserToken(response.data.data.baseInfo.token)
								common.simpleToast('登录成功')
								uni.reLaunch({
									url: '/pages/index/index',
								})
								const app = getApp();
								let accounts = app.globalData.accountManagement
								accounts.push(accountsData2)
								if (accounts.length > 0) {
									accounts = accounts.filter((item, index, arr) => arr.findIndex(p =>
										p.phone === item.phone) === index)
									uni.setStorage({
										key: "accountManagement",
										data: accounts
									})
								}
							} else {
								common.simpleToast('一键授权失败,请使用手机号登录')
								uni.navigateTo({
									url: '/pages/phoneLogin/login',
								})
							}
						})
					},
				})
			},

			clickNoAllow() {
				this.setData({
					openUser: null
				})
			},

			clickOtherPhone() {
				uni.navigateTo({
					url: '/pages/phoneLogin/phoneLogin',
				})
			},
		}
	};
</script>

<style>
	@import './login.css';
</style>