| 1 |
- import{c as B,d as u,k as $,N,n as d,t as I,z as P,I as j,w as D}from"./index-e9453d64.js";import{d as _,r as f,g as C,a as M,w as R,M as U,o as F,z as S,c as n,h as O,N as T,m as b}from"./index-ddf66cb5.js";const[V,i]=B("image"),q={src:String,alt:String,fit:String,position:String,round:Boolean,block:Boolean,width:d,height:d,radius:d,lazyLoad:Boolean,iconSize:d,showError:I,errorIcon:P("photo-fail"),iconPrefix:String,showLoading:I,loadingIcon:P("photo"),crossorigin:String,referrerpolicy:String};var A=_({name:V,props:q,emits:["load","error"],setup(r,{emit:g,slots:c}){const t=f(!1),a=f(!0),o=f(),{$Lazyload:l}=C().proxy,k=M(()=>{const e={width:u(r.width),height:u(r.height)};return $(r.radius)&&(e.overflow="hidden",e.borderRadius=u(r.radius)),e});R(()=>r.src,()=>{t.value=!1,a.value=!0});const v=e=>{a.value&&(a.value=!1,g("load",e))},m=()=>{const e=new Event("load");Object.defineProperty(e,"target",{value:o.value,enumerable:!0}),v(e)},h=e=>{t.value=!0,a.value=!1,g("error",e)},y=(e,s,z)=>z?z():n(j,{name:e,size:r.iconSize,class:s,classPrefix:r.iconPrefix},null),x=()=>{if(a.value&&r.showLoading)return n("div",{class:i("loading")},[y(r.loadingIcon,i("loading-icon"),c.loading)]);if(t.value&&r.showError)return n("div",{class:i("error")},[y(r.errorIcon,i("error-icon"),c.error)])},E=()=>{if(t.value||!r.src)return;const e={alt:r.alt,class:i("img"),style:{objectFit:r.fit,objectPosition:r.position},crossorigin:r.crossorigin,referrerpolicy:r.referrerpolicy};return r.lazyLoad?O(n("img",b({ref:o},e),null),[[T("lazy"),r.src]]):n("img",b({ref:o,src:r.src,onLoad:v,onError:h},e),null)},w=({el:e})=>{const s=()=>{e===o.value&&a.value&&m()};o.value?s():S(s)},L=({el:e})=>{e===o.value&&!t.value&&h()};return l&&N&&(l.$on("loaded",w),l.$on("error",L),U(()=>{l.$off("loaded",w),l.$off("error",L)})),F(()=>{S(()=>{var e;(e=o.value)!=null&&e.complete&&!r.lazyLoad&&m()})}),()=>{var e;return n("div",{class:i({round:r.round,block:r.block}),style:k.value},[E(),x(),(e=c.default)==null?void 0:e.call(c)])}}});const J=D(A);export{J as I};
|
