vue2-vant2-components/lib/vvc-upload/index.js

基于 vue2 和 vant2 开发的移动端表格组件

(function(){"use strict";var t={};!function(){t.n=function(e){var i=e&&e.__esModule?function(){return e["default"]}:function(){return e};return t.d(i,{a:i}),i}}(),function(){t.d=function(e,i){for(var n in i)t.o(i,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:i[n]})}}(),function(){t.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)}}(),function(){t.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}}();var e={};t.r(e),t.d(e,{default:function(){return K}});var i=function(){var t=this,e=t._self._c;return e("div",{staticClass:"vvc-upload"},[["picture-card","avatar"].includes(t.listType)?[e("upload-picture-card",{attrs:{list:t.list,maxCount:"avatar"===t.listType?1:t.maxCount,showFileName:t.showFileName,disabled:t.disabled,readonly:t.readonly},on:{submit:t.submit,deleteItem:t.handleDeleteItem,"click-item":t.handleClickItem},scopedSlots:t._u([{key:"trigger",fn:function(){return[t._t("trigger")]},proxy:!0}],null,!0)})]:"picture"===t.listType?[e("upload-picture",{attrs:{list:t.list,deleteTrigger:t.deleteTrigger,disabled:t.disabled,readonly:t.readonly},on:{submit:t.submit,deleteItem:t.handleDeleteItem,"click-item":t.handleClickItem},scopedSlots:t._u([{key:"trigger",fn:function(){return[t._t("trigger")]},proxy:!0},{key:"tip",fn:function(){return[t._t("tip")]},proxy:!0}],null,!0)})]:[e("upload-text",{attrs:{list:t.list,deleteTrigger:t.deleteTrigger,disabled:t.disabled,readonly:t.readonly},on:{submit:t.submit,deleteItem:t.handleDeleteItem,"click-item":t.handleClickItem},scopedSlots:t._u([{key:"trigger",fn:function(){return[t._t("trigger")]},proxy:!0},{key:"tip",fn:function(){return[t._t("tip")]},proxy:!0}],null,!0)})],e("van-uploader",{directives:[{name:"show",rawName:"v-show",value:!1,expression:"false"}],ref:"vanUploader",attrs:{accept:t.accept,multiple:t.multiple,"lazy-load":t.lazyLoad,capture:t.capture,"before-read":t.handleBeforeUpload,"after-read":t.handleAfterUpload}})],2)},n=[],l=require("vant/lib/uploader"),a=t.n(l),s=require("vant/lib/dialog"),r=t.n(s),o=require("vant/lib/toast"),d=t.n(o),u=require("vant/lib/image-preview"),c=t.n(u),p=(require("vant/lib/uploader/style"),require("vant/lib/dialog/style"),require("vant/lib/toast/style"),require("vant/lib/image-preview/style"),function(){var t=this,e=t._self._c;return e("div",{staticClass:"vvc-upload_pictureCard"},[t._l(t.list,(function(i,n){return e("div",{key:n,staticClass:"vvc-upload_pictureCard_item"},[e("div",{staticClass:"vvc-upload_pictureCard_item_content"},[e("van-image",{attrs:{src:i.url,fit:"cover"},on:{click:function(e){return t.handleClickItem(i)}},scopedSlots:t._u([{key:"loading",fn:function(){return[e("van-loading",{attrs:{type:"spinner",size:"20"}})]},proxy:!0},{key:"error",fn:function(){return[e("van-icon",{attrs:{name:"description"}})]},proxy:!0}],null,!0)}),t.readonly||t.disabled?t._e():e("div",{staticClass:"vvc-upload_pictureCard_item_content_delete",on:{click:function(e){return t.handleDeleteItem(i,n)}}},[e("van-icon",{attrs:{name:"cross"}})],1),["pending"===i.type?e("div",{staticClass:"vvc-upload_pictureCard_item_content_state vvc-upload_pictureCard_item_content_state--loading"},[e("van-circle",{attrs:{value:100*i.progress,text:`${Math.round(100*(i.progress||0))}%`}})],1):t._e(),e("transition",{attrs:{name:"van-fade"}},["rejected"===i.type?e("div",{staticClass:"vvc-upload_pictureCard_item_content_state vvc-upload_pictureCard_item_content_state--error"},[e("van-icon",{attrs:{name:"close"}}),e("p",{staticClass:"vvc-upload_pictureCard_item_content_state_message"},[t._v(t._s(t.t("uploadFailText")))])],1):t._e()])]],2),t.showFileName?e("div",{staticClass:"vvc-upload-picture_item_fileName"},[t._v(t._s(i.name))]):t._e()])})),!t.readonly&&t.maxCount>t.list.length?e("div",{staticClass:"vvc-upload_pictureCard_upload",on:{click:t.handleSubmit}},[t._t("trigger",(function(){return[e("div",{staticClass:"vvc-upload_pictureCard_upload_content"},[e("van-icon",{staticClass:"vvc-upload_pictureCard_upload_icon",attrs:{name:"photograph"}})],1)]}))],2):t._e()],2)}),v=[],m=require("vant/lib/image"),_=t.n(m),h=require("vant/lib/loading"),f=t.n(h),g=require("vant/lib/icon"),y=t.n(g),b=require("vant/lib/circle"),C=t.n(b),x=(require("vant/lib/image/style"),require("vant/lib/loading/style"),require("vant/lib/icon/style"),require("vant/lib/circle/style"),require("vue2-vant2-components/lib/utils/create/i18n.js")),k={data(){return{t:(0,x.createI18N)("upload")}},props:["list","maxCount","showFileName","disabled","readonly"],methods:{handleSubmit(){this.disabled||this.readonly||this.$emit("submit")},handleDeleteItem(t,e){this.$emit("deleteItem",t,e)},handleClickItem(t){this.$emit("click-item",t)}},components:{[_().name]:_(),[f().name]:f(),[y().name]:y(),[C().name]:C()}},I=k;function S(t,e,i,n,l,a,s,r){var o,d="function"===typeof t?t.options:t;if(e&&(d.render=e,d.staticRenderFns=i,d._compiled=!0),n&&(d.functional=!0),a&&(d._scopeId="data-v-"+a),s?(o=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"===typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),l&&l.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(s)},d._ssrRegister=o):l&&(o=r?function(){l.call(this,(d.functional?this.parent:this).$root.$options.shadowRoot)}:l),o)if(d.functional){d._injectStyles=o;var u=d.render;d.render=function(t,e){return o.call(e),u(t,e)}}else{var c=d.beforeCreate;d.beforeCreate=c?[].concat(c,o):[o]}return{exports:t,options:d}}var $=S(I,p,v,!1,null,null,null),L=$.exports,w=function(){var t=this,e=t._self._c;return e("div",{staticClass:"vvc-upload_text"},[t.readonly?t._e():[e("div",{staticClass:"vvc-upload_text_text",on:{click:t.handleSubmit}},[t._t("trigger",(function(){return[e("van-button",{attrs:{icon:"plus",type:"primary",size:"small",disabled:t.disabled}},[t._v(" "+t._s(t.t("uploadButtonText"))+" ")])]}))],2),e("div",{staticClass:"vvc-upload_text_tip"},[t._t("tip")],2)],e("div",{staticClass:"vvc-upload_text_fileList"},t._l(t.list,(function(i,n){return e("div",{directives:[{name:"vvc-longpress",rawName:"v-vvc-longpress",value:()=>t.handleLongpressCell(i,n),expression:"() => handleLongpressCell(item, index)"}],key:n,staticClass:"vvc-upload_text_fileList_item",attrs:{"vvc-longpress-time":1e3},on:{click:function(e){return t.handleClickItem(i)}}},[e("van-swipe-cell",{attrs:{disabled:t.disabled||t.readonly||"swipecell"!==t.deleteTrigger},scopedSlots:t._u([{key:"right",fn:function(){return[e("van-button",{attrs:{square:"",type:"danger",text:t.t("deleteButtonText"),block:""},on:{click:function(e){return e.stopPropagation(),t.handleDeleteItem(i,n)}}})]},proxy:!0}],null,!0)},[[e("div",{staticClass:"vvc-upload_text_fileList_item_content"},[e("van-icon",{staticClass:"vvc-upload_text_fileList_item_content_prefix",attrs:{name:"description"}}),e("span",{staticClass:"vvc-upload_text_fileList_item_content_name"},[t._v(t._s(i.name))]),t.readonly?t._e():e("div",{staticClass:"vvc-upload_text_fileList_item_content_suffix"},["pending"===i.type?e("span",[t._v(t._s(Math.round(100*i.progress))+"%")]):"rejected"===i.type?e("van-icon",{attrs:{name:"close",color:"#F56C6C"}}):e("van-icon",{attrs:{name:"passed",color:"#67C23A"}})],1)],1)]],2),e("transition",{attrs:{name:"van-fade"}},[t.readonly||"pending"!==i.type?t._e():e("div",{staticClass:"vvc-upload_text_fileList_item_progress"},[e("div",{staticClass:"vvc-upload_text_fileList_item_progress_content",style:{width:100*i.progress+"%"}})])])],1)})),0)],2)},T=[],U=require("vant/lib/button"),F=t.n(U),M=require("vant/lib/swipe-cell"),N=t.n(M),q=(require("vant/lib/button/style"),require("vant/lib/swipe-cell/style"),{data(){return{t:(0,x.createI18N)("upload")}},props:["list","deleteTrigger","disabled","readonly"],methods:{handleSubmit(){this.readonly||this.disabled||this.$emit("submit")},handleDeleteItem(t,e){this.disabled||this.readonly||this.$emit("deleteItem",t,e)},handleClickItem(t){this.$emit("click-item",t)},handleLongpressCell(t,e){"longpress"===this.deleteTrigger&&this.handleDeleteItem(t,e)}},components:{[y().name]:y(),[F().name]:F(),[N().name]:N()}}),O=q,j=S(O,w,T,!1,null,null,null),B=j.exports,R=function(){var t=this,e=t._self._c;return e("div",{staticClass:"vvc-upload_picture"},[t.readonly?t._e():[e("div",{staticClass:"vvc-upload_picture_text",on:{click:t.handleSubmit}},[t._t("trigger",(function(){return[e("van-button",{attrs:{icon:"plus",type:"primary",size:"small",disabled:t.disabled}},[t._v(" "+t._s(t.t("uploadButtonText"))+" ")])]}))],2),e("div",{staticClass:"vvc-upload_picture_tip"},[t._t("tip")],2)],e("div",{staticClass:"vvc-upload_picture_fileList"},t._l(t.list,(function(i,n){return e("div",{key:n,class:["vvc-upload_picture_fileList_item",{"is-error":"rejected"===i.type}],on:{click:function(e){return t.handleClickItem(i)}}},[e("div",{staticClass:"vvc-upload_picture_fileList_item_content"},[[t.readonly||"rejected"!==i.type?e("van-image",{staticClass:"vvc-upload_picture_fileList_item_content_image",attrs:{src:i.url,name:"description"},scopedSlots:t._u([{key:"loading",fn:function(){return[e("van-loading",{attrs:{type:"spinner",size:"20"}})]},proxy:!0},{key:"error",fn:function(){return[e("van-icon",{attrs:{name:"description"}})]},proxy:!0}],null,!0)}):e("div",{staticClass:"vvc-upload_picture_fileList_item_content_image"},[e("van-icon",{attrs:{name:"clear"}}),e("p",[t._v(t._s(t.t("loadFailedText")))])],1)],e("div",{staticClass:"vvc-upload_picture_fileList_item_content_content"},[e("p",{staticClass:"vvc-upload_picture_fileList_item_content_content_name"},[t._v(t._s(i.name))]),t.readonly||"pending"!==i.type?t._e():e("div",{staticClass:"vvc-upload_picture_fileList_item_content_content_progress"},[e("div",{staticClass:"vvc-upload_picture_fileList_item_content_content_progress_rate",style:{width:100*(i.progress||0)+"%"}}),e("div",{staticClass:"vvc-upload_picture_fileList_item_content_content_progress_message"},[t._v(" "+t._s(100*(i.progress||0))+"% ")])])])],2),t.readonly||t.disabled?t._e():e("div",{staticClass:"vvc-upload_picture_fileList_item_content_delete",on:{click:function(e){return e.stopPropagation(),t.handleDeleteItem(i,n)}}},[e("van-icon",{attrs:{name:"cross"}})],1)])})),0)],2)},z=[],D={data(){return{t:(0,x.createI18N)("upload")}},props:["list","disabled","readonly"],methods:{handleSubmit(){this.readonly||this.disabled||this.$emit("submit")},handleDeleteItem(t,e){this.disabled||this.readonly||this.$emit("deleteItem",t,e)},handleClickItem(t){this.$emit("click-item",t)}},components:{[y().name]:y(),[F().name]:F(),[_().name]:_(),[f().name]:f()}},E=D,P=S(E,R,z,!1,null,null,null),A=P.exports,J={name:"vvcUpload",data(){return{list:[],uuidMapUrl:{},t:(0,x.createI18N)()}},props:{multipartUpload:{type:Object},value:{type:[String,Array],require:!0},listType:{type:String,default:"text",validator:t=>["text","picture","picture-card","avatar"].includes(t)},accept:{type:String,default:"*"},multiple:{type:Boolean,default:!1},lazyLoad:{type:Boolean,default:!1},capture:{type:String},maxSize:{type:[Number,String,Function]},maxCount:{type:[Number,String]},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},previewImageOnly:{type:Boolean,default:!0},onClickItem:{type:Function},onRemove:{type:Function},onSuccess:{type:Function},onError:{type:Function},onProgress:{type:Function},onChange:{type:Function},beforeUpload:{type:Function},beforeRemove:{type:Function},onExceed:{type:Function},onOversize:{type:Function},onIllegalType:{type:Function},deleteTrigger:{type:String,default:"swipecell",validator:t=>["longpress","swipecell"].includes(t)},showFileName:{type:Boolean,default:!1}},watch:{value:{handler(t){if(t)if("avatar"===this.listType){if(Array.isArray(t))return void console.error("If the listType type is avatar, the value of value can only be of type string");this.list=[{name:t.replace(/(.+\/)/i,"")||"",url:t,fileUrl:t,progress:1,type:"fulfilled",uuid:`${this.getRandom()}-${t.replace(/(.+\/)/i,"")||this.t("upload.unknownFile")}`}]}else this.list=JSON.parse(JSON.stringify(t)).map((t=>{var e;return{progress:1,type:"fulfilled",uuid:`${this.getRandom()}-${t.name||(null===(e=t.fileUrl)||void 0===e?void 0:e.replace(/(.+\/)/i,""))||this.t("upload.unknownFile")}`,...t,url:this.uuidMapUrl[t.uuid]||t.url||t.fileUrl}}));else this.list=[]},immediate:!0}},methods:{submit(){this.$refs.vanUploader.chooseFile()},handleBeforeUpload(t){var e;let i=Array.isArray(t)?t:[t];return!(!n(i,this.list,this.maxCount,this.onExceed)||!l(i,this.accept,this.onIllegalType)||!a(i,this.list,this.maxSize,this.onOversize)||null!==(e=this.beforeUpload)&&void 0!==e&&e.call(this,i,this.getMapList()));function n(t,e,i,n){return!(e.length+t.length>i)||((null===n||void 0===n?void 0:n(t,JSON.parse(JSON.stringify(e))))||d()(this.t("upload.fileTotalLimitUnit",{msg1:i})),!1)}function l(t,e,i){if("*"===e)return!0;let n=new RegExp(`(${e.replace(/\,/g,"|")})$`,"i"),l=new RegExp(`(${e.replace(/\,/g,"|").replace(/\/\*/g,"")})$`,"i");return!t.some((t=>!(n.test(t.name)||l.test(t.type.split("/")[0]))))||((null===i||void 0===i?void 0:i(t,e))||d()(this.t("upload.fileTypeLimitUnit",{msg1:e})),!1)}function a(t,e,i,n){const l="function"===typeof i?i(t):i;if(l&&t.some((t=>t.size>l))){let i=l,a="";return i/1024>1&&(i/=1024,a="KB"),i/1024>1&&(i/=1024,a="MB"),i/1024>1&&(i/=1024,a="GB"),(null===n||void 0===n?void 0:n(t,JSON.parse(JSON.stringify(e))))||d()(this.t("upload.fileSizeLimitUnit",{msg1:`${i}${a}`})),!1}return!0}},handleAfterUpload(t){let e=Array.isArray(t)?t:[t];e.forEach((({content:t,file:e})=>{var i;let n=this.list.length||0,l=`${Date.now()}-${e.name}`,a=null;this.$set(this.list,n,{name:e.name||this.t("upload.unknownFile"),url:t,progress:0,message:this.t("upload.uploading"),type:"pending",uuid:l}),null===(i=this.onChange)||void 0===i||i.call(this,e,this.getMapList()),this.multipartUpload&&(a=this.multipartUpload,a({file:e,progress:t=>{var i;(n=this.list.findIndex((t=>t.uuid===l)),-1!==n)&&(this.$set(this.list[n],"progress",t),null===(i=this.onProgress)||void 0===i||i.call(this,e,this.getMapList()))},success:t=>{var i,a;(n=this.list.findIndex((t=>t.uuid===l)),-1!==n)&&(this.$set(this.list[n],"progress",1),this.$set(this.list[n],"type","fulfilled"),this.$set(this.list[n],"fileUrl",t),"avatar"===this.listType?this.$emit("input",t||""):this.$emit("input",this.getMapList()),null===(i=this.onChange)||void 0===i||i.call(this,e,this.getMapList()),null===(a=this.onSuccess)||void 0===a||a.call(this,e,this.getMapList()))},fail:()=>{var t,i;(n=this.list.findIndex((t=>t.uuid===l)),-1!==n)&&(this.$set(this.list[n],"type","rejected"),null===(t=this.onChange)||void 0===t||t.call(this,e,this.getMapList()),null===(i=this.onError)||void 0===i||i.call(this,e,this.getMapList()))}}))}))},async handleDeleteItem(t,e){var i;let n=await(null===(i=this.beforeRemove)||void 0===i?void 0:i.call(this,t,this.getMapList()))||!0;n&&r().confirm({message:this.t("upload.removeUnit",{msg1:t.name})}).then((()=>{var i;"avatar"===this.listType?this.$emit("input",""):(this.$delete(this.list,e),this.$emit("input",this.getMapList())),null===(i=this.onRemove)||void 0===i||i.call(this,t,this.getMapList())})).catch((()=>{}))},handleClickItem(t){var e;t.type&&"fulfilled"!==t.type||(null===(e=this.onClickItem)||void 0===e||e.call(this,t),this.previewImageOnly&&/\.(png|jpg|jpeg|bmp|gif|pic|webp|svg|x-icon)$/i.test(t.name)&&c()({images:[t.url],startPosition:0}))},getMapList(){let t=JSON.parse(JSON.stringify(this.list));return t.map((t=>(this.$set(this.uuidMapUrl,t.uuid||Date().now,t.url),{...t,url:t.fileUrl})))},getRandom(){return Math.floor(Math.random()*Math.pow(10,12))+Math.pow(10,13)}},components:{[a().name]:a(),uploadPictureCard:L,uploadText:B,uploadPicture:A}},V=J,X=S(V,i,n,!1,null,null,null),G=X.exports,K=G;module.exports=e})();