@fangzhongya/page 0.0.26 → 0.0.28

package/dist/effect/design.cjs

@@ -0,0 +1,336 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const common = require("../render/common.cjs");
+const render = require("../utils/render.cjs");
+const config$2 = require("../render/config.cjs");
+const design = require("../components/control/design.cjs");
+const draggable = require("./draggable.cjs");
+require("../components/design/design-grids.cjs");
+require("../components/design/design-vif-item.cjs");
+require("../components/design/design-dynamic.cjs");
+require("../components/design/design-div.cjs");
+require("../components/design/design-icon.cjs");
+require("../components/design/design-el-input.cjs");
+const config$1 = require("../components/control/config.cjs");
+const index = require("../utils/index.cjs");
+const config = require("../config.cjs");
+const util = require("../components/operate/util.cjs");
+const util$1 = require("../config/util.cjs");
+const designElInput_vue_vue_type_script_setup_true_lang = require("../components/design/design-el-input2.cjs");
+const designDynamic_vue_vue_type_script_setup_true_lang = require("../components/design/design-dynamic2.cjs");
+const designVifItem_vue_vue_type_script_setup_true_lang = require("../components/design/design-vif-item2.cjs");
+const designGrids_vue_vue_type_script_setup_true_lang = require("../components/design/design-grids2.cjs");
+const designDiv_vue_vue_type_script_setup_true_lang = require("../components/design/design-div2.cjs");
+const designIcon_vue_vue_type_script_setup_true_lang = require("../components/design/design-icon2.cjs");
+const position = config.enums.position;
+const nameObjs = {
+  PageGridLayout: designGrids_vue_vue_type_script_setup_true_lang.default,
+  PageVifEif: designVifItem_vue_vue_type_script_setup_true_lang.default,
+  PageDynamic: designDynamic_vue_vue_type_script_setup_true_lang.default,
+  ElInput: designElInput_vue_vue_type_script_setup_true_lang.default
+};
+const generals = [
+  "PageGridLayout",
+  "ElInput",
+  "Slot",
+  "Teleport",
+  "KeepAlive",
+  "Template",
+  "Suspense",
+  "Component",
+  "RouterView",
+  "RouterLink",
+  "PageString",
+  "PageDynamic",
+  "PageVfor",
+  "PageVif",
+  "PageVifEif",
+  "PageHtml",
+  "Transition",
+  "TransitionGroup"
+];
+function isDom(obj) {
+  return obj instanceof Element;
+}
+function getIcon(name, callback) {
+  const span = document.createElement("span");
+  span.className = "com-fang-icon";
+  span.innerHTML = `<i class="${"effect-fang-icon-" + name}"></i>`;
+  span.onclick = callback;
+  return span;
+}
+function addOperate(dom, obj, drag) {
+  const clickKey = (key) => {
+    util.operateClickKey(key + "", obj, drag.list, drag.index, {
+      right: drag.right,
+      rkey: drag.rkey,
+      replication: drag.replication
+    });
+  };
+  const cs = index.getClass("design-operate");
+  const fragment = document.createElement("div");
+  fragment.className = cs("operates");
+  const div1 = document.createElement("div");
+  div1.className = cs("names");
+  const span1 = document.createElement("span");
+  span1.textContent = obj.name;
+  div1.appendChild(span1);
+  const div2 = document.createElement("div");
+  div2.className = cs("operate");
+  const div2hide = document.createElement("div");
+  div2hide.className = cs("operate-hide");
+  const span2 = getIcon("set", (e) => {
+    drag.onSet(e);
+  });
+  span2.addEventListener("mouseenter", (e) => {
+    drag.onSet(e);
+  });
+  div2hide.appendChild(span2);
+  div2.appendChild(div2hide);
+  const div2show = document.createElement("div");
+  div2show.className = cs("operate-show");
+  if (obj.design?.islock) {
+    div2show.appendChild(
+      getIcon("lock", () => {
+        clickKey(18);
+      })
+    );
+  }
+  div2.appendChild(div2hide);
+  div2.appendChild(div2show);
+  const div3 = document.createElement("div");
+  div3.className = cs("fulls");
+  div3.appendChild(
+    getIcon("clear", () => {
+      clickKey(17);
+    })
+  );
+  fragment.appendChild(div1);
+  fragment.appendChild(div2);
+  fragment.appendChild(div3);
+  dom.appendChild(fragment);
+}
+function setCons(config2, drag, obj) {
+  let c = config2.class || "";
+  if (Array.isArray(c)) {
+    c = c.join(" ");
+  }
+  config2.class = c + " " + drag.class?.join(" ");
+  config2.onClick = drag.onClick;
+  const refs = config2.ref;
+  config2.ref = (el) => {
+    if (refs) {
+      refs(el);
+    }
+    const dom = el?.$el || el?.ref || el;
+    if (isDom(dom)) {
+      const children = dom.children;
+      for (let i = 0; i < children.length; i++) {
+        const child = children[i];
+        if (child.classList && child.classList.contains(
+          "fang-page-design-operate-operates"
+        )) {
+          dom.removeChild(child);
+        }
+      }
+      addOperate(dom, obj, drag);
+    } else {
+      console.log("ref", obj, el);
+    }
+  };
+  config2.onContextmenu = drag.onContextmenu;
+}
+function getSlotsDom(obj, params = {}, temps, cons = {}) {
+  return (config2) => {
+    setCons(config2, cons, obj);
+    if (obj.name == "PagePosition") {
+      config2.position = void 0;
+    }
+    if (obj.name === "PageGridLayout") {
+      return draggable.getGridDiv(obj, config2, params, temps);
+    }
+    return config$1.getDesignSlots(obj, (slots, key, scope) => {
+      let ts;
+      if (obj.name === "PageVfor") {
+        const v = config2.value || [];
+        const fors = config$2.getForObject(obj.config?.fors);
+        if (obj.config?.isin) {
+          const k = Object.keys(v)[0] || 0;
+          ts = common.getTempsArr(
+            temps,
+            [
+              {
+                value: v[k],
+                name: fors[0],
+                __obj: obj,
+                key: "item",
+                type: "unknown"
+              },
+              {
+                value: k,
+                name: fors[1],
+                key: "key",
+                type: "string|number"
+              },
+              {
+                value: 0,
+                name: fors[2],
+                key: "index",
+                type: "number"
+              }
+            ],
+            "forin"
+          );
+        } else {
+          ts = common.getTempsArr(
+            temps,
+            [
+              {
+                value: v[0],
+                name: fors[0],
+                __obj: obj,
+                key: "item",
+                type: "unknown"
+              },
+              {
+                value: 0,
+                name: fors[1],
+                key: "index",
+                type: "number"
+              }
+            ],
+            "forof"
+          );
+        }
+      } else {
+        ts = common.getTempsArr(temps, [scope]);
+      }
+      if (key === position) {
+        return design.getResizable(
+          slots,
+          obj,
+          params,
+          key,
+          ts
+        );
+      }
+      return draggable.getDraggableDiv(
+        slots,
+        obj,
+        params,
+        (v, p, c) => {
+          return setDesign(v, p, ts, c);
+        },
+        key
+      );
+    });
+  };
+}
+function setCompon(cons) {
+  return (obj, config2, slots) => {
+    setCons(config2, cons, obj);
+    if (obj.design?.absolute) {
+      config$1.getAbsolute(obj, config2);
+    }
+    let name = obj.name;
+    if (generals.includes(obj.name)) {
+      name = nameObjs[obj.name] || designDiv_vue_vue_type_script_setup_true_lang.default;
+    }
+    if (util$1.getComponObj(obj).status?.icon) {
+      return getIconDom(obj, config2, {
+        slots
+      });
+    }
+    return common.useGetCompon(name, config2, {
+      slots
+    });
+  };
+}
+function getIconDom(obj, attarObj, config2 = {}) {
+  return vue.h(designIcon_vue_vue_type_script_setup_true_lang.default, attarObj, {
+    default() {
+      return common.useGetCompon(obj.name, attarObj, config2);
+    }
+  });
+}
+function setDesign(obj, params = {}, temps, cons = {}) {
+  if (!obj.design?.hide) {
+    obj.temps = [...temps];
+    if (generals.includes(obj.name)) {
+      return getGeneralDiv(obj, params, temps, cons);
+    }
+    return common.assemblyGetRender(
+      obj,
+      params,
+      temps,
+      getSlotsDom(obj, params, temps, cons),
+      setCompon(cons)
+    );
+  } else {
+    return "";
+  }
+}
+function setDesignDag(arr, props, params = {}, temps) {
+  return draggable.getDraggableDiv(
+    arr,
+    props,
+    params,
+    (v, p, c) => {
+      return setDesign(v, params, temps, c);
+    }
+  );
+}
+function getGeneralDiv(obj, params, temps, cons = {}) {
+  const config2 = {
+    assembly: obj
+  };
+  common.getData(obj, params, temps, config2);
+  config2[render.getClassId(params.name)] = "";
+  const sls = getSlotsDom(obj, params, temps);
+  const set = setCompon(cons);
+  const slots = sls(config2);
+  return set(obj, config2, slots);
+}
+function getRender(params = {}, lists, temps) {
+  if (lists) {
+    return setDesignDag(lists, {}, params, temps);
+  } else {
+    return vue.h("div", params.attrs, params.slots);
+  }
+}
+function getRenderAssembly(obj, params, temps) {
+  return common.assemblyGetRender(
+    obj,
+    params,
+    temps,
+    () => {
+      return config$1.getDesignSlots(obj, (slots) => {
+        return setDesignDag(
+          slots,
+          obj,
+          params,
+          temps
+        );
+      });
+    },
+    (obj2, config2, slots) => {
+      const slot = slots.default();
+      if (slot) {
+        return vue.h(
+          "div",
+          {
+            class: "assembly-div"
+          },
+          slot
+        );
+      } else {
+        return vue.h("div", params.attrs, params.slots);
+      }
+    }
+  );
+}
+exports.getGeneralDiv = getGeneralDiv;
+exports.getRender = getRender;
+exports.getRenderAssembly = getRenderAssembly;
+exports.setDesign = setDesign;

package/dist/effect/design.d.ts

@@ -0,0 +1,11 @@
+import { VNode } from 'vue';
+export declare function setDesign(obj: ControlDesign, params: ObjAny | undefined, temps: Array<TempsObject>, cons?: ObjAny): VNode | string;
+export declare function getGeneralDiv(obj: ControlDesign, params: ObjAny, temps: Array<TempsObject>, cons?: ObjAny): string | VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>;
+export declare function getRender(params: ObjAny | undefined, lists: Array<ControlDesign> | undefined, temps: Array<TempsObject>): string | VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>;
+export declare function getRenderAssembly(obj: ControlDesign, params: ObjAny, temps: Array<TempsObject>): string | VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>;

package/dist/effect/design.js

@@ -0,0 +1,336 @@
+import { h } from "vue";
+import { getTempsArr, useGetCompon, assemblyGetRender, getData } from "../render/common.js";
+import { getClassId } from "../utils/render.js";
+import { getForObject } from "../render/config.js";
+import { getResizable } from "../components/control/design.js";
+import { getGridDiv, getDraggableDiv } from "./draggable.js";
+import "../components/design/design-grids.js";
+import "../components/design/design-vif-item.js";
+import "../components/design/design-dynamic.js";
+import "../components/design/design-div.js";
+import "../components/design/design-icon.js";
+import "../components/design/design-el-input.js";
+import { getDesignSlots, getAbsolute } from "../components/control/config.js";
+import { getClass } from "../utils/index.js";
+import { enums } from "../config.js";
+import { operateClickKey } from "../components/operate/util.js";
+import { getComponObj } from "../config/util.js";
+import _sfc_main from "../components/design/design-el-input2.js";
+import _sfc_main$1 from "../components/design/design-dynamic2.js";
+import _sfc_main$2 from "../components/design/design-vif-item2.js";
+import _sfc_main$3 from "../components/design/design-grids2.js";
+import _sfc_main$4 from "../components/design/design-div2.js";
+import _sfc_main$5 from "../components/design/design-icon2.js";
+const position = enums.position;
+const nameObjs = {
+  PageGridLayout: _sfc_main$3,
+  PageVifEif: _sfc_main$2,
+  PageDynamic: _sfc_main$1,
+  ElInput: _sfc_main
+};
+const generals = [
+  "PageGridLayout",
+  "ElInput",
+  "Slot",
+  "Teleport",
+  "KeepAlive",
+  "Template",
+  "Suspense",
+  "Component",
+  "RouterView",
+  "RouterLink",
+  "PageString",
+  "PageDynamic",
+  "PageVfor",
+  "PageVif",
+  "PageVifEif",
+  "PageHtml",
+  "Transition",
+  "TransitionGroup"
+];
+function isDom(obj) {
+  return obj instanceof Element;
+}
+function getIcon(name, callback) {
+  const span = document.createElement("span");
+  span.className = "com-fang-icon";
+  span.innerHTML = `<i class="${"effect-fang-icon-" + name}"></i>`;
+  span.onclick = callback;
+  return span;
+}
+function addOperate(dom, obj, drag) {
+  const clickKey = (key) => {
+    operateClickKey(key + "", obj, drag.list, drag.index, {
+      right: drag.right,
+      rkey: drag.rkey,
+      replication: drag.replication
+    });
+  };
+  const cs = getClass("design-operate");
+  const fragment = document.createElement("div");
+  fragment.className = cs("operates");
+  const div1 = document.createElement("div");
+  div1.className = cs("names");
+  const span1 = document.createElement("span");
+  span1.textContent = obj.name;
+  div1.appendChild(span1);
+  const div2 = document.createElement("div");
+  div2.className = cs("operate");
+  const div2hide = document.createElement("div");
+  div2hide.className = cs("operate-hide");
+  const span2 = getIcon("set", (e) => {
+    drag.onSet(e);
+  });
+  span2.addEventListener("mouseenter", (e) => {
+    drag.onSet(e);
+  });
+  div2hide.appendChild(span2);
+  div2.appendChild(div2hide);
+  const div2show = document.createElement("div");
+  div2show.className = cs("operate-show");
+  if (obj.design?.islock) {
+    div2show.appendChild(
+      getIcon("lock", () => {
+        clickKey(18);
+      })
+    );
+  }
+  div2.appendChild(div2hide);
+  div2.appendChild(div2show);
+  const div3 = document.createElement("div");
+  div3.className = cs("fulls");
+  div3.appendChild(
+    getIcon("clear", () => {
+      clickKey(17);
+    })
+  );
+  fragment.appendChild(div1);
+  fragment.appendChild(div2);
+  fragment.appendChild(div3);
+  dom.appendChild(fragment);
+}
+function setCons(config, drag, obj) {
+  let c = config.class || "";
+  if (Array.isArray(c)) {
+    c = c.join(" ");
+  }
+  config.class = c + " " + drag.class?.join(" ");
+  config.onClick = drag.onClick;
+  const refs = config.ref;
+  config.ref = (el) => {
+    if (refs) {
+      refs(el);
+    }
+    const dom = el?.$el || el?.ref || el;
+    if (isDom(dom)) {
+      const children = dom.children;
+      for (let i = 0; i < children.length; i++) {
+        const child = children[i];
+        if (child.classList && child.classList.contains(
+          "fang-page-design-operate-operates"
+        )) {
+          dom.removeChild(child);
+        }
+      }
+      addOperate(dom, obj, drag);
+    } else {
+      console.log("ref", obj, el);
+    }
+  };
+  config.onContextmenu = drag.onContextmenu;
+}
+function getSlotsDom(obj, params = {}, temps, cons = {}) {
+  return (config) => {
+    setCons(config, cons, obj);
+    if (obj.name == "PagePosition") {
+      config.position = void 0;
+    }
+    if (obj.name === "PageGridLayout") {
+      return getGridDiv(obj, config, params, temps);
+    }
+    return getDesignSlots(obj, (slots, key, scope) => {
+      let ts;
+      if (obj.name === "PageVfor") {
+        const v = config.value || [];
+        const fors = getForObject(obj.config?.fors);
+        if (obj.config?.isin) {
+          const k = Object.keys(v)[0] || 0;
+          ts = getTempsArr(
+            temps,
+            [
+              {
+                value: v[k],
+                name: fors[0],
+                __obj: obj,
+                key: "item",
+                type: "unknown"
+              },
+              {
+                value: k,
+                name: fors[1],
+                key: "key",
+                type: "string|number"
+              },
+              {
+                value: 0,
+                name: fors[2],
+                key: "index",
+                type: "number"
+              }
+            ],
+            "forin"
+          );
+        } else {
+          ts = getTempsArr(
+            temps,
+            [
+              {
+                value: v[0],
+                name: fors[0],
+                __obj: obj,
+                key: "item",
+                type: "unknown"
+              },
+              {
+                value: 0,
+                name: fors[1],
+                key: "index",
+                type: "number"
+              }
+            ],
+            "forof"
+          );
+        }
+      } else {
+        ts = getTempsArr(temps, [scope]);
+      }
+      if (key === position) {
+        return getResizable(
+          slots,
+          obj,
+          params,
+          key,
+          ts
+        );
+      }
+      return getDraggableDiv(
+        slots,
+        obj,
+        params,
+        (v, p, c) => {
+          return setDesign(v, p, ts, c);
+        },
+        key
+      );
+    });
+  };
+}
+function setCompon(cons) {
+  return (obj, config, slots) => {
+    setCons(config, cons, obj);
+    if (obj.design?.absolute) {
+      getAbsolute(obj, config);
+    }
+    let name = obj.name;
+    if (generals.includes(obj.name)) {
+      name = nameObjs[obj.name] || _sfc_main$4;
+    }
+    if (getComponObj(obj).status?.icon) {
+      return getIconDom(obj, config, {
+        slots
+      });
+    }
+    return useGetCompon(name, config, {
+      slots
+    });
+  };
+}
+function getIconDom(obj, attarObj, config = {}) {
+  return h(_sfc_main$5, attarObj, {
+    default() {
+      return useGetCompon(obj.name, attarObj, config);
+    }
+  });
+}
+function setDesign(obj, params = {}, temps, cons = {}) {
+  if (!obj.design?.hide) {
+    obj.temps = [...temps];
+    if (generals.includes(obj.name)) {
+      return getGeneralDiv(obj, params, temps, cons);
+    }
+    return assemblyGetRender(
+      obj,
+      params,
+      temps,
+      getSlotsDom(obj, params, temps, cons),
+      setCompon(cons)
+    );
+  } else {
+    return "";
+  }
+}
+function setDesignDag(arr, props, params = {}, temps) {
+  return getDraggableDiv(
+    arr,
+    props,
+    params,
+    (v, p, c) => {
+      return setDesign(v, params, temps, c);
+    }
+  );
+}
+function getGeneralDiv(obj, params, temps, cons = {}) {
+  const config = {
+    assembly: obj
+  };
+  getData(obj, params, temps, config);
+  config[getClassId(params.name)] = "";
+  const sls = getSlotsDom(obj, params, temps);
+  const set = setCompon(cons);
+  const slots = sls(config);
+  return set(obj, config, slots);
+}
+function getRender(params = {}, lists, temps) {
+  if (lists) {
+    return setDesignDag(lists, {}, params, temps);
+  } else {
+    return h("div", params.attrs, params.slots);
+  }
+}
+function getRenderAssembly(obj, params, temps) {
+  return assemblyGetRender(
+    obj,
+    params,
+    temps,
+    () => {
+      return getDesignSlots(obj, (slots) => {
+        return setDesignDag(
+          slots,
+          obj,
+          params,
+          temps
+        );
+      });
+    },
+    (obj2, config, slots) => {
+      const slot = slots.default();
+      if (slot) {
+        return h(
+          "div",
+          {
+            class: "assembly-div"
+          },
+          slot
+        );
+      } else {
+        return h("div", params.attrs, params.slots);
+      }
+    }
+  );
+}
+export {
+  getGeneralDiv,
+  getRender,
+  getRenderAssembly,
+  setDesign
+};