{"version":3,"file":"image2.js","sources":["../../../../../../packages/components/image/src/image.vue"],"sourcesContent":["<template>\n <div ref=\"container\" v-bind=\"containerAttrs\" :class=\"[ns.b(), $attrs.class]\">\n <slot v-if=\"hasLoadError\" name=\"error\">\n <div :class=\"ns.e('error')\">{{ t('el.image.error') }}</div>\n </slot>\n <template v-else>\n <img\n v-if=\"imageSrc !== undefined\"\n v-bind=\"imgAttrs\"\n :src=\"imageSrc\"\n :loading=\"loading\"\n :style=\"imageStyle\"\n :class=\"imageKls\"\n :crossorigin=\"crossorigin\"\n @click=\"clickHandler\"\n @load=\"handleLoad\"\n @error=\"handleError\"\n />\n <div v-if=\"isLoading\" :class=\"ns.e('wrapper')\">\n <slot name=\"placeholder\">\n <div :class=\"ns.e('placeholder')\" />\n </slot>\n </div>\n </template>\n <template v-if=\"preview\">\n <image-viewer\n v-if=\"showViewer\"\n :z-index=\"zIndex\"\n :initial-index=\"imageIndex\"\n :infinite=\"infinite\"\n :zoom-rate=\"zoomRate\"\n :min-scale=\"minScale\"\n :max-scale=\"maxScale\"\n :url-list=\"previewSrcList\"\n :crossorigin=\"crossorigin\"\n :hide-on-click-modal=\"hideOnClickModal\"\n :teleported=\"previewTeleported\"\n :close-on-press-escape=\"closeOnPressEscape\"\n @close=\"closeViewer\"\n @switch=\"switchViewer\"\n >\n <div v-if=\"$slots.viewer\">\n <slot name=\"viewer\" />\n </div>\n </image-viewer>\n </template>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n nextTick,\n onMounted,\n ref,\n useAttrs as useRawAttrs,\n watch,\n} from 'vue'\nimport { useEventListener, useThrottleFn } from '@vueuse/core'\nimport { fromPairs } from 'lodash-unified'\nimport { useAttrs, useLocale, useNamespace } from '@element-plus/hooks'\nimport ImageViewer from '@element-plus/components/image-viewer'\nimport {\n getScrollContainer,\n isClient,\n isElement,\n isInContainer,\n isString,\n} from '@element-plus/utils'\nimport { imageEmits, imageProps } from './image'\n\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElImage',\n inheritAttrs: false,\n})\n\nconst props = defineProps(imageProps)\nconst emit = defineEmits(imageEmits)\n\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image')\nconst rawAttrs = useRawAttrs()\n\nconst containerAttrs = computed(() => {\n return fromPairs(\n Object.entries(rawAttrs).filter(\n ([key]) => /^(data-|on[A-Z])/i.test(key) || ['id', 'style'].includes(key)\n )\n )\n})\n\nconst imgAttrs = useAttrs({\n excludeListeners: true,\n excludeKeys: computed<string[]>(() => {\n return Object.keys(containerAttrs.value)\n }),\n})\n\nconst imageSrc = ref<string | undefined>()\nconst hasLoadError = ref(false)\nconst isLoading = ref(true)\nconst showViewer = ref(false)\nconst container = ref<HTMLElement>()\nconst _scrollContainer = ref<HTMLElement | Window>()\n\nconst supportLoading = isClient && 'loading' in HTMLImageElement.prototype\nlet stopScrollListener: (() => void) | undefined\nlet stopWheelListener: (() => void) | undefined\n\nconst imageKls = computed(() => [\n ns.e('inner'),\n preview.value && ns.e('preview'),\n isLoading.value && ns.is('loading'),\n])\n\nconst imageStyle = computed<CSSProperties>(() => {\n const { fit } = props\n if (isClient && fit) {\n return { objectFit: fit }\n }\n return {}\n})\n\nconst preview = computed(() => {\n const { previewSrcList } = props\n return Array.isArray(previewSrcList) && previewSrcList.length > 0\n})\n\nconst imageIndex = computed(() => {\n const { previewSrcList, initialIndex } = props\n let previewIndex = initialIndex\n if (initialIndex > previewSrcList.length - 1) {\n previewIndex = 0\n }\n return previewIndex\n})\n\nconst isManual = computed(() => {\n if (props.loading === 'eager') return false\n return (!supportLoading && props.loading === 'lazy') || props.lazy\n})\n\nconst loadImage = () => {\n if (!isClient) return\n\n // reset status\n isLoading.value = true\n hasLoadError.value = false\n imageSrc.value = props.src\n}\n\nfunction handleLoad(event: Event) {\n isLoading.value = false\n hasLoadError.value = false\n emit('load', event)\n}\n\nfunction handleError(event: Event) {\n isLoading.value = false\n hasLoadError.value = true\n emit('error', event)\n}\n\nfunction handleLazyLoad() {\n if (isInContainer(container.value, _scrollContainer.value)) {\n loadImage()\n removeLazyLoadListener()\n }\n}\n\nconst lazyLoadHandler = useThrottleFn(handleLazyLoad, 200, true)\n\nasync function addLazyLoadListener() {\n if (!isClient) return\n\n await nextTick()\n\n const { scrollContainer } = props\n if (isElement(scrollContainer)) {\n _scrollContainer.value = scrollContainer\n } else if (isString(scrollContainer) && scrollContainer !== '') {\n _scrollContainer.value =\n document.querySelector<HTMLElement>(scrollContainer) ?? undefined\n } else if (container.value) {\n _scrollContainer.value = getScrollContainer(container.value)\n }\n\n if (_scrollContainer.value) {\n stopScrollListener = useEventListener(\n _scrollContainer,\n 'scroll',\n lazyLoadHandler\n )\n setTimeout(() => handleLazyLoad(), 100)\n }\n}\n\nfunction removeLazyLoadListener() {\n if (!isClient || !_scrollContainer.value || !lazyLoadHandler) return\n\n stopScrollListener?.()\n _scrollContainer.value = undefined\n}\n\nfunction wheelHandler(e: WheelEvent) {\n if (!e.ctrlKey) return\n\n if (e.deltaY < 0) {\n e.preventDefault()\n return false\n } else if (e.deltaY > 0) {\n e.preventDefault()\n return false\n }\n}\n\nfunction clickHandler() {\n // don't show viewer when preview is false\n if (!preview.value) return\n\n stopWheelListener = useEventListener('wheel', wheelHandler, {\n passive: false,\n })\n\n // prevent body scroll\n prevOverflow = document.body.style.overflow\n document.body.style.overflow = 'hidden'\n showViewer.value = true\n emit('show')\n}\n\nfunction closeViewer() {\n stopWheelListener?.()\n document.body.style.overflow = prevOverflow\n showViewer.value = false\n emit('close')\n}\n\nfunction switchViewer(val: number) {\n emit('switch', val)\n}\n\nwatch(\n () => props.src,\n () => {\n if (isManual.value) {\n // reset status\n isLoading.value = true\n hasLoadError.value = false\n removeLazyLoadListener()\n addLazyLoadListener()\n } else {\n loadImage()\n }\n }\n)\n\nonMounted(() => {\n if (isManual.value) {\n addLazyLoadListener()\n } else {\n loadImage()\n }\n})\n</script>\n"],"names":["useLocale","useNamespace","useRawAttrs","computed","fromPairs","useAttrs","ref","isClient","isInContainer","useThrottleFn","nextTick","isElement","isString","getScrollContainer","useEventListener","watch","onMounted"],"mappings":"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"}