snowy-designer
Version:
基于Epic-Designer-Pro版本的设计器,可视化开发页面表单
2 lines (1 loc) • 1.76 kB
JavaScript
;const e=require("vue"),C=require("element-plus"),D={key:0,class:"form-main",style:{height:"100%"}},P=e.defineComponent({__name:"form",props:{componentSchema:{default:()=>({}),require:!0,type:Object}},setup(d,{expose:f}){var u,p;const r=d,h=e.inject("pageManager",{}),o=e.ref(null),c=e.inject("forms",{}),v=e.ref(!0),l=e.reactive({});h.addFormData(l,(p=(u=r.componentSchema)==null?void 0:u.componentProps)==null?void 0:p.name),e.provide("formData",l);function s(){return l}function m(t){Object.assign(l,t)}function g(){var t;return(t=o.value)==null?void 0:t.validate()}e.onMounted(async()=>{var t,a,n,i;if(((t=r.componentSchema)==null?void 0:t.type)==="form"&&c.value&&o.value){const b=((n=(a=r.componentSchema)==null?void 0:a.componentProps)==null?void 0:n.name)??((i=r.componentSchema)==null?void 0:i.name)??"default";return c.value[b]=o.value,o.value.getData=s,o.value.setData=m,!1}});const y=e.computed(()=>{const t=r.componentSchema.componentProps;let a=t.labelCol,n=t.wrapperCol;return t.labelLayout==="fixed"&&(a={style:`width:${typeof t.labelWidth=="number"?`${t.labelWidth}px`:t.labelWidth}`},n={style:"width:auto;flex:1"}),{...t,labelCol:a,wrapperCol:n}}),S=e.computed(()=>r.componentSchema.children??[]);return f({form:o,getData:s,setData:m,validate:g}),(t,a)=>v.value?(e.openBlock(),e.createElementBlock("div",D,[e.createVNode(e.unref(C.ElForm),e.mergeProps({ref_key:"form",ref:o,model:l},y.value,{style:{height:"100%"}}),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{},()=>[e.renderSlot(t.$slots,"edit-node",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(S.value,n=>e.renderSlot(t.$slots,"node",{componentSchema:n})),256))])])]),_:3},16,["model"])])):e.createCommentVNode("",!0)}});module.exports=P;