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

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

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("vue"),x=require("../../../../../hooks/src/common/clipboard.cjs");require("@vueuse/core");require("../../../../../hooks/src/store/index.cjs");;/* empty css                                             */;/* empty css                                                         */;/* empty css                                                              */const D=require("../../../../../manager/src/pageManager.cjs"),g=require("../../../../../manager/src/pluginManager.cjs"),C=require("../../../../../manager/src/revoke.cjs");;/* empty css                                                       */require("vue-draggable-plus");const a=require("../../../../../utils/src/common/data.cjs");require("../../../../../git/epic/epic-designer/node_modules/.pnpm/jsep@1.4.0/node_modules/jsep/dist/jsep.cjs");let s={schemas:[{id:"root",label:"页面",props:{},type:"page",children:[]}],script:`const { defineExpose, find } = epic;

function test (){
    console.log('test')
}

// 通过defineExpose暴露的函数或者属性
defineExpose({
 test
})`};function B(d,h){const M=m.ref(!1),c=D.createPageManager(),t=c.pageSchema,i=m.reactive({disabledHover:!1,hoverNode:null,matched:[],selectedNode:null}),f=C.useRevoke(t,i,l),{duplicate:v}=x.useClipboard(t,l,e=>f.push(e)),b={desktop:{},mobile:{mode:"mobile",width:"390px"},tablet:{mode:"tablet",width:"780px"}};m.watchEffect(()=>{d.defaultSchema?s=d.defaultSchema:d.formMode&&(s.schemas=g.pluginManager.designer.formSchema,g.pluginManager.component.hide("form")),d.formMode||g.pluginManager.component.show("form");const e=d.canvasMode??"desktop";t.canvas={mode:e,...b[e],...s.canvas},q(),c.setDefaultComponentIds(s.schemas)}),c.setDesignMode();function q(){if(!d.formMode||!d.tableJson)return;const e=d.tableJson.find(o=>o.tableType==="parent");if(!e)return;const n=a.findSchemas(t.schemas,o=>o.type==="form");n.length===1&&(n[0].props.name=e.tableName)}function N(){var e;return v((e=i.selectedNode)==null?void 0:e.id)}function S(){var u;if(!((u=i.selectedNode)!=null&&u.id)||i.selectedNode.id===t.schemas[0].id)return;const e=a.findSchemaInfoById(t.schemas,i.selectedNode.id);if(!e)return!1;let{index:n,list:o}=e;o.splice(n,1),n===o.length&&n--,l(o[n]),f.push("删除组件")}function l(e){if(e||(e=t.schemas[0]),p(e)){const o=a.getMatchedById(c.pageSchema.schemas,(e==null?void 0:e.id)||""),u=o.length-2;for(let r=u;r>=0;r--)if(!p(o[r])){e=o[r];break}}const n=a.findSchemaById(t.schemas,(e==null?void 0:e.id)||"");i.matched=a.getMatchedById(t.schemas,(n==null?void 0:n.id)||""),i.selectedNode=n}function p(e){var n;return((n=e.status)==null?void 0:n.lock)||g.pluginManager.component.getLocked(e.type)}function y(e=null){var n;if(!e||i.disabledHover)return i.hoverNode=null,!1;if(p(e)){const o=a.getMatchedById(c.pageSchema.schemas,(e==null?void 0:e.id)||""),u=o.length-2;for(let r=u;r>=0;r--)if(!p(o[r])){e=o[r];break}}if((e==null?void 0:e.id)===((n=i.hoverNode)==null?void 0:n.id))return!1;i.hoverNode=e}function k(){a.deepEqual(t.schemas,s.schemas)&&t.script===s.script||(a.deepCompareAndModify(t.schemas,s.schemas),t.script=s.script,l(t.schemas[0]),f.push("重置操作"),h("reset",t))}function I(){t.schemas=a.deepClone(s.schemas),l(t.schemas[0]),f.push("初始化")}return I(),{handleDelete:S,handleDuplicate:N,pageManager:c,pageSchema:t,ready:M,reset:k,revoke:f,setHoverNode:y,setSelectedNode:l,state:i}}exports.useDesigner=B;