index.tsx 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. import React, { useCallback, useEffect, useState } from 'react'
  2. import styles from './index.module.scss'
  3. import { Button } from 'antd'
  4. import { API_login, isTokenFlagAPI } from '@/store/action/A1List'
  5. import { MessageFu } from '@/utils/message'
  6. import { setTokenInfo } from '@/utils/storage'
  7. import history from '@/utils/history'
  8. import { isLocal } from '@/utils/http'
  9. function Login() {
  10. const loginFu = useCallback(() => {
  11. window.location.href = `https://dev.itfinspread.com:8003/#/sso?redirectUrl=${backUrl}`
  12. }, [])
  13. const [code, setCode] = useState('')
  14. const getUserInfo = useCallback(async (code: string) => {
  15. setCode(code)
  16. try {
  17. const res = await API_login({ code, redirectUrl: backUrl })
  18. if (res.code === 0) {
  19. if (res.data.token) {
  20. MessageFu.success('登录成功')
  21. // 用户信息存到本地
  22. setTokenInfo(res.data)
  23. window.location.href = `${isLocal ? '' : '/backstage'}/#/list`
  24. } else {
  25. MessageFu.warning('token为空')
  26. setCode('')
  27. }
  28. } else setCode('')
  29. } catch (error) {
  30. setCode('')
  31. }
  32. }, [])
  33. const checkTokenFu = useCallback(async () => {
  34. // 检查token有效直接跳list页面
  35. const res = await isTokenFlagAPI()
  36. if (res.code === 0) {
  37. if (res.data) {
  38. history.replace('/list')
  39. }
  40. }
  41. }, [])
  42. useEffect(() => {
  43. // 创建 URLSearchParams 对象解析查询字符串
  44. const searchParams = new URLSearchParams(window.location.search)
  45. const code = searchParams.get('code') // 获取 code 参数
  46. if (code) {
  47. getUserInfo(code)
  48. } else {
  49. checkTokenFu()
  50. }
  51. }, [checkTokenFu, getUserInfo])
  52. return (
  53. <div className={styles.Login}>
  54. <div className='LoginBtn'>
  55. <Button type='primary' size='large' onClick={loginFu} hidden={!!code}>
  56. 孪生数字底座平台授权登录
  57. </Button>
  58. </div>
  59. {/* 获取用户信息加载中 */}
  60. <div className='codeLoding' hidden={!code}>
  61. 授权中,请稍后...
  62. </div>
  63. </div>
  64. )
  65. }
  66. const MemoLogin = React.memo(Login)
  67. export default MemoLogin