login.vue 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <template>
  2. <view class="regbox">
  3. <view class="rggtop flex0"></view>
  4. <image :src="headimg" class="headimg flex0"></image>
  5. <view class="flex1">
  6. <button type="primary" class="rbtn mb20 mt50" open-type="getUserInfo" @getuserinfo="getuserinfo">
  7. <text class="btn-txt">微信一键登录</text>
  8. </button>
  9. <view class="lread" @click="checkflag=!checkflag">
  10. <view class="lreadl">
  11. <image :src="checkimg" v-if="checkflag"></image>
  12. <image :src="ncheckimg" v-else></image>
  13. </view>
  14. <view class="tit">阅读后自行选择是否同意<text @click.stop="handlePrivacy">用户协议</text>及<text @click.stop="handlePrivacy">隐私政策</text></view>
  15. </view>
  16. </view>
  17. <!-- <phone-btn :type="typeflag" @getPhoneNumber='getPhoneNumber' @getClose="getClose"></phone-btn> -->
  18. </view>
  19. </template>
  20. <script>
  21. import phoneBtn from "@/components/toptab/phonebtn.vue"
  22. export default {
  23. components:{
  24. phoneBtn
  25. },
  26. data(){
  27. return{
  28. headimg:require('@/static/images/logo.png')
  29. }
  30. },
  31. methods:{
  32. async getuserinfo(e) {
  33. // if(!this.checkflag){
  34. // this.$toast("请同意用户协议")
  35. // return
  36. // }
  37. const {iv,encryptedData} = e.detail
  38. const {nickName, avatarUrl, ...userInfo} = e.detail.userInfo
  39. // console.log(e.detail)
  40. try{
  41. uni.login({
  42. provider: 'weixin',
  43. success: (res) => {
  44. // 获取用户信息
  45. if(res.code){
  46. this.avatarUrl = avatarUrl
  47. this.nickName = nickName
  48. this.code = res.code
  49. this.userInfo =e.detail.userInfo
  50. uni.setStorageSync('userInfo', e.detail.userInfo)
  51. uni.setStorageSync('lcheckflag',true)
  52. this.typeflag=true;
  53. }
  54. }
  55. })
  56. } catch(e){
  57. //TODO handle the exception
  58. }
  59. },
  60. },
  61. onLoad: function() {
  62. },
  63. }
  64. </script>
  65. <style lang="scss" scoped>
  66. .regbox{
  67. min-height: 100vh;background-color: #f6f2e9;display: flex;flex-direction: column;
  68. .rggtop{width: 100%;height: 314rpx;background: linear-gradient(180deg, #EACBA2 0%, rgba(236,207,167,0) 100%);}
  69. .rbtn{
  70. width: 616rpx;height: 100rpx;border-radius: 50rpx;background-color: #D4A354 ;
  71. .btn-txt{font-size: 30rpx;color: #FFFFFF;}
  72. }
  73. }
  74. .headimg{width: 294rpx;height: 100rpx;margin:0 auto 36rpx;}
  75. .lread{
  76. display: flex;align-items: flex-start;justify-content: center;
  77. .lreadl{padding-top: 4rpx;
  78. image{width: 28rpx;height: 28rpx;margin-right: 14rpx;}
  79. }
  80. .tit{font-size: 26rpx;font-weight: 500;color: #666666;line-height: 40rpx;
  81. text{color: #4775EA;text-decoration: underline;padding: 0 6rpx;}
  82. }
  83. }
  84. // app
  85. </style>