App.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <template>
  2. <router-view></router-view>
  3. </template>
  4. <script setup lang="ts">
  5. import { onMounted, ref, provide, inject } from 'vue'
  6. import { useStore } from '@/store/index'
  7. import { ElNotification } from 'element-plus'
  8. const { setAsyncRoutesMark } = useStore()
  9. window.addEventListener('beforeunload', () => beforeunloadFn())
  10. const beforeunloadFn = (() => {
  11. setAsyncRoutesMark(false)
  12. })
  13. provide<GlobalPopup>('globalPopup', {
  14. showSuccess: (msg: string, time: number, icon: string) => { notificationTiop }, //!SECTION 成功
  15. showError: (msg: string, time: number, icon: string) => { notificationTiop }, //!SECTION 失败
  16. showWarning: (msg: string, time: number, icon: string) => { notificationTiop }, //!SECTION 警告
  17. showInfo: (msg: string, time: number, icon: string) => { notificationTiop }, //!SECTION 文本
  18. })
  19. const notificationTiop = (msg: string, time: number, icon: string, type: string) => {
  20. let obj: any = {}
  21. obj.title = '提示'
  22. obj.message = msg
  23. time ? obj.duration = time : obj.duration = 2000
  24. icon ? obj.iconClass = icon : obj.iconClass = ''
  25. type ? obj.type = type : obj.type = 'success'
  26. ElNotification(obj)
  27. }
  28. </script>
  29. <style>
  30. html,
  31. body,
  32. #app,
  33. .layouts {
  34. width: 100%;
  35. height: 100%;
  36. overflow: hidden;
  37. }
  38. </style>