epic-designer/dist/hooks/src/plugin/usePanel.js

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

import { shallowRef as u, ref as l, computed as c } from "vue";
import { loadAsyncComponent as d } from "../../../utils/src/common/component.js";
import "@vueuse/core";
import "../store/index.js";
import "../../../manager/src/pluginManager.js";
import "../../../git/epic/epic-designer/node_modules/.pnpm/jsep@1.4.0/node_modules/jsep/dist/jsep.js";
function C() {
  const n = {
    activityBars: u([]),
    // 活动栏配置列表
    rightSidebars: u([])
    // 右侧边栏配置列表
  }, o = l([]), t = l([]), f = c(() => n.activityBars.value.filter(
    (e) => !(o.value.includes(e.title) || o.value.includes(e.id))
  )), r = c(() => n.rightSidebars.value.filter(
    (e) => !(t.value.includes(e.title) || t.value.includes(e.id))
  ));
  function v(e) {
    typeof e.component == "function" && (e.component = d(
      e.component
    )), e.visible === void 0 && (e.visible = !0), e.sort === void 0 && (e.sort = 1e3);
    const i = n.activityBars.value.findIndex(
      (s) => s.id === e.id
    );
    i === -1 ? n.activityBars.value.push(e) : n.activityBars.value[i] = e;
  }
  function p(e) {
    typeof e.component == "function" && (e.component = d(
      e.component
    )), e.visible === void 0 && (e.visible = !0), e.sort === void 0 && (e.sort = 1e3);
    const i = n.rightSidebars.value.findIndex(
      (s) => s.id === e.id
    );
    i === -1 ? n.rightSidebars.value.push(e) : n.rightSidebars.value[i] = e;
  }
  function a(e) {
    o.value.push(e);
  }
  function m(e) {
    t.value.push(e);
  }
  function h(e) {
    const i = o.value.indexOf(e);
    i !== -1 && o.value.splice(i, 1);
  }
  function x(e) {
    const i = t.value.indexOf(e);
    i !== -1 && t.value.splice(i, 1);
  }
  return {
    activityBars: f,
    hideActivitybar: a,
    hideRightSidebar: m,
    registerActivitybar: v,
    registerRightSidebar: p,
    rightSidebars: r,
    showActivitybar: h,
    showRightSidebar: x,
    viewsContainers: n
  };
}
export {
  C as usePanel
};