auth.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <template>
  2. <div v-loading="loading" class="hc-body-loading" element-loading-text="授权登录中...">
  3. <div v-if="isErrorShow" class="error-page">
  4. <div class="img" :style="`background-image: url(${svg403});`" />
  5. <div class="content">
  6. <h1>403</h1>
  7. <div class="desc">抱歉,token授权登录异常,请重新进入</div>
  8. <div class="actions">
  9. <el-button type="primary" block size="large" @click="toLoginTap">手动登录</el-button>
  10. </div>
  11. </div>
  12. </div>
  13. </div>
  14. </template>
  15. <script setup>
  16. import { onMounted, ref } from 'vue'
  17. import { useAppStore } from '~src/store'
  18. import { setUserTenantInfo, useAppLogin } from '~sto/user'
  19. import { useRoute, useRouter } from 'vue-router'
  20. import { getObjVal, getObjValue, isNullES } from 'js-fast-way'
  21. import svg403 from '~src/assets/view/403.svg'
  22. import userApi from '~api/userInfo'
  23. import { getTenantID } from '~api/user'
  24. import { getTopUrl } from '~uti/tools'
  25. //初始变量
  26. const router = useRouter()
  27. const useRoutes = useRoute()
  28. const store = useAppStore()
  29. //变量
  30. const loading = ref(true)
  31. const isErrorShow = ref(false)
  32. //渲染完成
  33. onMounted(() => {
  34. //先清理下缓存
  35. store.clearStoreData()
  36. // 域名后加 /#/auth?token=xxx&tid=xxx&pid=xxx&cid=xxx
  37. const { token, tid, pid, cid } = getObjValue(useRoutes.query)
  38. if (token) {
  39. isErrorShow.value = false
  40. //缓存数据
  41. store.setTokenVal(token)
  42. store.setProjectId(pid)
  43. store.setContractId(cid)
  44. //处理授权登录
  45. queryCurrentUserData(tid)
  46. } else {
  47. loading.value = false
  48. isErrorShow.value = true
  49. }
  50. })
  51. //获取租户id
  52. const getTenantIdApi = async () => {
  53. const { data } = await getTenantID(getTopUrl())
  54. const { id } = await setUserTenantInfo(getObjVal(data))
  55. return id
  56. }
  57. //获取用户信息
  58. const queryCurrentUserData = async (tenant_id) => {
  59. await getTenantIdApi()
  60. const tenantIds = await getTenantIdApi()
  61. const tenantId = tenant_id ? tenant_id : tenantIds
  62. const { error, code, data } = await userApi.queryCurrentUserData()
  63. if (!error && code === 200) {
  64. await useAppLoginApi({
  65. tenantId: tenantId,
  66. username: data.account,
  67. password: data.plaintextPassword,
  68. type: 'account',
  69. })
  70. } else {
  71. window.$message?.error('授权信息异常')
  72. isErrorShow.value = true
  73. loading.value = false
  74. }
  75. }
  76. //请求授权登录
  77. const useAppLoginApi = async (form) => {
  78. loading.value = true
  79. const { error, msg } = await useAppLogin(form)
  80. if (error && !isNullES(msg)) {
  81. window.$message?.error('授权登录失败')
  82. isErrorShow.value = true
  83. loading.value = false
  84. return false
  85. }
  86. //授权登录成功
  87. setTimeout(() => {
  88. loading.value = false
  89. isErrorShow.value = false
  90. window?.$message?.success('授权登录成功')
  91. router.push({
  92. name: 'datav',
  93. })
  94. }, 1500)
  95. }
  96. //跳转登陆
  97. const toLoginTap = () => {
  98. router.push({ path: '/login' })
  99. }
  100. </script>
  101. <style lang="scss" scoped>
  102. @import "../../styles/error/style.scss";
  103. .hc-body-loading {
  104. position: relative;
  105. height: 100%;
  106. width: 100%;
  107. }
  108. </style>