120 lines
3.5 KiB
Vue
120 lines
3.5 KiB
Vue
<script lang="ts" setup>
|
|
// import { useRouter } from 'vue-router'
|
|
// import { getUUid, uuidLogin } from '@api/login'
|
|
// import { useStore } from '@store/index'
|
|
// import { IosRefresh } from '@vicons/ionicons5';
|
|
import { RotateCcw } from 'lucide-vue-next'
|
|
import { onBeforeUnmount, onMounted, ref } from 'vue'
|
|
// 定义事件
|
|
const emit = defineEmits<{
|
|
(event: 'login-success', data: any): void
|
|
}>()
|
|
|
|
interface UserToken {
|
|
token: string
|
|
}
|
|
interface ApiResponse<T> {
|
|
code: number
|
|
msg: string
|
|
token: string
|
|
}
|
|
const qrUrl = ref<string>('')
|
|
const qrSize = ref(174)
|
|
// const router = useRouter()
|
|
// const store = useStore()
|
|
let pollingTimer: ReturnType<typeof setInterval> | undefined
|
|
const bindTimeout = ref(false)
|
|
|
|
async function onGetUUid() {
|
|
bindTimeout.value = false
|
|
try {
|
|
// /wx/uuid/get
|
|
const res = await request.get('/wx/uuid/get')
|
|
if (res.code === 200) {
|
|
const appid = 'wx82d4c3c96f0ffa5b'
|
|
const { uuid } = res
|
|
const redirect_uri = `http://rtec8z.natappfree.cc/wx/uuid/bind/openid?uuid=${uuid}`
|
|
const codeUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${encodeURIComponent(
|
|
redirect_uri,
|
|
)}&response_type=code&scope=snsapi_userinfo&state=123456#wechat_redirect`
|
|
qrUrl.value = codeUrl
|
|
let counter = 1
|
|
pollingTimer && clearTimeout(pollingTimer)
|
|
pollingTimer = setInterval(async () => {
|
|
await request.get('/wx/uuid/login', { uuid }).then(async (res) => {
|
|
counter++
|
|
if (counter === 59) {
|
|
clearTimeout(pollingTimer)
|
|
bindTimeout.value = true
|
|
}
|
|
if (res.status === 1) {
|
|
clearTimeout(pollingTimer)
|
|
const userStore = useUserStore()
|
|
userStore.setToken(res.token)
|
|
const res1 = await request.get<ApiResponse<UserToken>>('/getInfo', {
|
|
token: res.token,
|
|
})
|
|
userStore.setUserInfo(res1.user)
|
|
window.location.href = '/'
|
|
// const parent = getCurrentInstance().parent
|
|
// parent.exposed.onCloseLogin()
|
|
// store.userInfo = res.data
|
|
// router.push('./home')
|
|
|
|
// store.dispatch("uuidLogin", res)
|
|
// that.$store.dispatch("uuidLogin", res)
|
|
// setTimeout(() => {
|
|
// that.$router.push({
|
|
// path: that.redirect || "/"
|
|
// }).catch(() => {});
|
|
// }, 1500)
|
|
}
|
|
}).catch(() => {
|
|
clearTimeout(pollingTimer)
|
|
})
|
|
}, 1000)
|
|
}
|
|
}
|
|
catch (error) {
|
|
console.log(error)
|
|
}
|
|
}
|
|
|
|
// 处理登录成功
|
|
// const handleLoginSuccess = (data: any) => {
|
|
// // 发出登录成功事件
|
|
// emit('login-success', data)
|
|
// }
|
|
|
|
// 组件挂载时生成二维码
|
|
onMounted(() => {
|
|
onGetUUid()
|
|
})
|
|
onBeforeUnmount(() => {
|
|
clearInterval(pollingTimer)
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="w-[280px] px-5 text-center relative">
|
|
<div v-if="bindTimeout" class="absolute left-[41px] h-full w-[230px] top-0 z-[9999] flex items-center justify-center flex-col cursor-pointer text-white bg-black/40" @click="onGetUUid">
|
|
刷新二维码
|
|
<RotateCcw />
|
|
</div>
|
|
<div v-if="qrUrl" class="relative w-full">
|
|
<!-- <component
|
|
is="RotateCcw"
|
|
class="h-[18px] w-[18px] color-white"
|
|
/> -->
|
|
<n-qr-code style="padding: 0;" class="p-0" :value="qrUrl" :size="qrSize" />
|
|
</div>
|
|
<div v-else class="p-5 text-gray-400">
|
|
加载中...
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|