var j=(p,D,f)=>new Promise((P,x)=>{var O=n=>{try{h(f.next(n))}catch(_){x(_)}},N=n=>{try{h(f.throw(n))}catch(_){x(_)}},h=n=>n.done?P(n.value):Promise.resolve(n.value).then(O,N);h((f=f.apply(p,D)).next())});import{E as ge,i as pe,p as fe,_ as q,aC as ve,__tla as he}from"./index-f0df2f76.js";import{d as R,e as $,a7 as I,_ as C,$ as z,f as s,a9 as k,R as _e,F as Le,aa as we,a8 as H,ad as Ie,ac as J,ae as xe,a0 as ye,r as Se,k as K,s as be,u as v,E as Q,m as $e}from"./vue-1631514e.js";import{an as V,aD as Ce,aN as ke,aO as De}from"./antd-057b41b1.js";import{P as Pe,__tla as Oe}from"./index-e26b3a3c.js";import{__tla as Ne}from"./useContentViewHeight-c315421e.js";import{__tla as We}from"./useWindowSizeFn-53b82e7c.js";import"./onMountedOrActivated-5690e97c.js";let Z,Ee=Promise.all([(()=>{try{return he}catch(p){}})(),(()=>{try{return Oe}catch(p){}})(),(()=>{try{return Ne}catch(p){}})(),(()=>{try{return We}catch(p){}})()]).then(()=>j(void 0,null,function*(){const p=R({name:"ImagePreview",components:{Image:V,PreviewGroup:V.PreviewGroup},props:{functional:ge.bool,imageList:{type:Array}},setup(a){const{prefixCls:u}=pe("image-preview"),m=$(()=>{const{imageList:l}=a;return l?l.map(t=>fe(t)?{src:t,placeholder:!1}:t):[]});return{prefixCls:u,getImageList:m}}});function D(a,u,m,l,t,y){const g=I("Image"),L=I("PreviewGroup");return C(),z("div",{class:ye(a.prefixCls)},[s(L,null,{default:k(()=>[!a.imageList||a.$slots.default?_e(a.$slots,"default",{key:0}):(C(!0),z(Le,{key:1},we(a.getImageList,i=>(C(),H(g,Ie(J({key:i.src},i)),xe({_:2},[i.placeholder?{name:"placeholder",fn:k(()=>[s(g,J(i,{src:i.placeholder,preview:!1}),null,16,["src"])]),key:"0"}:void 0]),1040))),128))]),_:3})],2)}const f=q(p,[["render",D]]),P="/assets/resume-8f27866b.svg",x="/assets/p-rotate-cb8bbfc3.svg",O="/assets/scale-44abde22.svg",N="/assets/unscale-c552f416.svg",h="/assets/unrotate-ef6a2daf.svg";var n=function(a){return a[a.LOADING=0]="LOADING",a[a.DONE=1]="DONE",a[a.FAIL=2]="FAIL",a}(n||{});const _={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}},r="img-preview",ee=R({name:"ImagePreview",props:_,emits:["img-load","img-error"],setup(a,{expose:u,emit:m}){const l=new Map,t=Se({currentUrl:"",imgScale:1,imgRotate:0,imgTop:0,imgLeft:0,status:n.LOADING,currentIndex:0,moveX:0,moveY:0,show:a.show}),y=K(null),g=K(null);function L(){oe();const{index:e,imageList:o}=a;if(!o||!o.length)throw new Error("imageList is undefined");t.currentIndex=e,T(o[e])}function i(){t.imgScale=1,t.imgRotate=0,t.imgTop=0,t.imgLeft=0}function oe(){const e=v(y);e&&(e.onmousewheel=E,document.body.addEventListener("DOMMouseScroll",E),document.ondragstart=function(){return!1})}const S=$(()=>{var o;const e=(o=a==null?void 0:a.scaleStep)!=null?o:0;return(e!=null?e:0>0)?e/100:t.imgScale/10});function E(e){e=e||window.event,e.delta=e.wheelDelta||-e.detail,e.preventDefault(),e.delta>0&&b(S.value),e.delta<0&&b(-S.value)}function b(e){t.imgScale<=.2&&e<0||(t.imgScale+=e*.1,t.imgScale<0&&(t.imgScale=.02))}function M(e){t.imgRotate+=e}function ne(){const e=v(g);e&&(e.onmousemove=null)}function T(e){t.status=n.LOADING;const o=new Image;o.src=e,o.onload=c=>{if(t.currentUrl!==e){const d=c.composedPath();if(a.rememberState){l.set(t.currentUrl,{scale:t.imgScale,top:t.imgTop,left:t.imgLeft,rotate:t.imgRotate});const w=l.get(e);w?(t.imgScale=w.scale,t.imgTop=w.top,t.imgRotate=w.rotate,t.imgLeft=w.left):(i(),a.defaultWidth&&(t.imgScale=a.defaultWidth/d[0].naturalWidth))}else a.defaultWidth&&(t.imgScale=a.defaultWidth/d[0].naturalWidth);d&&m("img-load",{index:t.currentIndex,dom:d[0],url:e})}t.currentUrl=e,t.status=n.DONE},o.onerror=c=>{const d=c.composedPath();d&&m("img-error",{index:t.currentIndex,dom:d[0],url:e}),t.status=n.FAIL}}function X(e){e&&e.stopPropagation(),Y()}function Y(){t.show=!1,document.body.removeEventListener("DOMMouseScroll",E),document.ondragstart=null}function U(){i()}u({resume:U,close:Y,prev:A.bind(null,"left"),next:A.bind(null,"right"),setScale:e=>{e>0&&e<=10&&(t.imgScale=e)},setRotate:e=>{t.imgRotate=e}});function A(e){const{currentIndex:o}=t,{imageList:c}=a;e==="left"&&(t.currentIndex--,o<=0&&(t.currentIndex=c.length-1)),e==="right"&&(t.currentIndex++,o>=c.length-1&&(t.currentIndex=0)),T(c[t.currentIndex])}function re(e){e=e||window.event,t.moveX=e.clientX,t.moveY=e.clientY;const o=v(g);o&&(o.onmousemove=le)}function le(e){e=e||window.event,e.preventDefault();const o=e.clientX-t.moveX,c=e.clientY-t.moveY;t.imgLeft+=o,t.imgTop+=c,t.moveX=e.clientX,t.moveY=e.clientY}const ie=$(()=>{const{imgScale:e,imgRotate:o,imgTop:c,imgLeft:d}=t;return{transform:`scale(${e}) rotate(${o}deg)`,marginTop:`${c}px`,marginLeft:`${d}px`,maxWidth:a.defaultWidth?"unset":"100%"}}),F=$(()=>{const{imageList:e}=a;return e.length>1});be(()=>{a.show&&L(),a.imageList&&i()});const ce=e=>{a.maskClosable&&e.target&&e.target.classList.contains(`${r}-content`)&&X(e)},me=()=>s("div",{class:`${r}__close`,onClick:X},[s(Ce,{class:`${r}__close-icon`},null)]),ue=()=>{if(!v(F))return null;const{currentIndex:e}=t,{imageList:o}=a;return s("div",{class:`${r}__index`},[e+1,Q(" / "),o.length])},de=()=>s("div",{class:`${r}__controller`},[s("div",{class:`${r}__controller-item`,onClick:()=>b(-S.value)},[s("img",{src:N},null)]),s("div",{class:`${r}__controller-item`,onClick:()=>b(S.value)},[s("img",{src:O},null)]),s("div",{class:`${r}__controller-item`,onClick:U},[s("img",{src:P},null)]),s("div",{class:`${r}__controller-item`,onClick:()=>M(-90)},[s("img",{src:h},null)]),s("div",{class:`${r}__controller-item`,onClick:()=>M(90)},[s("img",{src:x},null)])]),B=e=>v(F)?s("div",{class:[`${r}__arrow`,e],onClick:()=>A(e)},[e==="left"?s(ke,null,null):s(De,null,null)]):null;return()=>t.show&&s("div",{class:r,ref:y,onMouseup:ne,onClick:ce},[s("div",{class:`${r}-content`},[s("img",{style:v(ie),class:[`${r}-image`,t.status===n.DONE?"":"hidden"],ref:g,src:t.currentUrl,onMousedown:re},null),me(),ue(),de(),B("left"),B("right")])])}});let W=null;function te(a){var l;if(!ve)return;const u={},m=document.createElement("div");return Object.assign(u,{show:!0,index:0,scaleStep:100},a),W=s(ee,u),$e(W,m),document.body.appendChild(m),(l=W.component)==null?void 0:l.exposed}const G=["https://picsum.photos/id/66/346/216","https://picsum.photos/id/67/346/216","https://picsum.photos/id/68/346/216"],ae=R({components:{PageWrapper:Pe,ImagePreview:f},setup(){function a(){te({imageList:G,defaultWidth:700,rememberState:!0,onImgLoad:({index:u,url:m,dom:l})=>{}})}return{imgList:G,openImg:a}}});function se(a,u,m,l,t,y){const g=I("ImagePreview"),L=I("a-button"),i=I("PageWrapper");return C(),H(i,{title:"\u56FE\u7247\u9884\u89C8\u793A\u4F8B"},{default:k(()=>[s(g,{imageList:a.imgList},null,8,["imageList"]),s(L,{onClick:a.openImg,type:"primary"},{default:k(()=>[Q("\u65E0\u9884\u89C8\u56FE")]),_:1},8,["onClick"])]),_:1})}Z=q(ae,[["render",se]])}));export{Ee as __tla,Z as default};
|
