2 lines
4.3 KiB
JavaScript
2 lines
4.3 KiB
JavaScript
var e,t;import{Y as i,Z as o,aY as s,aA as r,G as a,H as d,o as h,j as l,w as n,h as u,m as g,y as c,z as m,a0 as v,p as y,B as p}from"./index-9bec188e.js";import{_ as b}from"./uv-icon.27c7246d.js";import{_ as w}from"./uv-transition.b971e856.js";import{_ as f}from"./_plugin-vue_export-helper.1b428a4d.js";const S=f({name:"uv-image",emits:["click","load","error"],mixins:[i,o,{props:{src:{type:String,default:""},mode:{type:String,default:"aspectFill"},width:{type:[String,Number],default:"300"},height:{type:[String,Number],default:"225"},shape:{type:String,default:"square"},radius:{type:[String,Number],default:0},lazyLoad:{type:Boolean,default:!0},observeLazyLoad:{type:Boolean,default:!1},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:"#f3f4f6"},cellChild:{type:Boolean,default:!1},...null==(t=null==(e=uni.$uv)?void 0:e.props)?void 0:t.image}}],data(){return{isError:!1,loading:!0,backgroundStyle:{},show:!1,observeShow:!this.observeLazyLoad,elIndex:"",imgWidth:this.width,imgHeight:this.height,thresholdValue:50}},watch:{src:{immediate:!0,handler(e){e?(this.isError=!1,this.loading=!0):this.isError=!0}}},computed:{wrapStyle(){let e={};return e.width=this.$uv.addUnit(this.imgWidth),e.height=this.$uv.addUnit(this.imgHeight),e.borderRadius="circle"==this.shape?"10000px":this.$uv.addUnit(this.radius),e.overflow=this.radius>0?"hidden":"visible",this.$uv.deepMerge(e,this.$uv.addStyle(this.customStyle))},imageStyle(){let e={};return e.borderRadius="circle"==this.shape?"10000px":this.$uv.addUnit(this.radius),e}},created(){this.elIndex=this.$uv.guid(),this.observer={},this.observerName="lazyLoadContentObserver"},mounted(){this.show=!0,this.observeLazyLoad&&this.observerFn()},methods:{onClick(){this.$emit("click")},onErrorHandler(e){this.loading=!1,this.isError=!0,this.$emit("error",e)},onLoadHandler(e){"widthFix"==this.mode&&(this.imgHeight="auto"),"heightFix"==this.mode&&(this.imgWidth="auto"),this.loading=!1,this.isError=!1,this.$emit("load",e),this.removeBgColor()},removeBgColor(){this.backgroundStyle={backgroundColor:"transparent"}},observerFn(){this.$nextTick((()=>{s("onLazyLoadReachBottom",(()=>{this.observeShow||(this.observeShow=!0)}))})),setTimeout((()=>{this.disconnectObserver(this.observerName);const e=r(this);e.relativeToViewport({bottom:this.thresholdValue}).observe(`.uv-image--${this.elIndex}`,(e=>{e.intersectionRatio>0&&(this.observeShow=!0,this.disconnectObserver(this.observerName))})),this[this.observerName]=e}),50)},disconnectObserver(e){const t=this[e];t&&t.disconnect()}}},[["render",function(e,t,i,o,s,r){const f=y,S=a(d("uv-icon"),b),$=p,L=a(d("uv-transition"),w);return h(),l(L,{show:s.show,mode:"fade",duration:e.fade?e.duration:0,"cell-child":e.cellChild,"custom-style":r.wrapStyle},{default:n((()=>[u($,{class:g(["uv-image",[`uv-image--${s.elIndex}`]]),onClick:r.onClick,style:c([r.wrapStyle,s.backgroundStyle])},{default:n((()=>[!s.isError&&s.observeShow?(h(),l(f,{key:0,src:e.src,mode:e.mode,onError:r.onErrorHandler,onLoad:r.onLoadHandler,"show-menuv-by-longpress":e.showMenuByLongpress,"lazy-load":e.lazyLoad,class:"uv-image__image",style:c([r.imageStyle])},null,8,["src","mode","onError","onLoad","show-menuv-by-longpress","lazy-load","style"])):m("",!0),e.showLoading&&s.loading?(h(),l($,{key:1,class:"uv-image__loading",style:c({borderRadius:"circle"==e.shape?"50%":e.$uv.addUnit(e.radius),backgroundColor:e.bgColor,width:e.$uv.addUnit(e.width),height:e.$uv.addUnit(e.height)})},{default:n((()=>[v(e.$slots,"loading",{},(()=>[u(S,{name:e.loadingIcon,width:e.width,height:e.height},null,8,["name","width","height"])]),!0)])),_:3},8,["style"])):m("",!0),e.showError&&s.isError&&!s.loading?(h(),l($,{key:2,class:"uv-image__error",style:c({borderRadius:"circle"==e.shape?"50%":e.$uv.addUnit(e.radius),width:e.$uv.addUnit(e.width),height:e.$uv.addUnit(e.height)})},{default:n((()=>[v(e.$slots,"error",{},(()=>[u(S,{name:e.errorIcon,width:e.width,height:e.height},null,8,["name","width","height"])]),!0)])),_:3},8,["style"])):m("",!0)])),_:3},8,["class","onClick","style"])])),_:3},8,["show","duration","cell-child","custom-style"])}],["__scopeId","data-v-cb6a87ee"]]);export{S as _};
|