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