index.vue 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. <template>
  2. <!-- index.wxml -->
  3. <view class="wrap">
  4. <view class="wrap_nr">
  5. <image class="logo_tu" src="/static/statics/img/un_login.png"></image>
  6. <view class="desc">您还没有登录</view>
  7. <view class="desc">请登录后继续操作呦~</view>
  8. <button class="custom_btn" @tap="getUserProfile">登录查看</button>
  9. </view>
  10. </view>
  11. </template>
  12. <script>
  13. // index.js
  14. let myPro = require('../../../utils/wxRequest.js');
  15. let util = require('../../../utils/util.js');
  16. export default {
  17. data() {
  18. return {};
  19. },
  20. onLoad: function (options) {
  21. // Do some initialize when page load.
  22. let that = this;
  23. },
  24. onShow: function () {
  25. // Do something when page show.
  26. let that = this; // 拿code换openid
  27. uni.login({
  28. success: function (res) {
  29. console.log('获取wxcode', res);
  30. let params = {
  31. code: res.code
  32. };
  33. myPro
  34. .wxRequest('user/mini-auth', 'POST', params)
  35. .then((res) => {
  36. let result = res.result; // 有token 是老用户
  37. if (result.token) {
  38. console.log('token', result.token);
  39. getApp().globalData.token = result.token; // getApp().globalData.openid = result.user.openid;
  40. uni.setStorage({
  41. key: 'token',
  42. data: result.token
  43. });
  44. getApp().globalData.is_member = result.user.is_member; // 会员 0否 1是
  45. getApp().globalData.userInfo = {
  46. nickname: result.user.nickname,
  47. thumb: result.user.thumb,
  48. phone: result.user.phone
  49. };
  50. if (result.user.store) {
  51. getApp().globalData.role = 1; // 有店铺,即为门店
  52. } // 回跳到首页
  53. uni.reLaunch({
  54. url: '/pages/index/index'
  55. }); // console.log('用户',getApp().globalData.userInfo)
  56. } else {
  57. // 新用户
  58. getApp().globalData.openid = result.openid;
  59. getApp().globalData.session_key = result.session_key;
  60. }
  61. })
  62. .catch((err) => {
  63. console.log('报错信息', err);
  64. uni.showToast({
  65. title: err,
  66. icon: 'none'
  67. });
  68. });
  69. },
  70. fail: function (res) {
  71. uni.showToast({
  72. title: '微信未授权成功,请在设置中允许使用用户信息',
  73. icon: 'none'
  74. });
  75. }
  76. });
  77. },
  78. onReady: function () {
  79. // Do something when page ready.
  80. },
  81. onHide: function () {
  82. // Do something when page hide.
  83. },
  84. onUnload: function () {
  85. // Do something when page close.
  86. },
  87. onPullDownRefresh: function () {
  88. // Do something when pull down.
  89. },
  90. onReachBottom: function () {
  91. // Do something when page reach bottom.
  92. },
  93. onPageScroll: function () {
  94. // Do something when page scroll
  95. },
  96. onResize: function () {
  97. // Do something when page resize
  98. },
  99. methods: {
  100. // 授权获取用户信息
  101. getUserProfile(event) {
  102. if (uni.getUserProfile) {
  103. uni.getUserProfile({
  104. desc: '获取您的昵称、头像、及性别',
  105. // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
  106. success: (res) => {
  107. // 存一下用户信息 昵称 头像 性别
  108. console.log('已授权', res);
  109. getApp().globalData.userInfo = {
  110. nickname: res.userInfo.nickName,
  111. thumb: res.userInfo.avatarUrl,
  112. sex: res.userInfo.gender
  113. }; // console.log('用户信息',getApp().globalData.userInfo)
  114. // 跳到下一页
  115. uni.navigateTo({
  116. url: '/pages/login/wechat/index'
  117. });
  118. }
  119. });
  120. } else {
  121. // 如果希望用户在最新版本的客户端上体验您的小程序,可以这样子提示
  122. uni.showModal({
  123. title: '提示',
  124. content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
  125. });
  126. }
  127. }
  128. }
  129. };
  130. </script>
  131. <style>
  132. /**index.wxss**/
  133. .wrap_nr {
  134. position: absolute;
  135. top: 50%;
  136. left: 50%;
  137. transform: translate(-50%, -50%);
  138. }
  139. .logo_tu {
  140. width: 240rpx;
  141. height: 347rpx;
  142. display: block;
  143. margin: 0 auto;
  144. /* background: #D54C43; */
  145. }
  146. .desc {
  147. padding-top: 30rpx;
  148. text-align: center;
  149. font-size: 30rpx;
  150. color: #000000;
  151. }
  152. .custom_btn {
  153. width: 405rpx;
  154. height: 98rpx;
  155. padding: 0;
  156. margin: 0;
  157. margin-top: 50rpx;
  158. font-weight: normal;
  159. background: #295c56;
  160. border-radius: 10rpx;
  161. font-size: 28rpx;
  162. color: #ffffff;
  163. display: flex;
  164. align-items: center;
  165. justify-content: center;
  166. }
  167. </style>