fullScreen.ts 880 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. import { ElLoading } from 'element-plus'
  2. /* 全局请求 loading */
  3. let loadingInstance: ReturnType<typeof ElLoading.service>
  4. /**
  5. * @description 开启 Loading
  6. * */
  7. const startLoading = () => {
  8. loadingInstance = ElLoading.service({
  9. fullscreen: true,
  10. lock: true,
  11. text: 'Loading',
  12. background: 'rgba(0, 0, 0, 0.7)'
  13. })
  14. }
  15. /**
  16. * @description 结束 Loading
  17. * */
  18. const endLoading = () => {
  19. loadingInstance.close()
  20. }
  21. /**
  22. * @description 显示全屏加载
  23. * */
  24. let needLoadingRequestCount = 0
  25. export const showFullScreenLoading = () => {
  26. if (needLoadingRequestCount === 0) {
  27. startLoading()
  28. }
  29. needLoadingRequestCount++
  30. }
  31. /**
  32. * @description 隐藏全屏加载
  33. * */
  34. export const tryHideFullScreenLoading = () => {
  35. if (needLoadingRequestCount <= 0) return
  36. needLoadingRequestCount--
  37. if (needLoadingRequestCount === 0) {
  38. endLoading()
  39. }
  40. }