import{f as Y,j as U,r as M,e as _,v as G,c as i,u as r,H as P}from"./vendor-@vue.54cfd5db.js";import{b as B,j,R as V}from"./vendor-@ant-design.73655db8.js";var H="/assets/resume.6e209205.svg",q="/assets/p-rotate.1d232189.svg",z="/assets/scale.8d8ebde4.svg",J="/assets/unscale.99ad049c.svg",K="/assets/unrotate.f9dd5a27.svg",c=function(n){return n[n.LOADING=0]="LOADING",n[n.DONE=1]="DONE",n[n.FAIL=2]="FAIL",n}(c||{});const Q={show:{type:Boolean,default:!1},imageList:{type:[Array],default:null},index:{type:Number,default:0},scaleStep:{type:Number},defaultWidth:{type:Number},maskClosable:{type:Boolean},rememberState:{type:Boolean}},o="img-preview";var te=Y({name:"ImagePreview",props:Q,emits:["img-load","img-error"],setup(n,{expose:N,emit:I}){const w=new Map,t=U({currentUrl:"",imgScale:1,imgRotate:0,imgTop:0,imgLeft:0,status:c.LOADING,currentIndex:0,moveX:0,moveY:0,show:n.show}),L=M(null),g=M(null);function O(){R();const{index:e,imageList:l}=n;if(!l||!l.length)throw new Error("imageList is undefined");t.currentIndex=e,S(l[e])}function f(){t.imgScale=1,t.imgRotate=0,t.imgTop=0,t.imgLeft=0}function R(){const e=r(L);!e||(e.onmousewheel=v,document.body.addEventListener("DOMMouseScroll",v),document.ondragstart=function(){return!1})}const m=_(()=>{var l;const e=(l=n==null?void 0:n.scaleStep)!=null?l:0;return(e!=null?e:0>0)?e/100:t.imgScale/10});function v(e){e=e||window.event,e.delta=e.wheelDelta||-e.detail,e.preventDefault(),e.delta>0&&d(m.value),e.delta<0&&d(-m.value)}function d(e){t.imgScale<=.2&&e<0||(t.imgScale+=e)}function x(e){t.imgRotate+=e}function k(){const e=r(g);!e||(e.onmousemove=null)}function S(e){t.status=c.LOADING;const l=new Image;l.src=e,l.onload=a=>{if(t.currentUrl!==e){const s=a.composedPath();if(n.rememberState){w.set(t.currentUrl,{scale:t.imgScale,top:t.imgTop,left:t.imgLeft,rotate:t.imgRotate});const u=w.get(e);u?(t.imgScale=u.scale,t.imgTop=u.top,t.imgRotate=u.rotate,t.imgLeft=u.left):(f(),n.defaultWidth&&(t.imgScale=n.defaultWidth/s[0].naturalWidth))}else n.defaultWidth&&(t.imgScale=n.defaultWidth/s[0].naturalWidth);s&&I("img-load",{index:t.currentIndex,dom:s[0],url:e})}t.currentUrl=e,t.status=c.DONE},l.onerror=a=>{const s=a.composedPath();s&&I("img-error",{index:t.currentIndex,dom:s[0],url:e}),t.status=c.FAIL}}function C(e){e&&e.stopPropagation(),$()}function $(){t.show=!1,document.body.removeEventListener("DOMMouseScroll",v),document.ondragstart=null}function y(){f()}N({resume:y,close:$,prev:h.bind(null,"left"),next:h.bind(null,"right"),setScale:e=>{e>0&&e<=10&&(t.imgScale=e)},setRotate:e=>{t.imgRotate=e}});function h(e){const{currentIndex:l}=t,{imageList:a}=n;e==="left"&&(t.currentIndex--,l<=0&&(t.currentIndex=a.length-1)),e==="right"&&(t.currentIndex++,l>=a.length-1&&(t.currentIndex=0)),S(a[t.currentIndex])}function p(e){e=e||window.event,t.moveX=e.clientX,t.moveY=e.clientY;const l=r(g);l&&(l.onmousemove=A)}function A(e){e=e||window.event,e.preventDefault();const l=e.clientX-t.moveX,a=e.clientY-t.moveY;t.imgLeft+=l,t.imgTop+=a,t.moveX=e.clientX,t.moveY=e.clientY}const W=_(()=>{const{imgScale:e,imgRotate:l,imgTop:a,imgLeft:s}=t;return{transform:`scale(${e}) rotate(${l}deg)`,marginTop:`${a}px`,marginLeft:`${s}px`,maxWidth:n.defaultWidth?"unset":"100%"}}),b=_(()=>{const{imageList:e}=n;return e.length>1});G(()=>{n.show&&O(),n.imageList&&f()});const E=e=>{n.maskClosable&&e.target&&e.target.classList.contains(`${o}-content`)&&C(e)},F=()=>i("div",{class:`${o}__close`,onClick:C},[i(B,{class:`${o}__close-icon`},null)]),T=()=>{if(!r(b))return null;const{currentIndex:e}=t,{imageList:l}=n;return i("div",{class:`${o}__index`},[e+1,P(" / "),l.length])},X=()=>i("div",{class:`${o}__controller`},[i("div",{class:`${o}__controller-item`,onClick:()=>d(-m.value)},[i("img",{src:J},null)]),i("div",{class:`${o}__controller-item`,onClick:()=>d(m.value)},[i("img",{src:z},null)]),i("div",{class:`${o}__controller-item`,onClick:y},[i("img",{src:H},null)]),i("div",{class:`${o}__controller-item`,onClick:()=>x(-90)},[i("img",{src:K},null)]),i("div",{class:`${o}__controller-item`,onClick:()=>x(90)},[i("img",{src:q},null)])]),D=e=>r(b)?i("div",{class:[`${o}__arrow`,e],onClick:()=>h(e)},[e==="left"?i(j,null,null):i(V,null,null)]):null;return()=>t.show&&i("div",{class:o,ref:L,onMouseup:k,onClick:E},[i("div",{class:`${o}-content`},[i("img",{style:r(W),class:[`${o}-image`,t.status===c.DONE?"":"hidden"],ref:g,src:t.currentUrl,onMousedown:p},null),F(),T(),X(),D("left"),D("right")])])}});export{te as _};
