@epxing/designer 0.0.0-stage → 5.3.0-beta.2

package/dist/src/visual/config/Font.js

@@ -0,0 +1,202 @@
+import '../../../style.css';
+import { resolveComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, createVNode, withCtx, Fragment, renderList, createBlock, normalizeStyle } from "vue";
+/* empty css         */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  name: "epx-visual-config-font",
+  props: {
+    value: [String, Object],
+    defaultValue: String,
+    label: String,
+    unit: {
+      type: String,
+      default: "px"
+    }
+  },
+  data() {
+    return {
+      style: {},
+      fontFamilyOption: [],
+      fontWeightOption: [],
+      predefineColors: []
+    };
+  },
+  watch: {
+    style(v) {
+      this.changeValue(v);
+    }
+  },
+  computed: {
+    clearSuffix() {
+      return (v = "") => {
+        if (v) return Number(v.replace(/[A-Za-z%]/g, ""));
+        return "";
+      };
+    }
+  },
+  methods: {
+    changeValue(v) {
+      if (v !== this.defaultValue) {
+        this.$emit("change-configs", v === this.defaultValue ? null : v);
+        this.$emit("input", v === this.defaultValue ? null : v);
+      }
+    }
+  },
+  created() {
+    this.predefineColors = ["#ff4500", "#ff8c00", "#ffd700", "#90ee90"];
+    this.fontWeightOption = [
+      {
+        label: this.$t("overstriking"),
+        value: "700"
+      },
+      {
+        label: this.$t("thin"),
+        value: "400"
+      },
+      {
+        label: this.$t("default"),
+        value: "500"
+      }
+    ];
+    this.fontFamilyOption = [
+      { label: "Arial, Helvetica, 微软雅黑", value: "arial, helvetica, microsoft yahei" },
+      { label: "Arial, Helvetica, 黑体", value: "arial, helvetica, simhei" },
+      { label: "Comic Sans MS, 微软雅黑", value: "comic sans ms, microsoft yahei" },
+      { label: "Comic Sans MS, 黑体", value: "comic sans ms, simhei" },
+      { label: "Impact, 微软雅黑", value: "impact, microsoft yahei" },
+      { label: "Impact, 黑体", value: "impact, simhei" },
+      { label: "Lucida Sans Unicode, 微软雅黑", value: "lucida sans unicode, microsoft yahei" },
+      { label: "Lucida Sans Unicode, 黑体", value: "lucida sans unicode, simhei" },
+      { label: "Trebuchet MS, 微软雅黑", value: "trebuchet ms, microsoft yahei" },
+      { label: "Trebuchet MS, 黑体", value: "trebuchet ms, simhei" },
+      { label: "Verdana, 微软雅黑", value: "verdana, microsoft yahei" },
+      { label: "Verdana, 黑体", value: "verdana, simhei" },
+      { label: "Georgia, 微软雅黑", value: "georgia, microsoft yahei" },
+      { label: "Georgia, 黑体", value: "georgia, simhei" },
+      { label: "Palatino Linotype, 微软雅黑", value: "palatino linotype, microsoft yahei" },
+      { label: "Palatino Linotype, 黑体", value: "palatino linotype, simhei" },
+      { label: "Times New Roman, 微软雅黑", value: "times new roman, microsoft yahei" },
+      { label: "Times New Roman, 黑体", value: "times new roman, simhei" },
+      { label: "Courier New, 微软雅黑", value: "courier new, microsoft yahei" },
+      { label: "Courier New, 黑体", value: "courier new, simhei" },
+      { label: "Lucida Console, 微软雅黑", value: "lucida console, microsoft yahei" },
+      { label: "Lucida Console, 黑体", value: "lucida console, simhei" }
+    ];
+    if (this.value) {
+      this.style = { ...this.value };
+    }
+  }
+};
+const _hoisted_1 = { class: "style-config__content" };
+const _hoisted_2 = { class: "style-config__subitem" };
+const _hoisted_3 = {
+  class: "style-config__label",
+  for: ""
+};
+const _hoisted_4 = { class: "style-config__subitem" };
+const _hoisted_5 = {
+  class: "style-config__label",
+  for: ""
+};
+const _hoisted_6 = { class: "style-config__subitem" };
+const _hoisted_7 = { class: "style-config__subitem" };
+const _hoisted_8 = {
+  class: "style-config__label",
+  for: ""
+};
+const _hoisted_9 = { class: "style-config__subitem" };
+const _hoisted_10 = {
+  class: "style-config__label",
+  for: ""
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_input_number = resolveComponent("el-input-number");
+  const _component_el_option = resolveComponent("el-option");
+  const _component_el_select = resolveComponent("el-select");
+  const _component_el_color_picker = resolveComponent("el-color-picker");
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createElementVNode("div", _hoisted_2, [
+      createElementVNode("label", _hoisted_3, toDisplayString(_ctx.$t("word size")), 1),
+      createVNode(_component_el_input_number, {
+        size: "small",
+        "model-value": $options.clearSuffix($data.style.fontSize),
+        "controls-position": "right",
+        onChange: _cache[0] || (_cache[0] = (v) => $data.style["fontSize"] = v + $props.unit)
+      }, null, 8, ["model-value"])
+    ]),
+    createElementVNode("div", _hoisted_4, [
+      createElementVNode("label", _hoisted_5, toDisplayString(_ctx.$t("row height")), 1),
+      createVNode(_component_el_input_number, {
+        size: "small",
+        "model-value": $options.clearSuffix($data.style.lineHeight),
+        "controls-position": "right",
+        onChange: _cache[1] || (_cache[1] = (v) => $data.style["lineHeight"] = v + $props.unit)
+      }, null, 8, ["model-value"])
+    ]),
+    createElementVNode("div", _hoisted_6, [
+      _cache[5] || (_cache[5] = createElementVNode("label", {
+        class: "style-config__label",
+        for: ""
+      }, "字体", -1)),
+      createVNode(_component_el_select, {
+        class: "selection",
+        size: "small",
+        modelValue: $data.style.fontFamily,
+        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => $data.style.fontFamily = $event),
+        placeholder: _ctx.$t("default")
+      }, {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList($data.fontFamilyOption, (item) => {
+            return openBlock(), createBlock(_component_el_option, {
+              key: item.value,
+              label: item.label,
+              value: item.value
+            }, {
+              default: withCtx(() => [
+                createElementVNode("span", {
+                  style: normalizeStyle({ fontFamily: item.value })
+                }, toDisplayString(item.label), 5)
+              ]),
+              _: 2
+            }, 1032, ["label", "value"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue", "placeholder"])
+    ]),
+    createElementVNode("div", _hoisted_7, [
+      createElementVNode("label", _hoisted_8, toDisplayString(_ctx.$t("word again")), 1),
+      createVNode(_component_el_select, {
+        class: "selection",
+        size: "small",
+        modelValue: $data.style.fontWeight,
+        "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => $data.style.fontWeight = $event),
+        placeholder: _ctx.$t("default")
+      }, {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList($data.fontWeightOption, (item) => {
+            return openBlock(), createBlock(_component_el_option, {
+              key: item.value,
+              label: item.label,
+              value: item.value
+            }, null, 8, ["label", "value"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue", "placeholder"])
+    ]),
+    createElementVNode("div", _hoisted_9, [
+      createElementVNode("label", _hoisted_10, toDisplayString(_ctx.$t("font color")), 1),
+      createVNode(_component_el_color_picker, {
+        modelValue: $data.style.color,
+        "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => $data.style.color = $event),
+        "show-alpha": "",
+        predefine: $data.predefineColors
+      }, null, 8, ["modelValue", "predefine"])
+    ])
+  ]);
+}
+const Font = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-e3d35e1a"]]);
+export {
+  Font as default
+};

package/dist/src/visual/config/FormItem.js

@@ -0,0 +1,23 @@
+import '../../../style.css';
+const _sfc_main = {
+  name: "epx-visual-config-form-item",
+  inject: {
+    visualComponent: {
+      default: null
+    }
+  },
+  props: {
+    item: {
+      type: Object,
+      required: true
+    }
+  },
+  render() {
+    const { item, visualComponent } = this;
+    if (item.render) return item.render(item);
+    return visualComponent ? visualComponent.renderFormItem(item) : null;
+  }
+};
+export {
+  _sfc_main as default
+};

package/dist/src/visual/config/Function.js

@@ -0,0 +1,114 @@
+import '../../../style.css';
+import { resolveComponent, openBlock, createElementBlock, createVNode, withCtx, Fragment, renderList, createBlock, createTextVNode, toDisplayString, createElementVNode, createCommentVNode } from "vue";
+/* empty css             */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  name: "epx-visual-config-function",
+  props: {
+    designer: Object,
+    value: Object,
+    defaultValue: String,
+    functionList: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  data() {
+    return {
+      functionName: ""
+    };
+  },
+  methods: {
+    editJS(item, type) {
+      var _a;
+      const { JS = "" } = ((_a = this.designer) == null ? void 0 : _a.pageConfig) || {};
+      if (!this.value) {
+        if (!this.functionName) {
+          this.$message.error("请输入事件名");
+          return;
+        }
+        if (this.functionList.includes(this.functionName)) {
+          this.$message.error("该事件名称已存在");
+          return;
+        }
+        const js = JS + `
+  /**
+   * Button ${this.functionName}
+   */
+  export function ${this.functionName} () {
+
+  }
+      `;
+        this.designer.updatePageConfig({ JS: js });
+        this.$emit("input", this.functionName);
+      }
+      this.designer.openPanel("jsPanel");
+    }
+  }
+};
+const _hoisted_1 = { class: "function" };
+const _hoisted_2 = { class: "handler-function" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_option = resolveComponent("el-option");
+  const _component_el_select = resolveComponent("el-select");
+  const _component_el_input = resolveComponent("el-input");
+  const _component_el_button = resolveComponent("el-button");
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createVNode(_component_el_select, {
+      size: "default",
+      clearable: "",
+      "model-value": $props.value || "new",
+      onClear: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("input", null))
+    }, {
+      default: withCtx(() => [
+        (openBlock(true), createElementBlock(Fragment, null, renderList($props.functionList, (option) => {
+          return openBlock(), createBlock(_component_el_option, {
+            onClick: ($event) => _ctx.$emit("input", option),
+            key: option,
+            value: option
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(option), 1)
+            ]),
+            _: 2
+          }, 1032, ["onClick", "value"]);
+        }), 128)),
+        createVNode(_component_el_option, {
+          onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("input", null)),
+          value: "new",
+          label: "添加新事件"
+        }, {
+          default: withCtx(() => [..._cache[4] || (_cache[4] = [
+            createTextVNode("添加新事件", -1)
+          ])]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }, 8, ["model-value"]),
+    createElementVNode("div", _hoisted_2, [
+      !$props.value ? (openBlock(), createBlock(_component_el_input, {
+        key: 0,
+        size: "default",
+        modelValue: $data.functionName,
+        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => $data.functionName = $event)
+      }, null, 8, ["modelValue"])) : createCommentVNode("", true),
+      createVNode(_component_el_button, {
+        class: "handler-function__btn",
+        size: "small",
+        onClick: _cache[3] || (_cache[3] = ($event) => $options.editJS(_ctx.item))
+      }, {
+        default: withCtx(() => [..._cache[5] || (_cache[5] = [
+          createTextVNode("编辑JS", -1)
+        ])]),
+        _: 1
+      })
+    ])
+  ]);
+}
+const Function = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-3115de90"]]);
+export {
+  Function as default
+};

package/dist/src/visual/config/Html.js

@@ -0,0 +1,111 @@
+import '../../../style.css';
+import { resolveComponent, openBlock, createElementBlock, createVNode, withCtx, createTextVNode, createBlock, createCommentVNode } from "vue";
+/* empty css         */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  name: "epx-visual-config-html",
+  props: {
+    designer: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    value: String,
+    defaultValue: String,
+    label: String,
+    i18nValue: Object
+  },
+  data() {
+    return {
+      dialogVisible: false
+    };
+  },
+  computed: {
+    variableList() {
+      var _a;
+      if ((_a = this.designer.pageConfig) == null ? void 0 : _a.variableSets) {
+        return [{
+          type: "folder",
+          name: "页面变量",
+          children: this.designer.pageConfig.variableSets.map((item) => ({ ...item, type: "variable", name: item.code }))
+        }];
+      }
+      return null;
+    },
+    formatValue() {
+      return (v) => {
+        if (v) {
+          const node = document.createElement("div");
+          node.innerHTML = v;
+          node.querySelectorAll(".datasource").forEach((item) => {
+            item.innerText = `{${item.getAttribute("data-datasource")}.${item.getAttribute("data-field")}}`;
+          });
+          const html = node.innerHTML;
+          node.remove();
+          return html || "";
+        }
+        return "";
+      };
+    }
+  },
+  methods: {
+    changeValue(v) {
+      const node = document.createElement("div");
+      node.innerHTML = v;
+      node.querySelectorAll(".datasource").forEach((item) => {
+        item.innerText = `$[${item.getAttribute("data-field")}]`;
+      });
+      const html = node.innerHTML;
+      node.remove();
+      if (v !== this.defaultValue) {
+        this.$emit("change-configs", html === this.defaultValue ? null : html);
+      }
+    },
+    changeLanguageValue(v) {
+      this.$emit("change-language-config", v);
+    }
+  }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_button = resolveComponent("el-button");
+  const _component_epx_form_html = resolveComponent("epx-form-html");
+  const _component_epx_visual_config_lazy_dialog = resolveComponent("epx-visual-config-lazy-dialog");
+  return openBlock(), createElementBlock("div", null, [
+    createVNode(_component_el_button, {
+      type: "primary",
+      link: "",
+      onClick: _cache[0] || (_cache[0] = ($event) => $data.dialogVisible = !$data.dialogVisible)
+    }, {
+      default: withCtx(() => [..._cache[2] || (_cache[2] = [
+        createTextVNode("编辑内容", -1)
+      ])]),
+      _: 1
+    }),
+    createVNode(_component_epx_visual_config_lazy_dialog, {
+      title: "编辑内容",
+      modelValue: $data.dialogVisible,
+      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => $data.dialogVisible = $event),
+      "append-to-body": "",
+      width: "700px"
+    }, {
+      default: withCtx(() => [
+        $data.dialogVisible ? (openBlock(), createBlock(_component_epx_form_html, {
+          key: 0,
+          class: "html",
+          modelValue: $options.formatValue($props.value),
+          i18nValue: $props.i18nValue,
+          variableList: $options.variableList,
+          "onUpdate:modelValue": $options.changeValue,
+          onChangeLanguage: $options.changeLanguageValue,
+          fieldConfigs: { state: "ADD", attriLabel: this.label, attribute: { international: "1" } }
+        }, null, 8, ["modelValue", "i18nValue", "variableList", "onUpdate:modelValue", "onChangeLanguage", "fieldConfigs"])) : createCommentVNode("", true)
+      ]),
+      _: 1
+    }, 8, ["modelValue"])
+  ]);
+}
+const Html = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-376dd63a"]]);
+export {
+  Html as default
+};

package/dist/src/visual/config/Image.js

@@ -0,0 +1,102 @@
+import '../../../style.css';
+import { resolveComponent, openBlock, createElementBlock, createVNode, withCtx, createElementVNode } from "vue";
+/* empty css          */
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  name: "epx-visual-config-image",
+  props: {
+    label: String,
+    modelValue: String,
+    defaultValue: String,
+    change: Function,
+    designer: Object
+  },
+  data() {
+    return {
+      imageUrl: ""
+    };
+  },
+  methods: {
+    changeValue(v) {
+      if (v !== this.defaultValue) {
+        this.$emit("change-configs", v === this.defaultValue ? null : v);
+        if (this.change) {
+          this.change(v);
+        } else {
+          this.$emit("update:modelValue", v);
+        }
+      }
+    },
+    upload(params) {
+      this.$http.save({
+        action: "upload",
+        file: params.file,
+        SOURCE: "page"
+      }, {
+        requestType: "formData"
+      }).then((data) => {
+        this.imageUrl = this.$util.getFileUrl(data.bean);
+        this.changeValue(data.bean);
+      });
+    },
+    handleAvatarSuccess(res, file) {
+    },
+    beforeAvatarUpload(file) {
+    }
+  }
+};
+const _hoisted_1 = { class: "container" };
+const _hoisted_2 = ["src"];
+const _hoisted_3 = {
+  key: 1,
+  class: "el-icon-plus avatar-uploader-icon"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_epx_visual_config_input = resolveComponent("epx-visual-config-input");
+  const _component_el_upload = resolveComponent("el-upload");
+  const _component_el_popover = resolveComponent("el-popover");
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createVNode(_component_epx_visual_config_input, {
+      designer: $props.designer,
+      label: $props.label,
+      value: $props.modelValue,
+      isInternational: false,
+      inputVariable: true,
+      onChangeConfigs: $options.changeValue
+    }, null, 8, ["designer", "label", "value", "onChangeConfigs"]),
+    createVNode(_component_el_popover, {
+      placement: "right",
+      width: "178",
+      "popper-class": "popper",
+      trigger: "click"
+    }, {
+      reference: withCtx(() => [..._cache[0] || (_cache[0] = [
+        createElementVNode("i", { class: "el-icon-upload" }, null, -1)
+      ])]),
+      default: withCtx(() => [
+        createVNode(_component_el_upload, {
+          class: "avatar-uploader",
+          action: "",
+          "http-request": $options.upload,
+          "show-file-list": false,
+          "on-success": $options.handleAvatarSuccess,
+          "before-upload": $options.beforeAvatarUpload
+        }, {
+          default: withCtx(() => [
+            $data.imageUrl ? (openBlock(), createElementBlock("img", {
+              key: 0,
+              src: $data.imageUrl,
+              class: "avatar"
+            }, null, 8, _hoisted_2)) : (openBlock(), createElementBlock("i", _hoisted_3))
+          ]),
+          _: 1
+        }, 8, ["http-request", "on-success", "before-upload"])
+      ]),
+      _: 1
+    })
+  ]);
+}
+const Image = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-db8c5bea"]]);
+export {
+  Image as default
+};