login.vue 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. <template>
  2. <view class="regbox" v-if="loginflag">
  3. <image :src="lbg" class="navbg"></image>
  4. <image :src="fbg" class="fbg"></image>
  5. <view class="wymain">
  6. <image :src="headimg" class="headimg"></image>
  7. <!-- 微信登录 -->
  8. <!-- #ifdef MP-WEIXIN -->
  9. <button type="primary" class="rbtn" open-type="getUserInfo" @getuserinfo="getuserinfo">
  10. <image :src="vxtab" class="vxtab"></image>
  11. <text class="btn-txt">微信一键登录</text>
  12. </button>
  13. <!-- #endif -->
  14. <button type="primary" class=" rbtn" @click="getlogin">
  15. <image :src="zhtab" class="zhtab"></image>
  16. <text class="btn-txt">账号密码登录</text>
  17. </button>
  18. <view class="line"></view>
  19. <!-- <view class="rbtn btna" @click="getregister">还没账号?去注册</view> -->
  20. </view>
  21. <phone-btn :type="typeflag" @getPhoneNumber='getPhoneNumber' @getClose="getClose"></phone-btn>
  22. </view>
  23. </template>
  24. <script>
  25. import * as base64 from "base-64"
  26. // import {getUserProfile} from "@/api/system/user.js"
  27. import {
  28. getToken
  29. } from '@/utils/auth'
  30. import phoneBtn from "@/components/toptab/phonebtn.vue"
  31. export default {
  32. components: {
  33. phoneBtn
  34. },
  35. data() {
  36. return {
  37. lbg: require('@/static/images/mine/lbg.png'),
  38. fbg: require('@/static/images/mine/fbg.png'),
  39. vxtab: require('@/static/images/mine/vxtab.png'),
  40. zhtab: require('@/static/images/mine/zhtab.png'),
  41. fbg: require('@/static/images/mine/fbg.png'),
  42. headimg: require('@/static/logo.png'),
  43. typeflag: false,
  44. loginflag: false,
  45. loginForm: {
  46. username: "",
  47. code: "",
  48. password: '',
  49. },
  50. }
  51. },
  52. methods: {
  53. handlePrivacy() {
  54. this.$tab.navigateTo(`/pages/agreement`)
  55. },
  56. getlogin(){
  57. this.$tab.navigateTo(`/pages/tlogin`)
  58. },
  59. getregister(){
  60. this.$tab.navigateTo(`/pages/register`)
  61. },
  62. async getuserinfo(e) {
  63. // if(!this.checkflag){
  64. // this.$toast("请同意用户协议")
  65. // return
  66. // }
  67. // 判断是不是有学校
  68. const {
  69. iv,
  70. encryptedData
  71. } = e.detail
  72. const {
  73. nickName,
  74. avatarUrl,
  75. ...userInfo
  76. } = e.detail.userInfo
  77. // console.log(e.detail)
  78. try {
  79. uni.login({
  80. provider: 'weixin',
  81. success: (res) => {
  82. // 获取用户信息
  83. if (res.code) {
  84. this.avatarUrl = avatarUrl
  85. this.nickName = nickName
  86. this.code = res.code
  87. this.userInfo = e.detail.userInfo
  88. uni.setStorageSync('userInfo', e.detail.userInfo)
  89. uni.setStorageSync('lcheckflag', true)
  90. this.typeflag = true;
  91. }
  92. }
  93. })
  94. } catch (e) {
  95. //TODO handle the exception
  96. }
  97. },
  98. getClose() {
  99. this.typeflag = false
  100. },
  101. getPhoneNumber(data) {
  102. var that = this;
  103. var params = data
  104. that.$store.dispatch('Login', params).then(() => {
  105. that.$modal.closeLoading()
  106. that.$toast('登录成功')
  107. that.typeflag = false;
  108. that.loginSuccess(data)
  109. }).catch(() => {
  110. // if (this.captchaEnabled) {
  111. // this.getCode()
  112. // }
  113. })
  114. },
  115. // 登录成功后,处理函数
  116. loginSuccess(result) {
  117. // 设置用户信息
  118. var that = this;
  119. this.$store.dispatch('GetInfo').then(res => {
  120. this.$tab.reLaunch('/pages/index/index')
  121. })
  122. },
  123. },
  124. onLoad: function() {
  125. if (getToken()) {
  126. this.$tab.reLaunch('/pages/index/index')
  127. // 判断有什么角色
  128. } else {
  129. this.loginflag = true;
  130. }
  131. },
  132. }
  133. </script>
  134. <style lang="scss" scoped>
  135. .navbg{width: 100%;height: 100vh;}
  136. .fbg{width: 100%;height: 750rpx;position: absolute;bottom: 0;left: 0;}
  137. .wymain{z-index: 2;position: relative;padding: 320rpx 60rpx;}
  138. .headimg{width: 110rpx;height: 110rpx;margin:0 auto 128rpx;display: block;}
  139. .rbtn {height: 84rpx;margin-bottom:60rpx;font-weight: bold;font-size: 28rpx;color: #FFFFFF;display: flex;align-items: center;justify-content: center;background: #0156FE;
  140. border-radius: 10rpx;
  141. .vxtab{width: 38rpx;height: 32rpx;margin-right: 18rpx;}
  142. .zhtab{width: 30rpx;height: 34rpx;margin-right: 22rpx;}
  143. &.btna{background: #D9E6FF;color: #0156FE;}
  144. }
  145. .line{width: 60rpx;height: 6rpx;background: #CDCDCD;margin: 0 auto 60rpx;}
  146. </style>