form-designer-xinyi
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 12.7 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),c=require("ant-design-vue"),_=require("./index-Df9Drsqp.cjs"),k=require("./revoke-Bbm2vFx2.cjs"),w=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),b={class:"mb-2 w-full"},g={class:"flex items-center w-390px"},C=e.createElementVNode("span",{class:"iconfont epic-icon-shanchu1"},null,-1),B=[C],y=e.defineComponent({__name:"actionItem",props:{modelValue:{},fieldOptions:{},triggerOptions:{}},emits:["update:modelValue","delete"],setup(p,{emit:h}){const V=e.inject("designer"),s=h,i=p,t=_.useVModel(i,"modelValue",s),m=e.computed(()=>V.state.checkedNode);console.log("checkedNode",m);const r=e.computed(()=>k.findSchemas([m.value],a=>a.id&&a.id===t.value.field,!0));function d(){s("delete")}return(f,a)=>(e.openBlock(),e.createElementBlock("div",b,[e.createVNode(e.unref(c.Space),null,{default:e.withCtx(()=>[e.createVNode(e.unref(c.Select),{class:"w-150px",value:e.unref(t).trigger,"onUpdate:value":a[0]||(a[0]=o=>e.unref(t).trigger=o),options:i.triggerOptions,placeholder:"选择动作"},null,8,["value","options"]),e.createElementVNode("div",g,[e.createVNode(e.unref(c.Select),{style:e.normalizeStyle({width:e.unref(t).trigger==="setValue"&&e.unref(t).field?"210px":"100%"}),value:e.unref(t).field,"onUpdate:value":a[1]||(a[1]=o=>e.unref(t).field=o),options:i.fieldOptions,placeholder:"选择字段",onChange:a[2]||(a[2]=o=>e.unref(t).value=void 0)},null,8,["style","value","options"]),e.unref(t).trigger==="setValue"&&e.unref(t).field?(e.openBlock(),e.createBlock(e.unref(_._sfc_main),{key:e.unref(t).field,class:"w-240px ml-2",modelValue:e.unref(t).value,"onUpdate:modelValue":a[3]||(a[3]=o=>e.unref(t).value=o),"component-schema":{...r.value,noFormItem:!0,componentProps:{...r.value.componentProps,defaultValue:void 0,disabled:void 0,hidden:void 0}}},null,8,["modelValue","component-schema"])):e.createCommentVNode("",!0),e.unref(t).trigger==="addValue"&&e.unref(t).field&&(e.unref(t).field.split("_")[0]=="checkbox"||e.unref(t).field.split("_")[0]=="xyTextArea"||e.unref(t).field.split("_")[0]=="xyInput")?(e.openBlock(),e.createBlock(e.unref(_._sfc_main),{key:e.unref(t).field,class:"w-240px ml-2",modelValue:e.unref(t).value,"onUpdate:modelValue":a[4]||(a[4]=o=>e.unref(t).value=o),"component-schema":{...r.value,noFormItem:!0,componentProps:{...r.value.componentProps,defaultValue:void 0,disabled:void 0,hidden:void 0}}},null,8,["modelValue","component-schema"])):e.createCommentVNode("",!0),e.createVNode(e.unref(c.Checkbox),{checked:e.unref(t).reverseExecute,"onUpdate:checked":a[5]||(a[5]=o=>e.unref(t).reverseExecute=o),class:"ml-2 w-120px"},{default:e.withCtx(()=>[e.createTextVNode("否则不")]),_:1},8,["checked"])]),e.createElementVNode("div",{class:"w-28px h-28px cursor-pointer bg-red-100 text-red-400 hover:bg-red-400 border-solid border-1px border-red-300 rounded-full flex justify-center items-center hover:text-white",onClick:d},B)]),_:1})]))}}),E=e.createElementVNode("span",{class:"iconfont epic-icon-tianjia"},null,-1),S=e.defineComponent({__name:"actionEdit",props:{modelValue:{}},emits:["update:modelValue"],setup(p,{emit:h}){const V=e.inject("designer"),s=e.computed(()=>V.state.checkedNode),i=e.computed(()=>{const o=k.findSchemas([s.value],n=>{var l,u;return n.type==="form"&&(((l=n.componentProps)==null?void 0:l.name)??n.name===((u=s.value)==null?void 0:u.componentProps.name))},!0);return k.findSchemas((o==null?void 0:o.children)??[],n=>!!n.input||["text","downLoad","card"].includes(n.type),!1,n=>n.type!=="subform").map(n=>{var l;return{label:["text"].includes(n.type)?(l=n.componentProps)==null?void 0:l.defaultValue:n.label,value:n.id}}).reverse()}),t=[{label:"隐藏",value:"hide"},{label:"显示",value:"show"},{label:"必填",value:"required"},{label:"非必填",value:"notRequired"},{label:"只读",value:"readonly"},{label:"可写",value:"readWrite"},{label:"禁用",value:"disabled"},{label:"启用",value:"enabled"},{label:"设置值",value:"setValue"},{label:"追加值",value:"addValue"}],m=p,r=h,d=_.useVModel(m,"modelValue",r);function f(o){d.value.push({trigger:o})}function a(o){d.value.splice(o,1)}return(o,v)=>(e.openBlock(),e.createElementBlock("div",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(d),(n,l)=>(e.openBlock(),e.createBlock(y,{modelValue:e.unref(d)[l],"onUpdate:modelValue":u=>e.unref(d)[l]=u,key:l,fieldOptions:i.value,triggerOptions:t,onDelete:u=>a(l)},null,8,["modelValue","onUpdate:modelValue","fieldOptions","onDelete"]))),128)),e.createVNode(e.unref(c.Dropdown),null,{overlay:e.withCtx(()=>[e.createVNode(e.unref(c.Menu),null,{default:e.withCtx(()=>[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(t,n=>e.createVNode(e.unref(c.MenuItem),{onClick:l=>f(n.value),key:n.value},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.label),1)]),_:2},1032,["onClick"])),64))]),_:1})]),default:e.withCtx(()=>[e.createElementVNode("span",{class:"ant-dropdown-link cursor-pointer text-blue-500",onClick:v[0]||(v[0]=e.withModifiers(()=>{},["prevent"]))},[E,e.createTextVNode(" 添加动作 ")])]),_:1})]))}}),O={class:"mb-4"},$=e.createElementVNode("span",{class:"iconfont epic-icon-shanchu1"},null,-1),D=[$],U=e.defineComponent({__name:"conditionItem",props:{modelValue:{},fieldOptions:{}},emits:["update:modelValue","delete"],setup(p,{emit:h}){const V=e.inject("designer"),s=h,i=p,t=_.useVModel(i,"modelValue",s),m=e.computed(()=>V.state.checkedNode),r=e.computed(()=>k.findSchemas([m.value],u=>u.field===t.value.field,!0)),d=[{label:"等于",value:"eq"},{label:"不等于",value:"neq"}],f=[{label:"大于",value:"gt"},{label:"大于等于",value:"gte"},{label:"小于",value:"lt"},{label:"小于等于",value:"lte"}],a=[{label:"包含",value:"in"},{label:"不包含",value:"nin"}],o=[...d.map(l=>l.value),...f.map(l=>l.value),...a.map(l=>l.value)],v=e.computed(()=>{const l=[{label:"为空",value:"null"},{label:"非空",value:"notNull"}];return["input","textarea","password","select","checkbox","JSelectMultiple"].includes(r.value.type)&&l.unshift(...a),["number"].includes(r.value.type)&&l.unshift(...f),["xyTextArea","input","input","number","textarea","password","radio","checkbox","select","slider","time","date","cascader","switch","color-picker","JSelectDept","JSelectMultiple","JDictSelectTag","classifiedDictionary","selectUser","xyRadio"].includes(r.value.type)&&l.unshift(...d),l});e.watch(()=>v.value,l=>{t.value.operator=l[0].value});function n(){s("delete")}return(l,u)=>(e.openBlock(),e.createElementBlock("div",O,[e.createVNode(e.unref(c.Space),null,{default:e.withCtx(()=>[e.createVNode(e.unref(c.Select),{class:"w-180px",value:e.unref(t).field,"onUpdate:value":u[0]||(u[0]=x=>e.unref(t).field=x),options:i.fieldOptions,placeholder:"选择字段"},null,8,["value","options"]),e.unref(t).field?(e.openBlock(),e.createBlock(e.unref(c.Select),{key:0,value:e.unref(t).operator,"onUpdate:value":u[1]||(u[1]=x=>e.unref(t).operator=x),class:"w-100px",options:v.value,placeholder:"选择判断条件"},null,8,["value","options"])):e.createCommentVNode("",!0),e.unref(t).field&&e.unref(t).operator&&o.includes(e.unref(t).operator)?(e.openBlock(),e.createBlock(e.unref(_._sfc_main),{key:1,modelValue:e.unref(t).value,"onUpdate:modelValue":u[2]||(u[2]=x=>e.unref(t).value=x),"component-schema":{...r.value,noFormItem:!0,componentProps:{...r.value.componentProps,defaultValue:void 0,disabled:void 0,hidden:void 0}}},null,8,["modelValue","component-schema"])):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"w-28px h-28px cursor-pointer bg-red-100 text-red-400 hover:bg-red-400 border-solid border-1px border-red-300 rounded-full flex justify-center items-center hover:text-white",onClick:n},D)]),_:1})]))}}),N=p=>(e.pushScopeId("data-v-9db78388"),p=p(),e.popScopeId(),p),T={class:"flex"},j={key:0,class:"logical-operator"},I=N(()=>e.createElementVNode("div",{class:"logical-operator__line"},null,-1)),P={class:"flex-1"},M=N(()=>e.createElementVNode("span",{class:"iconfont epic-icon-tianjia mr-1"},null,-1)),q=e.defineComponent({__name:"conditionEdit",props:{modelValue:{}},emits:["update:modelValue"],setup(p,{emit:h}){const V=e.inject("designer"),s=e.computed(()=>V.state.checkedNode),i=e.computed(()=>{var a;return k.getFormSchemas([s.value],(a=s.value)==null?void 0:a.componentProps.name).map(o=>({label:o.label,value:o.field})).reverse()}),t=p,m=h,r=_.useVModel(t,"modelValue",m);function d(){r.value.conditions.push({})}function f(a){r.value.conditions.splice(a,1)}return(a,o)=>(e.openBlock(),e.createElementBlock("div",T,[e.unref(r).conditions.length?(e.openBlock(),e.createElementBlock("div",j,[I,e.createVNode(e.unref(c.Switch),{checked:e.unref(r).operator,"onUpdate:checked":o[0]||(o[0]=v=>e.unref(r).operator=v),"checked-children":"且",checkedValue:"and",unCheckedValue:"or","un-checked-children":"或"},null,8,["checked"])])):e.createCommentVNode("",!0),e.createElementVNode("div",P,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(r).conditions,(v,n)=>(e.openBlock(),e.createBlock(U,{modelValue:e.unref(r).conditions[n],"onUpdate:modelValue":l=>e.unref(r).conditions[n]=l,key:n,fieldOptions:i.value,onDelete:l=>f(n)},null,8,["modelValue","onUpdate:modelValue","fieldOptions","onDelete"]))),128)),e.createVNode(e.unref(c.Button),{class:"w-100%",type:"dashed",onClick:d},{icon:e.withCtx(()=>[M]),default:e.withCtx(()=>[e.createTextVNode(" 添加条件 ")]),_:1})])]))}}),F=w._export_sfc(q,[["__scopeId","data-v-9db78388"]]),L={class:"epic-drawer-container h-full"},R={class:"h-full flex flex-col"},A={class:"px-16px"},J=e.createElementVNode("span",{class:"iconfont epic-icon-tianjia mr-1"},null,-1),z={class:"mt-2 flex-1 overflow-auto px-16px"},H=["onClick"],W=e.createElementVNode("span",{class:"iconfont epic-icon-tianjia"},null,-1),G=[W],K={class:"epic-modal-footer"},Q=e.defineComponent({__name:"drawer",emits:["ok"],setup(p,{expose:h,emit:V}){const s=V,i=e.ref(!1),t=e.ref([]);function m(o=[]){t.value=o,i.value=!0}function r(){t.value.push({actions:[],condition:{conditions:[],operator:"and"}})}function d(o){t.value.splice(o,1)}function f(){i.value=!1}function a(){s("ok",t.value),f()}return h({showDrawer:m}),(o,v)=>(e.openBlock(),e.createBlock(e.unref(c.Drawer),{class:"epic-drawer-form-logic",width:"650px",title:"逻辑规则",open:i.value,"onUpdate:open":v[0]||(v[0]=n=>i.value=n)},{default:e.withCtx(()=>[e.createElementVNode("div",L,[e.createElementVNode("div",R,[e.createElementVNode("div",A,[e.createVNode(e.unref(c.Button),{class:"w-full",type:"primary",onClick:r},{icon:e.withCtx(()=>[J]),default:e.withCtx(()=>[e.createTextVNode(" 添加逻辑规则 ")]),_:1})]),e.createElementVNode("div",z,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.value,(n,l)=>(e.openBlock(),e.createBlock(e.unref(c.Card),{key:l,class:"mt-2",bodyStyle:{padding:"16px"}},{default:e.withCtx(()=>[e.createElementVNode("div",{class:"absolute top-8px right-8px cursor-pointer rounded-full w-24px h-24px text-16px flex items-center justify-center hover:bg-gray-100 rotate-45",onClick:u=>d(l)},G,8,H),e.createVNode(e.unref(c.Divider),null,{default:e.withCtx(()=>[e.createTextVNode("当满足以下条件时")]),_:1}),e.createVNode(F,{modelValue:n.condition,"onUpdate:modelValue":u=>n.condition=u},null,8,["modelValue","onUpdate:modelValue"]),e.createVNode(e.unref(c.Divider),null,{default:e.withCtx(()=>[e.createTextVNode("则执行")]),_:1}),e.createVNode(S,{modelValue:n.actions,"onUpdate:modelValue":u=>n.actions=u},null,8,["modelValue","onUpdate:modelValue"])]),_:2},1024))),128))])])]),e.createElementVNode("div",K,[e.createVNode(e.unref(c.Space),{align:"end"},{default:e.withCtx(()=>[e.createVNode(e.unref(c.Button),{onClick:f},{default:e.withCtx(()=>[e.createTextVNode("关闭")]),_:1}),e.createVNode(e.unref(c.Button),{type:"primary",onClick:a},{default:e.withCtx(()=>[e.createTextVNode(" 确定 ")]),_:1})]),_:1})])]),_:1},8,["open"]))}}),X=e.createElementVNode("span",{class:"iconfont epic-icon-shezhi mr-1"},null,-1),Y=e.defineComponent({__name:"formLogic",props:{modelValue:{}},emits:["update:modelValue"],setup(p,{emit:h}){const V=e.inject("pageSchema"),s=p,i=e.ref(),t=h;function m(){var d;(d=i.value)==null||d.showDrawer(s.modelValue)}function r(d){t("update:modelValue",d),V.logicRules=d}return(d,f)=>{var a;return e.openBlock(),e.createElementBlock("div",null,[e.createVNode(e.unref(c.Badge),{count:((a=s.modelValue)==null?void 0:a.length)??0},{default:e.withCtx(()=>[e.createVNode(e.unref(c.Button),{onClick:m},{icon:e.withCtx(()=>[X]),default:e.withCtx(()=>[e.createTextVNode(" 配置")]),_:1})]),_:1},8,["count"]),e.createVNode(Q,{onOk:r,ref_key:"drawerRef",ref:i},null,512)])}}});exports.default=Y;