mp-ui-user/components/auth/auth.vue

<template>
	<view>
		<u-popup :show="authShow" mode="bottom">
			<view class="auth-wrap">
				<view class="tip">为了正常使用功能，请授权用户信息。</view>
				<button :loading="authIng" @click="getInfo()" type="default">授权</button>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import $http from '../../utils/request.js'
	export default {
		name: "auth",
		props: {
			authShow: {
				type: Boolean,
				default: true
			},
			authToken: {
				type: String,
				default: ''
			},
			authMobile: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				authIng: false
			};
		},
		methods: {
			getInfo() {
				let _this = this
				if (this.authIng) {
					return
				}
				_this.authIng = true
				uni.getUserProfile({
					desc: '用于填充用户默认信息',
					success(info) {
						uni.login({
							success(res) {
								$http.post('/api/v1/mp/user/wxauth', {
									...{
										identity: 1,
										code: res.code
									},
									...info.userInfo
								}).then(res => {
									_this.authIng = false
									if (res.code === 0) {
										uni.$u.toast('授权成功');
										_this.authIng = false
										_this.$emit('close')
									}
								}).catch(() => {
									_this.authIng = false
								})
							}
						})
					},
					fail() {
						_this.authIng = false
					}
				})
			},

			getBaseInfo() {
				$http.post('/api/v1/mp/user/getLoginUserinfo', {}).then(res => {
					if (res.code == 0) {
						uni.setStorageSync('userInfo', res.data)
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.auth-wrap {
		/* #ifndef MP-ALIPAY */
		padding: 32rpx 32rpx 50rpx;
		/* #endif */
		/* #ifdef MP-ALIPAY */
		padding: 32rpx 32rpx 0;
		/* #endif */

		/deep/ button {
			line-height: 76rpx;
			font-size: 28rpx;
			height: 76rpx;
			color: #fff;
			background-color: $uni-bg-color;
			border: none;
			border-radius: 100rpx;
		}
	}

	.tip {
		padding: 50rpx 16rpx;
		font-size: 26rpx;
		color: #333;
	}
</style>