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