UNPKG

fx-epic-designer

Version:

基于vue3的设计器,可视化开发页面表单

2 lines (1 loc) 2.31 kB
"use strict";const t=require("vue");;/* empty css */require("vuedraggable");const q=require("../../../utils/src/common/string.cjs");require("@vueuse/core");require("../../../hooks/src/store/index.cjs");require("../../../utils/src/manager/pluginManager.cjs");const l=require("ant-design-vue"),w={class:"epic-upload-image"},C={key:0},b=t.defineComponent({__name:"uploadImage",props:{maxCount:{default:99},modelValue:{default:""}},emits:["update:modelValue","change"],setup(m,{emit:f}){const o=m,c=f,g=t.useAttrs(),a=t.ref([]);let u="";const n=t.ref(""),p=t.ref(!1),d=e=>{p.value=e};t.watch(()=>a.value,e=>{u=e.filter(r=>r.status==="done").map(r=>r.url).join(","),c("update:modelValue",u),c("change",u)}),t.watch(()=>o.modelValue,e=>{if(u!==e){if(e===""){a.value=[];return}e&&a.value&&(a.value=e.split(",").map(r=>({name:r,status:"done",uid:q.getUUID(),url:r})))}},{deep:!0,immediate:!0});function v(e){t.nextTick(()=>{a.value=e})}const h=e=>{var r,i;if(e.file.status!=="uploading"){if(e.file.status==="done"){const s=(i=(r=e.file.response)==null?void 0:r.data)==null?void 0:i.url;if(!e.file.url&&!s){e.file.status="error",l.message.error("上传失败");return}e.file.url=s,e.file.thumbUrl=s}e.file.status==="error"&&l.message.error("upload error")}},x=()=>{},U=t.computed(()=>({...g,accept:"image/gif,image/jpeg,image/jpg,image/png,image/svg","onBefore-upload":x,onChange:h,onPreview:V,"file-list":a.value,"list-type":"picture-card","onUpdate:file-list":v}));function V(e){e.url&&(n.value=e.url,d(!0))}function _(){n.value&&l.message.error("图片地址无法访问!")}return(e,r)=>(t.openBlock(),t.createElementBlock("div",w,[t.createVNode(t.unref(l.Upload),t.normalizeProps(t.guardReactiveProps(U.value)),{default:t.withCtx(()=>{var i;return[(((i=a.value)==null?void 0:i.length)??0)<o.maxCount?(t.openBlock(),t.createElementBlock("div",C,r[0]||(r[0]=[t.createElementVNode("span",{class:"icon--epic icon--epic--cloud-upload-outlined mr-2px text-$epic-text-main text-lg"},null,-1),t.createElementVNode("div",{class:"ant-upload-text"},"点击上传",-1)]))):t.createCommentVNode("",!0)]}),_:1},16),t.createVNode(t.unref(l.Image),{style:{display:"none"},src:n.value,preview:{visible:p.value,onVisibleChange:d},onError:_},null,8,["src","preview"])]))}});module.exports=b;