@jecloud/ui
Version:
JECloud UI库，基于ant-design-vue封装
1 lines • 2.36 kB
JavaScript
import{createVNode as e,createTextVNode as l,Fragment as u}from"vue";import{encode as t,decode as a,uploadFile as n,previewFile as o,downloadFile as r,isEmpty as i}from"@jecloud/utils";import{nextTick as s,ref as c,watch as f,h as p}from"vue";import{useModelValue as v}from"../../../hooks";import d from"../../../tooltip";import m from"../../../modal";export function useUploadFile(x){var g=x.props,S=x.context,h=v({props:g,context:S}),y=h.value,F=c({}),N=c(0),k=c(!1),b=null;f((function(){return h.value}),(function(e){F.value=a(e)||{}}),{immediate:!0});var C=function(){s((function(){setTimeout((function(){k.value=!1,N.value=0}),100)}))},K=function(){k.value||n({url:g.url,params:g.params,maxSize:g.maxSize,includeSuffix:g.includeSuffix,excludeSuffix:g.excludeSuffix,onFlowInit:function(e){b=e},onUploadStart:function(){N.value=0,k.value=!0},onFileProgress:function(e){N.value=Math.round(100*e.progress())},onFileError:function(e){F.value="",m.alert({title:"上传失败",message:e.message,status:m.status.error})},onValidate:function(e){var l,u=e.files,t=e.errors;if(t.length)return m.alert({title:"上传失败",content:function(){return t.map((function(e){return p("div",e.message)}))},status:m.status.error}),!1;F.value=null===(l=u[0])||void 0===l?void 0:l.file}}).then((function(e){var l=e[0];l&&(h.value=y=t(l)),C()})).catch((function(e,l){console.log(e,l),C()}))};return{onSelect:K,onReset:function(){k.value&&(C(),null==b||b.cancel(),s((function(){h.value=y})))},displaySlot:function(){return e(u,null,[e("div",{class:["update-input-display ",{"is--upload":F.value.fileKey}],onClick:function(){i(h.value)&&K()}},[F.value.relName?e(d,{placement:"bottomLeft"},{default:function(){return[F.value.name||F.value.relName]},title:function(){return e("div",{class:"je-input-select-upload-tooltip"},[e("span",{onClick:function(){return o(F.value.fileKey)}},[l("预览")]),l("|"),e("span",{onClick:function(){return r(F.value.fileKey)}},[l("下载")])])}}):F.value.name||F.value.relName||e("span",{class:"update-input-display-placeholder"},[g.placeholder])]),k.value?e("div",{class:{"upload-progress":!0,"is--uploaddone":100===N.value}},[e("div",{class:"upload-progress-bar"},[e("div",{class:"upload-progress-bar-item",style:{width:N.value+"%"}},null)]),e("div",{class:"upload-progress-text"},[100===N.value?"上传完成":N.value+"/100%"])]):null])},value:h}}