epic-designer-dev/dist/core/src/components/designer/hooks/useDesigner.cjs

基于vue3的设计器,可视化开发页面表单。在epic-designer的基础上新增了字典选择器

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("vue"),x=require("../../../../../hooks/src/common/clipboard.cjs"),C=require("@vueuse/core");require("../../../../../hooks/src/store/index.cjs");;/* empty css                                             */require("vuedraggable");const i=require("../../../../../utils/src/common/data.cjs"),H=require("../../../../../utils/src/manager/pageManager.cjs"),I=require("../../../../../utils/src/manager/pluginManager.cjs"),w=require("../../../../../utils/src/manager/revoke.cjs");let a={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 B(r,p){const g=f.ref(!1),u=H.usePageManager(),c=u.pageSchema,s=f.reactive({disabledHover:!1,hoverNode:null,matched:[],selectedNode:null}),d=w.useRevoke(c,s,o),{copy:N,cut:y,duplicate:M,paste:S}=x.useClipboard(c,o,e=>d.push(e)),k={desktop:{},mobile:{mode:"mobile",width:"390px"},tablet:{mode:"tablet",width:"780px"}};f.watchEffect(()=>{r.defaultSchema?a=r.defaultSchema:r.formMode&&(a.schemas=I.pluginManager.formSchema);const e=r.canvasMode??"desktop";c.canvas={mode:e,...k[e]},u.setDefaultComponentIds(a.schemas)}),u.setDesignMode();function h(){var e;return M((e=s.selectedNode)==null?void 0:e.id)}function v(){return y(s.selectedNode)}function m(){var l;if(!((l=s.selectedNode)!=null&&l.id)||s.selectedNode.id===c.schemas[0].id)return;const e=i.findSchemaInfoById(c.schemas,s.selectedNode.id);if(!e)return!1;let{index:t,list:n}=e;n.splice(t,1),t===n.length&&t--,o(n[t]),d.push("删除组件")}function o(e=s.selectedNode){const n=i.findSchemaById(c.schemas,(e==null?void 0:e.id)??"")||c.schemas[0];s.matched=i.getMatchedById(c.schemas,n.id??""),s.selectedNode=n}function E(e=null){var t;if(!e||s.disabledHover)return s.hoverNode=null,!1;if((e==null?void 0:e.id)===((t=s.hoverNode)==null?void 0:t.id))return!1;s.hoverNode=e}function b(){i.deepEqual(c.schemas,a.schemas)&&c.script===a.script||(i.deepCompareAndModify(c.schemas,a.schemas),c.script=a.script,o(c.schemas[0]),d.push("重置操作"),p("reset",c))}function q(){c.schemas=i.deepClone(a.schemas),o(c.schemas[0]),d.push("初始化")}function D(e=document){const t=C.useMagicKeys({target:e});e.addEventListener("keydown",n=>{n.ctrlKey&&n.key==="s"&&n.preventDefault(),n.ctrlKey&&n.key==="d"&&n.preventDefault()},{capture:!0}),f.watchEffect(()=>{var l;const n=document.activeElement;if(!(n instanceof HTMLInputElement||n instanceof HTMLTextAreaElement)){if((t.Delete.value||t.Backspace.value)&&s.selectedNode&&m(),t["ctrl+c"].value&&s.selectedNode&&N(s.selectedNode),t["ctrl+v"].value)return S((l=s.selectedNode)==null?void 0:l.id);t["ctrl+d"].value&&s.selectedNode&&h(),t["ctrl+x"].value&&s.selectedNode&&v(),t["ctrl+z"].value&&!t.shift.value&&d.undo(),(t["ctrl+shift+z"].value||t["ctrl+y"].value)&&d.redo(),t["ctrl+s"].value&&p("save",c),t.Escape.value&&o(c.schemas[0])}})}return q(),{handleCut:v,handleDelete:m,handleDuplicate:h,pageManager:u,pageSchema:c,ready:g,reset:b,revoke:d,setHoverNode:E,setSelectedNode:o,setupHotkeys:D,state:s}}exports.useDesigner=B;