UNPKG

form-designer-xinyi

Version:

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

2 lines (1 loc) 11.3 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 q(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(f=>f()),c.length=0},l=(f,u,p,a)=>(f.addEventListener(u,p,a),()=>f.removeEventListener(u,p,a)),h=t.watch(()=>[q(o),O(n)],([f,u])=>{if(d(),!f)return;const p=G(u)?{...u}:u;c.push(...r.flatMap(a=>s.map(w=>l(f,a,w,p))))},{immediate:!0,flush:"post"}),C=()=>{h(),d()};return j(C),C}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,f=>{f.repeat&&O(l)||h(f)&&r(f)},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=>q(u)):[q(e)]),C=t.watch(h,u=>{if(l(),d.value&&s){c=new ResizeObserver(o);for(const p of u)p&&c.observe(p,n)}},{immediate:!0,flush:"post"}),f=()=>{l(),C()};return j(f),{isSupported:d,stop:f}}function ce(e,o={width:0,height:0},r={}){const{window:s=R,box:n="content-box"}=r,c=t.computed(()=>{var u,p;return(p=(u=q(e))==null?void 0:u.namespaceURI)==null?void 0:p.includes("svg")}),d=t.ref(o.width),l=t.ref(o.height),{stop:h}=$(e,([u])=>{const p=n==="border-box"?u.borderBoxSize:n==="content-box"?u.contentBoxSize:u.devicePixelContentBoxSize;if(s&&c.value){const a=q(e);if(a){const w=a.getBoundingClientRect();d.value=w.width,l.value=w.height}}else if(p){const a=Array.isArray(p)?p:[p];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=q(e);u&&(d.value="offsetWidth"in u?u.offsetWidth:o.width,l.value="offsetHeight"in u?u.offsetHeight:o.height)});const C=t.watch(()=>q(e),u=>{d.value=u?o.width:0,l.value=u?o.height:0});function f(){h(),C()}return{width:d,height:l,stop:f}}function ue(e,o,r,s={}){var n,c,d;const{clone:l=!1,passive:h=!1,eventName:C,deep:f=!1,defaultValue:u,shouldEmit:p}=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=C;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,x=b=>{p?p(b)&&w(S,b):w(S,b)};if(h){const b=k(),I=t.ref(b);let V=!1;return t.watch(()=>e[o],A=>{V||(V=!0,I.value=E(A),t.nextTick(()=>V=!1))}),t.watch(I,A=>{!V&&(A!==e[o]||f)&&x(A)},{deep:f}),I}else return t.computed({get(){return k()},set(b){x(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}),C=t.inject("ruleFieldPrefix",null),f=t.inject("resetFormData",!1);(s.resetFormData||f)&&(c={});const u=o,p=_.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({}),x=t.computed(()=>{var i,m;return(i=n.componentProps)!=null&&i.hidden?!1:typeof n.show=="boolean"?n.show:((m=n.show)==null?void 0:m.call(n,{values:c}))??!0}),b=t.computed(()=>{var g,v;let i=x.value&&((g=n.rules)==null?void 0:g.map(P=>{var M,F;return typeof P.required<"u"&&typeof((M=n.componentProps)==null?void 0:M.required)<"u"&&(P.required=(F=n.componentProps)==null?void 0:F.required),{...P,validator:P.validator&&l.funcs.value[P.validator]}}));if((v=n.componentProps)!=null&&v.required&&(!i||i.filter(P=>typeof P.required<"u").length===0)){const P={required:!0,message:"必填项",type:"string",trigger:["change","blur"],validator:void 0};i?i.push(P):i=[P]}let m=n.field;s.ruleField?m=s.ruleField:C&&n.field&&(m=_.deepClone(C),m.push(n.field));const y={...n,rules:i,rule:i,field:m};return y.children&&delete y.children,y}),I=t.computed(()=>{var y,g;const i=((y=V.value)==null?void 0:y.bindModel)??"modelValue",m={};return n.on&&Object.keys(n.on).forEach(v=>{m[`on${_.capitalizeFirstLetter(v)}`]=(...P)=>l.doActions(n.on[v],...P)}),{...s,...n.componentProps,disabled:(h==null?void 0:h.value)||((g=n.componentProps)==null?void 0:g.disabled),bindModel:i,[`onUpdate:${i}`]:D,...m}}),V=t.computed(()=>_.pluginManager.getComponentConfingByType(n.type)??null),A=()=>c[n.field??""]??s.modelValue;t.watch(()=>a.value,()=>{N()},{immediate:!0});function N(){var m;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),(m=V.value)!=null&&m.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 m,y,g;if(typeof((m=n.componentProps)==null?void 0:m.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 m=JSON.stringify({...i,children:void 0});if(m===B)return!1;B=m,U()},{immediate:!0,deep:!0}),t.onUnmounted(T),(i,m)=>{var g;const y=t.resolveComponent("ENode");return t.unref(n).noFormItem!==!0&&((g=V.value)!=null&&g.defaultSchema.input)&&E.value&&x.value?(t.openBlock(),t.createBlock(t.unref(p),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},{...I.value,...k,[I.value.bindModel]:A()}),{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&&x.value?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(E.value),t.mergeProps({key:1,onVnodeMounted:N,ref_key:"componentInstance",ref:a,model:t.unref(c)},{...I.value,...k,[I.value.bindModel]:A()}),{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-CIlXywiB.cjs"))),e.component("ERuleEditor",async()=>await Promise.resolve().then(()=>require("./index-DoIfXUcZ.cjs"))),e.component("EOptionsEditor",async()=>await Promise.resolve().then(()=>require("./index-UaaxcLw0.cjs"))),e.component("ENode",async()=>await Promise.resolve().then(()=>require("./index-Cnj_xRkB.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-DWB-0Nqs.cjs"))}),e.registerRightSidebar({id:"style_view",title:"样式",component:async()=>await Promise.resolve().then(()=>require("./styleView-Bzz_M3g8.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;