feat: 增加路由监控and添加登陆页面

增加了一个路由监控，类似于vue-router中的路由卫士，利用监测路径的变化来是否执行监控用户是否授权登陆，如果没登陆就弹出授权界面。

app.js

@@ -1,5 +1,12 @@
-import { getAllSubs } from './util/getSubs'
-import { getToken} from './api/token'
+import {
+  getAllSubs
+} from './util/getSubs'
+import {
+  getToken
+} from './api/token'
+let globalData = {
+  url: null
+}
 App({
   onLaunch: function () {
     // 获取subs列表并放在缓存中
@@ -31,8 +38,35 @@ App({
         console.log('error')
       }
     })
+    this.proxy()
   },
-  globalData: {
-    userInfo: null
+  // 类似vue-router中的路由卫士
+  // 利用监测url的变化也就是路由的变化，来监测是否有用户的授权，没授权的就返回登陆页面
+  proxy () {
+    Object.defineProperty(globalData, 'url', {
+      get: function (val) {
+        return val
+      },
+      set: function (newValue) {
+        wx.getSetting({
+          success: (res) => {
+            if (res.authSetting['scope.userInfo']) {
+              wx.navigateTo({
+                url: newValue,
+                success: globalData['success']
+              })
+            } else {
+              wx.navigateTo({
+                url: '/pages/login/login',
+              })
+            }
+          }
+        })
+      }
+    })
+  },
+  navigateTo(arg) {
+    globalData.url = arg.url
+    globalData.success = arg.success
   }
 })

app.json

@@ -3,7 +3,8 @@
     "pages/main/main",
     "pages/my/my",
     "pages/drift/drift",
-    "pages/lucky/lucky"
+    "pages/lucky/lucky",
+    "pages/login/login"
   ],
   "subpackages": [
     {

components/card/card.js

@@ -15,8 +15,8 @@ Component({
     }
   },
   methods: {
-    onGotUserInfo(event) {
-      this.triggerEvent('gotUserInfo',event)
+    onGotUserInfo(){
+      this.triggerEvent('gotUserInfo')
     }
   }
 })

components/turntable/turntable.wxml

@@ -40,7 +40,7 @@
 				rotate = 40
 				break
 		}
-		return 'transform: translateY(100rpx) translateX(' + distance + 'rpx) rotate(-45deg);'
+		return 'transform: translateY(100rpx) translateX(' + distance + 'rpx) rotate(-'+ rotate +'deg);'
 	}
 	module.exports = {
 		rotate: rotate,

pages/askForHelp/askForHelp.js

@@ -7,6 +7,7 @@ import {
 import Toast from '../../miniprogram_npm/@vant/weapp/toast/toast'
 import{ normallArray} from '../../util/normal'
 const normalGood = normallArray(createGoods)
+const app = getApp()
 Page({
   data: {
     value: '',
@@ -73,10 +74,10 @@ Page({
   // 选择
   onSelectGood(e) {
     let gid = e.currentTarget.dataset.gid
-    wx.navigateTo({
+    app.navigateTo({
       url: '/pages/help-detail/help-detail',
       events: {},
-      success: function (res) {
+      success: (res) => {
         // 通过eventChannel向被打开页面传送数据
         res.eventChannel.emit('selectGood', gid)
       }

pages/drift/drift.js

@@ -18,6 +18,20 @@ Page({
   onReady: function () {
     this._pending(1, 'all')
   },
+  onShow: function () {
+    // 判断是否有用户授权
+    wx.getSetting({
+      success: (res) => {
+        if (res.authSetting['scope.userInfo']) {
+          return
+        } else {
+          wx.navigateTo({
+            url: '/pages/login/login',
+          })
+        }
+      }
+    })
+  },
   // 标签页的选择
   onSelect(event) {
     let label = event.detail.name

pages/hot/hot.js

@@ -2,6 +2,7 @@ import {
   getAllUser,
   ranking
 } from '../../api/user'
+const app = getApp()
 Page({
   data: {
     page: 1,
@@ -35,13 +36,13 @@ Page({
     // 当前选择的ID
     const id = event.currentTarget.dataset.index 
     if (id===this.data.ranking){
-      wx.navigateTo({
+      app.navigateTo({
         url: '/pages/myGoods/myGoods',
       })
     }else{
-      wx.navigateTo({
+      app.navigateTo({
         url: '/pages/use/use',
-        success: function (res) {
+        success: (res) => {
           res.eventChannel.emit('sendUse', data)
         }
       })

pages/login/login.js

@@ -0,0 +1,42 @@
+import {
+  getToken
+} from '../../api/token'
+import {
+  _getUserInfo
+} from '../../util/getUser'
+import {
+  saveUserByNickname,
+  saveUserByImage
+} from '../../api/user'
+let data = {
+  nickname: null,
+  logo: null
+}
+Page({
+  onGotUserInfo() {
+    wx.login({
+      complete: (res) => {
+        _getUserInfo().then(res => {
+           data.nickname = res.userInfo.nickName
+           data.logo = res.userInfo.avatarUrl
+        }).then(() => {
+          saveUserByImage(data.logo)
+        }).then(() => {
+          saveUserByNickname(data.nickname)
+        }).then(()=>{
+          wx.navigateBack()
+        })
+      },
+      success: (res) =>{
+        if (res.code) {
+          getToken(res.code).then((res) => {
+            wx.setStorage({
+              data: res.token,
+              key: 'token',
+            })
+          })
+        }
+      }
+    })
+  }
+})

pages/login/login.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "van-image": "../../miniprogram_npm/@vant/weapp/image",
+    "van-divider": "../../miniprogram_npm/@vant/weapp/divider"
+  }
+}

pages/login/login.wxml

@@ -0,0 +1,24 @@
+<view class="login bg">
+  <view class="logo">
+    <image src="{{tool.img()}}" />
+  </view>
+  <view class="title">
+    <text>七享网</text>
+  </view>
+  <view class="context">
+    <van-divider borderColor="#D3D3D3"></van-divider>
+    <text>登陆后应用获得以下权限</text>
+    <text>1、获得你的公开信息（昵称、头像等）</text>
+    <text>2、可以完全享用该项目</text>
+    <text>3、放心我绝不会盗用您的微信信息另做它用的，亲~</text>
+  </view>
+    <button class="but" plain="true" open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="onGotUserInfo">确认登陆</button>
+</view>
+<wxs module="tool">
+  var img = function () {
+    return '../../image/logo/logo.png'
+  }
+  module.exports = {
+    img: img
+  }
+</wxs>

pages/login/login.wxss

@@ -0,0 +1,49 @@
+.login{
+  position: fixed;
+  top: 0px;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.logo{
+  width: 100%;
+  text-align: center;
+  margin-top: 100rpx;
+  margin-bottom: 20px;
+}
+.logo image {
+  width: 100px;
+  height: 100px;
+  background-color: #fff;
+  border-radius: 50%;
+}
+.login .title{
+  font-size: 50rpx;
+  font-weight: 700;
+  color: #1c92d2;
+}
+.context{
+  width: 70%;
+}
+.context text{
+  display: block;
+  color: #D3D3D3;
+  font-size: 24rpx;
+}
+.context text:nth-last-child(4){
+  font-size: 36rpx;
+  font-weight: 700;
+  color: black;
+  margin-bottom: 12px;
+}
+.but{
+  width: 70%;
+  height: 46px;
+  border: none !important;
+  background-color: #1c92d2 !important;
+  color: white !important;
+  margin-top: 80px;
+}

pages/lucky/lucky.js

@@ -63,7 +63,7 @@ Page({
     }).then(() => {
       this.selectComponent('#myTurnTable').onClear()
     }).then(() => {
-      // sentMyLucky(prize)
+      sentMyLucky(prize)
     }).then(() => {
       this._getMyLucky()
     })