Blame view
src/views/login/components/SocialSignin.vue
2.12 KB
d7d9c38c2
![]() |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 |
<template> <div class="social-signup-container"> <div class="sign-btn" @click="wechatHandleClick('wechat')"> <span class="wx-svg-container"><svg-icon icon-class="wechat" class="icon" /></span> WeChat </div> <div class="sign-btn" @click="tencentHandleClick('tencent')"> <span class="qq-svg-container"><svg-icon icon-class="qq" class="icon" /></span> QQ </div> </div> </template> <script> // import openWindow from '@/utils/open-window' export default { name: 'SocialSignin', methods: { wechatHandleClick(thirdpart) { alert('ok') // this.$store.commit('SET_AUTH_TYPE', thirdpart) // const appid = 'xxxxx' // const redirect_uri = encodeURIComponent('xxx/redirect?redirect=' + window.location.origin + '/auth-redirect') // const url = 'https://open.weixin.qq.com/connect/qrconnect?appid=' + appid + '&redirect_uri=' + redirect_uri + '&response_type=code&scope=snsapi_login#wechat_redirect' // openWindow(url, thirdpart, 540, 540) }, tencentHandleClick(thirdpart) { alert('ok') // this.$store.commit('SET_AUTH_TYPE', thirdpart) // const client_id = 'xxxxx' // const redirect_uri = encodeURIComponent('xxx/redirect?redirect=' + window.location.origin + '/auth-redirect') // const url = 'https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=' + client_id + '&redirect_uri=' + redirect_uri // openWindow(url, thirdpart, 540, 540) } } } </script> <style lang="scss" scoped> .social-signup-container { margin: 20px 0; .sign-btn { display: inline-block; cursor: pointer; } .icon { color: #fff; font-size: 24px; margin-top: 8px; } .wx-svg-container, .qq-svg-container { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; padding-top: 1px; border-radius: 4px; margin-bottom: 20px; margin-right: 5px; } .wx-svg-container { background-color: #24da70; } .qq-svg-container { background-color: #6BA2D6; margin-left: 50px; } } </style> |