vue-amazing-ui/lib/upload/Upload.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),H=require("../spin/index.cjs"),$=require("../message/index.cjs"),S=require("../image/index.cjs"),I=require("../space/index.cjs"),_=require("../utils/index.cjs"),T=["onDrop","onClick"],j=["accept","multiple","onChange"],A={class:"upload-tip"},O={class:"file-uploading"},W={key:0,class:"file-preview"},G={key:1,class:"file-svg",focusable:"false","data-icon":"file-pdf",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},J={key:2,class:"file-svg",focusable:"false","data-icon":"file",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},K={class:"file-mask"},Q=["onClick"],X=["onClick"],Y=e.defineComponent({__name:"Upload",props:{accept:{default:"*"},multiple:{type:Boolean,default:!1},maxCount:{default:void 0},tip:{default:"Upload"},fit:{default:"contain"},draggable:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},spaceProps:{default:()=>({})},spinProps:{default:()=>({})},imageProps:{default:()=>({})},messageProps:{default:()=>({})},actionMessage:{default:()=>({upload:"上传成功",remove:"删除成功"})},beforeUpload:{type:Function,default:()=>!0},uploadMode:{default:"base64"},customRequest:{type:Function,default:()=>{}},fileList:{default:()=>[]}},emits:["update:fileList","drop","change","preview","remove"],setup(w,{expose:k,emit:y}){const i=w,n=e.ref([]),d=e.ref(1),p=e.ref([]),v=e.ref(),g=e.ref(),r=e.ref(),{colorPalettes:V}=_.useInject("Upload"),u=y,c=e.computed(()=>i.maxCount===void 0?1/0:i.maxCount);e.watchEffect(()=>{b()});function b(){n.value=[...i.fileList],n.value.length>c.value&&n.value.splice(c.value),i.disabled?d.value=n.value.length:n.value.length<c.value?d.value=i.fileList.length+1:d.value=c.value}function m(l){const t=/\.(jpg|jpeg|png|gif)$/i,o=/^data:image/;return t.test(l)||o.test(l)}function M(l){const t=/\.pdf$/i,o=/^data:application\/pdf/;return t.test(l)||o.test(l)}function C(l,t){const o=l.dataTransfer?.files;if(o?.length){const a=o.length;for(let s=0;s<a&&t+s<=c.value;s++)h(o[s],t+s);v.value[t].value=""}u("drop",l)}function E(l){v.value[l].click()}function z(l,t){const o=l.target.files;if(o?.length){const a=o.length;for(let s=0;s<a&&t+s<c.value;s++)h(o[s],t+s);v.value[t].value=""}}const h=async(l,t)=>{new Promise((a,s)=>{try{const f=i.beforeUpload(l);f instanceof Promise?f.then(a,s):typeof f=="boolean"?f?a(f):s(new Error("Function returned false")):a(f)}catch(f){s(f)}}).then(()=>{c.value>d.value&&d.value++,i.uploadMode==="base64"&&(p.value[t]=!0,N(l,t)),i.uploadMode==="custom"&&(p.value[t]=!0,B(l,t))}).catch(a=>{console.log("beforeUpload error:",a)})};function N(l,t){const o=new FileReader;o.readAsDataURL(l),o.onloadstart=function(a){},o.onabort=function(a){},o.onerror=function(a){},o.onprogress=function(a){a.loaded===a.total&&(p.value[t]=!1)},o.onload=function(a){n.value.push({name:l.name,url:a.target?.result}),i.actionMessage.upload&&r.value.success(i.actionMessage.upload),u("update:fileList",n.value),u("change",n.value)},o.onloadend=function(a){}}function B(l,t){i.customRequest(l).then(o=>{n.value.push(o),i.actionMessage.upload&&r.value.success(i.actionMessage.upload),u("update:fileList",n.value),u("change",n.value)}).catch(o=>{c.value>1&&(d.value=n.value.length+1),r.value.error(o)}).finally(()=>{p.value[t]=!1})}function P(l,t){if(m(t)){const o=n.value.slice(0,l).filter(a=>!m(a.url));g.value[l-o.length].preview(0)}else window.open(t);u("preview",n.value[l])}function q(l){n.value.length<c.value&&d.value--;const t=n.value.splice(l,1);i.actionMessage.remove&&r.value.success(i.actionMessage.remove),u("remove",t[0]),u("update:fileList",n.value),u("change",n.value)}function R(l){r.value.info(l)}function L(l){r.value.success(l)}function U(l){r.value.error(l)}function F(l){r.value.warning(l)}function D(l){r.value.loading(l)}return k({info:R,success:L,error:U,warning:F,loading:D}),(l,t)=>(e.openBlock(),e.createElementBlock("div",{class:"upload-wrap",style:e.normalizeStyle(`--upload-primary-color: ${e.unref(V)[5]};`)},[e.createVNode(e.unref(I.default),e.mergeProps({gap:"small"},l.spaceProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,o=>(e.openBlock(),e.createElementBlock("div",{class:"upload-item-panel",key:o},[e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass(["upload-item",{"upload-disabled":l.disabled}]),onDragenter:t[1]||(t[1]=e.withModifiers(()=>{},["stop","prevent"])),onDragover:t[2]||(t[2]=e.withModifiers(()=>{},["stop","prevent"])),onDrop:e.withModifiers(a=>l.draggable&&!l.disabled?C(a,o-1):()=>!1,["stop","prevent"]),onClick:a=>l.disabled?()=>!1:E(o-1)},[e.createElementVNode("input",{ref_for:!0,ref_key:"uploadInputRef",ref:v,type:"file",onClick:t[0]||(t[0]=e.withModifiers(()=>{},["stop"])),accept:l.accept,multiple:l.multiple,onChange:a=>z(a,o-1),style:{display:"none"}},null,40,j),e.createElementVNode("div",null,[t[3]||(t[3]=e.createElementVNode("svg",{focusable:"false",class:"plus-svg","data-icon":"plus",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("defs"),e.createElementVNode("path",{d:"M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"}),e.createElementVNode("path",{d:"M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"})],-1)),e.createElementVNode("p",A,[e.renderSlot(l.$slots,"tip",{},()=>[e.createTextVNode(e.toDisplayString(l.tip),1)],!0)])])],42,T),[[e.vShow,!p.value[o-1]&&!n.value[o-1]]]),e.withDirectives(e.createElementVNode("div",O,[e.createVNode(e.unref(H.default),e.mergeProps({class:"spin-uploading",tip:"uploading",size:"small",indicator:"spin-line",color:"var(--upload-primary-color)"},{ref_for:!0},l.spinProps),null,16)],512),[[e.vShow,p.value[o-1]]]),n.value[o-1]?(e.openBlock(),e.createElementBlock("div",W,[m(n.value[o-1].url)?(e.openBlock(),e.createBlock(e.unref(S.default),e.mergeProps({key:0,ref_for:!0,ref_key:"imageRef",ref:g,style:{"--image-primary-color":"var(--upload-primary-color)"},bordered:!1,width:82,height:82,fit:l.fit,src:n.value[o-1].url,name:n.value[o-1].name},{ref_for:!0},l.imageProps),null,16,["fit","src","name"])):M(n.value[o-1].url)?(e.openBlock(),e.createElementBlock("svg",G,[...t[4]||(t[4]=[e.createElementVNode("path",{d:"M531.3 574.4l.3-1.4c5.8-23.9 13.1-53.7 7.4-80.7-3.8-21.3-19.5-29.6-32.9-30.2-15.8-.7-29.9 8.3-33.4 21.4-6.6 24-.7 56.8 10.1 98.6-13.6 32.4-35.3 79.5-51.2 107.5-29.6 15.3-69.3 38.9-75.2 68.7-1.2 5.5.2 12.5 3.5 18.8 3.7 7 9.6 12.4 16.5 15 3 1.1 6.6 2 10.8 2 17.6 0 46.1-14.2 84.1-79.4 5.8-1.9 11.8-3.9 17.6-5.9 27.2-9.2 55.4-18.8 80.9-23.1 28.2 15.1 60.3 24.8 82.1 24.8 21.6 0 30.1-12.8 33.3-20.5 5.6-13.5 2.9-30.5-6.2-39.6-13.2-13-45.3-16.4-95.3-10.2-24.6-15-40.7-35.4-52.4-65.8zM421.6 726.3c-13.9 20.2-24.4 30.3-30.1 34.7 6.7-12.3 19.8-25.3 30.1-34.7zm87.6-235.5c5.2 8.9 4.5 35.8.5 49.4-4.9-19.9-5.6-48.1-2.7-51.4.8.1 1.5.7 2.2 2zm-1.6 120.5c10.7 18.5 24.2 34.4 39.1 46.2-21.6 4.9-41.3 13-58.9 20.2-4.2 1.7-8.3 3.4-12.3 5 13.3-24.1 24.4-51.4 32.1-71.4zm155.6 65.5c.1.2.2.5-.4.9h-.2l-.2.3c-.8.5-9 5.3-44.3-8.6 40.6-1.9 45 7.3 45.1 7.4zm191.4-388.2L639.4 73.4c-6-6-14.1-9.4-22.6-9.4H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V311.3c0-8.5-3.4-16.7-9.4-22.7zM790.2 326H602V137.8L790.2 326zm1.8 562H232V136h302v216a42 42 0 0042 42h216v494z"},null,-1)])])):(e.openBlock(),e.createElementBlock("svg",J,[...t[5]||(t[5]=[e.createElementVNode("path",{d:"M854.6 288.6L639.4 73.4c-6-6-14.1-9.4-22.6-9.4H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V311.3c0-8.5-3.4-16.7-9.4-22.7zM790.2 326H602V137.8L790.2 326zm1.8 562H232V136h302v216a42 42 0 0042 42h216v494z"},null,-1)])])),e.createElementVNode("div",K,[e.createElementVNode("a",{class:"file-icon",title:"预览",onClick:a=>P(o-1,n.value[o-1].url)},[...t[6]||(t[6]=[e.createElementVNode("svg",{class:"icon-svg",focusable:"false","data-icon":"eye",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("path",{d:"M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z"})],-1)])],8,Q),e.withDirectives(e.createElementVNode("a",{class:"file-icon",title:"删除",onClick:e.withModifiers(a=>q(o-1),["prevent","stop"])},[...t[7]||(t[7]=[e.createElementVNode("svg",{class:"icon-svg",focusable:"false","data-icon":"delete",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("path",{d:"M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"})],-1)])],8,X),[[e.vShow,!l.disabled]])])])):e.createCommentVNode("",!0)]))),128))]),_:3},16),e.createVNode(e.unref($.default),e.mergeProps({ref_key:"messageRef",ref:r},l.messageProps),null,16)],4))}});exports.default=Y;