sun-card-design 1.1.37 → 1.1.38

package/dist/sun-card-designer.es3.js

@@ -1,506 +0,0 @@
-import { ref, reactive, watch, onMounted, resolveComponent, createElementBlock, openBlock, createElementVNode, createCommentVNode, createVNode, unref, toDisplayString, withCtx, createTextVNode, createBlock, normalizeClass, withModifiers, normalizeStyle } from "vue";
-import Properties from "./sun-card-designer.es4.js";
-import Variable from "./sun-card-designer.es5.js";
-import { empty, pc, phone, leftSvg, rightSvg, moban, clear } from "./sun-card-designer.es6.js";
-import { LeftOutlined } from "@ant-design/icons-vue";
-import Structure from "./sun-card-designer.es7.js";
-import Template from "./sun-card-designer.es8.js";
-import Module from "./sun-card-designer.es9.js";
-import RenderPanel from "./sun-card-designer.es10.js";
-import PanoramaView from "./sun-card-designer.es11.js";
-import PreviewPanel from "./sun-card-designer.es12.js";
-import { useRouter, useRoute } from "vue-router";
-import { message } from "ant-design-vue";
-import { useCardManageStore } from "./sun-card-designer.es13.js";
-import { generateShortUUID } from "./sun-card-designer.es14.js";
-/* empty css                       */
-import _export_sfc from "./sun-card-designer.es16.js";
-const _hoisted_1 = { class: "nav" };
-const _hoisted_2 = { class: "back" };
-const _hoisted_3 = { class: "main" };
-const _hoisted_4 = { class: "left" };
-const _hoisted_5 = { class: "right" };
-const _hoisted_6 = { class: "operate" };
-const _hoisted_7 = ["innerHTML"];
-const _hoisted_8 = ["innerHTML"];
-const _hoisted_9 = ["innerHTML"];
-const _hoisted_10 = ["innerHTML"];
-const _hoisted_11 = ["innerHTML"];
-const _hoisted_12 = ["innerHTML"];
-const _hoisted_13 = {
-  key: 0,
-  class: "loading"
-};
-const _sfc_main = {
-  __name: "index",
-  props: ["name", "variableList"],
-  emits: ["save"],
-  setup(__props, { emit: __emit }) {
-    const router = useRouter();
-    const route = useRoute();
-    const cardManageStore = useCardManageStore();
-    const props = __props;
-    const emit = __emit;
-    const loading = ref(false);
-    const previewPanelRef = ref(null);
-    const tabValue = ref("组件");
-    const tabOptions = reactive(["模板", "组件", "结构"]);
-    const currentUuid = ref(null);
-    const cardName = ref("");
-    const activeTab = ref("1");
-    const data = ref({
-      type: "card",
-      uuid: "card",
-      list: [],
-      config: {
-        background: "#ffffff",
-        padding: 6,
-        borderRadius: 8
-      }
-    });
-    const activeOperate = ref("_1");
-    watch(
-      () => data.value.list,
-      () => {
-        if (!getSaveData().length) {
-          const timter = setTimeout(() => {
-            clearTimeout(timter);
-            document.querySelector(".canvas").innerHTML = `
-        <div class="empty" style="position: absolute; top: 240px; width: 100%; text-align: center; left: 0;">
-          <div">
-            ${empty()}
-            <div class="empt-text">暂未添加元素</div>
-          </div>
-        </div>
-        `;
-          }, 0);
-        } else {
-          const emptyContainer = document.querySelector(".empty");
-          if (emptyContainer) emptyContainer.remove();
-        }
-      },
-      { deep: true, immediate: true }
-    );
-    watch(
-      () => cardManageStore.currentDeleteUuid,
-      (val) => {
-        changeDelete(val);
-      }
-    );
-    watch(
-      () => cardManageStore.currentCopyUuid,
-      (val) => {
-        changeCopy(val());
-      }
-    );
-    const changeDelete = (val, list = data.value.list) => {
-      for (let i = 0; i < list.length; i++) {
-        if (list[i].uuid === val) {
-          list[i].state = false;
-          restRight();
-          return;
-        }
-        if (["grid", "singleColumn", "multipleColumn", "multipleLine", "gridList"].includes(list[i].type)) {
-          list[i].columns.forEach((e) => {
-            changeDelete(val, e.list);
-          });
-        }
-      }
-    };
-    const changeCopy = (val, list = data.value.list) => {
-      if (!Array.isArray(list)) return false;
-      for (let i = 0; i < list.length; i++) {
-        const node = list[i];
-        if (node?.uuid === val) {
-          const cloned = cloneWithNewUuids(node);
-          list.splice(i + 1, 0, cloned);
-          cardManageStore.setMarks({
-            state: true,
-            uuid: cloned.uuid,
-            action: "add"
-          });
-          restRight();
-          return true;
-        }
-        if (["grid", "singleColumn", "multipleColumn", "multipleLine", "gridList"].includes(node?.type) && Array.isArray(node.columns)) {
-          for (const col of node.columns) {
-            if (changeCopy(val, col.list)) return true;
-          }
-        }
-      }
-      return false;
-    };
-    const changeUI = (val) => {
-      activeOperate.value = val;
-      const obj = {
-        "_1": "pc",
-        "_2": "mobile"
-      };
-      cardManageStore.setCurrentRenderUI(obj[val]);
-      setViewportMeta(obj[val]);
-    };
-    const setViewportMeta = (mode) => {
-      let viewport = document.querySelector('meta[name="viewport"]');
-      if (!viewport) {
-        viewport = document.createElement("meta");
-        viewport.name = "viewport";
-        document.head.appendChild(viewport);
-      }
-      if (mode === "mobile") {
-        viewport.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no";
-      } else {
-        viewport.content = "width=device-width, initial-scale=1.0";
-      }
-    };
-    const onRevoke = (val) => {
-      if (!val) return;
-      setDataState(cardManageStore.marks[cardManageStore.marks.length - 1].uuid);
-      cardManageStore.updateMarks("revoke");
-    };
-    const onRedo = (val) => {
-      if (!val) return;
-      setDataState(cardManageStore.marks[0].uuid);
-      cardManageStore.updateMarks("redo");
-    };
-    const setDataState = (uuid, list = data.value.list) => {
-      for (let i = 0; i < list.length; i++) {
-        if (list[i].uuid === uuid) {
-          list[i].state = !list[i].state;
-          return;
-        }
-        if (["grid", "singleColumn", "multipleColumn", "multipleLine", "gridList"].includes(list[i].type)) {
-          list[i].columns.forEach((e) => {
-            setDataState(uuid, e.list);
-          });
-        }
-      }
-    };
-    const onClear = () => {
-      data.value = {
-        type: "card",
-        uuid: "card",
-        list: [],
-        config: {
-          background: "#ffffff",
-          padding: 6,
-          borderRadius: 8
-        }
-      };
-      restRight();
-      cardManageStore.clearMarks();
-    };
-    const restRight = () => {
-      cardManageStore.setCurrentSelectUuid(null);
-    };
-    const onViewiew = () => {
-      const record = {
-        ...data.value,
-        list: getSaveData()
-      };
-      console.info(record);
-      if (!record.list.length) {
-        message.info("请添加卡片内容");
-        return;
-      }
-      previewPanelRef.value.onOpen(record);
-    };
-    const onSave = async () => {
-      try {
-        const params = {
-          data: JSON.stringify({
-            ...data.value,
-            list: getSaveData()
-          }),
-          name: route.query.name,
-          type: route.query.type,
-          id: route.query.id
-        };
-        emit("save", params);
-      } catch (error) {
-        message.error("失败");
-      }
-    };
-    watch(
-      () => cardManageStore.currentSelectUuid,
-      (val) => {
-        currentUuid.value = val;
-      }
-    );
-    watch(
-      () => cardManageStore.dataSourceState,
-      () => {
-        cardManageStore.setDataSource(data.value);
-      }
-    );
-    onMounted(() => {
-      initData();
-      getData();
-      setViewportMeta("pc");
-    });
-    function initData() {
-      data.value = {
-        type: "card",
-        uuid: "card",
-        list: [],
-        config: {
-          background: "#ffffff",
-          padding: 6,
-          borderRadius: 8
-        }
-      };
-      cardName.value = props.name;
-    }
-    async function getData() {
-      loading.value = true;
-      try {
-        loading.value = false;
-      } catch (error) {
-        loading.value = false;
-      }
-    }
-    function onBack() {
-      router.go(-1);
-    }
-    function onClick() {
-      cardManageStore.setAllClickEvent(null);
-    }
-    function cloneWithNewUuids(node) {
-      const copy = JSON.parse(JSON.stringify(node));
-      assignUuidsRecursively(copy);
-      return copy;
-    }
-    function assignUuidsRecursively(node) {
-      node.uuid = generateShortUUID();
-      if (["grid", "singleColumn", "multipleColumn", "multipleLine", "gridList"].includes(node.type) && Array.isArray(node.columns)) {
-        node.columns.forEach((col) => {
-          if (Array.isArray(col.list)) {
-            col.list.forEach((child) => assignUuidsRecursively(child));
-          }
-        });
-      }
-    }
-    function getSaveData() {
-      const newList = JSON.parse(JSON.stringify(data.value.list));
-      return filterListByState(newList);
-    }
-    function filterListByState(list) {
-      if (!Array.isArray(list)) return [];
-      const result = [];
-      for (const node of list) {
-        if (node?.state === false) continue;
-        const cloned = JSON.parse(JSON.stringify(node));
-        if (cloned && Object.prototype.hasOwnProperty.call(cloned, "state")) {
-          delete cloned.state;
-        }
-        if (["grid", "singleColumn", "multipleColumn", "multipleLine", "gridList"].includes(cloned?.type) && Array.isArray(cloned.columns)) {
-          cloned.columns = cloned.columns.map((col) => {
-            const colClone = { ...col };
-            colClone.list = filterListByState(colClone.list || []);
-            return colClone;
-          });
-        }
-        result.push(cloned);
-      }
-      return result;
-    }
-    return (_ctx, _cache) => {
-      const _component_a_button = resolveComponent("a-button");
-      const _component_a_segmented = resolveComponent("a-segmented");
-      const _component_a_tab_pane = resolveComponent("a-tab-pane");
-      const _component_a_tabs = resolveComponent("a-tabs");
-      const _component_a_tooltip = resolveComponent("a-tooltip");
-      const _component_a_spin = resolveComponent("a-spin");
-      return openBlock(), createElementBlock("div", {
-        onClick,
-        class: "config-main"
-      }, [
-        createElementVNode("div", _hoisted_1, [
-          createElementVNode("div", _hoisted_2, [
-            createVNode(unref(LeftOutlined), {
-              class: "back-icon",
-              onClick: onBack
-            }),
-            createElementVNode("span", null, toDisplayString(cardName.value), 1)
-          ]),
-          createElementVNode("div", null, [
-            createVNode(_component_a_button, {
-              type: "primary",
-              style: { "margin-right": "12px", "color": "#0066ff", "background": "rgba(0, 102, 255, 0.1)" },
-              onClick: onViewiew
-            }, {
-              default: withCtx(() => [..._cache[6] || (_cache[6] = [
-                createTextVNode("预览", -1)
-              ])]),
-              _: 1
-            }),
-            createVNode(_component_a_button, {
-              type: "primary",
-              onClick: onSave
-            }, {
-              default: withCtx(() => [..._cache[7] || (_cache[7] = [
-                createTextVNode("发布", -1)
-              ])]),
-              _: 1
-            })
-          ])
-        ]),
-        createElementVNode("div", _hoisted_3, [
-          createElementVNode("div", _hoisted_4, [
-            createVNode(_component_a_tabs, {
-              activeKey: activeTab.value,
-              "onUpdate:activeKey": _cache[1] || (_cache[1] = ($event) => activeTab.value = $event),
-              size: "large"
-            }, {
-              default: withCtx(() => [
-                createVNode(_component_a_tab_pane, {
-                  key: "1",
-                  tab: "卡片"
-                }, {
-                  default: withCtx(() => [
-                    createVNode(_component_a_segmented, {
-                      value: tabValue.value,
-                      "onUpdate:value": _cache[0] || (_cache[0] = ($event) => tabValue.value = $event),
-                      block: "",
-                      options: tabOptions,
-                      style: { "margin-bottom": "10px" }
-                    }, null, 8, ["value", "options"]),
-                    tabValue.value === "模板" ? (openBlock(), createBlock(Template, {
-                      key: 0,
-                      recordData: data.value
-                    }, null, 8, ["recordData"])) : createCommentVNode("", true),
-                    tabValue.value === "组件" ? (openBlock(), createBlock(Module, {
-                      key: 1,
-                      recordData: data.value
-                    }, null, 8, ["recordData"])) : createCommentVNode("", true),
-                    tabValue.value === "结构" ? (openBlock(), createBlock(Structure, {
-                      key: 2,
-                      recordData: data.value
-                    }, null, 8, ["recordData"])) : createCommentVNode("", true)
-                  ]),
-                  _: 1
-                }),
-                createVNode(_component_a_tab_pane, {
-                  key: "2",
-                  tab: "变量",
-                  forceRender: true
-                }, {
-                  default: withCtx(() => [
-                    createVNode(Variable, {
-                      variables: props.variableList
-                    }, null, 8, ["variables"])
-                  ]),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }, 8, ["activeKey"])
-          ]),
-          createElementVNode("div", {
-            class: "center",
-            onClick: restRight
-          }, [
-            createVNode(RenderPanel, { sourceData: data.value }, null, 8, ["sourceData"])
-          ]),
-          createElementVNode("div", _hoisted_5, [
-            createVNode(Properties, { recordData: data.value }, null, 8, ["recordData"])
-          ]),
-          createElementVNode("div", _hoisted_6, [
-            createVNode(_component_a_tooltip, null, {
-              title: withCtx(() => [..._cache[8] || (_cache[8] = [
-                createTextVNode("PC端", -1)
-              ])]),
-              default: withCtx(() => [
-                createElementVNode("div", {
-                  class: normalizeClass(["operate-icon", { "active-icon": activeOperate.value === "_1" }]),
-                  innerHTML: unref(pc)(),
-                  onClick: _cache[2] || (_cache[2] = ($event) => changeUI("_1"))
-                }, null, 10, _hoisted_7)
-              ]),
-              _: 1
-            }),
-            createVNode(_component_a_tooltip, null, {
-              title: withCtx(() => [..._cache[9] || (_cache[9] = [
-                createTextVNode("移动端", -1)
-              ])]),
-              default: withCtx(() => [
-                createElementVNode("div", {
-                  class: normalizeClass(["operate-icon", { "active-icon": activeOperate.value === "_2" }]),
-                  innerHTML: unref(phone)(),
-                  onClick: _cache[3] || (_cache[3] = ($event) => changeUI("_2"))
-                }, null, 10, _hoisted_8)
-              ]),
-              _: 1
-            }),
-            _cache[14] || (_cache[14] = createElementVNode("div", { class: "line" }, null, -1)),
-            createVNode(_component_a_tooltip, null, {
-              title: withCtx(() => [..._cache[10] || (_cache[10] = [
-                createTextVNode("撤销", -1)
-              ])]),
-              default: withCtx(() => [
-                createElementVNode("div", {
-                  class: "operate-icon",
-                  style: normalizeStyle({ color: unref(cardManageStore).revokeState ? "#000" : "#ccc" }),
-                  innerHTML: unref(leftSvg)(),
-                  onClick: _cache[4] || (_cache[4] = withModifiers(($event) => onRevoke(unref(cardManageStore).revokeState), ["stop"]))
-                }, null, 12, _hoisted_9)
-              ]),
-              _: 1
-            }),
-            createVNode(_component_a_tooltip, null, {
-              title: withCtx(() => [..._cache[11] || (_cache[11] = [
-                createTextVNode("重做", -1)
-              ])]),
-              default: withCtx(() => [
-                createElementVNode("div", {
-                  class: "operate-icon",
-                  style: normalizeStyle({ color: unref(cardManageStore).redoState ? "#000" : "#ccc" }),
-                  innerHTML: unref(rightSvg)(),
-                  onClick: _cache[5] || (_cache[5] = withModifiers(($event) => onRedo(unref(cardManageStore).redoState), ["stop"]))
-                }, null, 12, _hoisted_10)
-              ]),
-              _: 1
-            }),
-            _cache[15] || (_cache[15] = createElementVNode("div", { class: "line" }, null, -1)),
-            createVNode(_component_a_tooltip, null, {
-              title: withCtx(() => [..._cache[12] || (_cache[12] = [
-                createTextVNode("保存为模板", -1)
-              ])]),
-              default: withCtx(() => [
-                createElementVNode("div", {
-                  class: "operate-icon",
-                  innerHTML: unref(moban)()
-                }, null, 8, _hoisted_11)
-              ]),
-              _: 1
-            }),
-            createVNode(_component_a_tooltip, null, {
-              title: withCtx(() => [..._cache[13] || (_cache[13] = [
-                createTextVNode("清空卡片", -1)
-              ])]),
-              default: withCtx(() => [
-                createElementVNode("div", {
-                  class: "operate-icon",
-                  innerHTML: unref(clear)(),
-                  onClick: withModifiers(onClear, ["stop"])
-                }, null, 8, _hoisted_12)
-              ]),
-              _: 1
-            })
-          ])
-        ]),
-        loading.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
-          createVNode(_component_a_spin)
-        ])) : createCommentVNode("", true),
-        createVNode(PanoramaView),
-        createVNode(PreviewPanel, {
-          ref_key: "previewPanelRef",
-          ref: previewPanelRef
-        }, null, 512)
-      ]);
-    };
-  }
-};
-const ConfigMain = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a9616c2f"]]);
-export {
-  ConfigMain as default
-};