| 1 |
- import{bo as ve,aF as me,av as be,aw as pe,bc as ge,bd as X,d as q,bp as J,bq as ke,br as we,be as _e,ax as xe,bs as ye,r as h,bt as ze,b5 as Ie,J as w,K as Z,am as he,k as Ce,o as C,q as j,f as i,w as p,g as m,Y as f,a,at as G,b2 as Oe,O,aL as _,aJ as Ne,c as S,F as H,bu as Te,bv as Ae,bw as Le,bx as Re,L as Ye,by as Ee,bz as Xe,n as Se,v as Fe,a3 as $e,ay as Be,$ as De,bA as Me,az as Pe,bl as L,bB as I,bC as Ve,aA as We,__tla as qe}from"./index-73e02845.js";let K,N,Je=Promise.all([(()=>{try{return qe}catch{}})()]).then(async()=>{N=function(g,T,v){var n=!0,b=!0;if(typeof g!="function")throw new TypeError("Expected a function");return ve(v)&&(n="leading"in v?!!v.leading:n,b="trailing"in v?!!v.trailing:b),me(g,T,{leading:n,maxWait:T,trailing:b})};const U=be({urlList:{type:pe(Array),default:()=>ge([])},zIndex:{type:Number},initialIndex:{type:Number,default:0},infinite:{type:Boolean,default:!0},hideOnClickModal:Boolean,teleported:Boolean,closeOnPressEscape:{type:Boolean,default:!0},zoomRate:{type:Number,default:1.2},minScale:{type:Number,default:.2},maxScale:{type:Number,default:7}}),Q={close:()=>!0,switch:g=>X(g),rotate:g=>X(g)},ee=["src"],ae=q({name:"ElImageViewer"});K=We(Pe(q({...ae,props:U,emits:Q,setup(g,{expose:T,emit:v}){const n=g,b={CONTAIN:{name:"contain",icon:J(ke)},ORIGINAL:{name:"original",icon:J(we)}},{t:se}=_e(),t=xe("image-viewer"),{nextZIndex:ne}=ye(),R=h(),F=h([]),$=ze(),y=h(!0),k=h(n.initialIndex),A=Ie(b.CONTAIN),l=h({scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}),te=w(()=>{const{urlList:e}=n;return e.length<=1}),B=w(()=>k.value===0),D=w(()=>k.value===n.urlList.length-1),le=w(()=>n.urlList[k.value]),oe=w(()=>[t.e("btn"),t.e("prev"),t.is("disabled",!n.infinite&&B.value)]),ie=w(()=>[t.e("btn"),t.e("next"),t.is("disabled",!n.infinite&&D.value)]),ce=w(()=>{const{scale:e,deg:s,offsetX:o,offsetY:u,enableTransition:c}=l.value;let r=o/e,d=u/e;switch(s%360){case 90:case-270:[r,d]=[d,-r];break;case 180:case-180:[r,d]=[-r,-d];break;case 270:case-90:[r,d]=[-d,r]}const z={transform:`scale(${e}) rotate(${s}deg) translate(${r}px, ${d}px)`,transition:c?"transform .3s":""};return A.value.name===b.CONTAIN.name&&(z.maxWidth=z.maxHeight="100%"),z}),ue=w(()=>X(n.zIndex)?n.zIndex:ne());function Y(){$.stop(),v("close")}function re(){y.value=!1}function de(e){y.value=!1,e.target.alt=se("el.image.error")}function fe(e){if(y.value||e.button!==0||!R.value)return;l.value.enableTransition=!1;const{offsetX:s,offsetY:o}=l.value,u=e.pageX,c=e.pageY,r=N(z=>{l.value={...l.value,offsetX:s+z.pageX-u,offsetY:o+z.pageY-c}}),d=L(document,"mousemove",r);L(document,"mouseup",()=>{d()}),e.preventDefault()}function M(){l.value={scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}}function P(){if(y.value)return;const e=Ve(b),s=Object.values(b),o=A.value.name,u=(s.findIndex(c=>c.name===o)+1)%e.length;A.value=b[e[u]],M()}function E(e){const s=n.urlList.length;k.value=(e+s)%s}function V(){B.value&&!n.infinite||E(k.value-1)}function W(){D.value&&!n.infinite||E(k.value+1)}function x(e,s={}){if(y.value)return;const{minScale:o,maxScale:u}=n,{zoomRate:c,rotateDeg:r,enableTransition:d}={zoomRate:n.zoomRate,rotateDeg:90,enableTransition:!0,...s};switch(e){case"zoomOut":l.value.scale>o&&(l.value.scale=Number.parseFloat((l.value.scale/c).toFixed(3)));break;case"zoomIn":l.value.scale<u&&(l.value.scale=Number.parseFloat((l.value.scale*c).toFixed(3)));break;case"clockwise":l.value.deg+=r,v("rotate",l.value.deg);break;case"anticlockwise":l.value.deg-=r,v("rotate",l.value.deg)}l.value.enableTransition=d}return Z(le,()=>{he(()=>{const e=F.value[0];e!=null&&e.complete||(y.value=!0)})}),Z(k,e=>{M(),v("switch",e)}),Ce(()=>{var e,s;(function(){const o=N(c=>{switch(c.code){case I.esc:n.closeOnPressEscape&&Y();break;case I.space:P();break;case I.left:V();break;case I.up:x("zoomIn");break;case I.right:W();break;case I.down:x("zoomOut")}}),u=N(c=>{x((c.deltaY||c.deltaX)<0?"zoomIn":"zoomOut",{zoomRate:n.zoomRate,enableTransition:!1})});$.run(()=>{L(document,"keydown",o),L(document,"wheel",u)})})(),(s=(e=R.value)==null?void 0:e.focus)==null||s.call(e)}),T({setActiveItem:E}),(e,s)=>(C(),j(Me,{to:"body",disabled:!e.teleported},[i(De,{name:"viewer-fade",appear:""},{default:p(()=>[m("div",{ref_key:"wrapper",ref:R,tabindex:-1,class:f(a(t).e("wrapper")),style:G({zIndex:a(ue)})},[m("div",{class:f(a(t).e("mask")),onClick:s[0]||(s[0]=Oe(o=>e.hideOnClickModal&&Y(),["self"]))},null,2),O(" CLOSE "),m("span",{class:f([a(t).e("btn"),a(t).e("close")]),onClick:Y},[i(a(_),null,{default:p(()=>[i(a(Ne))]),_:1})],2),O(" ARROW "),a(te)?O("v-if",!0):(C(),S(H,{key:0},[m("span",{class:f(a(oe)),onClick:V},[i(a(_),null,{default:p(()=>[i(a(Te))]),_:1})],2),m("span",{class:f(a(ie)),onClick:W},[i(a(_),null,{default:p(()=>[i(a(Ae))]),_:1})],2)],64)),O(" ACTIONS "),m("div",{class:f([a(t).e("btn"),a(t).e("actions")])},[m("div",{class:f(a(t).e("actions__inner"))},[i(a(_),{onClick:s[1]||(s[1]=o=>x("zoomOut"))},{default:p(()=>[i(a(Le))]),_:1}),i(a(_),{onClick:s[2]||(s[2]=o=>x("zoomIn"))},{default:p(()=>[i(a(Re))]),_:1}),m("i",{class:f(a(t).e("actions__divider"))},null,2),i(a(_),{onClick:P},{default:p(()=>[(C(),j(Ye(a(A).icon)))]),_:1}),m("i",{class:f(a(t).e("actions__divider"))},null,2),i(a(_),{onClick:s[3]||(s[3]=o=>x("anticlockwise"))},{default:p(()=>[i(a(Ee))]),_:1}),i(a(_),{onClick:s[4]||(s[4]=o=>x("clockwise"))},{default:p(()=>[i(a(Xe))]),_:1})],2)],2),O(" CANVAS "),m("div",{class:f(a(t).e("canvas"))},[(C(!0),S(H,null,Se(e.urlList,(o,u)=>Fe((C(),S("img",{ref_for:!0,ref:c=>F.value[u]=c,key:o,src:o,style:G(a(ce)),class:f(a(t).e("img")),onLoad:re,onError:de,onMousedown:fe},null,46,ee)),[[$e,u===k.value]])),128))],2),Be(e.$slots,"default")],6)]),_:3})],8,["disabled"]))}}),[["__file","/home/runner/work/element-plus/element-plus/packages/components/image-viewer/src/image-viewer.vue"]]))});export{K as E,Je as __tla,N as t};
|
