| 1 |
- import{b as e,d as a,r as t,w as o,c as l,$ as r,bc as s,a as u,o as d,i,n,e as c,u as y,f as h,l as g,m as p,a3 as v,N as m,_ as f}from"./index-CU9Dsx61.js";const b=f(a({name:"u-image",options:{addGlobalClass:!0,virtualHost:!0,styleIsolation:"shared"},props:{...e,src:{type:String,default:""},mode:{type:String,default:"aspectFill"},width:{type:[String,Number],default:"100%"},height:{type:[String,Number],default:"auto"},shape:{type:String,default:"square"},borderRadius:{type:[String,Number],default:0},lazyLoad:{type:Boolean,default:!0},showMenuByLongpress:{type:Boolean,default:!0},loadingIcon:{type:String,default:"photo"},errorIcon:{type:String,default:"error-circle"},showLoading:{type:Boolean,default:!0},showError:{type:Boolean,default:!0},fade:{type:Boolean,default:!0},webp:{type:Boolean,default:!1},duration:{type:[String,Number],default:500},bgColor:{type:String,default:"var(--u-bg-color)"},useSlots:{type:Object,default:void 0}},emits:["click","error","load"],setup(e,{expose:a,emit:f}){const b=f,w=e,S=t(!1),_=t(!0),k=t(1),R=t(w.duration),B=t({});o((()=>w.src),(e=>{e?(S.value=!1,_.value=!0):(S.value=!0,_.value=!1)}),{immediate:!0});const N=l((()=>{let e={};return e.width=r.addUnit(w.width),e.height=r.addUnit(w.height),e.borderRadius="circle"===w.shape?"50%":r.addUnit(w.borderRadius),e.overflow=Number(w.borderRadius)>0?"hidden":"visible",w.fade&&(e.opacity=k.value,e.transition=`opacity ${Number(R.value)/1e3}s ease-in-out`),e}));function C(){b("click")}function L(e){_.value=!1,S.value=!0,b("error",e)}function I(){if(_.value=!1,S.value=!1,b("load"),!w.fade)return U();k.value=0,R.value=0,setTimeout((()=>{R.value=w.duration,k.value=1,setTimeout((()=>{U()}),Number(R.value))}),50)}function U(){B.value={backgroundColor:"transparent"}}const z=s();function $(e){return w.useSlots?!!z[e]&&w.useSlots[e]:!!z[e]}return a({changeStatus:function(e){"loading"===e?(_.value=!0,S.value=!1):"error"===e?(_.value=!1,S.value=!0):(_.value=!1,S.value=!1)}}),(e,a)=>{const t=p,o=m,l=i;return d(),u(l,{class:c(["u-image",e.customClass]),onClick:C,style:n(y(r).toStyle(N.value,B.value,e.customStyle))},{default:h((()=>[S.value?g("",!0):(d(),u(t,{key:0,src:e.src,mode:e.mode,onError:L,onLoad:I,"lazy-load":e.lazyLoad,class:"u-image__image","show-menu-by-longpress":e.showMenuByLongpress,style:n({borderRadius:"circle"===e.shape?"50%":y(r).addUnit(e.borderRadius)})},null,8,["src","mode","lazy-load","show-menu-by-longpress","style"])),e.showLoading&&_.value?(d(),u(l,{key:1,class:"u-image__loading",style:n({borderRadius:"circle"===e.shape?"50%":y(r).addUnit(e.borderRadius),backgroundColor:e.bgColor})},{default:h((()=>[$("loading")?v(e.$slots,"loading",{key:0},void 0,!0):(d(),u(o,{key:1,name:e.loadingIcon,width:e.width,height:e.height},null,8,["name","width","height"]))])),_:3},8,["style"])):g("",!0),e.showError&&S.value&&!_.value?(d(),u(l,{key:2,class:"u-image__error",style:n({borderRadius:"circle"===e.shape?"50%":y(r).addUnit(e.borderRadius)})},{default:h((()=>[$("error")?v(e.$slots,"error",{key:0},void 0,!0):(d(),u(o,{key:1,name:e.errorIcon,width:e.width,height:e.height},null,8,["name","width","height"]))])),_:3},8,["style"])):g("",!0)])),_:3},8,["style","class"])}}}),[["__scopeId","data-v-675a9770"]]);export{b as _};
|
