fec-dev-designer 1.1.2 → 5.1.2

package/es/src/packages/form/index.vue.js

@@ -8,7 +8,7 @@ import "../../../node_modules/element-plus/theme-chalk/el-dropdown.css.js";
 import "../../../node_modules/element-plus/theme-chalk/el-dropdown-menu.css.js";
 import "../../../node_modules/element-plus/theme-chalk/el-checkbox.css.js";
 import "../../../node_modules/element-plus/theme-chalk/el-input.css.js";
-import { computed as W, ref as T, watch as X, openBlock as u, createElementBlock as b, createVNode as i, createElementVNode as h, withCtx as m, unref as f, normalizeClass as S, withModifiers as q, createBlock as k, createCommentVNode as V, toDisplayString as ee, nextTick as oe } from "vue";
+import { computed as W, ref as D, watch as X, openBlock as u, createElementBlock as b, createVNode as i, createElementVNode as y, withCtx as m, unref as f, normalizeClass as S, withModifiers as q, createBlock as w, createCommentVNode as V, toDisplayString as ee, nextTick as oe } from "vue";
 import N from "../utils/eventBus.js";
 import "../../../node_modules/grid-layout-plus/es/index.js";
 import { VueDraggable as te } from "../../../node_modules/vue-draggable-plus/dist/vue-draggable-plus.js";
@@ -17,183 +17,190 @@ import ne from "./PageHeaderSetting.vue.js";
 import ae from "./PageFooterSetting.vue.js";
 import se from "./components/ComponentPreviewWrapper.vue.js";
 import ie from "./components/DividerWrapper.vue.js";
-import de from "./components/H2Wrapper.vue.js";
-import re from "./components/SubForm.vue.js";
-import ce from "./components/SubTable.vue.js";
-import { Setting as pe, Delete as ue, Lock as me, View as fe } from "../../../node_modules/@element-plus/icons-vue/dist/index.js";
-import { getEditConfigData as ge, getCurrentClass as ve, setHoverItem as B, setSelectedItem as he, isSelectedItem as ye } from "../utils/common.js";
-import { throttle as _e } from "../../../node_modules/@vexip-ui/utils/dist/index.js";
+import re from "./components/H2Wrapper.vue.js";
+import de from "./components/SubForm.vue.js";
+import ce from "./components/ApprovalHistory.vue.js";
+import pe from "./components/SubTable.vue.js";
+import { Setting as ue, Delete as me, Lock as fe, View as ge } from "../../../node_modules/@element-plus/icons-vue/dist/index.js";
+import { getEditConfigData as ve, getCurrentClass as ye, setHoverItem as A, setSelectedItem as he, isSelectedItem as _e } from "../utils/common.js";
+import { throttle as be } from "../../../node_modules/@vexip-ui/utils/dist/index.js";
 import "../../../node_modules/element-plus/theme-chalk/el-badge.css.js";
 import "../../../node_modules/element-plus/theme-chalk/el-message.css.js";
 import "./index.vue2.js";
-import be from "../../../_virtual/_plugin-vue_export-helper.js";
-import we from "../../../node_modules/grid-layout-plus/es/components/grid-layout.vue.js";
-import { ElMessage as xe } from "../../../node_modules/element-plus/es/components/message/index.js";
-import { ElIcon as ke } from "../../../node_modules/element-plus/es/components/icon/index.js";
-import { ElInput as Ve } from "../../../node_modules/element-plus/es/components/input/index.js";
+import we from "../../../_virtual/_plugin-vue_export-helper.js";
+import xe from "../../../node_modules/grid-layout-plus/es/components/grid-layout.vue.js";
+import { ElMessage as ke } from "../../../node_modules/element-plus/es/components/message/index.js";
+import { ElIcon as Ve } from "../../../node_modules/element-plus/es/components/icon/index.js";
+import { ElInput as Te } from "../../../node_modules/element-plus/es/components/input/index.js";
 import { ElCheckbox as Ee } from "../../../node_modules/element-plus/es/components/checkbox/index.js";
-import { ElDropdownMenu as De, ElDropdown as Te } from "../../../node_modules/element-plus/es/components/dropdown/index.js";
-import { ElForm as Ie } from "../../../node_modules/element-plus/es/components/form/index.js";
-import { ElScrollbar as Me } from "../../../node_modules/element-plus/es/components/scrollbar/index.js";
-const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, ze = ["onMouseenter", "onClick"], Se = {
+import { ElDropdownMenu as De, ElDropdown as Ie } from "../../../node_modules/element-plus/es/components/dropdown/index.js";
+import { ElForm as Me } from "../../../node_modules/element-plus/es/components/form/index.js";
+import { ElScrollbar as Ce } from "../../../node_modules/element-plus/es/components/scrollbar/index.js";
+const Fe = { class: "form-work-area" }, ze = { class: "form-grid-container" }, Se = ["onMouseenter", "onClick"], Ne = {
   key: 0,
   class: "component-toolbar"
-}, Ne = { class: "quick-setting-panel" }, Ue = { class: "setting-row" }, Re = { class: "setting-row" }, Ye = { class: "setting-row" }, He = ["onClick"], Pe = { class: "status-tags" }, We = {
+}, Ue = { class: "quick-setting-panel" }, He = { class: "setting-row" }, Re = { class: "setting-row" }, Ye = { class: "setting-row" }, Pe = ["onClick"], We = { class: "status-tags" }, Xe = {
   key: 0,
   class: "field-name-tag"
-}, Xe = {
+}, qe = {
   key: 1,
   class: "status-tag disabled-tag"
-}, qe = {
+}, Ae = {
   key: 2,
   class: "status-tag readonly-tag"
-}, y = "drop", Be = {
+}, h = "drop", Be = {
   __name: "index",
-  setup(Oe, { expose: O }) {
-    const p = W(() => ge()), I = T([]), d = T(p.value.fieldsData || []), _ = T(null), g = { x: 0, y: 0, w: 1, h: 1, i: "" };
+  setup(Oe, { expose: B }) {
+    const p = W(() => ve()), I = D([]), r = D(p.value.fieldsData || []), _ = D(null), g = { x: 0, y: 0, w: 1, h: 1, i: "" };
     X(
       () => p.value.columns,
       (t, o) => {
-        if (!d.value || t === o || t > o)
+        if (!r.value || t === o || t > o)
           return;
-        const l = [], n = [];
-        if (d.value.forEach((a) => {
-          a.i === y ? n.push(a) : a.x + a.w > t ? l.push({ ...a }) : n.push(a);
-        }), l.length > 0) {
-          l.sort((s, r) => s.y - r.y || s.x - r.x);
-          const a = Math.max(...n.map((s) => s.y), -1);
-          l.forEach((s, r) => {
-            s.y = a + 1 + Math.floor(r / t), s.x = 0;
-          }), d.value = [...n, ...l];
+        const n = [], l = [];
+        if (r.value.forEach((a) => {
+          a.i === h ? l.push(a) : a.x + a.w > t ? n.push({ ...a }) : l.push(a);
+        }), n.length > 0) {
+          n.sort((s, d) => s.y - d.y || s.x - d.x);
+          const a = Math.max(...l.map((s) => s.y), -1);
+          n.forEach((s, d) => {
+            s.y = a + 1 + Math.floor(d / t), s.x = 0;
+          }), r.value = [...l, ...n];
         }
       }
     ), X(
       () => p.value.labelPosition,
       (t) => {
-        const o = t === "top" ? 0.75 : 1, l = ["divider", "h2"];
-        d.value.forEach((n) => {
+        const o = t === "top" ? 0.75 : 1, n = [
+          "divider",
+          "h2",
+          "subForm",
+          "subTable",
+          "approvalHistory"
+        ];
+        r.value.forEach((l) => {
           var a;
-          l.includes((a = n.component) == null ? void 0 : a.fieldType) && (n.h = o);
+          n.includes((a = l.component) == null ? void 0 : a.fieldType) && (l.h = l.h * o);
         }), _.value.resizeEvent();
       }
     );
-    const M = T(!1);
-    function $(t) {
+    const M = D(!1);
+    function O(t) {
       console.log("🚀 ~ handleAddToGrid ~ event:", t);
-      const o = d.value.findIndex((n) => n.i === y);
+      const o = r.value.findIndex((l) => l.i === h);
       if (o !== -1) {
-        const n = d.value[o].component;
-        d.value[o].i = n.id, d.value[o].id = n.id, _.value.dragEvent(
+        const l = r.value[o].component;
+        r.value[o].i = l.id, r.value[o].id = l.id, _.value.dragEvent(
           "dragend",
-          n.id,
+          l.id,
           g.x,
           g.y,
           g.w,
           g.h
         );
       }
-      const l = _.value.getItem(y);
-      if (l) {
+      const n = _.value.getItem(h);
+      if (n) {
         try {
-          l.wrapper.style.display = "";
+          n.wrapper.style.display = "";
         } catch {
         }
         I.value = [], M.value = !0;
       }
     }
-    function A(t) {
-      var l, n, a;
-      const o = d.value.findIndex((s) => s.i === t.i);
+    function $(t) {
+      var n, l, a;
+      const o = r.value.findIndex((s) => s.i === t.i);
       if (o !== -1) {
-        const s = d.value[o];
+        const s = r.value[o];
         p.value.deletedFields || (p.value.deletedFields = []);
-        const r = {
-          label: ((l = s.component) == null ? void 0 : l.label) || "",
-          fieldName: ((n = s.component) == null ? void 0 : n.fieldName) || "",
+        const d = {
+          label: ((n = s.component) == null ? void 0 : n.label) || "",
+          fieldName: ((l = s.component) == null ? void 0 : l.fieldName) || "",
           fieldType: ((a = s.component) == null ? void 0 : a.fieldType) || "",
           deleteTime: (/* @__PURE__ */ new Date()).toLocaleString("zh-CN"),
           data: s
         };
-        p.value.deletedFields.push(r), d.value.splice(o, 1), xe.success("字段已移至回收站");
+        p.value.deletedFields.push(d), r.value.splice(o, 1), ke.success("字段已移至回收站");
       }
     }
-    let w = { x: null, y: null }, E = null;
-    const L = _e((t) => {
+    let x = { x: null, y: null }, T = null;
+    const L = be((t) => {
       if (M.value)
         return;
       const o = t.clonedData;
       if (!o)
         return;
-      (!E || E.element !== t.to) && (E = {
+      (!T || T.element !== t.to) && (T = {
         element: t.to,
         rect: t.to.getBoundingClientRect()
       });
-      const l = E.rect, n = t.originalEvent.clientX, a = t.originalEvent.clientY, s = n - l.left, r = a - l.top;
-      if (!(w.x === null || w.y === null || Math.abs(s - w.x) > 5 || // 5px 的容差
-      Math.abs(r - w.y) > 5))
+      const n = T.rect, l = t.originalEvent.clientX, a = t.originalEvent.clientY, s = l - n.left, d = a - n.top;
+      if (!(x.x === null || x.y === null || Math.abs(s - x.x) > 5 || // 5px 的容差
+      Math.abs(d - x.y) > 5))
         return;
-      w = { x: s, y: r };
+      x = { x: s, y: d };
       let v = { w: 1, h: 1 };
       o.fieldType == "textarea" ? v = { w: 1, h: 2 } : o.fieldType == "divider" || o.fieldType == "h2" ? v = {
         w: p.value.columns,
         h: 1,
         isResizable: !1
-      } : (o.fieldType == "subForm" || o.fieldType == "subTable") && (v = { w: p.value.columns, h: 2 });
-      const e = p.value.columns, c = 60, H = 0, J = (l.width + H) / e, K = c + H, Q = Math.floor(s / J), Z = Math.floor(r / K), C = Math.max(0, Math.min(Q, e - 1)), F = Math.max(0, Z);
-      let z = d.value.find((D) => D.i == y);
-      z ? (z.x = C, z.y = F) : d.value.push({
+      } : (o.fieldType == "subForm" || o.fieldType == "subTable" || o.fieldType == "approvalHistory") && (v = { w: p.value.columns, h: 2 });
+      const e = p.value.columns, c = 60, Y = 0, J = (n.width + Y) / e, K = c + Y, Q = Math.floor(s / J), Z = Math.floor(d / K), C = Math.max(0, Math.min(Q, e - 1)), F = Math.max(0, Z);
+      let z = r.value.find((E) => E.i == h);
+      z ? (z.x = C, z.y = F) : r.value.push({
         x: C,
         y: F,
         w: v.w,
         h: v.h,
-        i: y,
+        i: h,
         isResizable: v.isResizable !== !1,
         component: o
       }), oe(() => {
         var P;
-        const D = d.value.findIndex((x) => x.i == y);
-        if (D !== -1) {
-          const x = (P = _.value) == null ? void 0 : P.getItem(y);
-          if (!x)
+        const E = r.value.findIndex((k) => k.i == h);
+        if (E !== -1) {
+          const k = (P = _.value) == null ? void 0 : P.getItem(h);
+          if (!k)
             return;
           try {
-            x.wrapper.style.display = "none";
+            k.wrapper.style.display = "none";
           } catch {
           }
-          Object.assign(x.state, {
-            top: r,
+          Object.assign(k.state, {
+            top: d,
             left: s
-          }), x.calcXY(r, s), _.value.dragEvent(
+          }), k.calcXY(d, s), _.value.dragEvent(
             "dragstart",
-            y,
+            h,
             C,
             F,
             v.h,
             v.w
-          ), g.x = d.value[D].x, g.y = d.value[D].y, I.value = [];
+          ), g.x = r.value[E].x, g.y = r.value[E].y, I.value = [];
         }
       });
     });
     N.on("onFormDragStart", () => {
       M.value = !1;
     }), N.on("onFormDragEnd", (t) => {
-      E = null, w = { x: null, y: null };
-      const o = t.clonedData, l = t.originalEvent.clientX, n = t.originalEvent.clientY, a = document.querySelector(".form-grid-container").getBoundingClientRect();
-      l >= a.left && l <= a.right && n >= a.top && n <= a.bottom || (_.value.dragEvent(
+      T = null, x = { x: null, y: null };
+      const o = t.clonedData, n = t.originalEvent.clientX, l = t.originalEvent.clientY, a = document.querySelector(".form-grid-container").getBoundingClientRect();
+      n >= a.left && n <= a.right && l >= a.top && l <= a.bottom || (_.value.dragEvent(
         "dragend",
-        y,
+        h,
         g.x,
         g.y,
         g.h,
         g.w
-      ), d.value = d.value.filter(
-        (r) => r.i != y && r.i != o.id
+      ), r.value = r.value.filter(
+        (d) => d.i != h && d.i != o.id
       )), console.log("🚀 ~ onFormDragEnd:", t);
     }), N.on("resizeEvent", () => {
       _.value.resizeEvent();
     });
-    const U = T(/* @__PURE__ */ new Map());
-    function R(t) {
+    const U = D(/* @__PURE__ */ new Map());
+    function H(t) {
       return U.value.get(t) || !1;
     }
     function G(t, o) {
@@ -203,17 +210,17 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
       var t;
       return ((t = _.value) == null ? void 0 : t.state.isDragging) || !1;
     });
-    return O({
+    return B({
       onFormDragMove: L
     }), (t, o) => {
-      const l = ke, n = Ve, a = Ee, s = De, r = Te, Y = Ie, v = Me;
-      return u(), b("div", Ce, [
+      const n = Ve, l = Te, a = Ee, s = De, d = Ie, R = Me, v = Ce;
+      return u(), b("div", Fe, [
         i(ne),
         i(le),
-        h("div", Fe, [
+        y("div", ze, [
           i(v, null, {
             default: m(() => [
-              i(Y, {
+              i(R, {
                 class: "form-grid",
                 "label-width": p.value.labelWidth,
                 "label-position": p.value.labelPosition
@@ -225,14 +232,14 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
                     "onUpdate:modelValue": o[2] || (o[2] = (e) => I.value = e),
                     group: "dev",
                     class: "grid-draggable-wrapper",
-                    onAdd: $
+                    onAdd: O
                   }, {
                     default: m(() => [
-                      i(f(we), {
+                      i(f(xe), {
                         ref_key: "gridLayout",
                         ref: _,
-                        layout: d.value,
-                        "onUpdate:layout": o[1] || (o[1] = (e) => d.value = e),
+                        layout: r.value,
+                        "onUpdate:layout": o[1] || (o[1] = (e) => r.value = e),
                         "row-height": p.value.labelPosition == "top" ? 90 : 60,
                         margin: [0, 0],
                         "col-num": p.value.columns,
@@ -244,15 +251,15 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
                           e.component ? (u(), b("div", {
                             key: 0,
                             class: S(["form-component", [
-                              f(ve)(e.component),
+                              f(ye)(e.component),
                               e.component.fieldType
                             ]]),
-                            onMouseenter: (c) => f(B)(e.component),
-                            onMouseleave: o[0] || (o[0] = (c) => f(B)()),
+                            onMouseenter: (c) => f(A)(e.component),
+                            onMouseleave: o[0] || (o[0] = (c) => f(A)()),
                             onClick: q((c) => f(he)(e.component), ["stop"])
                           }, [
-                            !j.value && f(ye)(e.component) ? (u(), b("div", Se, [
-                              i(r, {
+                            !j.value && f(_e)(e.component) ? (u(), b("div", Ne, [
+                              i(d, {
                                 "popper-class": `form-quick-setting-${e.i}`,
                                 trigger: "click",
                                 placement: "bottom",
@@ -260,28 +267,28 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
                                 onVisibleChange: (c) => G(e.id, c)
                               }, {
                                 dropdown: m(() => [
-                                  R(e.id) ? (u(), k(s, { key: 0 }, {
+                                  H(e.id) ? (u(), w(s, { key: 0 }, {
                                     default: m(() => [
-                                      h("div", Ne, [
-                                        h("div", Ue, [
-                                          o[3] || (o[3] = h("span", { class: "setting-label" }, "标题:", -1)),
-                                          i(n, {
+                                      y("div", Ue, [
+                                        y("div", He, [
+                                          o[3] || (o[3] = y("span", { class: "setting-label" }, "标题:", -1)),
+                                          i(l, {
                                             modelValue: e.component.label,
                                             "onUpdate:modelValue": (c) => e.component.label = c,
                                             size: "small",
                                             class: "setting-input"
                                           }, null, 8, ["modelValue", "onUpdate:modelValue"])
                                         ]),
-                                        h("div", Re, [
-                                          o[4] || (o[4] = h("span", { class: "setting-label" }, "字段:", -1)),
-                                          i(n, {
+                                        y("div", Re, [
+                                          o[4] || (o[4] = y("span", { class: "setting-label" }, "字段:", -1)),
+                                          i(l, {
                                             modelValue: e.component.fieldName,
                                             "onUpdate:modelValue": (c) => e.component.fieldName = c,
                                             size: "small",
                                             class: "setting-input"
                                           }, null, 8, ["modelValue", "onUpdate:modelValue"])
                                         ]),
-                                        h("div", Ye, [
+                                        y("div", Ye, [
                                           i(a, {
                                             modelValue: e.component.required,
                                             "onUpdate:modelValue": (c) => e.component.required = c,
@@ -309,12 +316,12 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
                                 default: m(() => [
                                   e.component.fieldType != "blank" ? (u(), b("span", {
                                     key: 0,
-                                    class: S(["toolbar-btn settings-btn", { "is-active": R(e.id) }]),
+                                    class: S(["toolbar-btn settings-btn", { "is-active": H(e.id) }]),
                                     title: "快捷设置"
                                   }, [
-                                    i(l, null, {
+                                    i(n, null, {
                                       default: m(() => [
-                                        i(f(pe))
+                                        i(f(ue))
                                       ]),
                                       _: 1
                                     })
@@ -322,61 +329,64 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
                                 ]),
                                 _: 2
                               }, 1032, ["popper-class", "onVisibleChange"]),
-                              h("span", {
+                              y("span", {
                                 class: "toolbar-btn delete-btn",
                                 title: "删除组件",
-                                onClick: q((c) => A(e), ["stop"])
+                                onClick: q((c) => $(e), ["stop"])
                               }, [
-                                i(l, null, {
+                                i(n, null, {
                                   default: m(() => [
-                                    i(f(ue))
+                                    i(f(me))
                                   ]),
                                   _: 1
                                 })
-                              ], 8, He)
+                              ], 8, Pe)
                             ])) : V("", !0),
-                            h("div", Pe, [
-                              p.value.showFieldName && e.component.fieldName ? (u(), b("div", We, ee(e.component.fieldType == "blank" ? "空白占位" : e.component.fieldName), 1)) : V("", !0),
-                              e.component.disabled ? (u(), b("div", Xe, [
-                                i(l, null, {
+                            y("div", We, [
+                              p.value.showFieldName && e.component.fieldName ? (u(), b("div", Xe, ee(e.component.fieldType == "blank" ? "空白占位" : e.component.fieldName), 1)) : V("", !0),
+                              e.component.disabled ? (u(), b("div", qe, [
+                                i(n, null, {
                                   default: m(() => [
-                                    i(f(me))
+                                    i(f(fe))
                                   ]),
                                   _: 1
                                 })
-                              ])) : e.component.readOnly ? (u(), b("div", qe, [
-                                i(l, null, {
+                              ])) : e.component.readOnly ? (u(), b("div", Ae, [
+                                i(n, null, {
                                   default: m(() => [
-                                    i(f(fe))
+                                    i(f(ge))
                                   ]),
                                   _: 1
                                 })
                               ])) : V("", !0)
                             ]),
-                            h("div", {
+                            y("div", {
                               class: S(["component-content", {
                                 "is-disabled": e.component.disabled,
                                 "is-readonly": e.component.readOnly && !e.component.disabled
                               }])
                             }, [
-                              e.component.fieldType == "divider" ? (u(), k(ie, {
+                              e.component.fieldType == "divider" ? (u(), w(ie, {
                                 key: 0,
                                 "component-data": e.component
-                              }, null, 8, ["component-data"])) : e.component.fieldType == "h2" ? (u(), k(de, {
+                              }, null, 8, ["component-data"])) : e.component.fieldType == "h2" ? (u(), w(re, {
                                 key: 1,
                                 "component-data": e.component
-                              }, null, 8, ["component-data"])) : e.component.fieldType == "subForm" ? (u(), k(re, {
+                              }, null, 8, ["component-data"])) : e.component.fieldType == "subForm" ? (u(), w(de, {
                                 key: 2,
                                 "component-data": e.component
-                              }, null, 8, ["component-data"])) : e.component.fieldType == "subTable" ? (u(), k(ce, {
+                              }, null, 8, ["component-data"])) : e.component.fieldType == "subTable" ? (u(), w(pe, {
                                 key: 3,
                                 "component-data": e.component
-                              }, null, 8, ["component-data"])) : (u(), k(se, {
+                              }, null, 8, ["component-data"])) : e.component.fieldType == "approvalHistory" ? (u(), w(ce, {
                                 key: 4,
                                 "component-data": e.component
+                              }, null, 8, ["component-data"])) : (u(), w(se, {
+                                key: 5,
+                                "component-data": e.component
                               }, null, 8, ["component-data"]))
                             ], 2)
-                          ], 42, ze)) : V("", !0)
+                          ], 42, Se)) : V("", !0)
                         ]),
                         _: 1
                       }, 8, ["layout", "row-height", "col-num"])
@@ -394,7 +404,7 @@ const Ce = { class: "form-work-area" }, Fe = { class: "form-grid-container" }, z
       ]);
     };
   }
-}, Co = /* @__PURE__ */ be(Be, [["__scopeId", "data-v-22a7ee1a"]]);
+}, zo = /* @__PURE__ */ we(Be, [["__scopeId", "data-v-02539d10"]]);
 export {
-  Co as default
+  zo as default
 };