epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 2.92 kB
JavaScript
;const e=require("vue");;/* empty css */const y=require("../../../../base-ui/src/node/node.vue.cjs"),c=require("../../../../../utils/src/common/data.cjs"),k=require("@vueuse/core");require("../../../../../hooks/src/store/index.cjs");const B=require("../../../../../utils/src/manager/pluginManager.cjs");require("vuedraggable");const p=require("./data.cjs"),V=require("./ERuleItem.vue.cjs"),E={class:"rule-item-main m-t-2 relative rounded border border-solid p-2 transition-all"},b={key:0,class:"m-t-2 flex first:m-0"},C={class:"epic-attr-label"},N={class:"flex-1"},w=e.defineComponent({__name:"index",props:{modelValue:{default:void 0,type:Array},ruleType:{default:"string",type:String}},emits:["update:modelValue"],setup(m,{emit:v}){const d=m,g=v,_=B.pluginManager.getComponent("button"),u=k.useVModel(d,"modelValue",g),r=e.ref({message:"必填项",required:!1,trigger:["change"],type:d.ruleType}),h=[{label:"必填项",model:"required",type:"switch"},{componentProps:{mode:"multiple",multiple:!0,options:p.triggerOptions,placeholder:"校验时机"},label:"校验时机",model:"trigger",show(){return!!r.value.required},type:"select"},{componentProps:{options:p.typeOptions,placeholder:"类型"},label:"类型",model:"type",show(){return!!r.value.required},type:"select"},{componentProps:{placeholder:"校验信息"},label:"校验信息",model:"message",show(){return!!r.value.required},type:"input"}],l=e.ref([]);e.watch(()=>u.value,(o,s)=>{o&&(c.deepEqual(o,s??[])||(l.value=[],o.forEach(t=>{t.required===void 0?l.value.push(t):r.value=t})))},{immediate:!0});function f(){l.value.push({message:"",trigger:["change"],type:d.ruleType}),a()}function a(){if(r.value.required){u.value=c.deepClone([...l.value,r.value]);return}if(l.value.length>0){u.value=c.deepClone(l.value);return}u.value=void 0}function q(o){l.value.splice(o,1),a()}return(o,s)=>(e.openBlock(),e.createElementBlock("div",null,[e.createElementVNode("div",E,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(h,(t,n)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:n},[!t.show||t.show()?(e.openBlock(),e.createElementBlock("div",b,[e.createElementVNode("div",C,e.toDisplayString(t.label),1),e.createElementVNode("div",N,[e.createVNode(e.unref(y),{modelValue:r.value[t.model],"onUpdate:modelValue":i=>r.value[t.model]=i,"component-schema":{...t,noFormItem:!0},onChange:a},null,8,["modelValue","onUpdate:modelValue","component-schema"])])])):e.createCommentVNode("",!0)],64))),64))]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,(t,n)=>(e.openBlock(),e.createBlock(V,{key:n,rule:l.value[n],"onUpdate:rule":i=>l.value[n]=i,onDelete:i=>q(n),onChange:a},null,8,["rule","onUpdate:rule","onDelete"]))),128)),e.createVNode(e.unref(_),{class:"m-t-2",onClick:f},{default:e.withCtx(()=>s[0]||(s[0]=[e.createTextVNode(" 添加规则 ")])),_:1})]))}});module.exports=w;