'第一次提交'

zhangxiaoxu123

2023-04-03 3c38aafd3b6db169fe2039affbbcc7bf36176d3a

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<template>
  <view class="container">
    <view class="auth-header">
      <view class="auth-logo">
        <u-avatar size="100" icon="github-circle-fill" fontSize="100"></u-avatar>
      </view>
    </view>
 
    <view class="auth-box">
      <view class="btn-group">
        <!-- #ifdef MP-WEIXIN -->
        <u-button class="auth-btn" open-type="getPhoneNumber" type="primary" @getphonenumber="getPhoneNumber">一键登录</u-button>
        <navigator class="reg-login-link" url="/pages/login/mobile" open-type="navigate" hover-class="none">手机号登录/注册 &gt;</navigator>
        <!-- #endif -->
 
        <!-- #ifndef MP-WEIXIN -->
        <u-button type="primary" text="手机号登录/注册" @click="handleJump"></u-button>
        <!-- #endif -->
      </view>
      <view class="auth-footer">
        <view>登录即表示同意<text class="lk-text">《用户协议》</text> 和 <text class="lk-text">《隐私政策》</text></view>
      </view>
    </view>
  </view>
</template>
 
<script>
export default {
  data() {
    return {}
  },
  onLoad() {},
  onReady() {},
  methods: {
    getPhoneNumber(e) {
      let phoneCode = e.detail.code
      if (!e.detail.code) {
        uni.showModal({
          title: '授权失败',
          content: '您已拒绝获取绑定手机号登录授权，可以使用其他手机号验证登录',
          cancelText: '知道了',
          confirmText: '验证登录',
          confirmColor: '#3C9CFFFF',
          success: res => {
            if (res.confirm) {
              uni.$u.route('/pages/login/mobile')
            } else if (res.cancel) {
              //console.log('用户点击取消')
            }
          }
        })
      } else {
        uni.login({
          provider: 'weixin',
          success: res => {
            this.$store.dispatch('Login', { type: 2, data: { phoneCode: phoneCode, loginCode: res.code } }).then(res => {
              uni.$u.toast('登录成功')
              setTimeout(() => {
                uni.switchTab({
                  url: '/pages/user/user'
                })
              }, 300)
            })
          }
        })
      }
    },
    handleJump() {
      uni.$u.route('/pages/login/mobile')
    }
  }
}
</script>
 
<style lang="scss" scoped>
.container {
  height: calc(100vh - 70px);
  @include flex-space-between(column);
}
 
.auth-header {
  flex: 2;
  @include flex-center;
  .auth-logo {
    @include flex-center(column);
  }
}
 
.auth-box {
  @include flex-center(column);
 
  .btn-group {
    width: 600rpx;
    margin-bottom: 200rpx;
    .auth-btn {
      height: 90rpx;
      font-size: 32rpx;
    }
  }
 
  .reg-login-link {
    margin-top: 32rpx;
    text-align: center;
    color: #636363;
    font-size: 30rpx;
  }
 
  .auth-footer {
    font-size: 26rpx;
    color: #939393;
    .lk-text {
      color: $u-primary;
      text-decoration: $u-primary;
    }
  }
}
</style>