epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 8.57 kB
JavaScript
;const e=require("vue");;/* empty css */const k=require("../../../../base-ui/src/icon/icon.vue.cjs");;/* empty css */;/* empty css */const C=require("../../../../../utils/src/common/data.cjs"),A=require("../../../../../utils/src/common/string.cjs");require("../../../../../git/epic/epic-designer/node_modules/.pnpm/jsep@1.4.0/node_modules/jsep/dist/jsep.cjs");const U=require("@vueuse/core");require("../../../../../hooks/src/store/index.cjs");const K=require("../../../../../hooks/src/designer/useDesignerContext.cjs"),j=require("../../../../../hooks/src/designer/usePageManager.cjs"),s=require("../../../../../manager/src/pluginManager.cjs");;/* empty css */const J=require("../../../../base-ui/src/tree/tree.vue.cjs"),P=require("./epArgsEditor.vue.cjs"),F=require("./epScriptEdit.vue.cjs"),L={class:"epic-modal-action-main rounded"},R={class:"epic-modal-left-panel flex h-full flex-col"},W={class:"flex h-0 flex-1 flex-col"},G={class:"h-0 flex-1"},H={class:"max-w-full truncate"},Q={class:"epic-node-type-text w-0 flex-1 truncate"},X={class:"epic-action-select h-30/100 flex flex-col"},Y={class:"mb-2"},Z={class:"pr-8px flex-1 overflow-auto"},ee=["onClick"],te=["title"],ne={class:"pt-42px text-center text-gray-400"},oe={class:"epic-modal-right-panel"},ae={key:1},le={key:0,class:"bg-$ep-muted mb-4 rounded-lg border p-4 transition-colors"},ce={class:"flex flex-col gap-1"},ie={class:"flex items-center"},se={class:"text-$ep-text-helper text-sm font-medium"},re={class:"text-$ep-text-secondary"},ue={key:1,class:"pt-42px text-center text-gray-400"},de=e.defineComponent({__name:"index",emits:["add","edit"],setup(pe,{expose:V,emit:b}){const E=b,B=s.pluginManager.component.get("modal"),M=s.pluginManager.component.get("button"),f=e.ref(!0),{pageSchema:y}=K.useDesignerContext(),S=j.usePageManager(),d=e.ref(!1),p=e.ref([]),c=e.ref(null),{copy:q}=U.useClipboard({}),D=e.computed(()=>{var o;return((o=c.value)==null?void 0:o.id)??""}),n=e.reactive({actionItem:{componentId:null,methodName:"test",type:"custom"},cacheData:{}}),T=e.computed(()=>{var t;const o={component:"组件",custom:"自定义函数",public:"公共函数"};return n.actionItem.type==="component"&&c.value?`${c.value.label||((t=s.pluginManager.component.getConfigByType(c.value.type))==null?void 0:t.defaultSchema.label)||"未命名组件"}`:o[n.actionItem.type]||n.actionItem.type}),i=e.computed(()=>{var o;return n.actionItem.type==="component"?c.value?(o=s.pluginManager.component.getConfigByType(c.value.type).config.action)==null?void 0:o.map(l=>({label:l.describe??l.description,value:l.type})):[]:n.actionItem.type==="custom"?Object.entries(S.funcs.value).filter(([t,l])=>typeof l=="function").map(([t])=>({label:t,value:t})):n.actionItem.type==="public"?Object.entries(s.pluginManager.publicMethods.methodsMap).map(([t,l])=>({...l,label:l.description,value:t})):[]}),h=e.computed(()=>{if(n.actionItem.type==="component"&&c.value){const o=s.pluginManager.component.getConfigByType(c.value.type).config.action,t=o==null?void 0:o.find(l=>l.type===n.actionItem.methodName);if(t!=null&&t.argsConfigs){const l=t.argsConfigs.findIndex(r=>r.label==="设置数据");l!==-1&&(t.argsConfigs[l]={...c.value,field:"0",id:A.getUUID(),label:"设置数据"})}return(t==null?void 0:t.argsConfigs)??[]}return[]});function w(){var o;d.value=!0,f.value=!0,n.actionItem.type="custom",n.actionItem.componentId=null,(o=i.value)!=null&&o.length&&g(i.value[0].value)}function $(o){if(d.value=!0,f.value=!1,c.value=null,o.componentId){const t=C.findSchemaById(y.schemas,o.componentId);c.value=t,p.value=[o.componentId]}e.nextTick(()=>{n.actionItem.componentId=o.componentId,n.actionItem.methodName=o.methodName,n.actionItem.type=o.type,n.actionItem.args=o.args})}function O(){const{methodName:o,type:t}=n.actionItem;if(o){if(t==="component"&&o==="setAttr"&&c.value){const r=(s.pluginManager.component.getConfigByType(c.value.type).config.attribute||[]).filter(({field:a})=>String(a).startsWith("props")),u=JSON.parse(n.actionItem.args||"[]"),m=r.findIndex(({field:a})=>a===`props.${u[0]}`);m!==-1&&(n.actionItem.args=JSON.stringify([u[0],u[m+1]]))}}else{alert("请先选择动作方法");return}E(f.value?"add":"edit",C.deepClone(e.toRaw(n.actionItem))),_()}function _(){d.value=!1,p.value=[],n.cacheData={}}function I(o){var t;n.actionItem.componentId=null,n.actionItem.type=o,c.value=null,n.actionItem.methodName=null,p.value=[],(t=i.value)!=null&&t.length&&g(i.value[0].value)}function z(o){var t;n.actionItem.args&&(n.cacheData[n.actionItem.componentId+n.actionItem.methodName]=n.actionItem.args),n.actionItem.componentId=o.id,n.actionItem.type="component",n.actionItem.methodName=null,c.value=o.componentSchema,(t=i.value)!=null&&t.length&&g(i.value[0].value)}function g(o){n.actionItem.methodName=o,n.actionItem.args=n.cacheData[n.actionItem.componentId+n.actionItem.methodName]}return V({handleOpen:w,handleOpenEdit:$}),(o,t)=>(e.openBlock(),e.createBlock(e.unref(B),{modelValue:d.value,"onUpdate:modelValue":t[4]||(t[4]=l=>d.value=l),width:"1200px",title:"动作配置",onClose:_,onOk:O},{default:e.withCtx(()=>{var l,r,u,m;return[e.createElementVNode("div",L,[e.createElementVNode("div",R,[e.createElementVNode("div",W,[e.createElementVNode("div",{class:e.normalizeClass(["fun-btn",{checked:n.actionItem.type==="custom"}]),onClick:t[0]||(t[0]=a=>I("custom"))}," 自定义函数 ",2),e.createElementVNode("div",{class:e.normalizeClass(["fun-btn",{checked:n.actionItem.type==="public"}]),onClick:t[1]||(t[1]=a=>I("public"))}," 公共函数 ",2),t[6]||(t[6]=e.createTextVNode(" 组件 ",-1)),e.createElementVNode("div",G,[e.createVNode(e.unref(J),{"selected-keys":p.value,"onUpdate:selectedKeys":t[2]||(t[2]=a=>p.value=a),options:e.unref(y).schemas,onNodeClick:z},{"tree-node":e.withCtx(({schema:a})=>{var v,x,N;return[e.createElementVNode("div",{class:e.normalizeClass(["epic-text-padding hover:bg-$ep-muted flex items-center",{hidden:(v=a.props)==null?void 0:v.hidden}])},[e.createElementVNode("span",H,[(x=a.props)!=null&&x.hidden?(e.openBlock(),e.createBlock(e.unref(k),{key:0,name:"icon--epic--visibility-off-outline-rounded",class:"translate-y-2px"})):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString(a.label??((N=e.unref(s.pluginManager).component.getConfigByType(a.type))==null?void 0:N.defaultSchema.label)),1)]),e.createElementVNode("span",Q,e.toDisplayString(a.id),1),e.createVNode(e.unref(M),{class:"epic-copy-id-btn",size:"small",onClick:e.withModifiers(me=>e.unref(q)(a.id),["stop"])},{default:e.withCtx(()=>[...t[5]||(t[5]=[e.createTextVNode(" 复制ID ",-1)])]),_:1},8,["onClick"])],2)]}),_:1},8,["selected-keys","options"])])]),e.createElementVNode("div",X,[e.createElementVNode("div",Y,"动作选择（"+e.toDisplayString(T.value)+"）",1),e.createElementVNode("div",Z,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,a=>(e.openBlock(),e.createElementBlock("div",{key:a.value,class:e.normalizeClass([{checked:a.value===n.actionItem.methodName},"epic-action-item"]),onClick:v=>g(a.value)},[e.createElementVNode("span",{title:a.value},e.toDisplayString(a.label),9,te)],10,ee))),128)),e.withDirectives(e.createElementVNode("div",ne," 当前组件暂无动作 ",512),[[e.vShow,!((l=i.value)!=null&&l.length)]])])])]),e.createElementVNode("div",oe,[n.actionItem.type==="custom"?(e.openBlock(),e.createBlock(F,{key:0})):e.createCommentVNode("",!0),n.actionItem.type!=="custom"?(e.openBlock(),e.createElementBlock("div",ae,[n.actionItem.methodName&&((r=i.value)!=null&&r.length)?(e.openBlock(),e.createElementBlock("div",le,[e.createElementVNode("div",ce,[e.createElementVNode("div",ie,[e.createVNode(e.unref(k),{name:"icon--epic--info",class:"mr-2"}),e.createElementVNode("span",se,[e.createTextVNode(e.toDisplayString((u=c.value)==null?void 0:u.label)+" ",1),e.createElementVNode("span",re,e.toDisplayString(((m=i.value.find(a=>a.value===n.actionItem.methodName))==null?void 0:m.label)||"未知"),1),t[7]||(t[7]=e.createTextVNode(" 动作配置 ",-1))])])])])):e.createCommentVNode("",!0),h.value.length===0?(e.openBlock(),e.createElementBlock("div",ue," 暂无配置 ")):(e.openBlock(),e.createBlock(P,{key:D.value,modelValue:n.actionItem.args,"onUpdate:modelValue":t[3]||(t[3]=a=>n.actionItem.args=a),"action-args-configs":h.value},null,8,["modelValue","action-args-configs"]))])):e.createCommentVNode("",!0)])])]}),_:1},8,["modelValue"]))}});module.exports=de;