epic-designer/dist/ui/antd/upload-image/uploadImage.vue2.cjs

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

"use strict";const t=require("vue");;/* empty css                                       */require("vuedraggable");const w=require("../../../utils/src/common/string.cjs");require("@vueuse/core");require("../../../hooks/src/store/index.cjs");const i=require("ant-design-vue"),C={class:"epic-upload-image"},q={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 n="";const s=t.ref(""),p=t.ref(!1),d=e=>{p.value=e};t.watch(()=>a.value,e=>{n=e.filter(r=>r.status==="done").map(r=>r.url).join(","),c("update:modelValue",n),c("change",n)}),t.watch(()=>o.modelValue,e=>{if(n!==e){if(e===""){a.value=[];return}e&&a.value&&(a.value=e.split(",").map(r=>({name:r,status:"done",uid:w.getUUID(),url:r})))}},{deep:!0,immediate:!0});function v(e){t.nextTick(()=>{a.value=e})}const h=e=>{var r,l;if(e.file.status!=="uploading"){if(e.file.status==="done"){const u=(l=(r=e.file.response)==null?void 0:r.data)==null?void 0:l.url;if(!e.file.url&&!u){e.file.status="error",i.message.error("上传失败");return}e.file.url=u,e.file.thumbUrl=u}e.file.status==="error"&&i.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&&(s.value=e.url,d(!0))}function _(){s.value&&i.message.error("图片地址无法访问!")}return(e,r)=>(t.openBlock(),t.createElementBlock("div",C,[t.createVNode(t.unref(i.Upload),t.normalizeProps(t.guardReactiveProps(U.value)),{default:t.withCtx(()=>{var l;return[(((l=a.value)==null?void 0:l.length)??0)<o.maxCount?(t.openBlock(),t.createElementBlock("div",q,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(i.Image),{style:{display:"none"},src:s.value,preview:{visible:p.value,onVisibleChange:d},onError:_},null,8,["src","preview"])]))}});module.exports=b;