| 1 |
- import{m as j,d as H,aj as O,w as _,R as G,aC as ge,S as q,v as U,E as N,Y as he,k as i,a1 as J,aF as Y,L as te,bc as we,G as oe,X as Pe,am as ye,aD as be,W as Ie,z as K,as as M,P as Se,t as A,aT as ne,q as X,O as Q,n as L,at as xe,aI as Ce,a2 as E,au as ie,a6 as pe,N as V,aX as ze,aY as Re,y as se,$ as le,M as Te,bd as re,Z as ke,a7 as Fe,aR as Ae,a8 as De,ax as Xe,K as Le}from"./index.879f7421.js";import{a as Ue,S as Ye}from"./index.3c962eae.js";import{I as ce}from"./index.c463dbd0.js";const ee=e=>Math.sqrt((e[0].clientX-e[1].clientX)**2+(e[0].clientY-e[1].clientY)**2),W=j("image-preview")[1];var Oe=H({props:{src:String,show:Boolean,active:Number,minZoom:O(_),maxZoom:O(_),rootWidth:O(Number),rootHeight:O(Number)},emits:["scale","close","longPress"],setup(e,{emit:n,slots:r}){const a=G({scale:1,moveX:0,moveY:0,moving:!1,zooming:!1,imageRatio:0,displayWidth:0,displayHeight:0}),s=ge(),w=q(),S=U(()=>{const{rootWidth:t,rootHeight:u}=e,m=u/t;return a.imageRatio>m}),p=U(()=>{const{scale:t,moveX:u,moveY:m,moving:C,zooming:k}=a,$={transitionDuration:k||C?"0s":".3s"};if(t!==1){const ve=u/t,fe=m/t;$.transform=`scale(${t}, ${t}) translate(${ve}px, ${fe}px)`}return $}),y=U(()=>{if(a.imageRatio){const{rootWidth:t,rootHeight:u}=e,m=S.value?u/a.imageRatio:t;return Math.max(0,(a.scale*m-t)/2)}return 0}),l=U(()=>{if(a.imageRatio){const{rootWidth:t,rootHeight:u}=e,m=S.value?u:t*a.imageRatio;return Math.max(0,(a.scale*m-u)/2)}return 0}),v=t=>{t=Y(t,+e.minZoom,+e.maxZoom+1),t!==a.scale&&(a.scale=t,n("scale",{scale:t,index:e.active}))},b=()=>{v(1),a.moveX=0,a.moveY=0},h=()=>{const t=a.scale>1?1:2;v(t),a.moveX=0,a.moveY=0};let z,F,T,c,x,I,Z;const o=t=>{const{touches:u}=t,{offsetX:m}=s;s.start(t),z=u.length,F=a.moveX,T=a.moveY,Z=Date.now(),a.moving=z===1&&a.scale!==1,a.zooming=z===2&&!m.value,a.zooming&&(c=a.scale,x=ee(t.touches))},d=t=>{const{touches:u}=t;if(s.move(t),(a.moving||a.zooming)&&J(t,!0),a.moving){const{deltaX:m,deltaY:C}=s,k=m.value+F,$=C.value+T;a.moveX=Y(k,-y.value,y.value),a.moveY=Y($,-l.value,l.value)}if(a.zooming&&u.length===2){const m=ee(u),C=c*m/x;v(C)}},P=()=>{if(z>1)return;const{offsetX:t,offsetY:u}=s,m=Date.now()-Z,C=250,k=5;t.value<k&&u.value<k&&(m<C?I?(clearTimeout(I),I=null,h()):I=setTimeout(()=>{n("close"),I=null},C):m>we&&n("longPress"))},f=t=>{let u=!1;(a.moving||a.zooming)&&(u=!0,a.moving&&F===a.moveX&&T===a.moveY&&(u=!1),t.touches.length||(a.zooming&&(a.moveX=Y(a.moveX,-y.value,y.value),a.moveY=Y(a.moveY,-l.value,l.value),a.zooming=!1),a.moving=!1,F=0,T=0,c=1,a.scale<1&&b(),a.scale>e.maxZoom&&(a.scale=+e.maxZoom))),J(t,u),P(),s.reset()},R=t=>{const{naturalWidth:u,naturalHeight:m}=t.target;a.imageRatio=m/u};return N(()=>e.active,b),N(()=>e.show,t=>{t||b()}),he("touchmove",d,{target:U(()=>{var t;return(t=w.value)==null?void 0:t.$el})}),()=>{const t={loading:()=>i(te,{type:"spinner"},null)};return i(Ue,{ref:w,class:W("swipe-item"),onTouchstartPassive:o,onTouchend:f,onTouchcancel:f},{default:()=>[r.image?i("div",{class:W("image-wrap")},[r.image({src:e.src})]):i(ce,{src:e.src,fit:"contain",class:W("image",{vertical:S.value}),style:p.value,onLoad:R},t)]})}}});const[Me,D]=j("image-preview"),Ne=["show","transition","overlayStyle","closeOnPopstate"],Ee={show:Boolean,loop:A,images:ne(),minZoom:X(1/3),maxZoom:X(3),overlay:A,closeable:Boolean,showIndex:A,className:Q,closeIcon:L("clear"),transition:String,beforeClose:Function,overlayClass:Q,overlayStyle:Object,swipeDuration:X(300),startPosition:X(0),showIndicators:Boolean,closeOnPopstate:A,closeIconPosition:L("top-right")};var ue=H({name:Me,props:Ee,emits:["scale","close","closed","change","longPress","update:show"],setup(e,{emit:n,slots:r}){const a=q(),s=G({active:0,rootWidth:0,rootHeight:0}),w=()=>{if(a.value){const c=xe(a.value.$el);s.rootWidth=c.width,s.rootHeight=c.height,a.value.resize()}},S=c=>n("scale",c),p=c=>n("update:show",c),y=()=>{ie(e.beforeClose,{args:[s.active],done:()=>p(!1)})},l=c=>{c!==s.active&&(s.active=c,n("change",c))},v=()=>{if(e.showIndex)return i("div",{class:D("index")},[r.index?r.index({index:s.active}):`${s.active+1} / ${e.images.length}`])},b=()=>{if(r.cover)return i("div",{class:D("cover")},[r.cover()])},h=()=>i(Ye,{ref:a,lazyRender:!0,loop:e.loop,class:D("swipe"),duration:e.swipeDuration,initialSwipe:e.startPosition,showIndicators:e.showIndicators,indicatorColor:"white",onChange:l},{default:()=>[e.images.map((c,x)=>i(Oe,{src:c,show:e.show,active:s.active,maxZoom:e.maxZoom,minZoom:e.minZoom,rootWidth:s.rootWidth,rootHeight:s.rootHeight,onScale:S,onClose:y,onLongPress:()=>n("longPress",{index:x})},{image:r.image}))]}),z=()=>{if(e.closeable)return i(E,{role:"button",name:e.closeIcon,class:[D("close-icon",e.closeIconPosition),Ce],onClick:y},null)},F=()=>n("closed"),T=(c,x)=>{var I;return(I=a.value)==null?void 0:I.swipeTo(c,x)};return oe({swipeTo:T}),Pe(w),N([ye,be],w),N(()=>e.startPosition,c=>l(+c)),N(()=>e.show,c=>{const{images:x,startPosition:I}=e;c?(l(+I),Ie(()=>{w(),T(+I,{immediate:!0})})):n("close",{index:s.active,url:x[s.active]})}),()=>i(Se,K({class:[D(),e.className],overlayClass:[D("overlay"),e.overlayClass],onClosed:F,"onUpdate:show":p},M(e,Ne)),{default:()=>[z(),h(),v(),b()]})}});let B;const Ze={loop:!0,images:[],maxZoom:3,minZoom:1/3,onScale:void 0,onClose:void 0,onChange:void 0,teleport:"body",className:"",showIndex:!0,closeable:!1,closeIcon:"clear",transition:void 0,beforeClose:void 0,overlayStyle:void 0,overlayClass:void 0,startPosition:0,swipeDuration:300,showIndicators:!1,closeOnPopstate:!0,closeIconPosition:"top-right"};function $e(){({instance:B}=ze({setup(){const{state:e,toggle:n}=Re(),r=()=>{e.images=[]};return()=>i(ue,K(e,{onClosed:r,"onUpdate:show":n}),null)}}))}const Be=(e,n=0)=>{if(!!pe)return B||$e(),e=Array.isArray(e)?{images:e,startPosition:n}:e,B.open(V({},Ze,e)),B};se(ue);const[Ve,g,He]=j("uploader");function ae(e,n){return new Promise(r=>{if(n==="file"){r();return}const a=new FileReader;a.onload=s=>{r(s.target.result)},n==="dataUrl"?a.readAsDataURL(e):n==="text"&&a.readAsText(e)})}function de(e,n){return le(e).some(r=>r.file?Te(n)?n(r.file):r.file.size>n:!1)}function We(e,n){const r=[],a=[];return e.forEach(s=>{de(s,n)?a.push(s):r.push(s)}),{valid:r,invalid:a}}const _e=/\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i,je=e=>_e.test(e);function me(e){return e.isImage?!0:e.file&&e.file.type?e.file.type.indexOf("image")===0:e.url?je(e.url):typeof e.content=="string"?e.content.indexOf("data:image")===0:!1}var Ge=H({props:{name:_,item:O(Object),index:Number,imageFit:String,lazyLoad:Boolean,deletable:Boolean,previewSize:[Number,String,Array],beforeDelete:Function},emits:["delete","preview"],setup(e,{emit:n,slots:r}){const a=()=>{const{status:l,message:v}=e.item;if(l==="uploading"||l==="failed"){const b=l==="failed"?i(E,{name:"close",class:g("mask-icon")},null):i(te,{class:g("loading")},null),h=ke(v)&&v!=="";return i("div",{class:g("mask")},[b,h&&i("div",{class:g("mask-message")},[v])])}},s=l=>{const{name:v,item:b,index:h,beforeDelete:z}=e;l.stopPropagation(),ie(z,{args:[b,{name:v,index:h}],done:()=>n("delete")})},w=()=>n("preview"),S=()=>{if(e.deletable&&e.item.status!=="uploading"){const l=r["preview-delete"];return i("div",{role:"button",class:g("preview-delete",{shadow:!l}),tabindex:0,"aria-label":He("delete"),onClick:s},[l?l():i(E,{name:"cross",class:g("preview-delete-icon")},null)])}},p=()=>{if(r["preview-cover"]){const{index:l,item:v}=e;return i("div",{class:g("preview-cover")},[r["preview-cover"](V({index:l},v))])}},y=()=>{const{item:l,lazyLoad:v,imageFit:b,previewSize:h}=e;return me(l)?i(ce,{fit:b,src:l.content||l.url,class:g("preview-image"),width:Array.isArray(h)?h[0]:h,height:Array.isArray(h)?h[1]:h,lazyLoad:v,onClick:w},{default:p}):i("div",{class:g("file"),style:re(e.previewSize)},[i(E,{class:g("file-icon"),name:"description"},null),i("div",{class:[g("file-name"),"van-ellipsis"]},[l.file?l.file.name:l.url]),p()])};return()=>i("div",{class:g("preview")},[y(),a(),S()])}});const qe={name:X(""),accept:L("image/*"),capture:String,multiple:Boolean,disabled:Boolean,readonly:Boolean,lazyLoad:Boolean,maxCount:X(1/0),imageFit:L("cover"),resultType:L("dataUrl"),uploadIcon:L("photograph"),uploadText:String,deletable:A,afterRead:Function,showUpload:A,modelValue:ne(),beforeRead:Function,beforeDelete:Function,previewSize:[Number,String,Array],previewImage:A,previewOptions:Object,previewFullImage:A,maxSize:{type:[Number,String,Function],default:1/0}};var Ke=H({name:Ve,props:qe,emits:["delete","oversize","clickUpload","closePreview","clickPreview","update:modelValue"],setup(e,{emit:n,slots:r}){const a=q(),s=[],w=(o=e.modelValue.length)=>({name:e.name,index:o}),S=()=>{a.value&&(a.value.value="")},p=o=>{if(S(),de(o,e.maxSize))if(Array.isArray(o)){const d=We(o,e.maxSize);if(o=d.valid,n("oversize",d.invalid,w()),!o.length)return}else{n("oversize",o,w());return}o=G(o),n("update:modelValue",[...e.modelValue,...le(o)]),e.afterRead&&e.afterRead(o,w())},y=o=>{const{maxCount:d,modelValue:P,resultType:f}=e;if(Array.isArray(o)){const R=+d-P.length;o.length>R&&(o=o.slice(0,R)),Promise.all(o.map(t=>ae(t,f))).then(t=>{const u=o.map((m,C)=>{const k={file:m,status:"",message:""};return t[C]&&(k.content=t[C]),k});p(u)})}else ae(o,f).then(R=>{const t={file:o,status:"",message:""};R&&(t.content=R),p(t)})},l=o=>{const{files:d}=o.target;if(e.disabled||!d||!d.length)return;const P=d.length===1?d[0]:[].slice.call(d);if(e.beforeRead){const f=e.beforeRead(P,w());if(!f){S();return}if(Le(f)){f.then(R=>{y(R||P)}).catch(S);return}}y(P)};let v;const b=()=>n("closePreview"),h=o=>{if(e.previewFullImage){const d=e.modelValue.filter(me),P=d.map(f=>(f.file&&!f.url&&f.status!=="failed"&&(f.url=URL.createObjectURL(f.file),s.push(f.url)),f.url)).filter(Boolean);v=Be(V({images:P,startPosition:d.indexOf(o),onClose:b},e.previewOptions))}},z=()=>{v&&v.close()},F=(o,d)=>{const P=e.modelValue.slice(0);P.splice(d,1),n("update:modelValue",P),n("delete",o,w(d))},T=(o,d)=>{const P=["imageFit","deletable","previewSize","beforeDelete"],f=V(M(e,P),M(o,P,!0));return i(Ge,K({item:o,index:d,onClick:()=>n("clickPreview",o,w(d)),onDelete:()=>F(o,d),onPreview:()=>h(o)},M(e,["name","lazyLoad"]),f),M(r,["preview-cover","preview-delete"]))},c=()=>{if(e.previewImage)return e.modelValue.map(T)},x=o=>n("clickUpload",o),I=()=>{if(e.modelValue.length>=e.maxCount)return;const o=e.readonly?null:i("input",{ref:a,type:"file",class:g("input"),accept:e.accept,capture:e.capture,multiple:e.multiple,disabled:e.disabled,onChange:l},null);return r.default?i("div",{class:g("input-wrapper"),onClick:x},[r.default(),o]):De(i("div",{class:g("upload",{readonly:e.readonly}),style:re(e.previewSize),onClick:x},[i(E,{name:e.uploadIcon,class:g("upload-icon")},null),e.uploadText&&i("span",{class:g("upload-text")},[e.uploadText]),o]),[[Xe,e.showUpload]])},Z=()=>{a.value&&!e.disabled&&a.value.click()};return Fe(()=>{s.forEach(o=>URL.revokeObjectURL(o))}),oe({chooseFile:Z,closeImagePreview:z}),Ae(()=>e.modelValue),()=>i("div",{class:g()},[i("div",{class:g("wrapper",{disabled:e.disabled})},[c(),I()])])}});const aa=se(Ke);export{aa as U};
|
