1、对接谷歌验证器

src/layout/index.vue

@@ -13,16 +13,22 @@
         <settings />
       </right-panel>
     </div>
+
+    <!-- 绑定谷歌验证码弹窗 -->
+    <set-google-secret :visible.sync="showSetGooleSecret" :otpAuthUrl="needGoolAuthData.otpAuthUrl"
+      :secret="needGoolAuthData.secret" @success="handleBindSuccess"></set-google-secret>
   </div>
 </template>
 
 <script>
 import RightPanel from '@/components/RightPanel'
+import { needGoolAuth, setGoogleAuth } from '@/api/admin/sys-user'
 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
+import SetGoogleSecret from './SetGoogleSecret'
 import ResizeMixin from './mixin/ResizeHandler'
 import { mapState } from 'vuex'
 import variables from '@/styles/variables.scss'
-import dingSound from '@/assets/tiktok/sisfus.mp3'
+// import dingSound from '@/assets/tiktok/sisfus.mp3'
 import checkPermisAction from '@/utils/permisaction'
 
 export default {
@@ -33,11 +39,14 @@ export default {
     RightPanel,
     Settings,
     Sidebar,
-    TagsView
+    TagsView,
+    SetGoogleSecret
   },
   data() {
     return {
       voice: null,
+      showSetGooleSecret: false,
+      needGoolAuthData: {}
     }
   },
   mixins: [ResizeMixin],
@@ -63,35 +72,52 @@ export default {
   },
 
   created() {
-    // if (!this.roles.includes('admin')) {
-    //   this.currentRole = 'editorDashboard'
-    // }
+    this.getNeedGoolAuth()
 
     if (checkPermisAction(['admin:mmAlarmLog:notice'])) {
-      this.$confirm('是否接收警告?', '提示', {
-        distinguishCancelAndClose: true,
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.voice = new Audio(dingSound)
+      // this.$confirm('是否接收警告?', '提示', {
+      //   distinguishCancelAndClose: true,
+      //   confirmButtonText: '确定',
+      //   cancelButtonText: '取消',
+      //   type: 'warning'
+      // }).then(() => {
+      //   this.voice = new Audio(dingSound)
 
-        this.initWebSocket()
-      }).catch(() => {
-        console.log('取消')
-      });
+      this.initWebSocket()
+      // }).catch(() => {
+      //   console.log('取消')
+      // });
     }
   },
   destroyed() {
     console.log('断开websocket连接')
     this.websock.close() // 离开路由之后断开websocket连接
-    // unWsLogout(this.id, this.group).then(response => {
-    //   console.log(response.data)
-    // }
-    // )
   },
   methods: {
     checkPermisAction,
+    getNeedGoolAuth() {
+      const loading = this.$loading({
+        lock: true,
+        text: 'Loading',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      });
+
+      needGoolAuth()
+        .then(response => {
+          console.log("needGoogleAuth", response)
+          if (response.code === 200) {
+            if (response.data.needGooglAuth) {
+              this.needGoolAuthData.otpAuthUrl = response.data.otpAuthUrl
+              this.needGoolAuthData.secret = response.data.secret
+              this.showSetGooleSecret = true
+            }
+          }
+        })
+        .finally(() => {
+          loading.close()
+        })
+    },
     initWebSocket() { // 初始化weosocket
       const wsuri = `ws://${process.env.VUE_APP_WEBSOCKET_URL}/ws?token=${this.$store.state.user.token}`
 
@@ -110,7 +136,6 @@ export default {
       this.initWebSocket()
     },
     websocketonmessage(e) { // 数据接收
-      console.log("ws：", e.data)
       try {
         let data = JSON.parse(e.data)
 
@@ -122,7 +147,7 @@ export default {
           duration: 0
         });
 
-        this.playVoice("钱包告警")
+        // this.playVoice("钱包告警")
       } catch (err) {
         console.log("接收websocket数据失败:", err)
       }
@@ -146,6 +171,9 @@ export default {
     },
     handleClickOutside() {
       this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
+    },
+    handleBindSuccess() {
+      this.showSetGooleSecret = false
     }
   }
 }