tms-vue3-ui/dist/es/login/index.js

Vue3基础UI库，提供JSONSchema编辑器，支持基于JSONSchema生成表单。

import { defineComponent as H, ref as k, reactive as B, onMounted as O, nextTick as $, openBlock as l, createElementBlock as s, Fragment as L, createElementVNode as a, normalizeClass as S, unref as d, renderList as G, withDirectives as I, vModelDynamic as J, createCommentVNode as f, vModelText as K, createTextVNode as P, toDisplayString as M, createApp as Q } from "vue";
const R = ["placeholder", "type", "onUpdate:modelValue"], W = ["onClick"], X = {
  key: 0,
  class: "tvu-login__captcha"
}, Y = ["placeholder"], Z = {
  key: 1,
  class: "tvu-login__error--tip"
}, ee = {
  key: 2,
  class: "tvu-login__button"
}, te = {
  key: 3,
  class: "tvu-login__tip"
}, oe = {
  key: 0,
  class: "tvu-login__modal"
}, g = /* @__PURE__ */ H({
  __name: "Login",
  props: {
    schema: Array,
    loginTip: Object,
    errorTip: { type: Boolean, default: !0 },
    fnCaptcha: Function,
    fnLogin: Function,
    onSuccess: { type: Function, default: () => {
    } },
    onFail: { type: Function, default: () => {
    } },
    asDialog: { type: Boolean, default: !1 },
    onClose: { type: Function },
    closeAfterSuccess: { type: Boolean, default: !1 }
  },
  setup(v) {
    const y = v, r = k(null), _ = k(null);
    let {
      schema: c,
      loginTip: w,
      fnLogin: F,
      fnCaptcha: b,
      onSuccess: N,
      onFail: x,
      errorTip: U,
      asDialog: m,
      onClose: D,
      closeAfterSuccess: q
    } = y;
    const u = B({}), h = k(), E = k([]), p = B({}), i = k();
    c == null || c.forEach((e) => {
      e.type === "captcha" ? i.value = e : (p[e.key] = e.type === "password" ? "password" : "text", E.value.push(e));
    });
    const C = () => {
      i.value && (u[i.value.key] = "", _ != null && _.value && typeof b == "function" && b().then((e) => {
        let { code: n, captcha: t } = e;
        _.value.innerHTML = n !== 0 ? "获取失败" : t;
      }));
    }, j = (e) => {
      p[e.key] = p[e.key] === "password" ? "text" : "password";
    }, z = () => {
      if (h.value = "", c && c.length) {
        if (c.map((t) => t.key).filter((t) => !u[t]).length)
          return h.value = "缺少必填信息", x({ msg: "缺少必填信息" });
        typeof F == "function" && F(u).then((t) => {
          let { code: o, msg: T } = t;
          if (o !== 0)
            return C(), h.value = T || "登录失败", x(t);
          N(t), q && V();
        });
      }
    }, V = () => {
      var e, n;
      typeof D == "function" ? D() : (n = (e = r.value.parentElement) == null ? void 0 : e.parentElement) == null || n.removeChild(r.value.parentElement);
    };
    return O(() => {
      $(() => {
        C();
      });
    }), (e, n) => {
      var t;
      return l(), s(
        L,
        null,
        [
          a(
            "div",
            {
              ref_key: "el",
              ref: r,
              class: S(["tvu-login__form", { "tvu-login__form--modal": d(m) }])
            },
            [
              (l(!0), s(
                L,
                null,
                G(E.value, (o, T) => (l(), s("div", {
                  class: "tvu-login__input",
                  key: T
                }, [
                  I(a("input", {
                    placeholder: o.placeholder,
                    type: p[o.key],
                    "onUpdate:modelValue": (A) => u[o.key] = A,
                    required: ""
                  }, null, 8, R), [
                    [J, u[o.key]]
                  ]),
                  o.type === "password" ? (l(), s("span", {
                    key: 0,
                    onClick: (A) => j(o),
                    class: S({
                      "tvu-login__password--close": p[o.key] === "password",
                      "tvu-login__password--open": p[o.key] === "text"
                    })
                  }, null, 10, W)) : f("v-if", !0)
                ]))),
                128
                /* KEYED_FRAGMENT */
              )),
              i.value ? (l(), s("div", X, [
                I(a("input", {
                  placeholder: i.value.placeholder,
                  "onUpdate:modelValue": n[0] || (n[0] = (o) => u[i.value.key] = o),
                  required: ""
                }, null, 8, Y), [
                  [K, u[i.value.key]]
                ]),
                a(
                  "div",
                  {
                    ref_key: "elCaptcha",
                    ref: _
                  },
                  null,
                  512
                  /* NEED_PATCH */
                ),
                a("button", { onClick: C })
              ])) : f("v-if", !0),
              d(U) && h.value ? (l(), s("div", Z, [
                n[1] || (n[1] = a(
                  "i",
                  null,
                  null,
                  -1
                  /* HOISTED */
                )),
                P(
                  M(h.value),
                  1
                  /* TEXT */
                )
              ])) : f("v-if", !0),
              a("div", { class: "tvu-login__button" }, [
                a("button", { onClick: z }, "登录")
              ]),
              d(m) ? (l(), s("div", ee, [
                a("button", { onClick: V }, "关闭")
              ])) : f("v-if", !0),
              d(w) ? (l(), s(
                "div",
                te,
                M((t = d(w)) == null ? void 0 : t.text),
                1
                /* TEXT */
              )) : f("v-if", !0)
            ],
            2
            /* CLASS */
          ),
          d(m) ? (l(), s("div", oe)) : f("v-if", !0)
        ],
        64
        /* STABLE_FRAGMENT */
      );
    };
  }
});
function ne(v) {
  const y = document.createElement("div");
  document.body.appendChild(y);
  let r = Q(g, {
    asDialog: !0,
    ...v,
    onClose: () => {
      r.unmount(), document.body.removeChild(y);
    }
  });
  r.mount(y);
}
function le(v) {
  v.component("tms-login", g);
}
g.install = le;
g.open = ne;
export {
  g as default
};