@tuoyuan/web-plus/ui/es/index-D6cWX0HK.js

基于arco-design-vue的配置化表格表单组件

import { ref as m, onMounted as V, onBeforeUnmount as N, reactive as F, defineComponent as S, mergeModels as T, computed as U, useModel as A, resolveComponent as h, openBlock as x, createBlock as k, withCtx as g, createElementVNode as z, createVNode as C, createTextVNode as M, toDisplayString as O, createCommentVNode as D, normalizeClass as H, getCurrentInstance as L, render as _, h as R } from "vue";
function W(e, n) {
  let l;
  return function(...a) {
    clearTimeout(l), l = setTimeout(() => {
      e.apply(this, a);
    }, n);
  };
}
function q(e, n = 300) {
  const l = m(window.innerWidth), a = m(window.innerHeight), i = W(() => {
    l.value = window.innerWidth, a.value = window.innerHeight, e && e({ width: l.value, height: a.value });
  }, n);
  return V(() => {
    i(), window.addEventListener("resize", i);
  }), N(() => {
    window.removeEventListener("resize", i);
  }), { width: l, height: a };
}
function J(e, n, l) {
  V(() => {
    const [a, s] = n.value, i = l.context[a], r = s.split(".");
    e.value = r.reduce((c, d) => c && c[d], i), e.addEventListener("input", (c) => {
      const d = c.target.value;
      r.reduce((u, t, o) => {
        if (o === r.length - 1)
          u[t] = d;
        else
          return u[t] || l.context.$set(u, t, {}), u[t];
      }, i);
    });
  });
}
function Q(e) {
  return e == null;
}
function y(e) {
  if (typeof e != "object" || e === null)
    return e;
  let n = Array.isArray(e) ? [] : {};
  for (let l in e)
    e.hasOwnProperty(l) && (n[l] = y(e[l]));
  return n;
}
let P = { a: 1, b: { c: 2 } };
y(P);
const E = /* @__PURE__ */ new Set();
function $() {
  let e;
  do
    e = `${Date.now()}${Math.floor(Math.random() * 1e6)}`;
  while (E.has(e));
  return E.add(e), e;
}
const B = {
  size: "small"
}, X = {
  colGap: 0,
  rowGap: 0,
  span: 8,
  marginTop: "2px",
  autoLabelWidth: !0,
  scrollToFirstError: !0,
  layout: "horizontal",
  gutter: 10,
  labelAlign: "right",
  columns: [],
  justify: "start",
  align: "start",
  wrap: !0,
  submitBtn: !0,
  resetBtn: !0,
  menuBtn: !0,
  menu: !0,
  submitBtnText: "提交",
  resetBtnText: "重置",
  ...B
}, Y = {
  pagePosition: "br",
  resizable: !1,
  calcHeight: 20,
  align: "left",
  stripe: !1,
  drag: !1,
  rowKey: "id",
  scroll: {},
  submitBtn: !1,
  bordered: {
    cell: !0
    // wrapper: true,
  },
  columns: [],
  ...B
}, Z = (e) => {
  const n = m(e), l = F({});
  function a(t) {
    t.columns && t.columns.forEach((o) => {
      o._id = $();
    }), n.value = t;
  }
  function s(t, o) {
    Reflect.set(n.value, t, o);
  }
  function i() {
    n.value.columns = [];
  }
  function r(t, o) {
    o ? n.value.columns.splice(o, 0, t) : n.value.columns.push(t);
  }
  function c(t) {
    n.value.columns.splice(t, 1);
  }
  function d(t, o, p) {
    const { found: f, config: v } = u(t, n.value);
    if (f)
      Reflect.set(v, o, p);
    else
      throw new Error("字段不存在");
  }
  function u(t, o) {
    const p = o.columns.find((f) => f.field === t);
    if (p)
      return {
        found: !0,
        config: p
      };
    if (!o.groups)
      return {
        found: !1,
        config: null
      };
    for (const f of o.groups ?? []) {
      const v = f.columns.find((w) => w.field === t);
      if (v)
        return {
          found: !0,
          config: v,
          group: f.label
          // 可选：返回所属分组的标签
        };
    }
    return {
      found: !1,
      config: null
    };
  }
  return {
    option: n,
    formData: l,
    setColumn: d,
    addColumn: r,
    clearColumn: i,
    setOptionConfig: s,
    setOption: a,
    delColumn: c
  };
}, G = { style: { display: "flex", "justify-content": "space-between" } }, I = /* @__PURE__ */ S({
  name: "AModalForm",
  __name: "modal-form",
  props: /* @__PURE__ */ T({
    option: { default: {} },
    loading: { type: Boolean, default: !1 },
    onText: { default: "确定" },
    cancelText: { default: "取消" },
    title: { default: "表单" },
    footer: { type: Boolean, default: !0 },
    default: {},
    cancelBtn: { type: Boolean, default: !0 },
    maskClosable: { type: Boolean, default: !1 }
  }, {
    visible: {
      default: !0
    },
    visibleModifiers: {}
  }),
  emits: /* @__PURE__ */ T(["submit", "close"], ["update:visible"]),
  setup(e, { emit: n }) {
    m(B.size);
    const l = e, a = n, s = m(), i = U(() => Object.assign(
      {
        span: 12,
        menu: !1
      },
      l.option.value
    )), r = A(e, "visible");
    function c() {
      s.value.validate().then((t) => {
        t === void 0 && a("submit", u.value);
      });
    }
    function d() {
      a("close");
    }
    const u = m(y(l.default));
    return (t, o) => {
      const p = h("a-form-plus"), f = h("a-button"), v = h("a-space"), w = h("a-modal");
      return x(), k(w, {
        visible: r.value,
        "onUpdate:visible": o[1] || (o[1] = (b) => r.value = b),
        "unmount-on-close": !0,
        maskClosable: t.maskClosable,
        title: t.title,
        "body-style": {
          maxHeight: "calc(100vh - 400px)"
        },
        onClose: d,
        onCancel: d,
        footer: t.footer
      }, {
        footer: g((b) => [
          z("div", G, [
            o[2] || (o[2] = z("div", null, null, -1)),
            C(v, null, {
              default: g(() => [
                t.cancelBtn ? (x(), k(f, {
                  key: 0,
                  loading: t.loading,
                  onClick: d
                }, {
                  default: g(() => [
                    M(O(t.cancelText), 1)
                  ]),
                  _: 1
                }, 8, ["loading"])) : D("", !0),
                C(f, {
                  loading: t.loading,
                  type: "primary",
                  onClick: c
                }, {
                  default: g(() => [
                    M(O(t.onText), 1)
                  ]),
                  _: 1
                }, 8, ["loading"])
              ]),
              _: 1
            })
          ])
        ]),
        default: g(() => [
          C(p, {
            class: H({
              "form-modal--view": !0
            }),
            disabled: t.loading,
            option: i.value,
            ref_key: "formRef",
            ref: s,
            modelValue: u.value,
            "onUpdate:modelValue": o[0] || (o[0] = (b) => u.value = b)
          }, null, 8, ["disabled", "option", "modelValue"])
        ]),
        _: 1
      }, 8, ["visible", "maskClosable", "title", "footer"]);
    };
  }
});
function j(e) {
  const n = L(), l = n == null ? void 0 : n.appContext, a = F({
    visible: !1,
    loading: !1
  }), s = document.createElement("div"), i = () => {
    a.loading = !1, a.visible = !1, _(null, s), document.body.removeChild(s);
  }, r = m(e == null ? void 0 : e.option);
  function c() {
    document.body.appendChild(s);
    const u = R(I, {
      title: e.title,
      default: (e == null ? void 0 : e.default) ?? {},
      okText: e.okText,
      cancelText: e.cancelText,
      cancelBtn: e.cancelBtn,
      width: e.width,
      option: r,
      visible: a.visible,
      loading: a.loading,
      "onUpdate:visible": (t) => a.visible = t,
      onClose: () => {
        e.close && e.close(), i();
      },
      onSubmit: (t) => {
        a.loading = !0, e.submit && e.submit(t, i);
      }
    });
    l && (u.appContext = l), _(u, s);
  }
  function d() {
    a.visible = !0, c();
  }
  return {
    show: d,
    close: i,
    option: r
  };
}
export {
  X as a,
  B as b,
  $ as c,
  y as d,
  Y as e,
  q as f,
  J as g,
  j as h,
  Z as u,
  Q as v
};