epic-designer-gold 1.0.2 → 1.0.4

package/dist/index-C5-ZZLug.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),w=require("./axios-BAhOY32t.cjs"),O=require("./index-BPRzjSrH.cjs"),U=require("./icon.vue_vue_type_script_setup_true_lang-DJbUD5AQ.cjs"),oe=require("./vuedraggable.umd-BqhSJIAi.cjs"),le={class:"epic-widget-action-item whitespace-nowrap"},ae={key:0,class:"flex items-center"},re=e.defineComponent({__name:"previewWidgets",setup(F,{expose:R}){const p=e.inject("pageManager",{}),g=e.inject("pageSchema"),l=e.inject("designer"),b=e.inject("designerProps"),c=e.inject("revoke"),h=e.ref(null),B=e.ref(null),C=e.ref(null),$=e.ref(!1),a=e.ref(!1),r=e.ref(!0),i=e.ref("top"),{canvasScale:s,disabledZoom:N}=O.useStore();let o=null;const j=e.computed(()=>{const t=l.state.checkedNode;return!(!(t!=null&&t.id)||b.value.lockDefaultSchemaEdit&&p.defaultComponentIds.value.includes(t==null?void 0:t.id)||t.type==="table-col")}),z=e.computed(()=>{const t=l.state.checkedNode;return(t==null?void 0:t.type)==="table-col"}),V=e.computed(()=>{const t=l.state.checkedNode;return(t==null?void 0:t.type)==="table"}),m=e.computed(()=>{var v,_,x,u,M,L;const t=p.componentInstances.value,d=(v=l.state.checkedNode)==null?void 0:v.id;if((x=(_=l.state.checkedNode)==null?void 0:_.componentProps)!=null&&x.hidden)return null;const f=w.pluginManager.getComponentConfingByType((u=l.state.checkedNode)==null?void 0:u.type)??null;if(!d||!(t!=null&&t[d]))return null;if(f!=null&&f.defaultSchema.input&&((M=l.state.checkedNode)==null?void 0:M.noFormItem)!==!0)return(L=t[d+"formItem"])==null?void 0:L.$el;const n=t[d];return!(n!=null&&n.$el)||(n==null?void 0:n.$el.nodeName)==="#text"||!(n!=null&&n.$el.getBoundingClientRect)?null:n==null?void 0:n.$el}),y=e.computed(()=>{var v,_,x,u;const t=p.componentInstances.value,d=(v=l.state.hoverNode)==null?void 0:v.id,f=w.pluginManager.getComponentConfingByType((_=l.state.hoverNode)==null?void 0:_.type)??null;if(!d||!(t!=null&&t[d]))return null;if(f!=null&&f.defaultSchema.input&&((x=l.state.hoverNode)==null?void 0:x.noFormItem)!==!0)return(u=t[d+"formItem"])==null?void 0:u.$el;const n=t[d];return(n==null?void 0:n.$el.nodeName)==="#text"?null:n==null?void 0:n.$el}),{mutationObserver:k,observerConfig:D}=Q(J),{startTimedQuery:W,stopTimedQuery:E}=O.useTimedQuery(J);e.watch(()=>m.value,t=>{if(t){$.value=!0,k.observe(t,D);const d=t.parentNode;d&&(d.ondragstart=()=>{r.value=!1,W()},d.ondragend=()=>{r.value=!0,E()}),J()}else $.value=!1});const{mutationObserver:S,observerConfig:T}=Q(Z);e.watch(()=>y.value,t=>{t&&(S.observe(t,T),Z())});let H=0;e.watch(()=>{var t;return(t=l.state.hoverNode)==null?void 0:t.id},t=>{if(t){a.value=!0,clearTimeout(H);return}H=setTimeout(()=>{a.value=!1},300)});let A=0,I=0;function J(){const t=m.value;if(!t||!o)return;const{top:d,left:f}=o==null?void 0:o.getBoundingClientRect(),{top:n,left:v,width:_,height:x}=t.getBoundingClientRect(),u=N.value?1:s.value,M=n-d+((o==null?void 0:o.scrollTop)??0)*u,L=v-f+((o==null?void 0:o.scrollLeft)??0)*u,P=x/u;h.value&&(h.value.style.width=`${_/u}px`,h.value.style.height=`${P}px`,h.value.style.top=`${M/u}px`,h.value.style.left=`${L/u}px`,X(M,L)),C.value&&(M<45&&P<100?(C.value.style.top="",C.value.style.bottom="-30px",C.value.style["border-radius"]="0px 0px 4px 4px",i.value="bottom"):M<45?(C.value.style.top="0px",C.value.style["border-radius"]="0px 0px 4px 0",i.value="center"):(C.value.style.top="-30px",C.value.style["border-radius"]="4px 4px 0px 0px",i.value="top"))}function X(t,d){const f=m.value;if(!o||!f)return;const n=o.getBoundingClientRect(),{width:v}=f.getBoundingClientRect(),_=N.value?1:s.value,x=t/_-n.top;let u=d/_-n.left+v/_;u<n.width&&(u=0);const M=o.scrollTop-n.height/3+60,L=o.scrollTop+n.height/3*2,P=o.scrollLeft-n.width+200,q=o.scrollLeft+n.width-200;Math.abs(x-A)<10&&Math.abs(u-I)<10||(A=x,I=u,!(x>M&&x<L&&u>P&&u<q)&&(o.scrollTop=x,o.scrollLeft=u))}function Z(){var P,q;const t=y.value;if(!t)return;const{top:d,left:f}=(o==null?void 0:o.getBoundingClientRect())??{top:0,left:0},{top:n,left:v,width:_,height:x}=((P=t.getBoundingClientRect)==null?void 0:P.call(t))??((q=t.nextElementSibling)==null?void 0:q.getBoundingClientRect()),u=N.value?1:s.value,M=n-d+((o==null?void 0:o.scrollTop)??0)*u,L=v-f+((o==null?void 0:o.scrollLeft)??0)*u;B.value&&(B.value.style.width=`${_/u}px`,B.value.style.height=`${x/u}px`,B.value.style.top=`${M/u}px`,B.value.style.left=`${L/u}px`)}function Q(t){const d=window.MutationObserver,f={childList:!0,attributes:!0,subtree:!0};return{mutationObserver:new d(t),observerConfig:f}}function Y(){var n,v;const t=w.findSchemaInfoById(g.schemas,((n=l.state.checkedNode)==null?void 0:n.id)??"root");if(!t||!t.list||!t.list.length||!t.list[0].children||!t.list[0].children.length)return!1;let d=JSON.parse(JSON.stringify((v=t.list[0])==null?void 0:v.children[0]));d.children.forEach((_,x)=>{d.children[x].children=[]});const f=w.generateNewSchema(d);t.list[0].children.push(f),l.setCheckedNode(f),c.push(g.schemas,"表格增加一行")}function G(){var f,n,v,_;const t=w.findSchemaInfoById(g.schemas,((f=l.state.checkedNode)==null?void 0:f.id)??"root");if(!((n=t==null?void 0:t.list)!=null&&n.length)||!((_=(v=t.list[0])==null?void 0:v.children)!=null&&_.length))return!1;t.list[0].children.forEach(x=>{const u=x.children.length+1,M=Math.floor(24/u);x.children.forEach(L=>{L.componentProps.span=M}),x.children.push(w.generateNewSchema({type:"table-col",children:[],componentProps:{span:M}}))}),c.push(g.schemas,"表格增加一列")}function ee(){var _;const t=w.findSchemaInfoById(g.schemas,((_=l.state.checkedNode)==null?void 0:_.id)??"root");if(!t)return!1;const{list:d,schema:f,index:n}=t,v=w.generateNewSchema(f);d.splice(n+1,0,v),l.setCheckedNode(v),c.push(g.schemas,"复制组件")}function te(){var v;const t=w.findSchemaInfoById(g.schemas,((v=l.state.checkedNode)==null?void 0:v.id)??"root");if(!t)return!1;let{list:d,schema:f,index:n}=t;d.splice(n,1),n===d.length&&n--,l.setCheckedNode(d[n]),c.push(g.schemas,"删除组件")}function ne(t){o=t,o==null||o.addEventListener("scroll",()=>{J()}),O.useResizeObserver(m,J),O.useResizeObserver(y,Z)}return R({handleInit:ne}),(t,d)=>{var f,n,v,_,x;return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.withDirectives(e.createElementVNode("div",{ref_key:"selectorRef",ref:h,class:e.normalizeClass(["epic-checked-widget absolute pointer-events-none z-20",i.value+" "+(r.value?"transition-all":"")])},[e.createElementVNode("div",{class:"epic-widget-action-box",ref_key:"actionBoxRef",ref:C},[e.createElementVNode("div",le,e.toDisplayString((n=e.unref(w.pluginManager).getComponentConfingByType(((f=e.unref(l).state.checkedNode)==null?void 0:f.type)??""))==null?void 0:n.defaultSchema.label),1),j.value||V.value||z.value?(e.openBlock(),e.createElementBlock("div",ae,[j.value?(e.openBlock(),e.createElementBlock("div",{key:0,title:"复制",class:"epic-widget-action-item pointer-events-auto",onClick:ee},[e.createVNode(e.unref(U._sfc_main),{name:"icon--epic--copy-all-outline-rounded"})])):e.createCommentVNode("",!0),V.value?(e.openBlock(),e.createElementBlock("div",{key:1,title:"插入新行",class:"epic-widget-action-item pointer-events-auto",onClick:Y},[e.createVNode(e.unref(U._sfc_main),{name:"icon--epic--account-tree-outline-rounded"})])):e.createCommentVNode("",!0),V.value?(e.openBlock(),e.createElementBlock("div",{key:2,title:"插入新列",class:"epic-widget-action-item pointer-events-auto",onClick:G,style:{transform:"rotate(270deg)"}},[e.createVNode(e.unref(U._sfc_main),{name:"icon--epic--account-tree-outline-rounded"})])):e.createCommentVNode("",!0),j.value?(e.openBlock(),e.createElementBlock("div",{key:3,title:"删除",class:"epic-widget-action-item pointer-events-auto",onClick:te},[e.createVNode(e.unref(U._sfc_main),{name:"icon--epic--delete-outline-rounded"})])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],512)],2),[[e.vShow,$.value&&((v=e.unref(l).state.checkedNode)==null?void 0:v.id)!=="root"]]),e.withDirectives(e.createElementVNode("div",{ref_key:"hoverWidgetRef",ref:B,class:"epic-hover-widget absolute transition-all pointer-events-none z-998"},null,512),[[e.vShow,a.value&&((_=e.unref(l).state.checkedNode)==null?void 0:_.id)!==((x=e.unref(l).state.hoverNode)==null?void 0:x.id)]])],64)}}}),se=e.defineComponent({name:"EditNodeItem",__name:"editNodeItem",props:{schemas:{}},emits:["update:schemas"],setup(F,{emit:R}){const p=e.inject("designer"),g=e.inject("pageSchema"),l=e.inject("revoke"),b=F,c=R,h=e.computed({get(){return b.schemas},set(r){c("update:schemas",r)}});function B(r){p.setCheckedNode(h.value[r]),p.setDisableHover(!0)}function C(){p.setDisableHover(),l.push(g.schemas,"拖拽组件")}function $(){l.push(g.schemas,"插入组件")}function a(r){var i,s,N;return r.id===((i=g.schemas[0])==null?void 0:i.id)||(N=(s=w.pluginManager.getComponentConfingByType(r.type))==null?void 0:s.editConstraints)!=null&&N.immovable?"unmover-item":"draggable-item"}return(r,i)=>(e.openBlock(),e.createBlock(e.unref(oe.draggable),e.mergeProps({modelValue:h.value,"onUpdate:modelValue":i[0]||(i[0]=s=>h.value=s),"item-key":"id","component-data":{type:"transition-group"},class:"epic-draggable-range"},{animation:200,group:"edit-draggable",handle:".draggable-item",ghostClass:"moveing"},{onStart:i[1]||(i[1]=s=>B(s.oldIndex)),onEnd:i[2]||(i[2]=s=>C()),onAdd:i[3]||(i[3]=s=>{B(s.newIndex),$()})}),{item:e.withCtx(({element:s,index:N})=>[(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["widget-box",a(s)]),key:N},[e.createVNode(K,{schema:s},null,8,["schema"])],2))]),_:1},16,["modelValue"]))}}),K=e.defineComponent({name:"ENodeItem",__name:"nodeItem",props:{schema:{},name:{}},setup(F){const R=e.useAttrs(),p=e.inject("designer"),g=e.inject("pageManager",{}),l=e.inject("pageSchema",{}),b=e.ref(null);e.provide("nodeAttrs",R);const c=F,h=e.computed(()=>{var N,o,j,z,V;const a=g.componentInstances.value,r=(N=c.schema)==null?void 0:N.id,i=w.pluginManager.getComponentConfingByType((o=c.schema)==null?void 0:o.type)??null;if(!r||!(a!=null&&a[r]))return null;if(i!=null&&i.defaultSchema.input&&((j=c.schema)==null?void 0:j.noFormItem)!==!0)return(z=a[r+"formItem"])==null?void 0:z.$el;const s=a[r];return((V=s==null?void 0:s.$el)==null?void 0:V.nodeName)==="#text"?null:s==null?void 0:s.$el});e.watch(()=>h.value,a=>{a==null||a.addEventListener("click",B,!1),a==null||a.addEventListener("mouseover",C,!1),a==null||a.addEventListener("mouseout",$,!1)}),e.onUnmounted(()=>{var a,r,i;(a=h.value)==null||a.removeEventListener("click",B,!1),(r=h.value)==null||r.removeEventListener("mouseover",C,!1),(i=h.value)==null||i.removeEventListener("mouseout",$,!1)});function B(a){a.stopPropagation(),p.setCheckedNode(c.schema)}function C(a){var r;c.schema.id!==((r=l.schemas[0])==null?void 0:r.id)&&(a.stopPropagation(),p.setHoverNode(c.schema))}function $(a){a.stopPropagation(),p.setHoverNode(null)}return(a,r)=>{var s,N;const i=e.resolveComponent("ENodeItem");return e.openBlock(),e.createBlock(e.unref(O._sfc_main),{ref_key:"nodeRef",ref:b,componentSchema:c.schema},e.createSlots({_:2},[(N=(s=e.unref(w.pluginManager).getComponentConfingByType(c.schema.type))==null?void 0:s.editConstraints)!=null&&N.childImmovable?{name:"edit-node",fn:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.schema.children,o=>(e.openBlock(),e.createBlock(i,{key:o.id,schema:o},null,8,["schema"]))),128))]),key:"0"}:{name:"edit-node",fn:e.withCtx(()=>[c.schema.children?(e.openBlock(),e.createBlock(se,{key:0,schemas:c.schema.children,"onUpdate:schemas":r[0]||(r[0]=o=>c.schema.children=o)},null,8,["schemas"])):e.createCommentVNode("",!0)]),key:"1"}]),1032,["componentSchema"])}}}),ce={class:"min-w-750px rounded h-full"},ie=e.defineComponent({__name:"previewJson",setup(F,{expose:R}){const p=w.pluginManager.getComponent("modal"),g=w.pluginManager.getComponent("monacoEditor"),l={theme:"vs-light",selectOnLineNumbers:!0,minimap:{enabled:!1},readOnly:!0},b=e.ref(null),c=e.ref(!1),h=e.inject("pageSchema");function B(){c.value=!1}function C(){c.value=!0,b.value?b.value.setValue(JSON.stringify(h,null,2)):setTimeout(()=>{C()},300)}function $(a="epic-data.json"){const r=JSON.stringify(h,null,2);var i=`data:text/json;charset=utf-8,${encodeURIComponent(r)}`,s=document.createElement("a");s.setAttribute("href",i),s.setAttribute("download",a),s.click()}return R({handleOpen:C}),(a,r)=>(e.openBlock(),e.createBlock(e.unref(p),{modelValue:c.value,"onUpdate:modelValue":r[0]||(r[0]=i=>c.value=i),title:"查看数据",class:"w-900px",width:"900px",onClose:B,onOk:$,okText:"导出数据"},{default:e.withCtx(()=>[e.createElementVNode("div",ce,[e.createVNode(e.unref(g),{ref_key:"monacoEditorRef",ref:b,class:"editor h-full",autoToggleTheme:"",readOnly:"",config:l,language:"json"},null,512)])]),_:1},8,["modelValue"]))}}),de={class:"epic-edit-toolbar flex items-center justify-between px-2"},ue={class:"flex-1 h-full flex items-center"},fe={key:0,class:"epic-divider"},pe=["title","onClick"],he={class:"flex-1 h-full flex items-center justify-end"},me={key:0,class:"flex items-center ml-12px"},ve={class:"pr-8px w-82px cursor-pointer"},ge={class:"epic-device h-28px items-center gap-1 rounded-md border p-2px flex"},ye=["title","onClick"],ke=e.defineComponent({__name:"toolbar",setup(F){const R=w.pluginManager.getComponent("select"),{canvasScale:p,disabledZoom:g}=O.useStore(),l=e.ref("pc"),b=e.inject("pageSchema"),c=e.inject("designer"),h=e.inject("revoke"),B=e.ref(null),C=[{icon:"icon--epic--computer-outline-rounded",title:"pc",key:"pc"},{icon:"icon--epic--tablet-android-outline-rounded",title:"平板",key:"pad"},{icon:"icon--epic--phone-iphone-outline-sharp",title:"手机",key:"mobile"}],$=e.computed(()=>[{icon:"icon--epic--trash",title:"清空",on:o},{icon:"icon--epic--undo",title:"撤销",on:s,disabled:!h.recordList.value.length,divider:!0},{icon:"icon--epic--redo",title:"重做",on:N,disabled:!h.undoList.value.length}]),a=e.ref(null),r=e.computed({get(){return`${(p.value*100).toFixed(0)}%`},set(m){const y=parseFloat(m);p.value=y/100}}),i=[{label:"60%",value:"60%"},{label:"80%",value:"80%"},{label:"100%",value:"100%"},{label:"120%",value:"120%"},{label:"140%",value:"140%"}];function s(){const m=h.undo();m&&(w.deepCompareAndModify(b.schemas,m),c.setCheckedNode(b.schemas[0]))}function N(){const m=h.redo();m&&(w.deepCompareAndModify(b.schemas,m),c.setCheckedNode(b.schemas[0]))}function o(){c.reset()}function j(m){var D;const y=(D=m.target.files)==null?void 0:D[0];if(!y)return;m.target.value=null;const k=new FileReader;k.readAsText(y),k.onload=W=>{var E;z((E=W.target)==null?void 0:E.result)}}function z(m){try{let y=JSON.parse(m??"");y.schemas||(y=w.convertKFormData(y)),w.deepCompareAndModify(b,y)}catch(y){console.error(y)}}function V(m){c.handleToggleDeviceMode(m),l.value=m;const y={pc:{},pad:{width:"780px",mode:m},mobile:{width:"390px",height:"844px",mode:m}};b.canvas=y[m],console.log("%c [ pageSchema ]-248","font-size:13px; background:pink; color:#bf2c9f;",b)}return(m,y)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",de,[e.createElementVNode("div",ue,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList($.value,(k,D)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:D},[k.divider?(e.openBlock(),e.createElementBlock("div",fe)):e.createCommentVNode("",!0),e.createElementVNode("div",{title:k.title,class:e.normalizeClass(["epic-action-item text-base h-90% px-10px flex items-center cursor-pointer",{disabled:k.disabled}]),onClick:k.on},[e.createVNode(e.unref(U._sfc_main),{name:k.icon},null,8,["name"])],10,pe)],64))),128))]),e.withDirectives(e.createElementVNode("input",{type:"file",ref_key:"fileRef",ref:a,accept:".json,.txt",onChange:j},null,544),[[e.vShow,!1]]),e.createElementVNode("div",he,[e.unref(g)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",me,[e.createElementVNode("div",ve,[e.createVNode(e.unref(R),{value:r.value,"onUpdate:value":y[0]||(y[0]=k=>r.value=k),modelValue:r.value,"onUpdate:modelValue":y[1]||(y[1]=k=>r.value=k),options:i,size:"small"},null,8,["value","modelValue"])])])),e.createElementVNode("div",ge,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(C,k=>e.createElementVNode("div",{key:k.key,title:k.title,class:e.normalizeClass(["epic-device-item h-full px-1 flex items-center cursor-pointer text-base transition-colors rounded-sm",{checked:k.key===l.value}]),onClick:D=>V(k.key)},[e.createVNode(e.unref(U._sfc_main),{name:k.icon},null,8,["name"])],10,ye)),64))])])]),e.createVNode(ie,{ref_key:"previewJson",ref:B},null,512)],64))}}),xe={class:"h-full flex flex-col relative"},be=["draggable"],_e=e.defineComponent({__name:"editScreenContainer",setup(F){const R=e.inject("pageSchema"),p=e.ref(null),g=e.ref(null),l=e.ref(null),{pressSpace:b,disabledZoom:c}=O.useStore(),{handleElementDragStart:h,handleElementDrag:B,handleElementDragEnd:C}=O.useElementDrag(p),{width:$,height:a}=O.useElementSize(p),{canvasScale:r,handleZoom:i}=O.useElementZoom(g);let s=0,N=0;const o=e.ref({}),j=e.ref({}),z=e.ref({}),V=e.shallowRef({width:0,height:0});e.watchEffect(y),e.watch(z,()=>{e.nextTick(m)});function m(){l.value&&(V.value={width:l.value.clientWidth,height:l.value.clientHeight})}function y(){var E,S;z.value={width:((E=R.canvas)==null?void 0:E.width)??"0",height:((S=R.canvas)==null?void 0:S.height)??"0"}}O.watchOnce($,k),e.watch(V,k);function k(){let E=V.value.width||s,S=V.value.height||N;o.value={width:$.value+E+"px",height:a.value+S+"px"},j.value={width:E+"px",height:S+"px"},D()}function D(){e.nextTick(()=>{var A;let E=V.value.width||s;const T=(V.value.height||N)/2,H=E/2;(A=p.value)==null||A.scrollTo(H,T)})}O.useResizeObserver(p,W),O.useResizeObserver(g,W);function W(){var S;if(!p.value)return;const E=p.value.getBoundingClientRect();if(s=E.width-60,N=E.height-80,!c.value)if(V.value.width===0)r.value=1;else{const T=(s-20)/V.value.width,H=N/(V.value.height||((S=g.value)==null?void 0:S.clientHeight)||1),A=Math.abs(T-1)<Math.abs(H-1);let I=1;A?I=T:I=H,(T<1||H<1)&&(I=Math.min(T,H)),I<1.4&&I>.5&&(r.value=I)}O.debounce(k,50)()}return(E,S)=>(e.openBlock(),e.createElementBlock("div",xe,[e.createVNode(ke),e.createElementVNode("div",{ref_key:"editScreenContainerRef",ref:p,class:e.normalizeClass(["flex-1 overflow-auto overflow-y-hidden epic-edit-screen-container",{"cursor-grab":e.unref(b)}]),draggable:e.unref(b),onWheel:S[0]||(S[0]=(...T)=>e.unref(i)&&e.unref(i)(...T)),onDragstart:S[1]||(S[1]=(...T)=>e.unref(h)&&e.unref(h)(...T)),onDragend:S[2]||(S[2]=(...T)=>e.unref(C)&&e.unref(C)(...T)),onDrag:S[3]||(S[3]=(...T)=>e.unref(B)&&e.unref(B)(...T))},[e.createElementVNode("div",{id:"canvasContainer",class:"flex items-center justify-center",style:e.normalizeStyle(o.value)},[e.createElementVNode("div",{ref_key:"draggableElRef",ref:g,class:"transition-all"},[e.createElementVNode("div",{class:e.normalizeClass({"pointer-events-none":e.unref(b)}),style:e.normalizeStyle(j.value)},[e.renderSlot(E.$slots,"default")],6)],512)],4)],42,be),e.createElementVNode("div",{ref_key:"sizeBoxRef",ref:l,class:"absolute top-0 pointer-events-none",style:e.normalizeStyle(z.value)},null,4)]))}}),Ce={class:"epic-edit-canvas"},Ne=e.defineComponent({__name:"index",setup(F){const R=e.ref(null),p=e.ref(null),g=e.inject("pageSchema"),l=e.computed(()=>g.schemas[0]),b=e.computed(()=>({width:"100%",height:"100%"}));return e.onMounted(()=>{var c;(c=p.value)==null||c.handleInit(R.value)}),(c,h)=>(e.openBlock(),e.createElementBlock("section",Ce,[e.createVNode(_e,null,{default:e.withCtx(()=>[e.createElementVNode("div",{ref_key:"epicEditRangeRef",ref:R,class:"epic-edit-range rounded-md overflow-auto relative",style:e.normalizeStyle(b.value)},[e.createVNode(K,{schema:l.value},null,8,["schema"]),e.createVNode(re,{ref_key:"ePreviewWidgetsRef",ref:p},null,512)],4)]),_:1})]))}});exports.default=Ne;

package/dist/index-C6C5D9M8.js

@@ -0,0 +1,602 @@
+import { defineComponent as te, ref as O, reactive as oe, onMounted as ue, openBlock as m, createElementBlock as p, createVNode as t, unref as a, withCtx as s, createElementVNode as n, toDisplayString as v, Fragment as D, renderList as J, normalizeClass as de, normalizeStyle as re, createTextVNode as V, createCommentVNode as R } from "vue";
+import { p as f, E as q, e as se } from "./axios-BFVeUxau.js";
+import { ElMessage as L } from "element-plus";
+import { _ } from "./icon.vue_vue_type_script_setup_true_lang-D3QdcReY.js";
+import { u as ne, a as ie } from "./index-DO5DuUPL.js";
+const ce = { class: "e-data-source" }, me = { class: "icon-numbers" }, pe = { class: "drawer-content" }, ve = { class: "drawer-content-left" }, fe = ["onClick"], he = { class: "source-item-title" }, ye = ["onClick"], be = { class: "drawer-content-right" }, ge = { class: "content" }, Ve = {
+  key: 0,
+  class: "content-empty"
+}, _e = {
+  key: 1,
+  class: "content-form"
+}, Se = { class: "form-flex" }, ke = { class: "form-item" }, Le = { class: "form-item-title" }, Ne = {
+  key: 0,
+  class: "form-item-content"
+}, Ce = { class: "form-item" }, Ee = { class: "form-item-title" }, we = {
+  key: 0,
+  class: "form-item-content"
+}, Oe = { class: "form-item" }, Ue = { class: "form-item-title" }, De = {
+  key: 0,
+  class: "form-item-content"
+}, Je = { class: "content-right-btn" }, Be = /* @__PURE__ */ te({
+  __name: "index",
+  emits: ["update:modelValue", "update:sourceData"],
+  setup(qe, { emit: Pe }) {
+    const { t: u } = ne(), y = f.getComponent("button"), x = f.getComponent("Drawer"), h = f.getComponent("input"), N = f.getComponent("FormItem"), F = f.getComponent("Form"), B = f.getComponent("RadioGroup"), U = f.getComponent("RadioButton");
+    f.getComponent("select"), f.getComponent("switch");
+    const P = O(), A = {
+      GET: "#67c23a",
+      POST: "#e6a23c",
+      PUT: "#409eff",
+      DELETE: "#f56c6c"
+    }, M = O(0), $ = oe({
+      apiName: [{ required: !0, message: u("pleaseEnterApiName"), trigger: "blur" }],
+      url: [{ required: !0, message: u("pleaseEnterRequestUrl"), trigger: "blur" }],
+      dataKey: [{ required: !0, message: u("pleaseEnterLabelKey"), trigger: "blur" }],
+      dataValue: [{ required: !0, message: u("pleaseEnterValueKey"), trigger: "blur" }]
+    }), T = O(!1), b = O([]), e = O(), C = [
+      {
+        label: "1",
+        value: "1"
+      }
+    ];
+    function j() {
+      T.value = !0;
+    }
+    function G() {
+      const o = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+      return o.charAt(Math.floor(Math.random() * o.length));
+    }
+    function I(o) {
+      let l = "";
+      for (let d = 0; d < o; d++)
+        l += G();
+      return l;
+    }
+    function z() {
+      !e.value || e.value.id || !Object.keys(e.value).length ? (e.value = {
+        id: "",
+        url: "",
+        body: {},
+        bodyList: [],
+        apiName: `${u("dataSource")}_${I(5)}`,
+        method: "get",
+        params: {},
+        paramsList: [],
+        dataKey: "name",
+        headers: {},
+        headerList: [],
+        dataPath: "",
+        dataValue: "id"
+      }, b.value.push(e.value)) : e.value.id || K();
+    }
+    function H(o) {
+      var l;
+      !e.value || e.value.id || !Object.keys(e.value).length ? (b.value = JSON.parse(JSON.stringify(f.getSourceData())), ((l = e.value) == null ? void 0 : l.id) === o ? e.value = {} : (e.value = b.value.find((d) => d.id === o), e.value.paramsList = Object.keys(JSON.parse(e.value.params)).map((d) => ({
+        label: d,
+        value: JSON.parse(e.value.params)[d]
+      })), e.value.bodyList = Object.keys(JSON.parse(e.value.body)).map((d) => ({
+        label: d,
+        value: JSON.parse(e.value.body)[d]
+      })), e.value.headerList = Object.keys(JSON.parse(e.value.headers)).map((d) => ({
+        label: d,
+        value: JSON.parse(e.value.headers)[d]
+      })))) : K();
+    }
+    function Q(o) {
+      o ? (q.emit("deleteSourceData", o), e.value = {}) : (b.value = b.value.filter((l) => l.id !== o), e.value = {});
+    }
+    function W() {
+      var o;
+      (o = e.value) == null || o.paramsList.push({
+        label: "",
+        value: ""
+      });
+    }
+    function X(o) {
+      e.value.paramsList.splice(o, 1);
+    }
+    function Y() {
+      var o;
+      (o = e.value) == null || o.headerList.push({
+        label: "",
+        value: ""
+      });
+    }
+    function Z(o) {
+      e.value.headerList.splice(o, 1);
+    }
+    function ee() {
+      var o;
+      (o = e.value) == null || o.bodyList.push({
+        label: "",
+        value: ""
+      });
+    }
+    function ae(o) {
+      e.value.bodyList.splice(o, 1);
+    }
+    ue(() => {
+      b.value = JSON.parse(JSON.stringify(f.getSourceData()));
+    }), q.on("updateSource", (o) => {
+      b.value = JSON.parse(JSON.stringify(f.getSourceData()));
+    });
+    async function le() {
+      P.value.validate(async (o) => {
+        if (o)
+          try {
+            const l = {};
+            e.value.paramsList.forEach((i) => {
+              l[i.label] = i.value;
+            });
+            const d = {};
+            e.value.bodyList.forEach((i) => {
+              d[i.label] = i.value;
+            });
+            const S = {};
+            e.value.headerList.forEach((i) => {
+              S[i.label] = i.value;
+            });
+            let g = await se({
+              method: e.value.method,
+              // url: formData.value.url,
+              // url: "http://localhost:3333/users",
+              url: e.value.url,
+              params: l,
+              data: d,
+              headers: {
+                ...S,
+                Authorization: "Bearer " + ie.get("Admin-Token")
+              }
+            });
+            if (e.value.dataPath) {
+              const E = e.value.dataPath.split(".").reduce((k, r) => k[r], g.data);
+              E && E.length ? L({
+                message: E.map((k) => ({
+                  label: k[e.value.dataKey],
+                  value: k[e.value.dataValue]
+                }))
+              }) : L.info(u("configError"));
+            } else
+              g.data && g.data.length ? L({
+                message: g.data.map((i) => ({
+                  label: i[e.value.dataKey],
+                  value: i[e.value.dataValue]
+                }))
+              }) : L.info(u("configError"));
+          } catch {
+            L.error(u("requestFailed"));
+          } finally {
+          }
+        else
+          L.error(u("fillRequiredFields"));
+      });
+    }
+    async function K() {
+      e.value.body = e.value.bodyList.reduce((o, l) => (o[l.label] = l.value, o), {}), e.value.params = e.value.paramsList.reduce(
+        (o, l) => (o[l.label] = l.value, o),
+        {}
+      ), e.value.headers = e.value.headerList.reduce(
+        (o, l) => (o[l.label] = l.value, o),
+        {}
+      ), P.value.validate((o) => {
+        o ? e.value.id ? (q.emit("updateSourceData", {
+          ...e.value,
+          body: JSON.stringify(e.value.body),
+          params: JSON.stringify(e.value.params),
+          headers: JSON.stringify(e.value.headers)
+        }), e.value = {}) : (q.emit("saveSourceData", {
+          ...e.value,
+          body: JSON.stringify(e.value.body),
+          params: JSON.stringify(e.value.params),
+          headers: JSON.stringify(e.value.headers)
+        }), e.value = {}) : L.warning(u("completeFormFirst"));
+      });
+    }
+    return (o, l) => (m(), p("div", ce, [
+      t(a(y), {
+        class: "btn",
+        onClick: j
+      }, {
+        default: s(() => [
+          t(a(_), {
+            name: "icon--epic--window-outline",
+            class: "mr-4px"
+          }),
+          n("span", null, v(a(u)("configuration")), 1),
+          n("span", me, v(M.value || b.value.length), 1)
+        ]),
+        _: 1
+      }),
+      t(a(x), {
+        size: 960,
+        modelValue: T.value,
+        "onUpdate:modelValue": l[7] || (l[7] = (d) => T.value = d),
+        "append-to-body": "",
+        title: a(u)("dataSources")
+      }, {
+        default: s(() => [
+          n("div", pe, [
+            n("div", ve, [
+              t(a(y), {
+                type: "primary",
+                class: "btn",
+                onClick: z
+              }, {
+                default: s(() => [
+                  t(a(_), {
+                    name: "icon--epic--add-rounded",
+                    class: "mr-4px"
+                  }),
+                  n("span", null, v(a(u)("addDataSource")), 1)
+                ]),
+                _: 1
+              }),
+              n("div", null, [
+                (m(!0), p(D, null, J(b.value, (d) => {
+                  var S;
+                  return m(), p("div", {
+                    class: de(["source-item", { active: d.id === ((S = e.value) == null ? void 0 : S.id) }]),
+                    key: d.id,
+                    onClick: (g) => H(d.id)
+                  }, [
+                    n("div", he, [
+                      n("div", {
+                        style: re({
+                          color: A[d.method.toLocaleUpperCase()]
+                        })
+                      }, v(d.method.toLocaleUpperCase()), 5),
+                      n("div", null, v(d.apiName), 1)
+                    ]),
+                    n("div", {
+                      onClick: (g) => Q(d.id),
+                      class: "source-item-icon"
+                    }, [
+                      t(a(_), { name: "icon--epic--delete-outline-rounded" })
+                    ], 8, ye)
+                  ], 10, fe);
+                }), 128))
+              ])
+            ]),
+            n("div", be, [
+              n("div", ge, [
+                !e.value || !Object.keys(e.value).length ? (m(), p("div", Ve, v(a(u)("pleaseSelectDataSource")), 1)) : (m(), p("div", _e, [
+                  t(a(F), {
+                    ref_key: "ruleFormRef",
+                    ref: P,
+                    model: e.value,
+                    "label-position": "top",
+                    rules: $,
+                    "label-width": 120
+                  }, {
+                    default: s(() => {
+                      var d, S, g, i, E, k;
+                      return [
+                        t(a(N), {
+                          prop: "apiName",
+                          label: a(u)("apiName")
+                        }, {
+                          default: s(() => [
+                            t(a(h), {
+                              clearable: "",
+                              modelValue: e.value.apiName,
+                              "onUpdate:modelValue": l[0] || (l[0] = (r) => e.value.apiName = r),
+                              placeholder: a(u)("pleaseEnterApiName")
+                            }, null, 8, ["modelValue", "placeholder"])
+                          ]),
+                          _: 1
+                        }, 8, ["label"]),
+                        t(a(N), {
+                          prop: "url",
+                          label: a(u)("requestUrl")
+                        }, {
+                          default: s(() => [
+                            t(a(h), {
+                              modelValue: e.value.url,
+                              "onUpdate:modelValue": l[1] || (l[1] = (r) => e.value.url = r),
+                              clearable: "",
+                              placeholder: a(u)("pleaseEnterRequestUrl")
+                            }, null, 8, ["modelValue", "placeholder"])
+                          ]),
+                          _: 1
+                        }, 8, ["label"]),
+                        t(a(N), {
+                          label: a(u)("requestMethod"),
+                          required: ""
+                        }, {
+                          default: s(() => [
+                            t(a(B), {
+                              modelValue: e.value.method,
+                              "onUpdate:modelValue": l[2] || (l[2] = (r) => e.value.method = r)
+                            }, {
+                              default: s(() => [
+                                t(a(U), {
+                                  label: "GET",
+                                  value: "get"
+                                }, {
+                                  default: s(() => l[8] || (l[8] = [
+                                    V("GET")
+                                  ])),
+                                  _: 1
+                                }),
+                                t(a(U), {
+                                  label: "POST",
+                                  value: "post"
+                                }, {
+                                  default: s(() => l[9] || (l[9] = [
+                                    V("POST")
+                                  ])),
+                                  _: 1
+                                }),
+                                t(a(U), {
+                                  label: "PUT",
+                                  value: "put"
+                                }, {
+                                  default: s(() => l[10] || (l[10] = [
+                                    V("PUT")
+                                  ])),
+                                  _: 1
+                                }),
+                                t(a(U), {
+                                  label: "DELETE",
+                                  value: "delete"
+                                }, {
+                                  default: s(() => l[11] || (l[11] = [
+                                    V("DELETE")
+                                  ])),
+                                  _: 1
+                                })
+                              ]),
+                              _: 1
+                            }, 8, ["modelValue"])
+                          ]),
+                          _: 1
+                        }, 8, ["label"]),
+                        n("div", Se, [
+                          t(a(N), {
+                            prop: "dataKey",
+                            style: { width: "30%" },
+                            label: a(u)("labelKey")
+                          }, {
+                            default: s(() => [
+                              t(a(h), {
+                                modelValue: e.value.dataKey,
+                                "onUpdate:modelValue": l[3] || (l[3] = (r) => e.value.dataKey = r),
+                                clearable: "",
+                                placeholder: a(u)("pleaseEnterLabelKey")
+                              }, null, 8, ["modelValue", "placeholder"])
+                            ]),
+                            _: 1
+                          }, 8, ["label"]),
+                          t(a(N), {
+                            prop: "dataValue",
+                            style: { width: "30%" },
+                            label: a(u)("valueKey")
+                          }, {
+                            default: s(() => [
+                              t(a(h), {
+                                modelValue: e.value.dataValue,
+                                "onUpdate:modelValue": l[4] || (l[4] = (r) => e.value.dataValue = r),
+                                clearable: "",
+                                placeholder: a(u)("pleaseEnterValueKey")
+                              }, null, 8, ["modelValue", "placeholder"])
+                            ]),
+                            _: 1
+                          }, 8, ["label"]),
+                          t(a(N), {
+                            style: { width: "33%" },
+                            label: a(u)("dataPath")
+                          }, {
+                            default: s(() => [
+                              t(a(h), {
+                                modelValue: e.value.dataPath,
+                                "onUpdate:modelValue": l[5] || (l[5] = (r) => e.value.dataPath = r),
+                                clearable: "",
+                                placeholder: a(u)("nestedPath")
+                              }, null, 8, ["modelValue", "placeholder"])
+                            ]),
+                            _: 1
+                          }, 8, ["label"])
+                        ]),
+                        n("div", ke, [
+                          n("div", Le, [
+                            n("div", null, v(a(u)("requestParams")), 1),
+                            t(a(y), {
+                              onClick: W,
+                              text: "",
+                              type: "primary",
+                              class: "btn"
+                            }, {
+                              default: s(() => [
+                                t(a(_), { name: "icon--epic--add-rounded" }),
+                                V(" " + v(a(u)("add")), 1)
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          (d = e.value) != null && d.paramsList && ((S = e.value) != null && S.paramsList.length) ? (m(), p("div", Ne, [
+                            (m(!0), p(D, null, J(e.value.paramsList, (r, w) => (m(), p("div", {
+                              class: "content-item",
+                              key: r.value
+                            }, [
+                              t(a(h), {
+                                modelValue: r.label,
+                                "onUpdate:modelValue": (c) => r.label = c,
+                                filterable: "",
+                                "allow-create": "",
+                                style: { width: "42%" },
+                                options: C,
+                                placeholder: a(u)("paramName")
+                              }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"]),
+                              t(a(h), {
+                                modelValue: r.value,
+                                "onUpdate:modelValue": (c) => r.value = c,
+                                filterable: "",
+                                "allow-create": "",
+                                style: { width: "42%" },
+                                options: C,
+                                placeholder: a(u)("paramValue")
+                              }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"]),
+                              t(a(y), {
+                                onClick: (c) => X(w),
+                                type: "danger",
+                                circle: ""
+                              }, {
+                                default: s(() => [
+                                  t(a(_), {
+                                    style: { color: "#fff" },
+                                    name: "icon--epic--delete-outline-rounded"
+                                  })
+                                ]),
+                                _: 2
+                              }, 1032, ["onClick"])
+                            ]))), 128))
+                          ])) : R("", !0)
+                        ]),
+                        n("div", Ce, [
+                          n("div", Ee, [
+                            n("div", null, v(a(u)("requestHeaders")), 1),
+                            t(a(y), {
+                              onClick: Y,
+                              text: "",
+                              type: "primary",
+                              class: "btn"
+                            }, {
+                              default: s(() => [
+                                t(a(_), { name: "icon--epic--add-rounded" }),
+                                V(" " + v(a(u)("add")), 1)
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          (g = e.value) != null && g.headerList && ((i = e.value) != null && i.headerList.length) ? (m(), p("div", we, [
+                            (m(!0), p(D, null, J(e.value.headerList, (r, w) => (m(), p("div", {
+                              class: "content-item",
+                              key: w
+                            }, [
+                              t(a(h), {
+                                modelValue: r.label,
+                                "onUpdate:modelValue": (c) => r.label = c,
+                                filterable: "",
+                                "allow-create": "",
+                                style: { width: "42%" },
+                                options: C,
+                                placeholder: a(u)("paramName")
+                              }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"]),
+                              t(a(h), {
+                                modelValue: r.value,
+                                "onUpdate:modelValue": (c) => r.value = c,
+                                filterable: "",
+                                "allow-create": "",
+                                style: { width: "42%" },
+                                options: C,
+                                placeholder: a(u)("paramValue")
+                              }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"]),
+                              t(a(y), {
+                                onClick: (c) => Z(w),
+                                type: "danger",
+                                circle: ""
+                              }, {
+                                default: s(() => [
+                                  t(a(_), {
+                                    style: { color: "#fff" },
+                                    name: "icon--epic--delete-outline-rounded"
+                                  })
+                                ]),
+                                _: 2
+                              }, 1032, ["onClick"])
+                            ]))), 128))
+                          ])) : R("", !0)
+                        ]),
+                        n("div", Oe, [
+                          n("div", Ue, [
+                            n("div", null, v(a(u)("requestBody")), 1),
+                            t(a(y), {
+                              onClick: ee,
+                              text: "",
+                              type: "primary",
+                              class: "btn"
+                            }, {
+                              default: s(() => [
+                                t(a(_), { name: "icon--epic--add-rounded" }),
+                                V(" " + v(a(u)("add")), 1)
+                              ]),
+                              _: 1
+                            })
+                          ]),
+                          (E = e.value) != null && E.bodyList && ((k = e.value) != null && k.bodyList.length) ? (m(), p("div", De, [
+                            (m(!0), p(D, null, J(e.value.bodyList, (r, w) => (m(), p("div", {
+                              class: "content-item",
+                              key: w
+                            }, [
+                              t(a(h), {
+                                modelValue: r.label,
+                                "onUpdate:modelValue": (c) => r.label = c,
+                                filterable: "",
+                                "allow-create": "",
+                                style: { width: "42%" },
+                                options: C,
+                                placeholder: a(u)("paramName")
+                              }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"]),
+                              t(a(h), {
+                                modelValue: r.value,
+                                "onUpdate:modelValue": (c) => r.value = c,
+                                filterable: "",
+                                "allow-create": "",
+                                style: { width: "42%" },
+                                options: C,
+                                placeholder: a(u)("paramValue")
+                              }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"]),
+                              t(a(y), {
+                                onClick: l[6] || (l[6] = (c) => ae(o.i)),
+                                type: "danger",
+                                circle: ""
+                              }, {
+                                default: s(() => [
+                                  t(a(_), {
+                                    style: { color: "#fff" },
+                                    name: "icon--epic--delete-outline-rounded"
+                                  })
+                                ]),
+                                _: 1
+                              })
+                            ]))), 128))
+                          ])) : R("", !0)
+                        ]),
+                        n("div", Je, [
+                          t(a(y), {
+                            type: "info",
+                            onClick: le
+                          }, {
+                            default: s(() => [
+                              V(v(a(u)("requestTest")), 1)
+                            ]),
+                            _: 1
+                          }),
+                          t(a(y), {
+                            type: "primary",
+                            onClick: K
+                          }, {
+                            default: s(() => [
+                              V(v(a(u)("save")), 1)
+                            ]),
+                            _: 1
+                          })
+                        ])
+                      ];
+                    }),
+                    _: 1
+                  }, 8, ["model", "rules"])
+                ]))
+              ])
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["modelValue", "title"])
+    ]));
+  }
+});
+export {
+  Be as default
+};