epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 1.33 kB
JavaScript
;const t=require("vue");;/* empty css */require("vuedraggable");const s=require("../../../utils/src/common/string.cjs");require("@vueuse/core");require("../../../hooks/src/store/index.cjs");const o=require("naive-ui"),m=t.defineComponent({emits:["update:modelValue","change"],props:{modelValue:{default:"",type:String}},setup(d,{attrs:c,emit:a}){const u=t.ref([]);let i="";t.watch(()=>u.value,e=>{i=e.filter(l=>l.status==="finished").map(l=>l.url).join(","),a("update:modelValue",i),a("change",i)}),t.watch(()=>d.modelValue,e=>{if(i!==e){if(e===""){u.value=[];return}e!==null&&u.value!==null&&(u.value=e.split(",").map(l=>({id:s.getUUID(),name:s.getFileNameByUrl(l),status:"finished",url:l})))}},{immediate:!0});function p(e){t.nextTick(()=>{u.value=e})}const f=()=>{},h=({event:e,file:l})=>{var n;const r=e==null?void 0:e.target,g=JSON.parse((r==null?void 0:r.response)??"{}");l.url=(n=g.data)==null?void 0:n.url};return()=>t.h("div",null,{default:()=>[t.h(o.NUpload,{...c,"default-upload":!0,onError:f,onFinish:h,"file-list":u.value,"onUpdate:file-list":p},{default:()=>[t.h(o.NButton,{},{default:()=>[t.h("span",{class:"icon--epic icon--epic--cloud-upload-outlined text-lg",style:{"margin-right":"2px"}}),t.h("span",null,{default:()=>"上传文件"})]})]})]})}});module.exports=m;