UNPKG

form-designer-xinyi

Version:

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

2 lines (1 loc) 11.5 kB
"use strict";const t=require("vue"),_=require("./revoke-Bbm2vFx2.cjs");function j(e){return t.getCurrentScope()?(t.onScopeDispose(e),!0):!1}function W(e){let o=0,r,s;const n=()=>{o-=1,s&&o<=0&&(s.stop(),r=void 0,s=void 0)};return(...c)=>(o+=1,r||(s=t.effectScope(!0),r=s.run(()=>e(...c))),j(n),r)}function O(e){return typeof e=="function"?e():t.unref(e)}const K=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const L=e=>typeof e<"u",J=Object.prototype.toString,G=e=>J.call(e)==="[object Object]",H=()=>{};function Q(e){return t.getCurrentInstance()}function X(e,o=!0,r){Q()?t.onMounted(e,r):o?e():t.nextTick(e)}function Y(e=!1,o={}){const{truthyValue:r=!0,falsyValue:s=!1}=o,n=t.isRef(e),c=t.ref(e);function d(l){if(arguments.length)return c.value=l,c.value;{const h=O(r);return c.value=c.value===h?O(s):h,c.value}}return n?d:[c,d]}function Z(e,o,r){const s=t.watch(e,(...n)=>(t.nextTick(()=>s()),o(...n)),r);return s}function x(e){var o;const r=O(e);return(o=r==null?void 0:r.$el)!=null?o:r}const R=K?window:void 0;function ee(...e){let o,r,s,n;if(typeof e[0]=="string"||Array.isArray(e[0])?([r,s,n]=e,o=R):[o,r,s,n]=e,!o)return H;Array.isArray(r)||(r=[r]),Array.isArray(s)||(s=[s]);const c=[],d=()=>{c.forEach(p=>p()),c.length=0},l=(p,u,m,a)=>(p.addEventListener(u,m,a),()=>p.removeEventListener(u,m,a)),h=t.watch(()=>[x(o),O(n)],([p,u])=>{if(d(),!p)return;const m=G(u)?{...u}:u;c.push(...r.flatMap(a=>s.map(w=>l(p,a,w,m))))},{immediate:!0,flush:"post"}),P=()=>{h(),d()};return j(P),P}function te(e){return typeof e=="function"?e:typeof e=="string"?o=>o.key===e:Array.isArray(e)?o=>e.includes(o.key):()=>!0}function z(...e){let o,r,s={};e.length===3?(o=e[0],r=e[1],s=e[2]):e.length===2?typeof e[1]=="object"?(o=!0,r=e[0],s=e[1]):(o=e[0],r=e[1]):(o=!0,r=e[0]);const{target:n=R,eventName:c="keydown",passive:d=!1,dedupe:l=!1}=s,h=te(o);return ee(n,c,p=>{p.repeat&&O(l)||h(p)&&r(p)},d)}function ne(e,o,r={}){return z(e,o,{...r,eventName:"keydown"})}function oe(e,o,r={}){return z(e,o,{...r,eventName:"keyup"})}function re(){const e=t.ref(!1),o=t.getCurrentInstance();return o&&t.onMounted(()=>{e.value=!0},o),e}function ie(e){const o=re();return t.computed(()=>(o.value,!!e()))}function se(e){return JSON.parse(JSON.stringify(e))}function $(e,o,r={}){const{window:s=R,...n}=r;let c;const d=ie(()=>s&&"ResizeObserver"in s),l=()=>{c&&(c.disconnect(),c=void 0)},h=t.computed(()=>Array.isArray(e)?e.map(u=>x(u)):[x(e)]),P=t.watch(h,u=>{if(l(),d.value&&s){c=new ResizeObserver(o);for(const m of u)m&&c.observe(m,n)}},{immediate:!0,flush:"post"}),p=()=>{l(),P()};return j(p),{isSupported:d,stop:p}}function ce(e,o={width:0,height:0},r={}){const{window:s=R,box:n="content-box"}=r,c=t.computed(()=>{var u,m;return(m=(u=x(e))==null?void 0:u.namespaceURI)==null?void 0:m.includes("svg")}),d=t.ref(o.width),l=t.ref(o.height),{stop:h}=$(e,([u])=>{const m=n==="border-box"?u.borderBoxSize:n==="content-box"?u.contentBoxSize:u.devicePixelContentBoxSize;if(s&&c.value){const a=x(e);if(a){const w=a.getBoundingClientRect();d.value=w.width,l.value=w.height}}else if(m){const a=Array.isArray(m)?m:[m];d.value=a.reduce((w,{inlineSize:S})=>w+S,0),l.value=a.reduce((w,{blockSize:S})=>w+S,0)}else d.value=u.contentRect.width,l.value=u.contentRect.height},r);X(()=>{const u=x(e);u&&(d.value="offsetWidth"in u?u.offsetWidth:o.width,l.value="offsetHeight"in u?u.offsetHeight:o.height)});const P=t.watch(()=>x(e),u=>{d.value=u?o.width:0,l.value=u?o.height:0});function p(){h(),P()}return{width:d,height:l,stop:p}}function ue(e,o,r,s={}){var n,c,d;const{clone:l=!1,passive:h=!1,eventName:P,deep:p=!1,defaultValue:u,shouldEmit:m}=s,a=t.getCurrentInstance(),w=r||(a==null?void 0:a.emit)||((n=a==null?void 0:a.$emit)==null?void 0:n.bind(a))||((d=(c=a==null?void 0:a.proxy)==null?void 0:c.$emit)==null?void 0:d.bind(a==null?void 0:a.proxy));let S=P;S=S||`update:${o.toString()}`;const E=b=>l?typeof l=="function"?l(b):se(b):b,k=()=>L(e[o])?E(e[o]):u,I=b=>{m?m(b)&&w(S,b):w(S,b)};if(h){const b=k(),A=t.ref(b);let V=!1;return t.watch(()=>e[o],q=>{V||(V=!0,A.value=E(q),t.nextTick(()=>V=!1))}),t.watch(A,q=>{!V&&(q!==e[o]||p)&&I(q)},{deep:p}),A}else return t.computed({get(){return k()},set(b){I(b)}})}const le=t.defineComponent({name:"ENode",__name:"node",props:{componentSchema:{},modelValue:{},ruleField:{},resetFormData:{},name:{}},emits:["update:modelValue","change"],setup(e,{emit:o}){const{proxy:r}=t.getCurrentInstance(),s=e;let n=t.reactive(_.deepClone(s.componentSchema));t.watch(()=>s.componentSchema,i=>{_.deepEqual(n,i,["children"])||_.deepCompareAndModify(n,_.deepClone(i))},{deep:!0});let c=t.inject("formData",{});const d=t.inject("slots",{}),l=t.inject("pageManager",{}),h=t.inject("disabled",{value:!1}),P=t.inject("ruleFieldPrefix",null),p=t.inject("resetFormData",!1);(s.resetFormData||p)&&(c={});const u=o,m=_.pluginManager.getComponent("form-item"),a=t.ref(),w=t.ref(),S=t.useAttrs();Object.keys(S).length&&t.provide("nodeAttrs",S);const E=t.shallowRef(null),k=t.reactive({}),I=t.computed(()=>{var i,f;return(i=n.componentProps)!=null&&i.hidden?!1:typeof n.show=="boolean"?n.show:((f=n.show)==null?void 0:f.call(n,{values:c}))??!0});t.watch(I,(i,f)=>{f===!0&&i===!1&&n.field&&c[n.field]!==void 0&&delete c[n.field]});const b=t.computed(()=>{var g,v;let i=I.value&&((g=n.rules)==null?void 0:g.map(C=>{var F,M;return typeof C.required<"u"&&typeof((F=n.componentProps)==null?void 0:F.required)<"u"&&(C.required=(M=n.componentProps)==null?void 0:M.required),{...C,validator:C.validator&&l.funcs.value[C.validator]}}));if((v=n.componentProps)!=null&&v.required&&(!i||i.filter(C=>typeof C.required<"u").length===0)){const C={required:!0,message:"必填项",type:"string",trigger:["change","blur"],validator:void 0};i?i.push(C):i=[C]}let f=n.field;s.ruleField?f=s.ruleField:P&&n.field&&(f=_.deepClone(P),f.push(n.field));const y={...n,rules:i,rule:i,field:f};return y.children&&delete y.children,y}),A=t.computed(()=>{var y,g;const i=((y=V.value)==null?void 0:y.bindModel)??"modelValue",f={};return n.on&&Object.keys(n.on).forEach(v=>{f[`on${_.capitalizeFirstLetter(v)}`]=(...C)=>l.doActions(n.on[v],...C)}),{...s,...n.componentProps,disabled:(h==null?void 0:h.value)||((g=n.componentProps)==null?void 0:g.disabled),bindModel:i,[`onUpdate:${i}`]:D,...f}}),V=t.computed(()=>_.pluginManager.getComponentConfingByType(n.type)??null),q=()=>c[n.field??""]??s.modelValue;t.watch(()=>a.value,()=>{N()},{immediate:!0});function N(){var f;const i=a.value||r;n.id&&i&&(n.input&&(i.setValue=D,i.getValue=()=>c[n.field]||s.modelValue),i.setAttr=(y,g)=>n.componentProps[y]=g,i.getAttr=y=>n.componentProps[y],l.addComponentInstance(n.id,i),(f=V.value)!=null&&f.defaultSchema.input&&n.noFormItem!==!0&&w.value&&l.addComponentInstance(n.id+"formItem",w.value))}function T(){var i;n.id&&(l.removeComponentInstance(n.id),(i=V.value)!=null&&i.defaultSchema.input&&n.noFormItem!==!0&&l.removeComponentInstance(n.id+"formItem"))}async function U(){var f,y,g;if(typeof((f=n.componentProps)==null?void 0:f.defaultValue)<"u"){const v=l.isDesignMode.value?(y=n.componentProps)==null?void 0:y.defaultValue:c[n.field]??((g=n.componentProps)==null?void 0:g.defaultValue);D(_.deepClone(v))}if(n.type==="slot"){const v=n.slotName;if(!v)return;E.value=t.defineComponent({setup(){return()=>t.renderSlot(d,v,{componentSchema:n,model:c})}});return}const i=_.pluginManager.getComponent(n.type);if(!i){console.error(`组件${n.type}未注册`);return}if(typeof i=="function"){const v=await i();E.value=v.default??v}else E.value=i}function D(i){u("update:modelValue",i),u("change",i),n.field&&(c[n.field]=i)}let B=null;return t.watch(()=>n,i=>{const f=JSON.stringify({...i,children:void 0});if(f===B)return!1;B=f,U()},{immediate:!0,deep:!0}),t.onUnmounted(T),(i,f)=>{var g;const y=t.resolveComponent("ENode");return t.unref(n).noFormItem!==!0&&((g=V.value)!=null&&g.defaultSchema.input)&&E.value&&I.value?(t.openBlock(),t.createBlock(t.unref(m),t.mergeProps({key:0,ref_key:"formItemRef",ref:w},b.value),{default:t.withCtx(()=>[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(E.value),t.mergeProps({ref_key:"componentInstance",ref:a,onVnodeMounted:N},{...A.value,...k,[A.value.bindModel]:q()}),{node:t.withCtx(v=>[t.createVNode(y,t.normalizeProps(t.guardReactiveProps(v)),null,16)]),"edit-node":t.withCtx(()=>[t.renderSlot(i.$slots,"edit-node")]),_:3},16))]),_:3},16)):E.value&&I.value?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(E.value),t.mergeProps({key:1,onVnodeMounted:N,ref_key:"componentInstance",ref:a,model:t.unref(c)},{...A.value,...k,[A.value.bindModel]:q()}),{node:t.withCtx(v=>[t.createVNode(y,t.normalizeProps(t.guardReactiveProps(v)),null,16)]),"edit-node":t.withCtx(()=>[t.renderSlot(i.$slots,"edit-node")]),_:3},16,["model"])):t.createCommentVNode("",!0)}}}),ae={component:async()=>await Promise.resolve().then(()=>require("./index-BjvxDW4Q.cjs")),defaultSchema:{label:"代码编辑器",type:"monacoEditor",field:"monacoEditor",icon:"epic-icon-write",input:!0},config:{attribute:[{label:"字段名",type:"input",field:"field"},{label:"标题",type:"input",field:"label"},{label:"默认值",type:"monacoEditor",field:"componentProps.defaultValue"}]},bindModel:"model-value"},de={component:async()=>await Promise.resolve().then(()=>require("./index-Ch9jeYmj.cjs")),defaultSchema:{label:"页面",type:"page",componentProps:{},children:[]},config:{attribute:[{label:"页面名称",type:"input",componentProps:{placeholder:"请输入"},field:"componentProps.name"}]}};function fe(e){e.component("EInputSize",async()=>await Promise.resolve().then(()=>require("./index-CQvjegN8.cjs"))),e.component("EColEditor",async()=>await Promise.resolve().then(()=>require("./index-CXalf6g4.cjs"))),e.component("EActionEditor",async()=>await Promise.resolve().then(()=>require("./index-58-2V1Rn.cjs"))),e.component("ERuleEditor",async()=>await Promise.resolve().then(()=>require("./index-iY2QDwPJ.cjs"))),e.component("EOptionsEditor",async()=>await Promise.resolve().then(()=>require("./index-Mo9NyPPC.cjs"))),e.component("ENode",async()=>await Promise.resolve().then(()=>require("./index-n6zwytyX.cjs"))),e.component("SetAddValue",async()=>await Promise.resolve().then(()=>require("./index-DnkrgRKc.cjs"))),e.registerActivitybar({id:"component_view",title:"组件",icon:"epic-icon-mokuai_1",component:async()=>await Promise.resolve().then(()=>require("./index-MgFtJ5Du.cjs"))}),e.registerActivitybar({id:"sound_code_view",title:"源码",icon:"epic-icon-daima1",component:async()=>await Promise.resolve().then(()=>require("./index-DJUHDe1n.cjs"))}),e.registerActivitybar({id:"outline_view",title:"大纲",icon:"epic-icon-juxingkaobei",component:async()=>await Promise.resolve().then(()=>require("./outline-BStHiBV1.cjs"))}),e.registerRightSidebar({id:"attribute_view",title:"属性",component:async()=>await Promise.resolve().then(()=>require("./attributeView-D8Tr4RkF.cjs"))}),e.registerRightSidebar({id:"style_view",title:"样式",component:async()=>await Promise.resolve().then(()=>require("./styleView-DMMPwZYf.cjs"))}),e.registerRightSidebar({id:"event_view",title:"事件",component:async()=>await Promise.resolve().then(()=>require("./eventView-CMrkwW9y.cjs"))}),[ae,de].forEach(r=>{e.registerComponent(r)})}fe(_.pluginManager);exports._sfc_main=le;exports.createSharedComposable=W;exports.onKeyDown=ne;exports.onKeyUp=oe;exports.useElementSize=ce;exports.useResizeObserver=$;exports.useToggle=Y;exports.useVModel=ue;exports.watchOnce=Z;