epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 1.95 kB
JavaScript
;const t=require("vue");;/* empty css */require("vuedraggable");const x=require("../../../utils/src/common/string.cjs");require("@vueuse/core");require("../../../hooks/src/store/index.cjs");const n=require("ant-design-vue"),_={class:"epic-upload-file"},w=t.defineComponent({__name:"uploadFile",props:{maxCount:{default:99},modelValue:{default:""}},emits:["update:modelValue","change"],setup(c,{emit:d}){const s=c,i=d,p=t.useAttrs(),l=t.ref([]);let u="";t.watch(()=>l.value,e=>{u=e.filter(r=>r.status==="done").map(r=>r.url).join(","),i("update:modelValue",u),i("change",u)}),t.watch(()=>s.modelValue,e=>{if(u!==e){if(e===""){l.value=[];return}e&&l.value&&(l.value=e.split(",").map(r=>({name:r,status:"done",uid:x.getUUID(),url:r})))}},{deep:!0,immediate:!0});function f(e){t.nextTick(()=>{l.value=e})}const m=e=>{var r,a;if(e.file.status!=="uploading"){if(e.file.status==="done"){const o=(a=(r=e.file.response)==null?void 0:r.data)==null?void 0:a.url;if(!e.file.url&&!o){e.file.status="error",n.message.error("上传失败");return}e.file.url=o,e.file.thumbUrl=o}e.file.status==="error"&&n.message.error("upload error")}},g=()=>{},v=t.computed(()=>({...p,"onBefore-upload":g,onChange:m,onPreview:h,"file-list":l.value,"onUpdate:file-list":f}));function h(e){console.log(e),e.url&&window.open(e.url,"_blank")}return(e,r)=>(t.openBlock(),t.createElementBlock("div",_,[t.createVNode(t.unref(n.Upload),t.normalizeProps(t.guardReactiveProps(v.value)),{default:t.withCtx(()=>{var a;return[(((a=l.value)==null?void 0:a.length)??0)<s.maxCount?(t.openBlock(),t.createBlock(t.unref(n.Button),{key:0,class:"flex items-center"},{default:t.withCtx(()=>r[0]||(r[0]=[t.createElementVNode("span",{class:"icon--epic icon--epic--cloud-upload-outlined text-lg"},null,-1),t.createElementVNode("div",{class:"ant-upload-text"},"上传文件",-1)])),_:1})):t.createCommentVNode("",!0)]}),_:1},16)]))}});module.exports=w;