UNPKG

form-designer-xinyi

Version:

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

2 lines (1 loc) 1.97 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),l=require("ant-design-vue"),y={class:"epic-upload-image"},w={key:0},C=t.createElementVNode("span",{class:"iconfont epic-icon-shangchuan1 mr-2px"},null,-1),x=t.createElementVNode("div",{class:"ant-upload-text"},"点击上传",-1),U=[C,x],k=t.defineComponent({__name:"uploadImage",props:{modelValue:{type:Array,default:()=>[]},maxCount:{type:Number}},emits:["update:modelValue","change"],setup(p,{emit:m}){const f=t.useAttrs(),u=p,i=m,r=t.ref([]),o=t.ref(""),c=t.ref(!1),d=e=>{c.value=e};t.watch(r,e=>{i("update:modelValue",e),i("change",e)}),t.watch(()=>u.modelValue,e=>{if(e!=null&&e.length>0&&r.value!=null){if(r.value===e)return;r.value.length=0,r.value.push(...e)}},{deep:!0,immediate:!0});function g(e){t.nextTick(()=>{r.value=e})}const v=e=>{var n,a;if(e.file.status!=="uploading"){if(e.file.status==="done"){const s=(a=(n=e.file.response)==null?void 0:n.data)==null?void 0:a.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")}},h=e=>{},_=t.computed(()=>({...f,"list-type":"picture-card",accept:"image/gif,image/jpeg,image/jpg,image/png,image/svg","onUpdate:file-list":g,"file-list":r.value,"onBefore-upload":h,onChange:v,onPreview:V}));function V(e){e.url&&(o.value=e.url,d(!0))}function b(){o.value&&l.message.error("图片地址无法访问!")}return(e,n)=>(t.openBlock(),t.createElementBlock("div",y,[t.createVNode(t.unref(l.Upload),t.normalizeProps(t.guardReactiveProps(_.value)),{default:t.withCtx(()=>{var a;return[(((a=r.value)==null?void 0:a.length)??0)<(u.maxCount??999)?(t.openBlock(),t.createElementBlock("div",w,U)):t.createCommentVNode("",!0)]}),_:1},16),t.createVNode(t.unref(l.Image),{style:{display:"none"},src:o.value,preview:{visible:c.value,onVisibleChange:d},onError:b},null,8,["src","preview"])]))}});exports.default=k;