paymentCode/pages/index/index.vue

<template>
  <view class="login-main">
    <view class="login-main-content">
      <image class="img" src="../../static/images/logo.png" mode=""></image>
    </view>
    <view class="login-contont">
      <view class="login-contont-info">
        <h5>请确认以下信息并授权登录</h5>
        <view class="text">获取您的信息（你的头像、信息等）</view>
      </view>
      <view class="login-contont-button">
        <button class="btn" @click="login">授权登录</button>
      </view>
      <view class="radio">
        <u-radio-group v-model="radiovalue">
          <u-radio value="1" size="30" name="1" iconSize="25">
            <text class="radioText"
              >授权同意《用户服务协议》 和《隐私协议》</text
            ></u-radio
          >
        </u-radio-group>
      </view>
    </view>
  </view>
</template>

<script>
import { requestConfig } from "@/app.config.js";
export default {
  data() {
    return {
      radiovalue: 0,
    };
  },
  onLoad() {},
  methods: {
    login() {
		console.log(this.radiovalue);
		if(this.radiovalue==1){
			// ne.sxdirectpurchase.com
			let url = `https://open.weixin.qq.com/connect/oauth2/authorize?
								appid=${requestConfig.appid}
								&redirect_uri=${requestConfig.redirect_uri}
								&response_type=code
								&scope=snsapi_userinfo
								&state=STATE
								#wechat_redirect`;
			window.location = url;
		}else{
				uni.$u.toast('请先同意用户授权！');
		}

    },
  },
};
</script>
<style scoped lang="scss">
.u-radio-group--row {
  justify-content: center;
}

.radioText {
  font-weight: 500;
  font-size: 24rpx;
  color: #999999;
  line-height: 34rpx;
  text-align: left;
  font-style: normal;
}

.login-main {
  background: url("../../static/images/back.png") no-repeat;
  background-size: 100% 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 100vh;
}

.login-contont-button {
  .btn {
    margin-top: 20px;
    width: 90%;
    height: 90rpx;
    background: linear-gradient(275deg, #01cf6c 0%, #07e278 100%);
    border-radius: 44rpx;
    color: #fff;
  }
}

.login-contont {
  width: 100%;
  height: 50%;

  .login-contont-info {
    text-align: center;

    .text {
      margin-top: 10px;
      font-weight: 500;
      font-size: 28rpx;
      color: #999999;
      line-height: 40rpx;
      font-style: normal;
    }
  }
}

.radio {
  text-align: center;
  margin-top: 10px;
}

.login-main-content {
  text-align: center;
  padding-top: 100px;
  width: 100%;
  height: 50%;

  .img {
    width: 100px;
    height: 130px;
  }
}
</style>