activitys-uniapp/components/alert/pointAuth.vue

<template>
	<u-popup :custom-style="popupStyle" class="auth-point" v-model="show" mode="center" width="80%" border-radius="18" >
		<image class="auth-bg" mode="widthFix" src="/static/test/auth.jpg">
			<view class="auth-msg">
			</view>
			<u-button  open-type="getPhoneNumber" @getphonenumber="getphonenumber" :custom-style="customStyle" shape="circle" >去授权</u-button>
		</image>
	</u-popup>
</template>

<script>
	export default {
		name:"pointAuth",
		data() {
			return {
				show: true,
				popupStyle: {
					'u-mode-center-box': 'red'
				},
				customStyle: {
					color: 'white',
					background: "#E72226",
					width: '400rpx',
					margin: '30rpx auto'
				}
			};
		},

		methods: {
			showAuth(){
				this.show = true;
			},
			hide(){
				this.show = false;
			},
			getphonenumber(e){
				this.$emit('auth',e)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.auth-bg{
		width: 100%;
	}
	.auth-msg{
		padding: 0rpx 40rpx 20rpx 40rpx;
		display: flex;
		align-items: center;
		justify-content: left;
	}
</style>