Merge branch 'feature/login' into test

CHANGELOG.md

@@ -2,6 +2,15 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [1.3.6](https://gitlab.aodianyun.com/activities/web-lottery/compare/v1.3.5...v1.3.6) (2023-04-12)
+
+
+### Features
+
+* 交互优化 ([eed16ee](https://gitlab.aodianyun.com/activities/web-lottery/commit/eed16eeec34a80771f7979c857b7cc0a7b48c117))
+* 交互优化 ([017c6b1](https://gitlab.aodianyun.com/activities/web-lottery/commit/017c6b196ff435fdcca29da9b928bff5a5f0961e))
+* 优化中奖信息 ([1cb519b](https://gitlab.aodianyun.com/activities/web-lottery/commit/1cb519b8619c8d8a679f8fc0fa148da1faf1048d))
+
 ### [1.3.5](https://gitlab.aodianyun.com/activities/web-lottery/compare/v1.3.4...v1.3.5) (2023-01-10)
 
 

components/Common/BindPhoneDialog.vue

@@ -9,7 +9,6 @@
 </template>
 
 <script>
-import { mapActions } from 'vuex'
 import Bus from '@/utils/Bus'
 export default {
   name: 'BindPhoneDialog',
@@ -30,7 +29,6 @@ export default {
     }
   },
   methods: {
-    ...mapActions({ jumpToBinding: 'users/jumpToBinding' }),
     onClose() {
       this.visible = false
       this.$toast({
@@ -43,7 +41,7 @@ export default {
         message: '正在为您转跳，请完成绑定手机操作',
         duration: 1500,
         onClose: () => {
-          this.jumpToBinding()
+          Bus.$emit('showLogin')
         }
       })
     }

components/Common/ComplaintsDeal.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script>
-import { mapGetters, mapActions } from 'vuex'
+import { mapGetters } from 'vuex'
 import { CUSTOM_SOURCE_TYPE } from '@/utils/constant'
 
 import Bus from '@/utils/Bus'
@@ -35,7 +35,6 @@ export default {
     Bus.$off('initDeal')
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin' }),
     init() {
       const { uin, id } = this.$route.query
       if (typeof complaintsDeal === 'undefined') {
@@ -81,7 +80,7 @@ export default {
                 duration: 1500,
                 onClose() {
                   if (process.client && window.self !== window.top) return
-                  self.jumpToLogin()
+                  self.showLogin()
                 }
               })
             }
@@ -127,6 +126,9 @@ export default {
           this.entry.classList.remove('sidebar-hidden-scroll')
         }, 500)
       }
+    },
+    showLogin() {
+      Bus.$emit('showLogin')
     }
   }
 }

components/Lottery/Instant/Main.vue

@@ -267,7 +267,7 @@ export default {
     Bus.$off('updateMain')
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin', updateInfo: 'lottery/updateInfo' }),
+    ...mapActions({ updateInfo: 'lottery/updateInfo' }),
     // 中奖后， 关闭窗口回调
     winCloseCallback() {
       this.isShowWin = false
@@ -305,7 +305,7 @@ export default {
           message: '请先登录',
           duration: 1500,
           onClose: () => {
-            this.jumpToLogin()
+            Bus.$emit('showLogin')
           }
         })
         return

components/Lottery/Instant/MiniMain.vue

@@ -270,7 +270,7 @@ export default {
     Bus.$off('updateMain')
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin', updateInfo: 'lottery/updateInfo' }),
+    ...mapActions({ updateInfo: 'lottery/updateInfo' }),
     // 中奖后， 关闭窗口回调
     winCloseCallback(){
       this.isShowWin = false
@@ -308,7 +308,7 @@ export default {
           message: '请先登录',
           duration: 1500,
           onClose: () => {
-            this.jumpToLogin()
+            Bus.$emit('showLogin')
           }
         })
         return

components/Lottery/Instant/Records.vue

@@ -24,8 +24,9 @@
 </template>
 
 <script>
-import { mapGetters, mapActions } from 'vuex'
+import { mapGetters } from 'vuex'
 import RecordsPupup from '@/components/Lottery/Instant/RecordsPupup'
+import Bus from '@/utils/Bus'
 
 export default {
   name: 'Records',
@@ -56,7 +57,6 @@ export default {
     this.recordsAnimation()
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin' }),
     openRecord() {
       if (this.recordsLayouts && this.recordsLayouts.classList.contains('sidebar-hidden-scroll')) {
         this.recordsLayouts.classList.remove('sidebar-hidden-scroll')
@@ -67,7 +67,7 @@ export default {
           message: '请先登录，正在为您转跳',
           duration: 1500,
           onClose: () => {
-            this.jumpToLogin()
+            Bus.$emit('showLogin')
           }
         })
       } else {

components/Lottery/Instant/type/TypeScratch.vue

@@ -141,7 +141,7 @@ export default {
     Bus.$emit('initDeal', '#093c85')
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin', updateInfo: 'lottery/updateInfo' }),
+    ...mapActions({ updateInfo: 'lottery/updateInfo' }),
     // 开始抽奖
     startLottery() {
       Bus.$emit('updateMain', { func: 'startLottery' })

components/Lottery/Instant/type/TypeScratchMini.vue

@@ -146,7 +146,7 @@ export default {
     Bus.$emit('initDeal', '#093c85')
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin', updateInfo: 'lottery/updateInfo' }),
+    ...mapActions({ updateInfo: 'lottery/updateInfo' }),
     // 开始抽奖
     startLottery() {
       Bus.$emit('updateMain', { func: 'startLottery' })

components/Lottery/Timing/Main.vue

@@ -73,7 +73,7 @@ export default {
     this.eventHubInit()
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin', updateInfo: 'lottery/updateInfo' }),
+    ...mapActions({ updateInfo: 'lottery/updateInfo' }),
     eventHubInit() {
       Bus.$on('updateMain', data => {
         for (const [key, value] of Object.entries(data)) {
@@ -113,7 +113,7 @@ export default {
           message: '请先登录',
           duration: 1500,
           onClose: () => {
-            this.jumpToLogin()
+            Bus.$emit('showLogin')
           }
         })
       } else if (this.lotteryInfo.status !== 1) {

components/Lottery/Timing/MiniMain.vue

@@ -94,7 +94,7 @@ export default {
     })
   },
   methods: {
-    ...mapActions({ jumpToLogin: 'users/jumpToLogin', updateInfo: 'lottery/updateInfo' }),
+    ...mapActions({ updateInfo: 'lottery/updateInfo' }),
     eventHubInit() {
       Bus.$on('updateMain', data => {
         for (const [key, value] of Object.entries(data)) {
@@ -134,7 +134,7 @@ export default {
           message: '请先登录',
           duration: 1500,
           onClose: () => {
-            this.jumpToLogin()
+            Bus.$emit('showLogin')
           }
         })
       } else if (this.lotteryInfo.status !== 1) {

layouts/default.vue

@@ -5,11 +5,25 @@
   </div>
 </template>
 <script>
+import Bus from '@/utils/Bus'
+import { mapActions } from 'vuex'
+import loginAction from '@/plugins/UserAction/login'
 export default {
+  data() {
+    return {
+      loginInstance: null,
+    }
+  },
   mounted() {
     document.addEventListener('visibilitychange', this.handleVisibilityChange, false)
+    this.initLoginCenter()
+    Bus.$on('showLogin', this.toggleLogin)
+  },
+  destroyed() {
+    Bus.$off('showLogin')
   },
   methods: {
+    ...mapActions({ jumpToLogin: 'users/jumpToLogin' }),
     handleVisibilityChange() {
       const { uin = 0 } = this.$route.query
       if (document.hidden) {
@@ -19,7 +33,75 @@ export default {
         this.$store.dispatch('users/getUerInfo', { uin })
       }
     },
-  }
+    // 云平台登录模块初始化
+    initLoginCenter() {
+      if (!window.LoginCenter) return
+      // eslint-disable-next-line no-undef
+      this.loginInstance = LoginCenter({
+        target: document.body,
+        props: {
+          uin: this.$route.query.uin,
+          zIndex: 100000,
+          backUrl: encodeURIComponent(window.location.href),
+          serviceAgreement: `//${process.env.OSS_DOMAIN}/staticPages/agreement_user.html`,
+          privacyAgreement: `//${process.env.OSS_DOMAIN}/staticPages/agreement_privacy.html`,
+          successCallback: ({ type, response }) => {
+            if (type === 'recover'){
+              this.$toast("密码修改成功!");
+              setTimeout(() => {
+                this.loginInstance.hide()
+              }, 500);
+              return
+            }
+            this.$toast("登录成功!");
+            if (type === 'phone'){
+              this.loginInstance.hide()
+            }
+            if (type === 'password'){
+              this.loginInstance.hide()
+            }
+            const query = this.$route.query
+            const onFinished = () => {
+              delete query.token
+              if (type === 'weixinPc' && 'code' in query){
+                delete query.code
+                this.$router.replace({
+                  path: this.$route.path,
+                  query
+                })
+              }
+              if (type === 'alipay' && 'auth_code' in query){
+                delete query.auth_code
+                this.$router.replace({
+                  path: this.$route.path,
+                  query
+                })
+              }
+            }
+            // const loginAction = require("@/plugins/UserAction/login").default;
+            loginAction.call(this, { token: response.data, onFinished })
+          },
+          failCallback: ({ response }) => {
+            this.$toast(response.errorMessage)
+          },
+        },
+        onMount: () => {
+          console.log('已挂载')
+        },
+      })
+    },
+    // 登录判断
+    toggleLogin() {
+      if (!this.loginInstance) {
+        this.$toast('登录模块加载失败，3秒后为您跳转到登录页')
+        setTimeout(() => {
+          this.jumpToLogin()
+        }, 3000)
+        return
+      }
+      this.loginInstance.show()
+    }
+  },
 }
 </script>
 <style lang="less" scoped>

nuxt.config.js

@@ -127,9 +127,18 @@ export default {
       {
         href: '//www.googletagmanager.com',
         rel: 'dns-prefetch'
-      }
+      },
+      {
+        rel: 'stylesheet',
+        href: `//${STATIC_SOURCE_DOMAIN}/custom-plugins-library/login-center/style.css`,
+      },
     ],
-    script: [{ src: `//${STATIC_SOURCE_DOMAIN}/web-component/complaintsDeal/complaintsDeal.min.js`, defer: true }]
+    script: [
+      { src: `//${STATIC_SOURCE_DOMAIN}/web-component/complaintsDeal/complaintsDeal.min.js`, defer: true },
+      {
+        src: `//${STATIC_SOURCE_DOMAIN}/custom-plugins-library/login-center/login-center.min.js`
+      },
+    ]
   },
 
   // Global CSS: https://go.nuxtjs.dev/config-css

package.json

 {
   "name": "web-lottery",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "private": true,
   "license": "UNLICENSED",
   "scripts": {
@@ -58,6 +58,7 @@
     "@nuxtjs/sentry": "^5.1.7",
     "core-js": "^3.15.1",
     "dayjs": "^1.10.6",
+    "js-cookie": "2.2.0",
     "lotteries": "^1.2.1",
     "normalize.css": "^8.0.1",
     "nuxt": "^2.15.8",

plugins/UserAction/login.js

+import Cookie from 'js-cookie'
+import action from '../pvStatisticalService'
+
+export default async function({token, onFinished} = {token: ''}) {
+  token && Cookie.set('token', token, { expires: 10 });
+  await action()
+  onFinished && onFinished()
+  return this
+}
\ No newline at end of file

yarn.lock

@@ -5627,6 +5627,11 @@ js-base64@^2.5.2:
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.6.4.tgz#f4e686c5de1ea1f867dbcad3d46d969428df98c4"
   integrity sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ==
 
+js-cookie@2.2.0:
+  version "2.2.0"
+  resolved "https://registry.npmmirror.com/js-cookie/-/js-cookie-2.2.0.tgz#1b2c279a6eece380a12168b92485265b35b1effb"
+  integrity sha512-7YAJP/LPE/MhDjHIdfIiT665HUSumCwPN2hAmO6OJZ8V3o1mtz2HeQ8BKetEjkh+3nqGxYaq1vPMViUR8kaOXw==
+
 js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"