import{K as L,R as $,H as G}from"./index.DYFzjhQc.js";import"./elementPlus.CXoFsoPv.js";import{d as M,r as d,w as Z,k as J,ai as N,o as l,c as u,a as m,M as w,O as B,F as X,a8 as Y,Q as I,K as ee,U as g,R as h,I as z,Z as te,i as oe}from"./vue.1RczIYhx.js";const ae=M({name:"FsCropperUploader",props:{disabled:{},modelValue:{type:[String,Object,Array]},img:{},type:{type:String},uploadTip:{type:String},title:String,cropperHeight:{type:[String,Number]},dialogWidth:{type:[String,Number],default:"50%"},maxSize:{type:Number,default:5},limit:{type:Number,default:1},accept:{type:String,default:".jpg, .jpeg, .png, .gif, .webp"},cropper:{type:Object},uploader:{type:Object},compressQuality:{type:Number,default:.8},buildUrl:{type:Function,default:async function(e){return typeof e=="object"?e.url:e}},valueType:{type:String,default:"url"}},emits:["update:modelValue","change","ready"],setup(e,p){const{ui:b}=$(),f=d(),S=d(),C=d(),i=d([]),n=b.formItem.injectFormItemContext();let v=e.modelValue;a(e.modelValue);async function a(t){const o=[];if(t==null||t===""){i.value=o;return}if(typeof t=="string")o.push({url:await e.buildUrl(t),value:t,status:"done"});else if(typeof t=="object")o.push({url:await e.buildUrl(t),value:t,status:"done"});else for(const r of t)o.push({url:await e.buildUrl(r),value:r,status:"done"});i.value=o}function y(){e.disabled||(C.value=void 0,f.value.clear(),f.value.open())}function P(t){i.value.splice(t,1),j()}function O(){const t=i.value;if(t&&t.length>0){for(const o of t)if(o.status==="uploading")return!0}return!1}async function D(t){const o=t.blob,r=t.dataUrl,F=t.file.name,W=new File([o],F,{type:o.type}),c=te({url:void 0,dataUrl:r,status:"uploading",progress:0}),A=s=>{c.progress=s.percent},T=s=>{c.status="error",c.message="文件上传出错:"+s.message,console.error(s)},K={file:W,onProgress:A,onError:T,fileName:F};i.value.push(c);try{const s=await V(K);let R=s;e.valueType!=="object"&&(R=s[e.valueType]),c.url=await e.buildUrl(R),c.value=R,c.status="done",j()}catch(s){T(s)}}async function V(t){t.options=e.uploader||{};const{getUploaderImpl:o}=G();let r=await o(t.options.type);if(r==null)throw new Error("Sorry,The component is not ready yet");return await(r==null?void 0:r.upload(t))}async function j(){const t=[];for(const r of i.value)typeof r=="string"?t.push(r):t.push(r.value);let o=t;e.limit===1&&(o=t&&t.length>0?t[0]:void 0),v=o,p.emit("update:modelValue",o),await n.onChange(),await n.onBlur()}function x(t){return t.dataUrl?t.dataUrl:t.url}const U=d(!1),k=d();function H(t){U.value=!0,k.value=x(t)}function Q(){U.value=!1,k.value=null}Z(()=>e.modelValue,async t=>{p.emit("change",t),t!==v&&await a(t)});const _=oe();function q(t){p.emit("ready",{uploaderRef:_,...t})}const E=J(()=>({...e}));return{ui:b,cropperRef:f,uploaderImplRef:S,indexRef:C,listRef:i,addNewImage:y,hasUploading:O,cropComplete:D,doUpload:V,removeImage:P,getImageSrc:x,previewUrl:k,previewVisible:U,preview:H,closePreview:Q,doReady:q,computedProps:E}}}),re={class:"image-list"},le={class:"image-slot"},ie={class:"delete"},se={key:0,class:"status-uploading"},pe={key:1,class:"status-done"},ne={class:"fs-cropper-preview-content"},ce=["src"];function ue(e,p,b,f,S,C){const i=N("fs-loading"),n=N("fs-icon"),v=N("fs-cropper");return l(),u("div",{class:z(["fs-cropper-uploader",{"is-disabled":e.computedProps.disabled}])},[m("div",re,[(l(),w(I(e.ui.imageGroup.name),null,{default:B(()=>[(l(!0),u(X,null,Y(e.listRef,(a,y)=>(l(),u("div",{key:y,class:"image-item"},[(l(),w(I(e.ui.image.name),ee({class:"image",src:e.getImageSrc(a),ref_for:!0},e.computedProps.img),{placeholder:B(()=>[m("div",le,[g(i,{loading:!0})])]),_:2},1040,["src"])),m("div",ie,[e.computedProps.disabled?h("",!0):(l(),w(n,{key:0,icon:e.ui.icons.remove,onClick:P=>e.removeImage(y)},null,8,["icon","onClick"])),g(n,{icon:e.ui.icons.search,onClick:P=>e.preview(a)},null,8,["icon","onClick"])]),a.status==="uploading"?(l(),u("div",se,[(l(),w(I(e.ui.progress.name),{type:"circle",percentage:a.progress,width:70},null,8,["percentage"]))])):a.status==="done"?(l(),u("div",pe,[g(n,{icon:e.ui.icons.check,class:"status-down-icon"},null,8,["icon"])])):h("",!0)]))),128)),e.computedProps.limit<=0||e.computedProps.limit>e.listRef.length?(l(),u("div",{key:0,class:"image-item image-plus",onClick:p[0]||(p[0]=(...a)=>e.addNewImage&&e.addNewImage(...a))},[g(n,{icon:e.ui.icons.plus,class:"cropper-uploader-icon"},null,8,["icon"])])):h("",!0)]),_:1}))]),g(v,{ref:"cropperRef",title:e.computedProps.title,"cropper-height":e.computedProps.cropperHeight,"dialog-width":e.computedProps.dialogWidth,accept:e.computedProps.accept,"upload-tip":e.computedProps.uploadTip,"max-size":e.computedProps.maxSize,cropper:e.computedProps.cropper,"compress-quality":e.computedProps.compressQuality,output:"all",onDone:e.cropComplete,onReady:e.doReady},null,8,["title","cropper-height","dialog-width","accept","upload-tip","max-size","cropper","compress-quality","onDone","onReady"]),m("div",{class:z(["fs-cropper-preview",{open:e.previewVisible}]),onClick:p[1]||(p[1]=(...a)=>e.closePreview&&e.closePreview(...a))},[m("div",ne,[e.previewUrl?(l(),u("img",{key:0,src:e.previewUrl,class:"preview-image"},null,8,ce)):h("",!0)])],2)],2)}const fe=L(ae,[["render",ue]]);export{fe as default};