UNPKG

gepic

Version:

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

2 lines (1 loc) 2.76 kB
"use strict";const e=require("vue"),q=require("../../../utils/manager/pluginManager.cjs"),k=require("@vueuse/core");require("../../../hooks/store/index.cjs");const c=require("../../../utils/common/data.cjs"),B=require("./ERuleItem.vue.cjs"),V=require("../../components/node/src/node.vue.cjs"),p=require("./data.cjs"),E={class:"rule-item-main m-t-2 p-2 rounded border border-solid transition-all relative"},b={key:0,class:"flex m-t-2 first:m-0"},C={class:"epic-attr-label"},w={class:"flex-1"},N=e.defineComponent({__name:"index",props:{ruleType:{type:String,default:"string"},modelValue:{type:Array,default:void 0}},emits:["update:modelValue"],setup(m,{emit:v}){const g=q.pluginManager.getComponent("button"),i=m,_=v,u=k.useVModel(i,"modelValue",_),l=e.ref({required:!1,message:"必填项",type:i.ruleType,trigger:["change"]}),f=[{type:"switch",label:"必填项",model:"required"},{type:"select",label:"校验时机",model:"trigger",show(){return!!l.value.required},componentProps:{options:p.triggerOptions,placeholder:"校验时机",multiple:!0,mode:"multiple"}},{type:"select",label:"类型",model:"type",show(){return!!l.value.required},componentProps:{options:p.typeOptions,placeholder:"类型"}},{type:"input",label:"校验信息",model:"message",show(){return!!l.value.required},componentProps:{placeholder:"校验信息"}}],t=e.ref([]);e.watchEffect(()=>{u.value&&(t.value=[],u.value.forEach(o=>{typeof o.required<"u"?l.value=o:t.value.push(o)}))});function h(){t.value.push({message:"",type:i.ruleType,trigger:["change"]}),a()}function a(){if(l.value.required){u.value=c.deepClone([...t.value,l.value]);return}if(t.value.length){u.value=c.deepClone(t.value);return}u.value=void 0}function y(o){t.value.splice(o,1),a()}return(o,d)=>(e.openBlock(),e.createElementBlock("div",null,[e.createElementVNode("div",E,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(f,(r,n)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:n},[!r.show||r.show()?(e.openBlock(),e.createElementBlock("div",b,[e.createElementVNode("div",C,e.toDisplayString(r.label),1),e.createElementVNode("div",w,[e.createVNode(e.unref(V),{modelValue:l.value[r.model],"onUpdate:modelValue":s=>l.value[r.model]=s,"component-schema":{...r,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(t.value,(r,n)=>(e.openBlock(),e.createBlock(B,{key:n,rule:t.value[n],"onUpdate:rule":s=>t.value[n]=s,onDelete:s=>y(n),onChange:a},null,8,["rule","onUpdate:rule","onDelete"]))),128)),e.createVNode(e.unref(g),{class:"m-t-2",onClick:h},{default:e.withCtx(()=>d[0]||(d[0]=[e.createTextVNode(" 添加规则 ")])),_:1})]))}});module.exports=N;