service.mjs 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. import { nextTick } from 'vue';
  2. import { isString } from '@vue/shared';
  3. import { isClient } from '@vueuse/core';
  4. import '../../../utils/index.mjs';
  5. import '../../../hooks/index.mjs';
  6. import { createLoadingComponent } from './loading.mjs';
  7. import { useZIndex } from '../../../hooks/use-z-index/index.mjs';
  8. import { getStyle, addClass, removeClass } from '../../../utils/dom/style.mjs';
  9. import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
  10. let fullscreenInstance = void 0;
  11. const Loading = function(options = {}) {
  12. if (!isClient)
  13. return void 0;
  14. const resolved = resolveOptions(options);
  15. if (resolved.fullscreen && fullscreenInstance) {
  16. return fullscreenInstance;
  17. }
  18. const instance = createLoadingComponent({
  19. ...resolved,
  20. closed: () => {
  21. var _a;
  22. (_a = resolved.closed) == null ? void 0 : _a.call(resolved);
  23. if (resolved.fullscreen)
  24. fullscreenInstance = void 0;
  25. }
  26. });
  27. addStyle(resolved, resolved.parent, instance);
  28. addClassList(resolved, resolved.parent, instance);
  29. resolved.parent.vLoadingAddClassList = () => addClassList(resolved, resolved.parent, instance);
  30. let loadingNumber = resolved.parent.getAttribute("loading-number");
  31. if (!loadingNumber) {
  32. loadingNumber = "1";
  33. } else {
  34. loadingNumber = `${Number.parseInt(loadingNumber) + 1}`;
  35. }
  36. resolved.parent.setAttribute("loading-number", loadingNumber);
  37. resolved.parent.appendChild(instance.$el);
  38. nextTick(() => instance.visible.value = resolved.visible);
  39. if (resolved.fullscreen) {
  40. fullscreenInstance = instance;
  41. }
  42. return instance;
  43. };
  44. const resolveOptions = (options) => {
  45. var _a, _b, _c, _d;
  46. let target;
  47. if (isString(options.target)) {
  48. target = (_a = document.querySelector(options.target)) != null ? _a : document.body;
  49. } else {
  50. target = options.target || document.body;
  51. }
  52. return {
  53. parent: target === document.body || options.body ? document.body : target,
  54. background: options.background || "",
  55. svg: options.svg || "",
  56. svgViewBox: options.svgViewBox || "",
  57. spinner: options.spinner || false,
  58. text: options.text || "",
  59. fullscreen: target === document.body && ((_b = options.fullscreen) != null ? _b : true),
  60. lock: (_c = options.lock) != null ? _c : false,
  61. customClass: options.customClass || "",
  62. visible: (_d = options.visible) != null ? _d : true,
  63. target
  64. };
  65. };
  66. const addStyle = async (options, parent, instance) => {
  67. const { nextZIndex } = useZIndex();
  68. const maskStyle = {};
  69. if (options.fullscreen) {
  70. instance.originalPosition.value = getStyle(document.body, "position");
  71. instance.originalOverflow.value = getStyle(document.body, "overflow");
  72. maskStyle.zIndex = nextZIndex();
  73. } else if (options.parent === document.body) {
  74. instance.originalPosition.value = getStyle(document.body, "position");
  75. await nextTick();
  76. for (const property of ["top", "left"]) {
  77. const scroll = property === "top" ? "scrollTop" : "scrollLeft";
  78. maskStyle[property] = `${options.target.getBoundingClientRect()[property] + document.body[scroll] + document.documentElement[scroll] - Number.parseInt(getStyle(document.body, `margin-${property}`), 10)}px`;
  79. }
  80. for (const property of ["height", "width"]) {
  81. maskStyle[property] = `${options.target.getBoundingClientRect()[property]}px`;
  82. }
  83. } else {
  84. instance.originalPosition.value = getStyle(parent, "position");
  85. }
  86. for (const [key, value] of Object.entries(maskStyle)) {
  87. instance.$el.style[key] = value;
  88. }
  89. };
  90. const addClassList = (options, parent, instance) => {
  91. const ns = useNamespace("loading");
  92. if (!["absolute", "fixed", "sticky"].includes(instance.originalPosition.value)) {
  93. addClass(parent, ns.bm("parent", "relative"));
  94. } else {
  95. removeClass(parent, ns.bm("parent", "relative"));
  96. }
  97. if (options.fullscreen && options.lock) {
  98. addClass(parent, ns.bm("parent", "hidden"));
  99. } else {
  100. removeClass(parent, ns.bm("parent", "hidden"));
  101. }
  102. };
  103. export { Loading };
  104. //# sourceMappingURL=service.mjs.map