zk-driver-wechat-applet/components/authorize/authorize.vue

<template>
	<view>
		<view class='popup-box' >
		   <view class='title'>申请授权</view>
		   <view class='tip'>获得你的公开信息（昵称、头像等）,以便为您提供更好的服务</view>
		   <view class='bottom flex'>
		      <view class='item' @click="close">随便逛逛</view>
			  <button class='item grant' type="primary" @click="login">去授权</button>
		   </view>
		</view>
		<view class='mask'></view>
	</view>
</template>

<script>
	export default {
		name:"authorize",
		data() {
			return {
				
			};
		},
		methods:{
			login(){
				uni.navigateTo({
					url: "/pages/public/login"
				})
			},
		}
	}
</script>

<style>
	.popup-box{
	  width:500rpx;
	  background-color:#fff;
	  position:fixed;
	  top:50%;
	  left:50%;
	  margin-left:-250rpx;
	  transform:translateY(-50%);
	  z-index:311220;
	}
	.popup-box .title{
	  font-size:28rpx;
	  color:#000;
	  text-align:center;
	  margin-top: 30rpx;
	}
	.popup-box .tip{
	  font-size:22rpx;
	  color:#555;
	  padding:0 24rpx;
	  margin-top:25rpx;
	}
	.popup-box .bottom .item{
	  width:50%;
	  height:80rpx;
	  background-color:#eeeeee;
	  text-align:center;
	  line-height:80rpx;
	  font-size:24rpx;
	  color:#666;
	  margin-top:54rpx;
	}
	.popup-box .bottom .item.on{
	  width: 100%;
	}
	.flex{
	  display:flex;
	}
	.popup-box .bottom .item.grant{
	  font-size:28rpx;
	  color:#fff;
	  font-weight:bold;
	  background-color:#58be6b;
	  border-radius:0;
	  padding:0;
	}
	.mask{
	  position:fixed;
	  top:0;
	  right:0;
	  left:0;
	  bottom:0;
	  background-color:rgba(0,0,0,0.3);
	  z-index:311110;
	}
</style>