auth.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <template>
  2. <div v-loading="loading" class="hc-body-loading" element-loading-text="授权登录中...">
  3. <div v-if="isErrorShow" class="error-page">
  4. <div :style="`background-image: url(${svg403});`" class="img" />
  5. <div class="content">
  6. <h1>403</h1>
  7. <div class="desc">抱歉,token授权登录异常,请重新进入</div>
  8. <div class="actions">
  9. <el-button block size="large" type="primary" @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 { getTenantID, loginByToken } from '~api/user'
  19. import { setUserAppInfo, setUserTenantInfo } from '~sto/user'
  20. import { useRoute, useRouter } from 'vue-router'
  21. import { getObjVal, getObjValue, isNullES } from 'js-fast-way'
  22. import svg403 from '~src/assets/view/403.svg'
  23. import { getTopUrl } from '~uti/tools'
  24. //初始变量
  25. const router = useRouter()
  26. const useRoutes = useRoute()
  27. const store = useAppStore()
  28. //先清理下缓存
  29. store.clearStoreData()
  30. //变量
  31. const loading = ref(true)
  32. const isErrorShow = ref(false)
  33. //渲染完成
  34. onMounted(() => {
  35. // http://档案的域名/#/auth-token?token=xxx&tid=xxx&pid=xxx&cid=xxx
  36. const { token, tid, pid, cid, bg } = getObjValue(useRoutes.query)
  37. if (!isNullES(token)) {
  38. isErrorShow.value = false
  39. //缓存数据
  40. store.setTokenVal(token)
  41. store.setProjectId(pid)
  42. store.setContractId(cid)
  43. store.setIsDatavBg(bg !== 'no')
  44. //处理授权登录
  45. setLoginByTokenData(token, 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 setLoginByTokenData = async (token, tenant_id) => {
  59. const tenantIds = await getTenantIdApi()
  60. const tenantId = tenant_id ? tenant_id : tenantIds
  61. await loginByTokenApi({ token, tenantId })
  62. }
  63. //请求授权登录
  64. const loginByTokenApi = async (form) => {
  65. await setUserTenantInfo()
  66. const { error, code, data } = await loginByToken(form)
  67. const res = getObjVal(data)
  68. if (!error && code === 200 && res) {
  69. await setUserAppInfo(res)
  70. setTimeout(() => {
  71. loading.value = false
  72. isErrorShow.value = false
  73. window?.$message?.success('授权登录成功')
  74. router.push({
  75. name: 'datav',
  76. })
  77. }, 1500)
  78. } else {
  79. window.$message?.error('授权登录失败')
  80. isErrorShow.value = true
  81. loading.value = false
  82. store.setIsDatavBg(true)
  83. }
  84. }
  85. //跳转登陆
  86. const toLoginTap = () => {
  87. router.push({ path: '/login' })
  88. }
  89. </script>
  90. <style lang="scss" scoped>
  91. @import "../../styles/error/style.scss";
  92. .hc-body-loading {
  93. position: relative;
  94. height: 100%;
  95. width: 100%;
  96. }
  97. </style>