mirror of
https://gitee.com/niucloud-team/niucloud-admin.git
synced 2026-01-05 12:38:10 +00:00
2 lines
5.8 KiB
JavaScript
2 lines
5.8 KiB
JavaScript
import{d as ie,v as ue,T as ce,c as O}from"./event-a537c4cb.js";import{b as de,d as fe,a as q,af as me,ag as ve,E as k,a7 as pe,h as ge,j as be,ah as ke,ai as we,aj as _e,ak as Ie}from"./index-72686045.js";import{m as he}from"./index-8cefa3ab.js";import{z as xe,u as ye,_ as Ce,k as Ee,w as ze}from"./base-0e92f4db.js";import{u as Ne,E as x}from"./index-6cae7119.js";import{u as Te}from"./focus-trap-83769a43.js";import{d as G,V as j,r as C,aw as Oe,s as Le,c as y,w as H,A as Re,o as Ae,b as E,m as W,q as l,p,f as d,n as c,u as e,h as Z,C as z,e as V,F as U,U as Ve,t as Xe,L as $e,g as Ye,a1 as Me}from"./runtime-core.esm-bundler-67034826.js";import{d as Se}from"./debounce-f6ba9d12.js";var Be="Expected a function";function X(_,N,g){var o=!0,f=!0;if(typeof _!="function")throw new TypeError(Be);return xe(g)&&(o="leading"in g?!!g.leading:o,f="trailing"in g?!!g.trailing:f),Se(_,N,{leading:o,maxWait:N,trailing:f})}const Fe=de({urlList:{type:fe(Array),default:()=>he([])},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}}),De={close:()=>!0,switch:_=>q(_)},Pe=["src"],je=G({name:"ElImageViewer"}),He=G({...je,props:Fe,emits:De,setup(_,{expose:N,emit:g}){const o=_,f={CONTAIN:{name:"contain",icon:j(me)},ORIGINAL:{name:"original",icon:j(ve)}},{t:J}=Ne(),s=ye("image-viewer"),{nextZIndex:K}=Te(),L=C(),$=C([]),Y=Oe(),I=C(!0),b=C(o.initialIndex),T=Le(f.CONTAIN),r=C({scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}),Q=y(()=>{const{urlList:a}=o;return a.length<=1}),M=y(()=>b.value===0),S=y(()=>b.value===o.urlList.length-1),ee=y(()=>o.urlList[b.value]),ae=y(()=>{const{scale:a,deg:t,offsetX:n,offsetY:i,enableTransition:m}=r.value;let u=n/a,v=i/a;switch(t%360){case 90:case-270:[u,v]=[v,-u];break;case 180:case-180:[u,v]=[-u,-v];break;case 270:case-90:[u,v]=[-v,u];break}const h={transform:`scale(${a}) rotate(${t}deg) translate(${u}px, ${v}px)`,transition:m?"transform .3s":""};return T.value.name===f.CONTAIN.name&&(h.maxWidth=h.maxHeight="100%"),h}),te=y(()=>q(o.zIndex)?o.zIndex:K());function R(){se(),g("close")}function ne(){const a=X(n=>{switch(n.code){case x.esc:o.closeOnPressEscape&&R();break;case x.space:F();break;case x.left:D();break;case x.up:w("zoomIn");break;case x.right:P();break;case x.down:w("zoomOut");break}}),t=X(n=>{const i=n.deltaY||n.deltaX;w(i<0?"zoomIn":"zoomOut",{zoomRate:o.zoomRate,enableTransition:!1})});Y.run(()=>{O(document,"keydown",a),O(document,"wheel",t)})}function se(){Y.stop()}function oe(){I.value=!1}function le(a){I.value=!1,a.target.alt=J("el.image.error")}function re(a){if(I.value||a.button!==0||!L.value)return;r.value.enableTransition=!1;const{offsetX:t,offsetY:n}=r.value,i=a.pageX,m=a.pageY,u=X(h=>{r.value={...r.value,offsetX:t+h.pageX-i,offsetY:n+h.pageY-m}}),v=O(document,"mousemove",u);O(document,"mouseup",()=>{v()}),a.preventDefault()}function B(){r.value={scale:1,deg:0,offsetX:0,offsetY:0,enableTransition:!1}}function F(){if(I.value)return;const a=Ee(f),t=Object.values(f),n=T.value.name,m=(t.findIndex(u=>u.name===n)+1)%a.length;T.value=f[a[m]],B()}function A(a){const t=o.urlList.length;b.value=(a+t)%t}function D(){M.value&&!o.infinite||A(b.value-1)}function P(){S.value&&!o.infinite||A(b.value+1)}function w(a,t={}){if(I.value)return;const{zoomRate:n,rotateDeg:i,enableTransition:m}={zoomRate:o.zoomRate,rotateDeg:90,enableTransition:!0,...t};switch(a){case"zoomOut":r.value.scale>.2&&(r.value.scale=Number.parseFloat((r.value.scale/n).toFixed(3)));break;case"zoomIn":r.value.scale<7&&(r.value.scale=Number.parseFloat((r.value.scale*n).toFixed(3)));break;case"clockwise":r.value.deg+=i;break;case"anticlockwise":r.value.deg-=i;break}r.value.enableTransition=m}return H(ee,()=>{Re(()=>{const a=$.value[0];a!=null&&a.complete||(I.value=!0)})}),H(b,a=>{B(),g("switch",a)}),Ae(()=>{var a,t;ne(),(t=(a=L.value)==null?void 0:a.focus)==null||t.call(a)}),N({setActiveItem:A}),(a,t)=>(E(),W(Me,{to:"body",disabled:!a.teleported},[l(ce,{name:"viewer-fade",appear:""},{default:p(()=>[d("div",{ref_key:"wrapper",ref:L,tabindex:-1,class:c(e(s).e("wrapper")),style:Z({zIndex:e(te)})},[d("div",{class:c(e(s).e("mask")),onClick:t[0]||(t[0]=ie(n=>a.hideOnClickModal&&R(),["self"]))},null,2),z(" CLOSE "),d("span",{class:c([e(s).e("btn"),e(s).e("close")]),onClick:R},[l(e(k),null,{default:p(()=>[l(e(pe))]),_:1})],2),z(" ARROW "),e(Q)?z("v-if",!0):(E(),V(U,{key:0},[d("span",{class:c([e(s).e("btn"),e(s).e("prev"),e(s).is("disabled",!a.infinite&&e(M))]),onClick:D},[l(e(k),null,{default:p(()=>[l(e(ge))]),_:1})],2),d("span",{class:c([e(s).e("btn"),e(s).e("next"),e(s).is("disabled",!a.infinite&&e(S))]),onClick:P},[l(e(k),null,{default:p(()=>[l(e(be))]),_:1})],2)],64)),z(" ACTIONS "),d("div",{class:c([e(s).e("btn"),e(s).e("actions")])},[d("div",{class:c(e(s).e("actions__inner"))},[l(e(k),{onClick:t[1]||(t[1]=n=>w("zoomOut"))},{default:p(()=>[l(e(ke))]),_:1}),l(e(k),{onClick:t[2]||(t[2]=n=>w("zoomIn"))},{default:p(()=>[l(e(we))]),_:1}),d("i",{class:c(e(s).e("actions__divider"))},null,2),l(e(k),{onClick:F},{default:p(()=>[(E(),W(Ve(e(T).icon)))]),_:1}),d("i",{class:c(e(s).e("actions__divider"))},null,2),l(e(k),{onClick:t[3]||(t[3]=n=>w("anticlockwise"))},{default:p(()=>[l(e(_e))]),_:1}),l(e(k),{onClick:t[4]||(t[4]=n=>w("clockwise"))},{default:p(()=>[l(e(Ie))]),_:1})],2)],2),z(" CANVAS "),d("div",{class:c(e(s).e("canvas"))},[(E(!0),V(U,null,Xe(a.urlList,(n,i)=>$e((E(),V("img",{ref_for:!0,ref:m=>$.value[i]=m,key:n,src:n,style:Z(e(ae)),class:c(e(s).e("img")),onLoad:oe,onError:le,onMousedown:re},null,46,Pe)),[[ue,i===b.value]])),128))],2),Ye(a.$slots,"default")],6)]),_:3})],8,["disabled"]))}});var We=Ce(He,[["__file","/home/runner/work/element-plus/element-plus/packages/components/image-viewer/src/image-viewer.vue"]]);const aa=ze(We);export{aa as E,X as t};
|