epic-designer-gold 1.0.2 → 1.0.4

package/dist/sign-C0z0Ygs4.js

@@ -0,0 +1,219 @@
+import { inject as K, watch as Q, nextTick as A, ref as s, onMounted as Z, onUnmounted as ee, openBlock as S, createElementBlock as _, toDisplayString as P, unref as i, createVNode as k, withCtx as T, createElementVNode as d, createTextVNode as W } from "vue";
+import { p as R, e as te } from "./axios-BFVeUxau.js";
+import { ElMessageBox as j, ElMessage as C } from "element-plus";
+import { u as ae, a as oe } from "./index-DO5DuUPL.js";
+import { _ as ne } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const le = { class: "sign-main" }, se = ["src"], ce = {
+  class: "sign",
+  style: {
+    height: "100%",
+    width: "100%"
+  }
+}, ue = ["id"], ie = { class: "btn" }, re = { class: "btns" }, me = {
+  __name: "sign",
+  props: {
+    componentSchema: {
+      type: Object,
+      require: !0,
+      default: () => ({})
+    },
+    modelValue: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(E, { expose: U, emit: X }) {
+    const { t: n } = ae(), B = R.getComponent("button"), Y = R.getComponent("Dialog"), I = X, o = E, v = K("disabled", { value: !1 });
+    Q(
+      () => o.componentSchema,
+      () => {
+        A(() => {
+          g.value = o.modelValue;
+        });
+      },
+      { deep: !0, immediate: !0 }
+    );
+    const l = s(null), r = s(null), a = s(), z = s("");
+    function F() {
+      var t, e, u, y;
+      if (r.value && ((t = r.value) != null && t.clientHeight) && ((e = r.value) != null && e.clientWidth)) {
+        if (l.value = document.getElementById(`canvas${o.componentSchema.field}`), l.value.height = ((u = r.value) == null ? void 0 : u.clientHeight) || 600, l.value.width = (y = r.value) == null ? void 0 : y.clientWidth, a.value = l.value.getContext("2d"), o.modelValue) {
+          let p = new Image();
+          p.src = o.modelValue, p.setAttribute("crossOrigin", "anonymous"), p.onload = () => {
+            a.value.fillStyle = a.value.createPattern(p, "repeat"), a.value.fillRect(0, 0, 1e3, 550);
+          };
+        }
+        a.value.lineWidth = o.componentSchema.componentProps.lineWidth || 4, o.componentSchema && o.componentSchema.componentProps && o.componentSchema.componentProps.style && o.componentSchema.componentProps.style.color && (a.value.strokeStyle = o.componentSchema.componentProps.style.color), z.value = l.value.getBoundingClientRect();
+      }
+    }
+    const f = s(""), h = s(""), N = s(""), H = s(""), c = s([]), w = s(!1);
+    function L(t) {
+      if (v.value || o.componentSchema.componentProps.readonly || o.componentSchema.componentProps.disabled)
+        return;
+      t = t || event, t.preventDefault();
+      let e = {
+        x: t.offsetX,
+        y: t.offsetY
+      };
+      f.value = e.x, h.value = e.y, a.value.beginPath(), a.value.moveTo(e.x, e.y), a.value.lineTo(e.x, e.y), a.value.stroke(), a.value.closePath(), c.value.push(e), w.value = !0;
+    }
+    function O(t) {
+      if (!(v.value || o.componentSchema.componentProps.readonly || o.componentSchema.componentProps.disabled) && (t = t || event, t.preventDefault(), w.value)) {
+        let e = {
+          x: t.offsetX,
+          y: t.offsetY
+        };
+        N.value = e.x, H.value = e.y, a.value.beginPath(), a.value.moveTo(f.value, h.value), a.value.lineTo(e.x, e.y), a.value.stroke(), a.value.closePath(), f.value = e.x, h.value = e.y, c.value.push(e);
+      }
+    }
+    function $(t) {
+      if (v.value || o.componentSchema.componentProps.readonly || o.componentSchema.componentProps.disabled)
+        return;
+      t = t || event, t.preventDefault();
+      let e = {
+        x: t.offsetX,
+        y: t.offsetY
+      };
+      a.value.beginPath(), a.value.moveTo(f.value, h.value), a.value.lineTo(e.x, e.y), a.value.stroke(), a.value.closePath(), c.value.push(e), c.value.push({ x: -1, y: -1 }), w.value = !1;
+    }
+    function V() {
+      j.confirm(n("rewriteWillClearCanvas"), n("warning"), {
+        confirmButtonText: n("confirm"),
+        cancelButtonText: n("cancel"),
+        type: "warning"
+      }).then(() => {
+        a.value.clearRect(0, 0, l.value.width, l.value.height), c.value = [], C({
+          type: "info",
+          message: n("clearSuccess")
+        });
+      }).catch(() => {
+      });
+    }
+    const g = s("");
+    async function x() {
+      let t = await q(l.value.toDataURL("image/png"));
+      g.value = t, I("update:modelValue", t);
+    }
+    async function q(t) {
+      try {
+        let e = atob(t.split(",")[1]), u = new ArrayBuffer(e.length), y = new Uint8Array(u);
+        for (let b = 0; b < e.length; b++)
+          y[b] = e.charCodeAt(b);
+        let p = new Blob([u], { type: "image/png" }), M = new FormData();
+        M.append("file", p, Date.now() + "png");
+        let J = await te({
+          method: "post",
+          url: "https://ess-ds.com/prod-api/center-file/file/upload",
+          data: M,
+          headers: {
+            "Content-Type": "multipart/form-data",
+            Authorization: "Bearer " + oe.get("Admin-Token")
+          }
+        });
+        return C({
+          type: "success",
+          message: n("uploadSuccess")
+        }), J.data.data.url;
+      } catch {
+        C({
+          type: "warning",
+          message: n("uploadFailed")
+        }), m.value = !1;
+      } finally {
+        m.value = !1;
+      }
+    }
+    const m = s(!1);
+    function G() {
+      j.confirm(n("confirmAbandonSignature"), n("warning"), {
+        confirmButtonText: n("confirm"),
+        cancelButtonText: n("cancel"),
+        type: "warning"
+      }).then(() => {
+        a.value.clearRect(0, 0, l.value.width, l.value.height), c.value = [], m.value = !1;
+      }).catch(() => !1);
+    }
+    function D() {
+      v.value || o.componentSchema.componentProps.readonly || o.componentSchema.componentProps.disabled || (m.value = !0, a.value && (a.value.clearRect(0, 0, l.value.width, l.value.height), c.value = []), A(() => {
+        F();
+      }));
+    }
+    return Z(() => {
+    }), ee(() => {
+    }), U({
+      surewrite: x
+    }), (t, e) => (S(), _("div", le, [
+      g.value ? (S(), _("img", {
+        key: 1,
+        class: "sign-board",
+        src: g.value,
+        alt: "",
+        onClick: D
+      }, null, 8, se)) : (S(), _("div", {
+        key: 0,
+        class: "sign-board",
+        onClick: D
+      }, P(i(n)("signaturePad")), 1)),
+      k(i(Y), {
+        modelValue: m.value,
+        "onUpdate:modelValue": e[0] || (e[0] = (u) => m.value = u),
+        title: i(n)("signaturePad"),
+        class: "w-860px",
+        width: "860px",
+        style: { height: "600px" },
+        "before-close": G,
+        draggable: !1,
+        modal: ""
+      }, {
+        default: T(() => [
+          d("div", ce, [
+            d("div", {
+              class: "canvas",
+              ref_key: "canvasWrap",
+              ref: r
+            }, [
+              d("canvas", {
+                id: `canvas${o.componentSchema.field}`,
+                onMousedown: L,
+                onMousemove: O,
+                onMouseup: $
+              }, null, 40, ue)
+            ], 512),
+            d("div", ie, [
+              e[1] || (e[1] = d("div", { class: "remark" }, null, -1)),
+              d("div", re, [
+                k(i(B), {
+                  type: "info",
+                  size: "mini",
+                  onClick: V,
+                  onTouch: V
+                }, {
+                  default: T(() => [
+                    W(P(i(n)("rewrite")), 1)
+                  ]),
+                  _: 1
+                }),
+                k(i(B), {
+                  type: "primary",
+                  size: "mini",
+                  onClick: x,
+                  onTouch: x
+                }, {
+                  default: T(() => [
+                    W(P(i(n)("confirm")), 1)
+                  ]),
+                  _: 1
+                })
+              ])
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["modelValue", "title"])
+    ]));
+  }
+}, ge = /* @__PURE__ */ ne(me, [["__scopeId", "data-v-b0e855ca"]]);
+export {
+  ge as default
+};