@epxing/business 0.0.0-stage → 5.3.0-beta.1

package/dist/src/components/MessageTemplate.vue.js

@@ -0,0 +1,693 @@
+import component from "@epxing/core/src/mixins/component";
+import { mapState } from "vuex";
+const _sfc_main = {
+  name: "epx-message-template",
+  mixins: [component],
+  props: {
+    formData: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      dataSourceModal: false,
+      dataSourceForm: {},
+      dataScopeDrawer: false,
+      dataSource: [],
+      allFields: [],
+      defaultExpandKey: [],
+      defaultProps: {
+        children: "children",
+        label: "text"
+      },
+      editDataSourceId: "",
+      editFormParamId: "",
+      formParams: [],
+      formParam: {},
+      formParamModal: false,
+      defineDynamicParams: []
+    };
+  },
+  computed: {
+    ...mapState({
+      systemVariableList: (state) => state.config.systemVariableList
+      // 当前导航菜单
+    }),
+    variableTree() {
+      return [{
+        type: "folder",
+        name: "自定义参数",
+        children: this.formParams.map((item) => ({
+          ...item,
+          name: item.NAME,
+          value: item.CODE,
+          type: "variable",
+          variableType: "params"
+        }))
+      }, {
+        type: "folder",
+        name: "系统变量",
+        children: this.systemVariableList
+      }];
+    },
+    sortFields: {
+      get() {
+        let {
+          SORT = "[]"
+        } = this.dataSourceForm;
+        if (!SORT || SORT === "undefined" || SORT === "") SORT = "[]";
+        return JSON.parse(SORT);
+      },
+      set(v) {
+        this.dataSourceForm.SORT = JSON.stringify(v);
+      }
+    },
+    dataSourceEntity() {
+      const {
+        ENTITY
+      } = this.dataSourceForm;
+      if (ENTITY) {
+        return ENTITY.id || ENTITY;
+      }
+      return "";
+    },
+    scopeParams: {
+      get() {
+        let {
+          DATA_SCOPE = "{}"
+        } = this.dataSourceForm;
+        if (!DATA_SCOPE || DATA_SCOPE === "undefined" || DATA_SCOPE === "null" || DATA_SCOPE === "") DATA_SCOPE = "{}";
+        return JSON.parse(DATA_SCOPE).scopeParams || [];
+      },
+      set(v) {
+        this.dataSourceForm.DATA_SCOPE = JSON.stringify({
+          scopeParams: v
+        });
+      }
+    },
+    scopeText() {
+      return this.scopeParams.reduce((text, item) => text += item.text, "");
+    },
+    data: {
+      get() {
+        return this.formData;
+      },
+      set(v) {
+        this.$emit("change", v);
+      }
+    }
+  },
+  watch: {
+    dataSourceForm: {
+      handler(v) {
+      },
+      deept: true
+    },
+    dataSourceEntity(v) {
+      if (v) {
+        const entity = v.id || v;
+        const meta = this.metas[v];
+        if (!meta) {
+          this.$store.dispatch({
+            // 加回调
+            type: "ADD_META",
+            metaId: entity
+          }).then((data2) => {
+            if (data2) {
+              const relations2 = data2.getRelations();
+              this.getAllFields(relations2);
+            }
+          });
+        } else {
+          const relations2 = meta.getRelations();
+          this.getAllFields(relations2);
+        }
+      }
+    },
+    "formData.TITLE"(v) {
+      if (this.titleEditor) {
+        const content = this.titleEditor.getContent();
+        if (v !== content) this.titleEditor.setContent(v);
+      }
+    },
+    "formData.CONTENT"(v) {
+      if (this.editor) {
+        const content = this.editor.getContent();
+        if (v !== content) this.editor.setContent(v);
+      }
+    },
+    "formData.TYPE"(v) {
+      this.initEditor();
+    }
+  },
+  methods: {
+    getDataSource() {
+      return new Promise((resolve) => {
+        this.$http.list({
+          entityId: "FM_MESSAGE_SOURCE",
+          "scope.TEMPLATE": this.$query.id
+        }).then(async (data2) => {
+          this.dataSource = data2.entitys.map((item) => ({
+            id: item.ENTITY,
+            name: item.NAME,
+            root: true,
+            sourceId: item.ID
+          }));
+          for (let index = 0; index < data2.entitys.length; index++) {
+            const item = data2.entitys[index];
+            const entityData = await this.getAttribute(item);
+            this.dataSource[index] = {
+              ...this.dataSource[index],
+              children: entityData
+            };
+          }
+          resolve(this.dataSource);
+        });
+      });
+    },
+    getAttribute(item) {
+      const {
+        ENTITY,
+        ENTITY_VIEW
+      } = item;
+      return this.$http.get({
+        action: "getEntityMetaView",
+        entityId: "FM_ENTITY_VIEW",
+        metaId: ENTITY,
+        metaViewId: ENTITY_VIEW,
+        allSub: true
+      }).then((data2) => {
+        const formatData = (arr) => {
+          arr.forEach((item2) => {
+            item2.field = item2.linkCode || item2.code;
+            item2.relationSort = item2.relationType;
+            if (!item2.codeKey) item2.codeKey = item2.relatedEntity;
+            item2.id = item2.field;
+            item2.name = item2.text;
+            item2.meta = item2.meta ? item2.meta.id : "";
+            if (item2.type === "meta" && item2.relationType === "1") item2.isSub = true;
+            if (item2.children) formatData(item2.children);
+          });
+        };
+        formatData(data2);
+        return data2;
+      });
+    },
+    getMessageParams() {
+      const {
+        id
+      } = this.$query;
+      return this.$http.list({
+        entityId: "FM_MESSAGE_PARAM",
+        "scope.TEMPLATE": id
+      }).then((data2) => {
+        this.formParams = [...data2.entitys];
+        this.defineDynamicParams = this.formParams.map((item) => ({
+          id: `#{${item.CODE}}`,
+          name: item.NAME
+        }));
+        return this.formParams;
+      });
+    },
+    getAppList() {
+      return this.$http.list({
+        entityId: "FM_SERVICE",
+        "scope.SYSTEM": this.SYSTEM
+      }).then((data2) => {
+        this.appList = data2.entitys.map((item) => ({
+          id: item.ID,
+          name: item.NAME
+        }));
+        return this.appList;
+      });
+    },
+    clickDataSource(data2) {
+      if (data2.root) {
+        this.editDataSourceId = data2.sourceId;
+      }
+    },
+    addDataSource() {
+      this.editDataSourceId = "";
+      this.dataSourceForm = {};
+      this.dataSourceModal = true;
+    },
+    editDataSource(data2) {
+      this.$http.get({
+        entityId: "FM_MESSAGE_SOURCE",
+        id: this.editDataSourceId
+      }).then((data3) => {
+        if (data3 && data3.data) {
+          this.dataSourceForm = {
+            ...data3.data
+          };
+        }
+        this.dataSourceModal = true;
+      }).catch(() => {
+        this.dataSourceModal = true;
+      });
+    },
+    deleteDataSource() {
+      this.$http.removeMulti({
+        entityId: "FM_MESSAGE_SOURCE",
+        ids: this.editDataSourceId
+      }).then((data2) => {
+        this.$message.success("删除成功");
+        this.getDataSource();
+      });
+    },
+    saveDataSource() {
+      const {
+        id
+      } = this.$query;
+      const {
+        ENTITY = "",
+        ENTITY_VIEW,
+        NAME,
+        SORT,
+        SUB_SOURCE = "",
+        DATA_SCOPE = ""
+      } = this.dataSourceForm;
+      if (!NAME) {
+        this.$message.error("请填写名称");
+        return;
+      }
+      if (!ENTITY) {
+        this.$message.error("请填写对象");
+        return;
+      }
+      this.$http.save({
+        action: this.editDataSourceId ? "update" : "save",
+        entityId: "FM_MESSAGE_SOURCE",
+        "bean.CLIENT": this.CLIENT,
+        "bean.SYSTEM": this.SYSTEM,
+        "bean.ID": this.editDataSourceId ? this.editDataSourceId : "",
+        "bean.TEMPLATE": id || "",
+        "bean.ENTITY": ENTITY ? ENTITY.id || ENTITY : "",
+        "bean.ENTITY_VIEW": ENTITY_VIEW || "",
+        "bean.NAME": NAME || "",
+        "bean.SORT": SORT || "",
+        "bean.SUB_SOURCE": SUB_SOURCE ? SUB_SOURCE.id || SUB_SOURCE : "",
+        "bean.DATA_SCOPE": DATA_SCOPE || ""
+      }).then(() => {
+        this.dataSourceModal = false;
+        this.editDataSourceId = "";
+        this.dataSourceForm = {};
+        this.getDataSource();
+      });
+    },
+    getAllFields(relations) {
+      const flags = relations.map((item) => item.flag);
+      this.$http.entityFieldTreeStore({
+        metaId: this.dataSourceEntity,
+        link: flags.join(","),
+        allSub: false,
+        subFields: "",
+        showKeyNameFlag: false
+      }).then((data) => {
+        const jsonData = eval("(" + data + ")");
+        this.allFields = [...jsonData];
+        this.defaultExpandKey = [this.allFields[0].code];
+      });
+    },
+    addSortField(field) {
+      if (!field.leaf) return;
+      const sortField = this.sortFields.find((item) => item.code === field.code);
+      if (!sortField) {
+        this.sortFields = [...this.sortFields, {
+          code: field.code,
+          text: field.text,
+          sort: "asc"
+        }];
+      }
+    },
+    changeSort(field) {
+      const sortFieldIndex = this.sortFields.findIndex((item) => item.code === field.code);
+      if (sortFieldIndex !== -1) {
+        const sortField = this.sortFields.find((item) => item.code === field.code);
+        const sortFields = [...this.sortFields];
+        sortFields.splice(sortFieldIndex, 1, {
+          ...sortField,
+          sort: sortField.sort === "asc" ? "desc" : "asc"
+        });
+        this.sortFields = [...sortFields];
+      }
+    },
+    deleteSort(field) {
+      const sortFieldIndex = this.sortFields.findIndex((item) => item.code === field.code);
+      if (sortFieldIndex !== -1) {
+        const sortFields = [...this.sortFields];
+        sortFields.splice(sortFieldIndex, 1);
+        this.sortFields = [...sortFields];
+      }
+    },
+    saveFormParam() {
+      const {
+        id
+      } = this.$query;
+      const {
+        CODE,
+        NAME
+      } = this.formParam;
+      if (!CODE || !NAME) {
+        this.$message.error("请输入参数信息");
+        return;
+      }
+      this.$http.save({
+        action: this.editFormParamId ? "update" : "save",
+        entityId: "FM_MESSAGE_PARAM",
+        "bean.CLIENT": this.CLIENT,
+        "bean.SYSTEM": this.SYSTEM,
+        "bean.ID": this.editFormParamId ? this.editFormParamId : "",
+        "bean.TEMPLATE": id,
+        "bean.CODE": CODE,
+        "bean.NAME": NAME
+      }).then(() => {
+        this.formParamModal = false;
+        this.editFormParamId = "";
+        this.formParam = {};
+        this.getMessageParams();
+      });
+    },
+    addFormParam() {
+      this.editFormParamId = "";
+      this.formParam = {};
+      this.formParamModal = true;
+    },
+    editFormParam(param) {
+      this.editFormParamId = param.ID;
+      this.formParamModal = true;
+      this.formParam = {
+        ...param
+      };
+    },
+    deleteFormParam(param) {
+      this.$http.removeMulti({
+        entityId: "FM_MESSAGE_PARAM",
+        ids: param.ID
+      }).then((data2) => {
+        this.$message.success("删除成功");
+        this.getMessageParams();
+      });
+    },
+    drag(e, data2, node) {
+      if (node.parent) {
+        let parent = node.parent;
+        let nodeText = "";
+        while (parent.parent && parent.data.root !== true) {
+          nodeText = parent.data.text + "." + nodeText;
+          parent = parent.parent;
+        }
+        const field = {
+          sourceId: parent.data.id,
+          sourceName: parent.data.name,
+          fieldId: node.data.id,
+          fieldName: nodeText ? nodeText + node.data.text : node.data.text
+        };
+        for (const key in field) {
+          e.dataTransfer.setData(key, field[key]);
+          e.dataTransfer.dropEffect = "copy";
+          e.dataTransfer.effectAllowed = "copy";
+        }
+      }
+    },
+    dragVariable(e, data2, node) {
+      e.dataTransfer.setData("type", "variable");
+      e.dataTransfer.setData("variableName", data2.name);
+      e.dataTransfer.setData("variableCode", data2.code);
+      e.dataTransfer.dropEffect = "copy";
+      e.dataTransfer.effectAllowed = "copy";
+    },
+    async initEditor() {
+      const that = this;
+      if (this.editor) this.editor.remove();
+      const hasTool = this.formData.TYPE && !this.formData.TYPE.includes("01");
+      let fontsizeFormats = "";
+      for (let i = 1; i <= 50; i++) {
+        fontsizeFormats += i + "pt ";
+      }
+      const editor = this.$refs.editor;
+      const params = {
+        id: "params",
+        name: "参数",
+        type: "datasource",
+        children: this.formParams.map((item) => ({
+          id: item.CODE,
+          name: item.NAME
+        }))
+      };
+      await this.$util.usePlugin("tinymce");
+      globalThis.tinymce.init({
+        target: editor,
+        plugins: "data pagelink link image contextmenu",
+        menubar: "",
+        toolbar: hasTool ? "undo redo | styleselect | bold italic underline  strikethrough | lineheight | alignleft aligncenter alignright alignjustify | outdent indent | fontselect fontsizeselect lineheight | forecolor backcolor |table | image | media | link " : "",
+        contextmenu: "link data pagelink",
+        language: "zh_CN",
+        dataSource: [...this.dataSource, {
+          type: "variable",
+          name: "系统变量",
+          children: this.systemVariableList
+        }, params],
+        appList: [...this.appList],
+        promotion: false,
+        branding: false,
+        convert_urls: false,
+        content_style: "p {margin: 2px 0}",
+        lineheight_formats: "1 1.1 1.2 1.3 1.4 1.5 2 2.5 3",
+        font_formats: "Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Trebuchet MS=trebuchet ms,geneva;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats;宋体=simsun,serif;黑体=SimHei",
+        fontsize_formats: fontsizeFormats,
+        paste_enable_default_filters: false,
+        images_upload_handler: (blobInfo, succFun) => {
+          var file = blobInfo.blob();
+          this.$http.save({
+            action: "upload",
+            file
+          }, {
+            requestType: "formData"
+          }).then((data2) => {
+            if (data2 && data2.bean) {
+              succFun(this.$util.getFileUrl(data2.bean, "", false));
+            }
+          });
+        },
+        file_picker_callback: function(callback, value, meta) {
+          var input = document.createElement("input");
+          input.setAttribute("type", "file");
+          input.click();
+          input.onchange = function(evt) {
+            const file = this.files[0];
+            that.$http.save({
+              action: "upload",
+              file
+            }, {
+              requestType: "formData"
+            }).then((data2) => {
+              if (data2 && data2.bean) {
+                callback(that.$util.getFileUrl(data2.bean, "", false), {
+                  text: file.name
+                });
+              }
+            });
+          };
+        },
+        paste_preprocess: (plugin, args) => {
+          if (/^<img src="(data:image.+)" alt="">$/.test(args.content)) {
+            const file = this.$util.dataURLtoBlob(RegExp.$1);
+            this.$http.save({
+              action: "upload",
+              file
+            }, {
+              requestType: "formData"
+            }).then((data2) => {
+              if (data2 && data2.bean) {
+                this.editor.execCommand("mceInsertClipboardContent", false, {
+                  content: '<img src="' + this.$util.getFileUrl(data2.bean, "", false) + '" alt="">'
+                });
+              }
+            });
+          }
+        },
+        setup: function(ed) {
+          ed.on("change", () => {
+            const value = ed.getContent();
+            that.data = {
+              ...that.data,
+              CONTENT: value
+            };
+          });
+        }
+      }).then((editors) => {
+        this.editor = editors[0];
+        if (this.editor) {
+          const frame = this.editor.iframeElement.contentWindow;
+          const editorContainer = frame.document.querySelector("body");
+          editorContainer.ondragover = (e) => {
+            e.preventDefault();
+          };
+          editorContainer.ondrop = (e) => {
+            let node = e.target;
+            while (node.nodeName === "LABEL") {
+              node = node.parentNode;
+            }
+            const type = e.dataTransfer.getData("type");
+            if (type === "variable") {
+              const variableCode = e.dataTransfer.getData("variableCode");
+              const variableName = e.dataTransfer.getData("variableName");
+              const span = document.createElement("font");
+              span.contentEditable = "false";
+              span.setAttribute("data-name", "variable");
+              span.setAttribute("data-value", variableCode);
+              span.innerHTML = `<label>{${variableName}}</label>`;
+              if (e.target.innerHTML === "<br>") {
+                e.target.innerHTML = "";
+              }
+              if (node.getAttribute("data-name") === "datasource" || node.getAttribute("data-name") === "variable") {
+                node.parentNode.insertBefore(span, node);
+              } else {
+                node.appendChild(span);
+              }
+            } else {
+              const fieldId = e.dataTransfer.getData("fieldId");
+              const sourceName = e.dataTransfer.getData("sourceName") || "";
+              const fieldName = e.dataTransfer.getData("fieldName");
+              if (fieldId) {
+                const span = document.createElement("span");
+                span.contentEditable = "false";
+                span.setAttribute("data-name", "datasource");
+                span.setAttribute("data-datasource", sourceName);
+                span.setAttribute("data-field", fieldId);
+                span.innerHTML = `<label>{${fieldName}}</label>`;
+                if (e.target.innerHTML === "<br>") {
+                  e.target.innerHTML = "";
+                }
+                e.target.appendChild(span);
+                const value = this.editor.getContent();
+                that.data = {
+                  ...that.data,
+                  CONTENT: value
+                };
+              } else {
+                return true;
+              }
+            }
+          };
+          this.editor.setContent(this.formData.CONTENT || "");
+        }
+      });
+    },
+    async initTitleEditor() {
+      const that = this;
+      if (this.titleEditor) this.titleEditor.remove();
+      const editor = this.$refs.titleEditor;
+      const params = {
+        id: "params",
+        name: "参数",
+        type: "datasource",
+        children: this.formParams.map((item) => ({
+          id: item.CODE,
+          name: item.NAME
+        }))
+      };
+      await this.$util.usePlugin("tinymce");
+      globalThis.tinymce.init({
+        target: editor,
+        height: 80,
+        autoresize_min_height: 80,
+        plugins: "data",
+        menubar: "",
+        toolbar: "",
+        contextmenu: "data",
+        language: "zh_CN",
+        dataSource: [...this.dataSource, {
+          type: "variable",
+          name: "系统变量",
+          children: this.systemVariableList
+        }, params],
+        statusbar: false,
+        promotion: false,
+        content_style: "p {margin: 2px 0}",
+        setup: function(ed) {
+          ed.on("change", () => {
+            const value = ed.getContent();
+            that.data = {
+              ...that.data,
+              TITLE: value
+            };
+          });
+        }
+      }).then((editors) => {
+        this.titleEditor = editors[0];
+        if (this.titleEditor) {
+          const frame = this.titleEditor.iframeElement.contentWindow;
+          const editorContainer = frame.document.querySelector("body");
+          editorContainer.ondragover = (e) => {
+            e.preventDefault();
+          };
+          editorContainer.ondrop = (e) => {
+            let node = e.target;
+            while (node.nodeName === "LABEL") {
+              node = node.parentNode;
+            }
+            const type = e.dataTransfer.getData("type");
+            if (type === "variable") {
+              const variableCode = e.dataTransfer.getData("variableCode");
+              const variableName = e.dataTransfer.getData("variableName");
+              const span = document.createElement("font");
+              span.contentEditable = "false";
+              span.setAttribute("data-name", "variable");
+              span.setAttribute("data-value", variableCode);
+              span.innerHTML = `<label>{${variableName}}</label>`;
+              if (e.target.innerHTML === "<br>") {
+                e.target.innerHTML = "";
+              }
+              if (node.getAttribute("data-name") === "datasource" || node.getAttribute("data-name") === "variable") {
+                node.parentNode.insertBefore(span, node);
+              } else {
+                node.appendChild(span);
+              }
+            } else {
+              const fieldId = e.dataTransfer.getData("fieldId");
+              const sourceName = e.dataTransfer.getData("sourceName") || "";
+              const fieldName = e.dataTransfer.getData("fieldName");
+              if (fieldId) {
+                const span = document.createElement("span");
+                span.contentEditable = "false";
+                span.setAttribute("data-name", "datasource");
+                span.setAttribute("data-datasource", sourceName);
+                span.setAttribute("data-field", fieldId);
+                span.innerHTML = `<label>{${fieldName}}</label>`;
+                if (e.target.innerHTML === "<br>") {
+                  e.target.innerHTML = "";
+                }
+                e.target.appendChild(span);
+                const value = this.titleEditor.getContent();
+                that.data = {
+                  ...that.data,
+                  TITLE: value
+                };
+              } else {
+                return true;
+              }
+            }
+          };
+          this.titleEditor.setContent(this.formData.TITLE || "");
+        }
+      });
+    }
+  },
+  created() {
+    Promise.all([this.getDataSource(), this.getMessageParams(), this.getAppList()]).then((data2) => {
+      if (this.systemVariableList.length === 0) {
+        this.$store.dispatch("GET_SYSTEM_VARIABLE");
+      }
+      this.initTitleEditor();
+      this.initEditor();
+    });
+  }
+};
+export {
+  _sfc_main as default
+};

package/dist/src/components/MetaList.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./MetaList.vue.js";
+export {
+  _sfc_main as default
+};