super-page-runtime 2.1.933 → 2.2.1

package/dist/es/components/runtime/views/assemblys/form/rich-text/richtext-runtime.vue2.js

@@ -1,254 +1,97 @@
-import { defineComponent, ref, watch, onMounted, nextTick, onBeforeUnmount, resolveComponent, openBlock, createElementBlock, Fragment, createBlock, normalizeClass, unref, normalizeStyle, withCtx, toDisplayString, createCommentVNode, createElementVNode } from "vue";
-import { getFormModelFields } from "../../../../utils/page-init-util.js";
-import { formatVariableValue, setVariableValue, getVariableValue } from "../../../../utils/page-helper-util.js";
-import Quill from "quill";
+import { defineComponent as e, ref as t, watch as l, onMounted as n, nextTick as i, onBeforeUnmount as o, resolveComponent as r, createElementBlock as a, openBlock as u, Fragment as s, createBlock as c, createCommentVNode as p, normalizeStyle as d, normalizeClass as g, unref as m, withCtx as f, createElementVNode as v, toDisplayString as h } from "vue";
+import { getFormModelFields as x } from "../../../../utils/page-init-util.js";
+import { formatVariableValue as y, setVariableValue as b, getVariableValue as C } from "../../../../utils/page-helper-util.js";
+import w from "quill";
 import "quill/dist/quill.snow.css";
-import { handleAfterInitEvent, handleFormEvent } from "../../../../utils/events/event-util.js";
-import http from "agilebuilder-ui/src/utils/request";
-import { $t } from "../../../../utils/i18n-util.js";
-import { getToken } from "agilebuilder-ui/src/utils/auth";
-import { getBaseUrl } from "../../../../utils/common-util.js";
-const _hoisted_1 = { style: { "width": "100%", "height": "100%" } };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "richtext-runtime",
-  props: {
-    pageContext: {},
-    configure: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const entity = props.pageContext.entity ? props.pageContext.entity : {};
-    const dynamicFields = getFormModelFields(props.pageContext, props.configure);
-    const runtimeInfo = props.configure.runtime ? props.configure.runtime : {};
-    const runtimeStyle = runtimeInfo.style;
-    const runtimeClass = runtimeInfo.class;
-    const headerStyle = runtimeInfo.headerStyle;
-    const titleExceedStyle = runtimeInfo.titleExceedStyle;
-    const designProperty = ref(runtimeInfo.props ? runtimeInfo.props : {});
-    let contentVariable = designProperty.value.value;
-    const initValue = formatVariableValue(props.pageContext, contentVariable);
-    const quillEditorRef = ref(null);
-    let quill = null;
-    ref(null);
-    const fontSize = [
-      "12px",
-      "13px",
-      "14px",
-      "15px",
-      "16px",
-      "18px",
-      "20px",
-      "24px",
-      "28px",
-      "32px",
-      "36px"
-    ];
-    let hisState = designProperty.value.state;
-    function checkReadonly(state) {
-      return state == "readonly" || state == "disabled";
-    }
-    const initReadonly = checkReadonly(hisState);
-    const option = ref({
-      modules: {
-        toolbar: [
-          ["bold", "italic", "underline", "strike"],
-          // 加粗 斜体 下划线 删除线
-          ["blockquote", "code-block"],
-          // 引用
-          [{ list: "ordered" }, { list: "bullet" }],
-          // 有序、无序列表
-          [{ script: "sub" }, { script: "super" }],
-          // 上标/下标
-          [{ indent: "-1" }, { indent: "+1" }],
-          // 缩进
-          [{ direction: "rtl" }],
-          // 文本方向
-          [{ size: fontSize }],
-          // 字体大小
-          [{ header: [1, 2, 3, 4, 5, 6, false] }],
-          // 标题
-          [{ color: [] }, { background: [] }],
-          // 字体颜色、字体背景颜色
-          [{ font: [] }],
-          // 字体种类
-          [{ align: [] }],
-          // 对齐方式
-          ["clean"],
-          // 清除文本格式
-          ["link", "image"]
-          // 链接、图片、视频
-        ]
-      },
-      theme: "snow",
-      placeholder: initReadonly ? "" : designProperty.value.placeholder,
-      readOnly: initReadonly
-    });
-    watch(designProperty.value, () => {
-      const newState = designProperty.value.state;
-      if (newState != void 0 && newState !== hisState) {
-        hisState = newState;
-        const isReadonly = checkReadonly(hisState);
-        if (quill) {
-          quill.enable(!isReadonly);
-          quill.root.dataset.placeholder = isReadonly ? "" : designProperty.value.placeholder;
-        }
-      }
-    });
-    function updateEditorHeight() {
-      if (quill && quill.container) {
-        const parentNode = quill.container.parentNode;
-        const parentRect = parentNode.getBoundingClientRect();
-        const thisRect = quill.container.getBoundingClientRect();
-        let newHeight = parentRect.height - (thisRect.top - parentRect.top);
-        if (newHeight < 100) {
-          newHeight = 100;
-        }
-        quill.container.style.height = newHeight + "px";
-      }
+import { handleAfterInitEvent as k, handleFormEvent as q } from "../../../../utils/events/event-util.js";
+import T from "agilebuilder-ui/src/utils/request";
+import { $t as j } from "../../../../utils/i18n-util.js";
+import { getToken as E } from "agilebuilder-ui/src/utils/auth";
+import { getBaseUrl as L } from "../../../../utils/common-util.js";
+const R = { style: { width: "100%", height: "100%" } }, S = e({ __name: "richtext-runtime", props: { pageContext: {}, configure: {} }, setup(e2) {
+  const S2 = e2, _ = S2.pageContext.entity ? S2.pageContext.entity : {}, B = x(S2.pageContext, S2.configure), H = S2.configure.runtime ? S2.configure.runtime : {}, M = H.style, N = H.class, A = H.headerStyle, D = H.titleExceedStyle, F = t(H.props ? H.props : {});
+  let U = F.value.value;
+  const W = y(S2.pageContext, U), z = t(null);
+  let I = null;
+  t(null);
+  let O = F.value.state;
+  function G(e3) {
+    return "readonly" == e3 || "disabled" == e3;
+  }
+  const J = G(O), K = t({ modules: { toolbar: [["bold", "italic", "underline", "strike"], ["blockquote", "code-block"], [{ list: "ordered" }, { list: "bullet" }], [{ script: "sub" }, { script: "super" }], [{ indent: "-1" }, { indent: "+1" }], [{ direction: "rtl" }], [{ size: ["12px", "13px", "14px", "15px", "16px", "18px", "20px", "24px", "28px", "32px", "36px"] }], [{ header: [1, 2, 3, 4, 5, 6, false] }], [{ color: [] }, { background: [] }], [{ font: [] }], [{ align: [] }], ["clean"], ["link", "image"]] }, theme: "snow", placeholder: J ? "" : F.value.placeholder, readOnly: J });
+  l(F.value, () => {
+    const e3 = F.value.state;
+    if (null != e3 && e3 !== O) {
+      O = e3;
+      const t2 = G(O);
+      I && (I.enable(!t2), I.root.dataset.placeholder = t2 ? "" : F.value.placeholder);
     }
-    const previewList = ref([]);
-    const showViewer = ref(false);
-    const formItemRef = ref(null);
-    const componentRef = ref(null);
-    const titleRef = ref(null);
-    onMounted(() => {
-      var _a;
-      quill = new Quill(quillEditorRef.value, option.value);
-      const delta = quill.clipboard.convertHTML(initValue);
-      quill.setContents(delta.ops);
-      (_a = quillEditorRef.value) == null ? void 0 : _a.addEventListener("focusout", handleFocusOut);
-      quill.on("text-change", async function(delta2, oldDelta, source) {
-        if (delta2.ops && delta2.ops.length > 0) {
-          for (let i = 0; i < delta2.ops.length; i++) {
-            const ops = delta2.ops[i];
-            if (ops.insert && ops.insert.image) {
-              const dataurl = ops.insert.image;
-              if (!dataurl.startsWith("data:image")) {
-                return;
-              }
-              const file = dataURLtoFile(dataurl, "image.png");
-              await uploadImage(file).then((res) => {
-                if (!quill) {
-                  return;
-                }
-                const images = quill.root.getElementsByTagName("img");
-                if (images && images.length > 0) {
-                  for (let i2 = 0; i2 < images.length; i2++) {
-                    const img = images[i2];
-                    if (img.src === dataurl) {
-                      img.src = res.url + "&jwt=" + getToken();
-                    }
-                  }
-                }
-              }).catch((err) => {
-                console.error(err, "上传图片失败");
-              });
+  });
+  const P = t([]), Q = t(false), V = t(null), X = t(null), Y = t(null);
+  function Z(e3) {
+    var _a;
+    null !== e3.relatedTarget && ((_a = z.value) == null ? void 0 : _a.contains(e3.relatedTarget)) || q(I.root.innerHTML, S2.pageContext, S2.configure, "change", { entity: _ });
+  }
+  function $(e3) {
+    const t2 = new FormData();
+    t2.append("file", e3);
+    const l2 = S2.pageContext.backendUrl, n2 = L(l2, S2.pageContext.isTest);
+    return T.post(n2 + "/common/fs-upload/rich-editor-image", t2, { headers: { "Content-Type": "multipart/form-data" } });
+  }
+  function ee(e3, t2) {
+    let l2 = e3.split(","), n2 = l2[0].match(/:(.*?);/)[1], i2 = atob(l2[1]), o2 = i2.length, r2 = new Uint8Array(o2);
+    for (; o2--; ) r2[o2] = i2.charCodeAt(o2);
+    return new File([r2], t2, { type: n2 });
+  }
+  return n(() => {
+    var _a;
+    I = new w(z.value, K.value);
+    const e3 = I.clipboard.convertHTML(W);
+    I.setContents(e3.ops), (_a = z.value) == null ? void 0 : _a.addEventListener("focusout", Z), I.on("text-change", async function(e4, t2, l2) {
+      if (e4.ops && e4.ops.length > 0) for (let t3 = 0; t3 < e4.ops.length; t3++) {
+        const l3 = e4.ops[t3];
+        if (l3.insert && l3.insert.image) {
+          const e5 = l3.insert.image;
+          if (!e5.startsWith("data:image")) return;
+          const t4 = ee(e5, "image.png");
+          await $(t4).then((t5) => {
+            if (!I) return;
+            const l4 = I.root.getElementsByTagName("img");
+            if (l4 && l4.length > 0) for (let n2 = 0; n2 < l4.length; n2++) {
+              const i2 = l4[n2];
+              i2.src === e5 && (i2.src = t5.url + "&jwt=" + E());
             }
-          }
-        }
-        setVariableValue(entity, dynamicFields, quill.root.innerHTML);
-      });
-      const editorContainer = quill.container;
-      editorContainer.addEventListener("click", function(event) {
-        if (event.target.localName === "img") {
-          previewList.value = [];
-          let imgSrc = event.target.src;
-          previewList.value.push(imgSrc);
-          showViewer.value = true;
+          }).catch((e6) => {
+          });
         }
-      });
-      updateEditorHeight();
-      nextTick(() => {
-        const value = getVariableValue(entity, dynamicFields);
-        handleAfterInitEvent(
-          value,
-          props.pageContext,
-          props.configure,
-          {
-            formItemRef: formItemRef.value,
-            componentRef: componentRef.value,
-            titleRef: titleRef.value,
-            value,
-            entity: props.pageContext.entity.data,
-            pageData: props.pageContext.entity.page
-          }
-        );
-      });
-    });
-    onBeforeUnmount(() => {
-      if (quillEditorRef.value) {
-        quillEditorRef.value.removeEventListener("focusout", handleFocusOut);
       }
+      b(_, B, I.root.innerHTML);
     });
-    function handleFocusOut(event) {
-      var _a;
-      if (event.relatedTarget === null || !((_a = quillEditorRef.value) == null ? void 0 : _a.contains(event.relatedTarget))) {
-        handleFormEvent(quill.root.innerHTML, props.pageContext, props.configure, "change", {
-          entity
-        });
+    I.container.addEventListener("click", function(e4) {
+      if ("img" === e4.target.localName) {
+        P.value = [];
+        let t2 = e4.target.src;
+        P.value.push(t2), Q.value = true;
       }
-    }
-    function uploadImage(blob) {
-      const params = new FormData();
-      params.append("file", blob);
-      const config = {
-        headers: {
-          "Content-Type": "multipart/form-data"
-        }
-      };
-      const backendUrl = props.pageContext.backendUrl;
-      const baseUrl = getBaseUrl(backendUrl, props.pageContext.isTest);
-      return http.post(baseUrl + "/common/fs-upload/rich-editor-image", params, config);
-    }
-    function dataURLtoFile(dataurl, filename) {
-      let arr = dataurl.split(",");
-      let mime = arr[0].match(/:(.*?);/)[1];
-      let bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
-      while (n--) {
-        u8arr[n] = bstr.charCodeAt(n);
+    }), function() {
+      if (I && I.container) {
+        const e4 = I.container.parentNode.getBoundingClientRect(), t2 = I.container.getBoundingClientRect();
+        let l2 = e4.height - (t2.top - e4.top);
+        l2 < 100 && (l2 = 100), I.container.style.height = l2 + "px";
       }
-      return new File([u8arr], filename, { type: mime });
-    }
-    return (_ctx, _cache) => {
-      const _component_el_form_item = resolveComponent("el-form-item");
-      const _component_el_image_viewer = resolveComponent("el-image-viewer");
-      return openBlock(), createElementBlock(Fragment, null, [
-        designProperty.value.tittleShow ? (openBlock(), createBlock(_component_el_form_item, {
-          key: 0,
-          required: designProperty.value.required,
-          class: normalizeClass(unref(runtimeClass)),
-          "label-width": designProperty.value.labelWidth,
-          style: normalizeStyle(unref(runtimeStyle))
-        }, {
-          label: withCtx(() => [
-            designProperty.value.tittleShow ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              style: normalizeStyle({ ...unref(headerStyle), ...unref(titleExceedStyle) })
-            }, toDisplayString(unref($t)(designProperty.value.title)), 5)) : createCommentVNode("", true)
-          ]),
-          default: withCtx(() => [
-            createElementVNode("div", _hoisted_1, [
-              createElementVNode("div", {
-                ref_key: "quillEditorRef",
-                ref: quillEditorRef,
-                style: { "width": "100%" }
-              }, null, 512)
-            ])
-          ]),
-          _: 1
-        }, 8, ["required", "class", "label-width", "style"])) : createCommentVNode("", true),
-        showViewer.value ? (openBlock(), createBlock(_component_el_image_viewer, {
-          key: 1,
-          "hide-on-click-modal": "",
-          onClose: _cache[0] || (_cache[0] = () => {
-            showViewer.value = false;
-          }),
-          "url-list": previewList.value
-        }, null, 8, ["url-list"])) : createCommentVNode("", true)
-      ], 64);
-    };
-  }
-});
+    }(), i(() => {
+      const e4 = C(_, B);
+      k(e4, S2.pageContext, S2.configure, { formItemRef: V.value, componentRef: X.value, titleRef: Y.value, value: e4, entity: S2.pageContext.entity.data, pageData: S2.pageContext.entity.page });
+    });
+  }), o(() => {
+    z.value && z.value.removeEventListener("focusout", Z);
+  }), (e3, t2) => {
+    const l2 = r("el-form-item"), n2 = r("el-image-viewer");
+    return u(), a(s, null, [F.value.tittleShow ? (u(), c(l2, { key: 0, required: F.value.required, class: g(m(N)), "label-width": F.value.labelWidth, style: d(m(M)) }, { label: f(() => [F.value.tittleShow ? (u(), a("div", { key: 0, style: d({ ...m(A), ...m(D) }) }, h(m(j)(F.value.title)), 5)) : p("", true)]), default: f(() => [v("div", R, [v("div", { ref_key: "quillEditorRef", ref: z, style: { width: "100%" } }, null, 512)])]), _: 1 }, 8, ["required", "class", "label-width", "style"])) : p("", true), Q.value ? (u(), c(n2, { key: 1, "hide-on-click-modal": "", onClose: t2[0] || (t2[0] = () => {
+      Q.value = false;
+    }), "url-list": P.value }, null, 8, ["url-list"])) : p("", true)], 64);
+  };
+} });
 export {
-  _sfc_main as default
+  S as default
 };

package/dist/es/components/runtime/views/assemblys/form/select/select-runtime.vue.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./select-runtime.vue2.js";
+import e from "./select-runtime.vue2.js";
 export {
-  _sfc_main as default
+  e as default
 };