1 |
- import{ap as $,B as ge,C as le,aq as be,ar as ne,f as K,as as ke,at as Re,au as Ye,Q as we,P as _e,av as $e,s as y,aw as Xe,ax as De,H as g,i as se,k as he,ay as ze,o as b,c as oe,j as r,w as z,p as m,t as u,u as a,$ as ie,Z as Fe,V as k,N as L,az as Me,m as N,F as re,aA as Pe,aB as He,aC as je,aD as We,Y as qe,aE as Ge,aF as Ve,y as Ze,a6 as Ke,a7 as Qe,r as Q,aG as Ue,aH as Je,D as xe,L as X,E as D,aI as ea,a0 as Ce,aJ as aa,aK as ta,U as la,z as na,aL as sa,aM as oa,__tla as ia}from"./entry.b543c057.js";import{t as ue,__tla as ra}from"./throttle.fb82e93c.js";import{u as ua,__tla as ca}from"./index.f1aa5bf8.js";import{g as da,__tla as va}from"./scroll.5206d247.js";let Ie,ce,fa=Promise.all([(()=>{try{return ia}catch{}})(),(()=>{try{return ra}catch{}})(),(()=>{try{return ca}catch{}})(),(()=>{try{return va}catch{}})()]).then(async()=>{const Oe=(c,p)=>{if(!$||!c||!p)return!1;const o=c.getBoundingClientRect();let n;return p instanceof Element?n=p.getBoundingClientRect():n={top:0,right:window.innerWidth,bottom:window.innerHeight,left:0},o.top<n.bottom&&o.bottom>n.top&&o.right>n.left&&o.left<n.right},Ee=ge({urlList:{type:le(Array),default:()=>be([])},zIndex:{type:Number},initialIndex:{type:Number,default:0},infinite:{type:Boolean,default:!0},hideOnClickModal:{type:Boolean,default:!1},teleported:{type:Boolean,default:!1},closeOnPressEscape:{type:Boolean,default:!0},zoomRate:{type:Number,default:1.2}}),Le={close:()=>!0,switch:c=>ne(c)},Ne=["src"],Te=K({name:"ElImageViewer"}),Ae=K({...Te,props:Ee,emits:Le,setup(c,{expose:p,emit:o}){const n=c,T={CONTAIN:{name:"contain",icon:ke(Re)},ORIGINAL:{name:"original",icon:ke(Ye)}},{t:x}=we(),s=_e("image-viewer"),{nextZIndex:U}=$e(),A=y(),w=y([]),_=Xe(),h=y(!0),d=y(n.initialIndex),v=De(T.CONTAIN),i=y({scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}),B=g(()=>{const{urlList:e}=n;return e.length<=1}),S=g(()=>d.value===0),W=g(()=>d.value===n.urlList.length-1),J=g(()=>n.urlList[d.value]),F=g(()=>{const{scale:e,deg:t,offsetX:l,offsetY:f,enableTransition:I}=i.value;let O=l/e,E=f/e;switch(t%360){case 90:case-270:[O,E]=[E,-O];break;case 180:case-180:[O,E]=[-O,-E];break;case 270:case-90:[O,E]=[-E,O];break}const Y={transform:`scale(${e}) rotate(${t}deg) translate(${O}px, ${E}px)`,transition:I?"transform .3s":""};return v.value.name===T.CONTAIN.name&&(Y.maxWidth=Y.maxHeight="100%"),Y}),ee=g(()=>ne(n.zIndex)?n.zIndex:U());function R(){ae(),o("close")}function M(){const e=ue(l=>{switch(l.code){case D.esc:n.closeOnPressEscape&&R();break;case D.space:H();break;case D.left:V();break;case D.up:C("zoomIn");break;case D.right:Z();break;case D.down:C("zoomOut");break}}),t=ue(l=>{const f=l.deltaY||l.deltaX;C(f<0?"zoomIn":"zoomOut",{zoomRate:n.zoomRate,enableTransition:!1})});_.run(()=>{X(document,"keydown",e),X(document,"wheel",t)})}function ae(){_.stop()}function te(){h.value=!1}function q(e){h.value=!1,e.target.alt=x("el.image.error")}function G(e){if(h.value||e.button!==0||!A.value)return;i.value.enableTransition=!1;const{offsetX:t,offsetY:l}=i.value,f=e.pageX,I=e.pageY,O=ue(Y=>{i.value={...i.value,offsetX:t+Y.pageX-f,offsetY:l+Y.pageY-I}}),E=X(document,"mousemove",O);X(document,"mouseup",()=>{E()}),e.preventDefault()}function P(){i.value={scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}}function H(){if(h.value)return;const e=ea(T),t=Object.values(T),l=v.value.name,f=(t.findIndex(I=>I.name===l)+1)%e.length;v.value=T[e[f]],P()}function j(e){const t=n.urlList.length;d.value=(e+t)%t}function V(){S.value&&!n.infinite||j(d.value-1)}function Z(){W.value&&!n.infinite||j(d.value+1)}function C(e,t={}){if(h.value)return;const{zoomRate:l,rotateDeg:f,enableTransition:I}={zoomRate:n.zoomRate,rotateDeg:90,enableTransition:!0,...t};switch(e){case"zoomOut":i.value.scale>.2&&(i.value.scale=Number.parseFloat((i.value.scale/l).toFixed(3)));break;case"zoomIn":i.value.scale<7&&(i.value.scale=Number.parseFloat((i.value.scale*l).toFixed(3)));break;case"clockwise":i.value.deg+=f;break;case"anticlockwise":i.value.deg-=f;break}i.value.enableTransition=I}return se(J,()=>{he(()=>{const e=w.value[0];e!=null&&e.complete||(h.value=!0)})}),se(d,e=>{P(),o("switch",e)}),ze(()=>{var e,t;M(),(t=(e=A.value)==null?void 0:e.focus)==null||t.call(e)}),p({setActiveItem:j}),(e,t)=>(b(),oe(Je,{to:"body",disabled:!e.teleported},[r(Ue,{name:"viewer-fade",appear:""},{default:z(()=>[m("div",{ref_key:"wrapper",ref:A,tabindex:-1,class:u(a(s).e("wrapper")),style:ie({zIndex:a(ee)})},[m("div",{class:u(a(s).e("mask")),onClick:t[0]||(t[0]=Fe(l=>e.hideOnClickModal&&R(),["self"]))},null,2),k(" CLOSE "),m("span",{class:u([a(s).e("btn"),a(s).e("close")]),onClick:R},[r(a(L),null,{default:z(()=>[r(a(Me))]),_:1})],2),k(" ARROW "),a(B)?k("v-if",!0):(b(),N(re,{key:0},[m("span",{class:u([a(s).e("btn"),a(s).e("prev"),a(s).is("disabled",!e.infinite&&a(S))]),onClick:V},[r(a(L),null,{default:z(()=>[r(a(Pe))]),_:1})],2),m("span",{class:u([a(s).e("btn"),a(s).e("next"),a(s).is("disabled",!e.infinite&&a(W))]),onClick:Z},[r(a(L),null,{default:z(()=>[r(a(He))]),_:1})],2)],64)),k(" ACTIONS "),m("div",{class:u([a(s).e("btn"),a(s).e("actions")])},[m("div",{class:u(a(s).e("actions__inner"))},[r(a(L),{onClick:t[1]||(t[1]=l=>C("zoomOut"))},{default:z(()=>[r(a(je))]),_:1}),r(a(L),{onClick:t[2]||(t[2]=l=>C("zoomIn"))},{default:z(()=>[r(a(We))]),_:1}),m("i",{class:u(a(s).e("actions__divider"))},null,2),r(a(L),{onClick:H},{default:z(()=>[(b(),oe(qe(a(v).icon)))]),_:1}),m("i",{class:u(a(s).e("actions__divider"))},null,2),r(a(L),{onClick:t[3]||(t[3]=l=>C("anticlockwise"))},{default:z(()=>[r(a(Ge))]),_:1}),r(a(L),{onClick:t[4]||(t[4]=l=>C("clockwise"))},{default:z(()=>[r(a(Ve))]),_:1})],2)],2),k(" CANVAS "),m("div",{class:u(a(s).e("canvas"))},[(b(!0),N(re,null,Ze(e.urlList,(l,f)=>Ke((b(),N("img",{ref_for:!0,ref:I=>w.value[f]=I,key:l,src:l,style:ie(a(F)),class:u(a(s).e("img")),onLoad:te,onError:q,onMousedown:G},null,46,Ne)),[[Qe,f===d.value]])),128))],2),Q(e.$slots,"default")],6)]),_:3})],8,["disabled"]))}});var Se=xe(Ae,[["__file","/home/runner/work/element-plus/element-plus/packages/components/image-viewer/src/image-viewer.vue"]]);let de,ve,fe,me,pe,ye;ce=Ce(Se),de=ge({hideOnClickModal:{type:Boolean,default:!1},src:{type:String,default:""},fit:{type:String,values:["","contain","cover","fill","none","scale-down"],default:""},loading:{type:String,values:["eager","lazy"]},lazy:{type:Boolean,default:!1},scrollContainer:{type:le([String,Object])},previewSrcList:{type:le(Array),default:()=>be([])},previewTeleported:{type:Boolean,default:!1},zIndex:{type:Number},initialIndex:{type:Number,default:0},infinite:{type:Boolean,default:!0},closeOnPressEscape:{type:Boolean,default:!0},zoomRate:{type:Number,default:1.2}}),ve={load:c=>c instanceof Event,error:c=>c instanceof Event,switch:c=>ne(c),close:()=>!0,show:()=>!0},fe=["src","loading"],me={key:0},pe=K({name:"ElImage",inheritAttrs:!1}),ye=K({...pe,props:de,emits:ve,setup(c,{emit:p}){const o=c;let n="";const{t:T}=we(),x=_e("image"),s=aa(),U=ua(),A=y(),w=y(!1),_=y(!0),h=y(!1),d=y(),v=y(),i=$&&"loading"in HTMLImageElement.prototype;let B,S;const W=g(()=>s.style),J=g(()=>{const{fit:e}=o;return $&&e?{objectFit:e}:{}}),F=g(()=>{const{previewSrcList:e}=o;return Array.isArray(e)&&e.length>0}),ee=g(()=>{const{previewSrcList:e,initialIndex:t}=o;let l=t;return t>e.length-1&&(l=0),l}),R=g(()=>o.loading==="eager"?!1:!i&&o.loading==="lazy"||o.lazy),M=()=>{$&&(_.value=!0,w.value=!1,A.value=o.src)};function ae(e){_.value=!1,w.value=!1,p("load",e)}function te(e){_.value=!1,w.value=!0,p("error",e)}function q(){Oe(d.value,v.value)&&(M(),H())}const G=ta(q,200);async function P(){var e;if(!$)return;await he();const{scrollContainer:t}=o;sa(t)?v.value=t:oa(t)&&t!==""?v.value=(e=document.querySelector(t))!=null?e:void 0:d.value&&(v.value=da(d.value)),v.value&&(B=X(v,"scroll",G),setTimeout(()=>q(),100))}function H(){!$||!v.value||!G||(B==null||B(),v.value=void 0)}function j(e){if(e.ctrlKey&&(e.deltaY<0||e.deltaY>0))return e.preventDefault(),!1}function V(){F.value&&(S=X("wheel",j,{passive:!1}),n=document.body.style.overflow,document.body.style.overflow="hidden",h.value=!0,p("show"))}function Z(){S==null||S(),document.body.style.overflow=n,h.value=!1,p("close")}function C(e){p("switch",e)}return se(()=>o.src,()=>{R.value?(_.value=!0,w.value=!1,H(),P()):M()}),ze(()=>{R.value?P():M()}),(e,t)=>(b(),N("div",{ref_key:"container",ref:d,class:u([a(x).b(),e.$attrs.class]),style:ie(a(W))},[A.value!==void 0&&!w.value?(b(),N("img",la({key:0},a(U),{src:A.value,loading:e.loading,style:a(J),class:[a(x).e("inner"),a(F)&&a(x).e("preview"),_.value&&a(x).is("loading")],onClick:V,onLoad:ae,onError:te}),null,16,fe)):k("v-if",!0),_.value||w.value?(b(),N("div",{key:1,class:u(a(x).e("wrapper"))},[_.value?Q(e.$slots,"placeholder",{key:0},()=>[m("div",{class:u(a(x).e("placeholder"))},null,2)]):w.value?Q(e.$slots,"error",{key:1},()=>[m("div",{class:u(a(x).e("error"))},na(a(T)("el.image.error")),3)]):k("v-if",!0)],2)):k("v-if",!0),a(F)?(b(),N(re,{key:2},[h.value?(b(),oe(a(ce),{key:0,"z-index":e.zIndex,"initial-index":a(ee),infinite:e.infinite,"zoom-rate":e.zoomRate,"url-list":e.previewSrcList,"hide-on-click-modal":e.hideOnClickModal,teleported:e.previewTeleported,"close-on-press-escape":e.closeOnPressEscape,onClose:Z,onSwitch:C},{default:z(()=>[e.$slots.viewer?(b(),N("div",me,[Q(e.$slots,"viewer")])):k("v-if",!0)]),_:3},8,["z-index","initial-index","infinite","zoom-rate","url-list","hide-on-click-modal","teleported","close-on-press-escape"])):k("v-if",!0)],64)):k("v-if",!0)],6))}});var Be=xe(ye,[["__file","/home/runner/work/element-plus/element-plus/packages/components/image/src/image.vue"]]);Ie=Ce(Be)});export{Ie as E,fa as __tla,ce as a};
|