登录流程判定

src/api/axios.js

 import axios from 'axios'
 import qs from 'qs'
-// axios.defaults.baseURL = 'http://192.168.1.193:8300' // 本地荣
+axios.defaults.baseURL = 'http://192.168.1.193:8300' // 本地荣
 // axios.defaults.baseURL = 'http://192.168.1.174:8300' // 本地钱
-axios.defaults.baseURL = 'http://139.196.213.18:8300' // beta环境
+// axios.defaults.baseURL = 'http://139.196.213.18:8300' // beta环境
 let loadingInstance // 创建Loading 的实例
 // axios.defaults.headers.post['Content-Type'] = 'application/json; charset=utf-8'
 // axios.defaults.crossDomain = true

src/api/config.js

@@ -4,33 +4,37 @@ import qs from 'qs'
 import { MINGPAY_CONSTANT } from './constant'
 const config = {
   ddconfig: () => {
-    let senddate = qs.stringify({
-      version: MINGPAY_CONSTANT.MINGPAY_CONSTANT_VERSION,
-      url: MINGPAY_CONSTANT.MINGPAY_CONSTANT_URL,
-      agentId: MINGPAY_CONSTANT.MINGPAY_CONSTANT_AGENTID
-    })
-    return axios.post(`http://139.196.213.18:8300/v1/auth/getJsAuthenticationParameter?${senddate}`).then((res) => {
-      console.log(res)
-      let agentId = res.data.data.agentId
-      let timeStamp = res.data.data.timeStamp
-      let nonceStr = res.data.data.nonceStr
-      let signature = res.data.data.signature
-      sessionStorage.setItem('corpId', res.data.data.corpId)
-      dd.config({
-        agentId: agentId, // 必填，微应用ID
-        corpId: sessionStorage.getItem('corpId'), // 必填，企业ID
-        timeStamp: timeStamp, // 必填，生成签名的时间戳
-        nonceStr: nonceStr, // 必填，生成签名的随机串
-        signature: signature, // 必填，签名
-        type: 0, // 0/1选填。0表示微应用的jsapi,1表示服务窗的jsapi；不填默认为0。该参数从dingtalk.js的0.8.3版本开始支持
-        jsApiList: [
-          'biz.contact.choose',
-          'biz.contact.complexPicker'
-        ] // 必填，需要使用的jsapi列表，注意：不要带dd。
+    return new Promise((resolve, reject) => {
+      let senddate = qs.stringify({
+        version: MINGPAY_CONSTANT.MINGPAY_CONSTANT_VERSION,
+        url: MINGPAY_CONSTANT.MINGPAY_CONSTANT_URL,
+        agentId: MINGPAY_CONSTANT.MINGPAY_CONSTANT_AGENTID
       })
-      dd.error(function (error) {
-        console.log('dd error: ' + JSON.stringify(error))
-        return 'no'
+      return axios.post(`http://139.196.213.18:8300/v1/auth/getJsAuthenticationParameter?${senddate}`).then((res) => {
+        let agentId = res.data.data.agentId
+        let timeStamp = res.data.data.timeStamp
+        let nonceStr = res.data.data.nonceStr
+        let signature = res.data.data.signature
+        sessionStorage.setItem('corpId', res.data.data.corpId)
+        dd.config({
+          agentId: agentId, // 必填，微应用ID
+          corpId: sessionStorage.getItem('corpId'), // 必填，企业ID
+          timeStamp: timeStamp, // 必填，生成签名的时间戳
+          nonceStr: nonceStr, // 必填，生成签名的随机串
+          signature: signature, // 必填，签名
+          type: 0, // 0/1选填。0表示微应用的jsapi,1表示服务窗的jsapi；不填默认为0。该参数从dingtalk.js的0.8.3版本开始支持
+          jsApiList: [
+            'biz.contact.choose',
+            'biz.contact.complexPicker'
+          ] // 必填，需要使用的jsapi列表，注意：不要带dd。
+        })
+        dd.error(function (error) {
+          console.log('dd error: ' + JSON.stringify(error))
+          resolve('no')
+        })
+        setTimeout(() => {
+          resolve()
+        }, 2000)
       })
     })
   },
@@ -43,25 +47,32 @@ const config = {
   },
   ddpermission: () => {
     // dd.ready参数为回调函数，在环境准备就绪时触发，jsapi的调用需要保证在该回调函数触发后调用，否则无效。
-    dd.runtime.permission.requestAuthCode({
-      corpId: sessionStorage.getItem('corpId'), // 企业id
-      onSuccess: function (info) {
-        let senddate = qs.stringify({
-          version: 'v1',
-          code: info.code,
-          corpId: 'ding9a93ca550f036ffe35c2f4657eb6378f'
-        })
-        console.log(senddate)
-        axios.post(`http://139.196.213.18:8300/v1/auth/token?${senddate}`).then((res) => {
-          sessionStorage.setItem('token', res.data.data.accessToken.access_token)
-          sessionStorage.setItem('userId', res.data.data.oapiUser.userid)
-          sessionStorage.setItem('avatar', res.data.data.oapiUser.avatar)
-          sessionStorage.setItem('name', res.data.data.oapiUser.name)
-          console.log(res)
-        }).catch((err) => {
-          console.log(err)
-        })
-      } })
+    return new Promise((resolve, reject) => {
+      dd.runtime.permission.requestAuthCode({
+        corpId: sessionStorage.getItem('corpId'), // 企业id
+        onSuccess: function (info) {
+          let senddate = qs.stringify({
+            version: 'v1',
+            code: info.code,
+            corpId: 'ding9a93ca550f036ffe35c2f4657eb6378f'
+          })
+          return axios.post(`http://139.196.213.18:8300/v1/auth/token?${senddate}`).then((res) => {
+            console.log(res)
+            if (res.data.resultCode === '0') {
+              sessionStorage.setItem('token', res.data.data.accessToken.access_token)
+              sessionStorage.setItem('userId', res.data.data.oapiUser.userid)
+              sessionStorage.setItem('avatar', res.data.data.oapiUser.avatar)
+              sessionStorage.setItem('name', res.data.data.oapiUser.name)
+              resolve('ok')
+            } else {
+              resolve('noPermission')
+            }
+          }).catch((err) => {
+            console.log(err)
+          })
+        }
+      })
+    })
   },
   ddchooseOne: () => {
     return new Promise((resolve, reject) => {

src/api/constant.js

 const MINGPAY_CONSTANT = {
-  // MINGPAY_CONSTANT_URL: 'http://mingpay-web-beta.mingwork.com:8888/',
-  MINGPAY_CONSTANT_URL: 'http://ming.vaiwan.com/',
+  MINGPAY_CONSTANT_URL: 'http://mingpay-web-beta.mingwork.com:8888/',
+  // MINGPAY_CONSTANT_URL: 'http://ming.vaiwan.com/',
   MINGPAY_CONSTANT_AGENTID: 270198704,
   MINGPAY_CONSTANT_VERSION: 'v1'
 }

src/components/pages/ConfigError.vue

 <template>
     <div class="ConfigError">
-      <a-layout style="padding: 24px 0; background: #fff">
-        <h1>获取权限失败</h1>
-      </a-layout>
+      <div><img src="../../assets/getTokenError.png"/></div>
+      <div>
+        <div style="margin-bottom: 16px">抱歉，获取用户身份失败</div>
+        <div><a-button type="primary" @click="Re_acquisition()">重试获取</a-button></div>
+      </div>
     </div>
 </template>
 
 <script>
 export default {
-  name: 'configError',
+  name: 'noPermission',
   components: {},
   data () {
     return {}
   },
   watch: {},
   computed: {},
-  methods: {},
+  methods: {
+    Re_acquisition () {
+      this.$router.push({ name: 'dashboard' })
+    }
+  },
   mounted () {}
 }
 </script>
+
+<style scoped>
+.ConfigError{
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ConfigError>div:nth-of-type(2){
+  font-size: 20px;
+}
+.ConfigError image {
+  width: 408px;
+  height: 308px;
+}
+.ConfigError>div:nth-of-type(1){
+  margin-right: 88px;
+}
+</style>

src/components/pages/Dashboard.vue

 <template>
     <div class="Dashboard">
-      <a-layout style="padding: 24px 0; background: #fff">
-        <h1>默认入123123口页面</h1>
+      <a-layout class="content" style="padding: 24px 0; background: #fff;">
+        <div><img src="../../assets/Welcome.png"/></div>
+        <div>欢迎您进入mingwork管理后台</div>
       </a-layout>
     </div>
 </template>
@@ -19,3 +20,23 @@ export default {
   mounted () {}
 }
 </script>
+
+<style scoped>
+.content{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: inherit;
+  height: 500px;
+}
+.content>div:nth-of-type(2){
+  font-size: 20px;
+}
+.content image {
+  width: 395px;
+  height: 260px;
+}
+.content>div:nth-of-type(1){
+  margin-right: 88px;
+}
+</style>

src/components/pages/NoPermission.vue

+<template>
+    <div class="noPermission">
+      <div><img src="../../assets/noPrremission.png"/></div>
+      <div>抱歉，您无访问权限</div>
+    </div>
+</template>
+
+<script>
+export default {
+  name: 'noPermission',
+  components: {},
+  data () {
+    return {}
+  },
+  watch: {},
+  computed: {},
+  methods: {},
+  mounted () {}
+}
+</script>
+
+<style scoped>
+.noPermission{
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.noPermission>div:nth-of-type(2){
+  font-size: 20px;
+}
+.noPermission image {
+  width: 402px;
+  height: 284px;
+}
+.noPermission>div:nth-of-type(1){
+  margin-right: 88px;
+}
+</style>

src/main.js

@@ -34,22 +34,32 @@ Vue.prototype.$message = message
 
 router.beforeEach(function (to, from, next) {
   // 项目初始化进行鉴权
-  if (sessionStorage.getItem('userId')) {
+  if (to.name === 'noPermission' || to.name === 'configError') {
     next()
   } else {
-    config.ddconfig().then((res) => {
-      console.log(res)
-      if (res === 'no') {
-        console.log('no', res)
-        next({ name: 'configError' })
-      } else {
-        next()
-      }
-    }).then(() => {
-      config.ddready('ddpermission')
-    }).catch((err) => {
-      console.log(err, '登录失败')
-    })
+    if (sessionStorage.getItem('userId')) {
+      next()
+    } else {
+      config.ddconfig().then((res) => {
+        if (res === 'no') {
+          console.log('no', res)
+          next({ name: 'configError' })
+        }
+      }).then(() => {
+        config.ddready('ddpermission').then((res) => {
+          console.log('ddpermission', res)
+          if (res === 'noPermission') {
+            next({ name: 'noPermission' })
+          } else {
+            next()
+          }
+        }).catch((err) => {
+          console.log('ddpermission', err)
+        })
+      }).catch((err) => {
+        console.log(err, '登录失败')
+      })
+    }
   }
 })
 

src/router.js

@@ -24,11 +24,6 @@ export default new Router({
           component: resolve => require(['./components/pages/Dashboard.vue'], resolve)
         },
         {
-          path: '/configError',
-          name: 'configError',
-          component: resolve => require(['./components/pages/ConfigError.vue'], resolve)
-        },
-        {
           path: '/paymentManagementHome',
           name: 'paymentManagementHome',
           component: resolve => require(['./components/pages/PaymentManagement/PaymentManagementHome.vue'], resolve),
@@ -81,6 +76,11 @@ export default new Router({
       path: '/noPermission',
       name: 'noPermission',
       component: resolve => require(['./components/pages/NoPermission.vue'], resolve)
+    },
+    {
+      path: '/configError',
+      name: 'configError',
+      component: resolve => require(['./components/pages/ConfigError.vue'], resolve)
     }
   ]
 })