activitys-uniapp/components/alert/pointAuth.vue

<template>
	<view>
		<u-popup :custom-style="popupStyle" class="auth-point" v-model="show" mode="center" width="80%" border-radius="18" >
			<image class="auth-bg" mode="aspectFill" src="../../static/poster/bg_shouyetc.png">
				<view class="auth-msg">
					<view v-for="(item,index) in vuex_active_setting.helpExplainList" :key="index">
						{{item.helpExplain}}
					</view>
				</view>
				<u-button  @click="toAuth" :custom-style="customStyle" shape="circle" >去授权</u-button>
			</image>
		</u-popup>
	</view>
</template>

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

		methods: {
			showAuth(url){
				this.authUrl = url;
				this.show = true;
			},
			hide(){
				this.show = false;
			},
			toAuth(){
				this.$jump('/pages/auth/auth?url='+encodeURIComponent(this.authUrl));
			}
		}
	}
</script>

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