logincode.vue 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195
  1. <template>
  2. <view class="container login">
  3. <view class="login-main">
  4. <image class="logo" src="https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/logo.png" mode=""></image>
  5. </view>
  6. <view class="login-input">
  7. <input type="number"
  8. v-model="invitationCode"
  9. maxlength="6"
  10. class="input"
  11. placeholder="请输入邀请码"
  12. />
  13. </view>
  14. <view class="login-row" @click.stop="this.$api.navigateTo('/pages/login/register-select')"><text>免费注册</text></view>
  15. <view class="login-btn" @click.stop="goLogin">登录</view>
  16. <view class="login-btn-last" @click.stop="this.$api.navigateTo('/pages/login/login')">账号登录</view>
  17. </view>
  18. </template>
  19. <script>
  20. import authorize from '@/common/config/authorize.js'
  21. import wxLogin from "@/common/config/wxLogin.js"
  22. import {mapState,mapMutations } from 'vuex';
  23. export default{
  24. data() {
  25. return{
  26. invitationCode:'', //获取用户登录的邀请码
  27. unionId:'',
  28. }
  29. },
  30. onLoad(option) {
  31. },
  32. computed: {
  33. ...mapState(['isWxAuthorize','isLoginType','isLoginProductId','isLoginOrderId'])
  34. },
  35. methods:{
  36. ...mapMutations(['login']),
  37. goLogin() {
  38. const userInfo = uni.getStorageSync('wechatUserInfo')
  39. if( this.invitationCode == ''){
  40. this.$util.msg('请输入邀请码',2000)
  41. return
  42. }
  43. this.isUserInfo = false
  44. this.UserService.InvitationCodeLogin({
  45. invitationCode:this.invitationCode,
  46. nickName:userInfo.nickName,
  47. avatarUrl:userInfo.avatarUrl,
  48. unionId:uni.getStorageSync('unionId')
  49. })
  50. .then(response =>{
  51. wxLogin.wxLoginAuthorize()
  52. if(response.data.userIdentity === 3){
  53. setTimeout(()=>{
  54. this.$api.navigateTo('/supplier/pages/index/index')
  55. },1500)
  56. }else{
  57. setTimeout(()=>{
  58. switch(this.isLoginType){
  59. case 9:
  60. this.$api.navigateTo(`/h5/pages/activity/activity_mid`)
  61. break;
  62. case 8:
  63. this.$api.navigateTo(`/pages/goods/product?id=${this.isLoginProductId}`)
  64. break;
  65. case 7:
  66. this.$api.navigateTo(`/pages/user/order/order-details?type=share&orderID=${this.isLoginOrderId}`)
  67. break;
  68. default:
  69. this.$api.switchTabTo('/pages/tabBar/user/user')
  70. }
  71. },1500)
  72. }
  73. })
  74. .catch(error =>{
  75. this.$util.msg(error.msg,2000)
  76. this.isUserInfo = false
  77. })
  78. }
  79. }
  80. }
  81. </script>
  82. <style lang="scss">
  83. .login{
  84. width: 100%;
  85. height: auto;
  86. .model-warp.none{
  87. display: none;
  88. }
  89. .model-warp.show{
  90. display: block;
  91. }
  92. .login-main{
  93. width: 100%;
  94. display: flex;
  95. flex-direction: column;
  96. align-items: center;
  97. height: 189rpx;
  98. padding:60rpx 0 40rpx 0;
  99. margin-bottom: 70rpx;
  100. .logo{
  101. width:467rpx;
  102. height: 189rpx;
  103. display: block;
  104. }
  105. }
  106. .login-input{
  107. width: 600rpx;
  108. height: 88rpx;
  109. padding: 24rpx 0;
  110. margin: 0 auto;
  111. margin-bottom: 30rpx;
  112. background: #FFFFFF;
  113. position: relative;
  114. box-sizing: border-box;
  115. border-bottom: 1px solid #E1E1E1;
  116. .input{
  117. width: 100%;
  118. height: 100%;
  119. background: #FFFFFF;
  120. font-size: $font-size-28;
  121. line-height: 88rpx;
  122. color: #333333;
  123. }
  124. }
  125. .login-row{
  126. padding: 0 75rpx;
  127. font-size: $font-size-28;
  128. line-height: 40rpx;
  129. color: #E15616;
  130. margin-bottom: 48rpx;
  131. text-align: right;
  132. }
  133. .login-btn{
  134. width: 600rpx;
  135. height: 88rpx;
  136. border-radius: 44rpx;
  137. font-size: $font-size-28;
  138. line-height: 88rpx;
  139. color: #FFFFFF;
  140. margin: 0 auto;
  141. text-align: center;
  142. background: $btn-confirm;
  143. }
  144. .login-btn-last{
  145. width: 600rpx;
  146. height: 86rpx;
  147. border-radius: 44rpx;
  148. font-size: $font-size-28;
  149. line-height: 88rpx;
  150. color: $color-system;
  151. margin: 0 auto;
  152. text-align: center;
  153. border: 1px solid $color-system;
  154. margin-top: 20rpx;
  155. }
  156. .model-authorization{
  157. width: 100%;
  158. height: 100%;
  159. position: fixed;
  160. top: 0;
  161. left: 0;
  162. z-index: 999;
  163. .authorization{
  164. width: 518rpx;
  165. height: 320rpx;
  166. position: absolute;
  167. background: rgba(255,255,255,.7);
  168. left: 0;
  169. right: 0;
  170. bottom: 0;
  171. top: 0;
  172. margin: auto;
  173. .to-btn{
  174. position: absolute;
  175. top: 0;
  176. left: 0;
  177. right: 0;
  178. bottom: 0;
  179. margin: auto;
  180. width: 70%;
  181. height: 88rpx;
  182. font-size: $font-size-28;
  183. line-height: 88rpx;
  184. color: #FFFFFF;
  185. text-align: center;
  186. border-radius: 44rpx;
  187. }
  188. }
  189. }
  190. }
  191. </style>