auth.vue 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. <template>
  2. <view>
  3. <!-- 使用Uniapp的loading组件 -->
  4. <view v-if="loading" class="hc-body-loading">
  5. <text>授权登录中...</text>
  6. </view>
  7. <!-- 错误页面 -->
  8. <view v-if="isErrorShow" class="error-page">
  9. <view :style="`background-image: url(${svg403});`" class="img"></view>
  10. <view class="content">
  11. <text class="title">403</text>
  12. <text class="desc">抱歉,token授权登录异常,请重新进入</text>
  13. <view class="actions">
  14. <!-- 使用Uniapp的button组件 -->
  15. <button class="uni-btn" type="primary" size="large" @click="toLoginTap">手动登录</button>
  16. </view>
  17. </view>
  18. </view>
  19. </view>
  20. </template>
  21. <script setup>
  22. import { onMounted, ref } from 'vue'
  23. import {useAppStore} from "@/store";
  24. import userApi from '@/httpApi/modules/user'
  25. import { errorToast, getTopUrl } from '@/utils/tools'
  26. import { useRoute, useRouter } from 'vue-router'
  27. // import svg403 from '~src/assets/view/403.svg'
  28. import { getObjVal, getObjValue, isNullES } from 'js-fast-way'
  29. import { setUserAppInfo, setUserTenantInfo } from '@/store/user'
  30. import { onLaunch, onShow } from '@dcloudio/uni-app';
  31. import {setToken, setRefreshToken} from '@/httpApi/util/auth';
  32. import {successToast} from "@/utils/tools";
  33. // 监听应用启动事件
  34. onLaunch((options) => {
  35. console.log(options,'options');
  36. });
  37. //初始变量
  38. const router = useRouter()
  39. const useRoutes = useRoute()
  40. const store = useAppStore()
  41. //先清理下缓存
  42. store.clearStoreData()
  43. const toUrl=ref("/pages/index/index")
  44. //渲染完成
  45. onMounted(() => {
  46. loading.value = true
  47. // http://质检的域名/#/auth-token?token=xxx&tid=xxx&pid=xxx&cid=xxx&layout=no&url=xxx
  48. console.log(useRoutes.query,'useRoutes.query');
  49. const { token, tid, pid, cid, layout, url } = getObjValue(useRoutes.query)
  50. if (!isNullES(token)) {
  51. isErrorShow.value = false
  52. toUrl.value = url ?? '/pages/index/index'
  53. //缓存数据
  54. setToken(token)
  55. store.setProjectId(pid)
  56. store.setContractId(cid)
  57. //处理授权登录
  58. setLoginByTokenData(token, tid)
  59. } else {
  60. loading.value = false
  61. isErrorShow.value = true
  62. }
  63. })
  64. //获取租户id
  65. const getTenantIdApi = async () => {
  66. const { data } = await userApi.getTenantID(getTopUrl())
  67. const { id } = await setUserTenantInfo(getObjVal(data))
  68. return id
  69. }
  70. //设置租户信息
  71. const setLoginByTokenData = async (token, tenant_id) => {
  72. const tenantIds = await getTenantIdApi()
  73. const tenantId = tenant_id ? tenant_id : tenantIds
  74. await loginByTokenApi({ token, tenantId })
  75. }
  76. //请求授权登录
  77. const loginByTokenApi = async (form) => {
  78. console.log(form,'form');
  79. const { error, code, data } = await userApi.loginByToken(form)
  80. const res = getObjVal(data)
  81. if (!error && code === 200 && res) {
  82. await setUserAppInfo(res)
  83. successToast('授权成功');
  84. setTimeout(() => {
  85. loading.value = false
  86. isErrorShow.value = false
  87. uni.navigateTo({url:toUrl.value });
  88. }, 1500)
  89. } else {
  90. errorToast('授权登录失败')
  91. isErrorShow.value = true
  92. loading.value = false
  93. }
  94. }
  95. //跳转登陆
  96. // const toLoginTap = () => {
  97. // router.push({ path: '/login-main' })
  98. // }
  99. // 定义响应式变量
  100. const loading = ref(false); // 控制加载状态
  101. const isErrorShow = ref(false); // 控制错误页面显示
  102. const svg403 = ref('/static/403.svg'); // 403错误图片路径
  103. // 跳转到登录页的方法
  104. const toLoginTap = () => {
  105. uni.navigateTo({
  106. url: '/pages/login/login',
  107. });
  108. };
  109. </script>
  110. <style scoped>
  111. .hc-body-loading {
  112. display: flex;
  113. justify-content: center;
  114. align-items: center;
  115. height: 100vh;
  116. font-size: 16px;
  117. color: #999;
  118. }
  119. .error-page {
  120. display: flex;
  121. flex-direction: column;
  122. align-items: center;
  123. justify-content: center;
  124. height: 100vh;
  125. text-align: center;
  126. }
  127. .img {
  128. width: 200px;
  129. height: 200px;
  130. background-size: cover;
  131. background-position: center;
  132. }
  133. .content {
  134. margin-top: 20px;
  135. }
  136. .title {
  137. font-size: 32px;
  138. font-weight: bold;
  139. color: #333;
  140. }
  141. .desc {
  142. font-size: 16px;
  143. color: #666;
  144. margin-top: 10px;
  145. }
  146. .actions {
  147. margin-top: 20px;
  148. }
  149. .uni-btn {
  150. width: 100%;
  151. }
  152. </style>