UNPKG

fx-epic-designer

Version:

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

11 lines (8 loc) 2.83 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue");;/* empty css */require("vuedraggable");const a=require("../../../../../utils/src/common/data.cjs"),k=require("../../../../../utils/src/manager/pageManager.cjs"),q=require("../../../../../utils/src/manager/pluginManager.cjs"),D=require("../../../../../utils/src/manager/revoke.cjs"),I=require("@vueuse/core");let o={schemas:[{componentProps:{style:{padding:"16px"}},id:"root",label:"页面",type:"page",children:[]}],script:`const { defineExpose, find } = epic; function test (){ console.log('test') } // 通过defineExpose暴露的函数或者属性 defineExpose({ test })`};function x(f,h){const y=u.ref(!1),r=k.usePageManager(),t=r.pageSchema,n=u.reactive({disabledHover:!1,hoverNode:null,matched:[],selectedNode:null}),i=D.useRevoke(t,n,d);u.watchEffect(()=>{f.defaultSchema?o=f.defaultSchema:f.formMode&&(o.schemas=q.pluginManager.formSchema),r.setDefaultComponentIds(o.schemas)}),r.setDesignMode();function p(){var g;const s=a.findSchemaInfoById(t.schemas,((g=n.selectedNode)==null?void 0:g.id)??"root");if(!s)return!1;const{index:e,schema:c,list:l}=s,v=a.generateNewSchema(c);l.splice(e+1,0,v),d(v),i.push("复制组件")}function m(){var l;if(!((l=n.selectedNode)!=null&&l.id)||n.selectedNode.id===t.schemas[0].id)return;const s=a.findSchemaInfoById(t.schemas,n.selectedNode.id);if(!s)return!1;let{index:e,list:c}=s;c.splice(e,1),e===c.length&&e--,d(c[e]),i.push("删除组件")}function d(s=n.selectedNode){const c=a.findSchemaById(t.schemas,(s==null?void 0:s.id)??"")||t.schemas[0];n.matched=a.getMatchedById(t.schemas,c.id??""),n.selectedNode=c}function N(s=null){var e;if(!s||n.disabledHover)return n.hoverNode=null,!1;if((s==null?void 0:s.id)===((e=n.hoverNode)==null?void 0:e.id))return!1;n.hoverNode=s}function S(){a.deepEqual(t.schemas,o.schemas)&&t.script===o.script||(a.deepCompareAndModify(t.schemas,o.schemas),t.script=o.script,d(t.schemas[0]),i.push("重置操作"),h("reset",t))}function M(){t.schemas=a.deepClone(o.schemas),d(t.schemas[0]),i.push("初始化")}function E(s=document){const e=I.useMagicKeys({target:s});s.addEventListener("keydown",c=>{c.ctrlKey&&c.key==="s"&&c.preventDefault()},{capture:!0}),u.watchEffect(()=>{const c=document.activeElement;c instanceof HTMLInputElement||c instanceof HTMLTextAreaElement||((e.Delete.value||e.Backspace.value)&&n.selectedNode&&m(),e["ctrl+c"].value&&n.selectedNode&&p(),e["ctrl+z"].value&&!e.shift.value&&i.undo(),(e["ctrl+shift+z"].value||e["ctrl+y"].value)&&i.redo(),e["ctrl+s"].value&&h("save",t),e.Escape.value&&d(t.schemas[0]))})}return M(),{handleCopy:p,handleDelete:m,pageManager:r,pageSchema:t,ready:y,reset:S,revoke:i,setHoverNode:N,setSelectedNode:d,setupHotkeys:E,state:n}}exports.useDesigner=x;