You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
9.3 KiB
1 line
9.3 KiB
11 months ago
|
{"version":3,"file":"service.mjs","sources":["../../../../../../packages/components/loading/src/service.ts"],"sourcesContent":["import { nextTick } from 'vue'\nimport { isString } from '@vue/shared'\nimport { isClient } from '@vueuse/core'\nimport { addClass, getStyle, removeClass } from '@element-plus/utils/dom'\nimport { PopupManager } from '@element-plus/utils/popup-manager'\nimport { createLoadingComponent } from './loading'\nimport type { LoadingInstance } from './loading'\nimport type { LoadingOptionsResolved } from '..'\nimport type { LoadingOptions } from './types'\nimport type { CSSProperties } from 'vue'\n\nlet fullscreenInstance: LoadingInstance | undefined = undefined\n\nexport const Loading = function (\n options: LoadingOptions = {}\n): LoadingInstance {\n if (!isClient) return undefined as any\n\n const resolved = resolveOptions(options)\n\n if (resolved.fullscreen && fullscreenInstance) {\n fullscreenInstance.remvoeElLoadingChild()\n fullscreenInstance.close()\n }\n\n const instance = createLoadingComponent({\n ...resolved,\n closed: () => {\n resolved.closed?.()\n if (resolved.fullscreen) fullscreenInstance = undefined\n },\n })\n\n addStyle(resolved, resolved.parent, instance)\n addClassList(resolved, resolved.parent, instance)\n\n resolved.parent.vLoadingAddClassList = () =>\n addClassList(resolved, resolved.parent, instance)\n\n /**\n * add loading-number to parent.\n * because if a fullscreen loading is triggered when somewhere\n * a v-loading.body was triggered before and it's parent is\n * document.body which with a margin , the fullscreen loading's\n * destroySelf function will remove 'el-loading-parent--relative',\n * and then the position of v-loading.body will be error.\n */\n let loadingNumber: string | null =\n resolved.parent.getAttribute('loading-number')\n if (!loadingNumber) {\n loadingNumber = '1'\n } else {\n loadingNumber = `${Number.parseInt(loadingNumber) + 1}`\n }\n resolved.parent.setAttribute('loading-number', loadingNumber)\n\n resolved.parent.appendChild(instance.$el)\n\n // after instance render, then modify visible to trigger transition\n nextTick(() => (instance.visible.value = resolved.visible))\n\n if (resolved.fullscreen) {\n fullscreenInstance = instance\n }\n return instance\n}\n\nconst resolveOptions = (options: LoadingOptions): LoadingOptionsResolved => {\n let target: HTMLElement\n if (isString(options.target)) {\n target =\n document.querySelector<HTMLElement>(options.target) ?? document.body\n } else {\n target = options.target || document.body\n }\n return {\n parent: target === document.body || options.body ? document.body : target,\n background: options.background || '',\n svg: options.svg || '',\n svgViewBox: options.svgViewBox || '',\n spinner: options.spinner || false,\n text: options.text || '',\n fullscreen: target === document.body && (options.fullscreen ?? true),\n lock: options.lock ?? false,\n customClass: options.customClass || '',\n visible: options.visible ?? true,\n target,\n }\n}\n\nconst addStyle = async (\n options: LoadingOptionsResolved,\n parent: HTMLElement,\n instance: LoadingInstance\n) => {\n const maskStyle: CSSProperties = {}\n if (options.fullscreen) {\n instance.originalPosition.value = getStyle(document.body, 'position')\n instance.originalOverflow.value = getStyle(document.body, 'overflow')\n maskStyle.zIndex = PopupManager.nextZIndex()\n } else if (options.parent === document.body) {\n instance.originalPosition.value = getStyle(document.body, 'position')\n /**\n * await dom render when visible is true in init,\n * because some component's height maybe 0.\n * e.g. el-table.\n */\n await nextTick()\n for (const property of ['top', 'left']) {\n const scroll = property === 'top' ? 'scrollTop' : 'scrollLeft'\n maskStyle[property] = `${\n (options.target as HTMLElement).getBoundingClientRect()[property] +\n document.body[scroll] +\n document.
|