tms-vue3-ui
Version:
Vue3基础UI库,提供JSONSchema编辑器,支持基于JSONSchema生成表单。
197 lines (196 loc) • 6.09 kB
JavaScript
import { defineComponent as H, ref as g, reactive as B, onMounted as O, nextTick as $, createElementBlock as l, openBlock as s, Fragment as L, createElementVNode as a, createCommentVNode as d, normalizeClass as S, unref as f, renderList as G, withDirectives as I, vModelDynamic as J, 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"
}, h = /* @__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 = g(null), _ = g(null);
let {
schema: c,
loginTip: w,
fnLogin: F,
fnCaptcha: b,
onSuccess: N,
onFail: x,
errorTip: U,
asDialog: m,
onClose: V,
closeAfterSuccess: q
} = y;
const u = B({}), k = g(), D = g([]), p = B({}), i = g();
c == null || c.forEach((e) => {
e.type === "captcha" ? i.value = e : (p[e.key] = e.type === "password" ? "password" : "text", D.value.push(e), e.defaultValue && typeof e.defaultValue == "string" && (u[e.key] = e.defaultValue));
});
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 (k.value = "", c && c.length) {
if (c.map((t) => t.key).filter((t) => !u[t]).length)
return k.value = "缺少必填信息", x({ msg: "缺少必填信息" });
typeof F == "function" && F(u).then((t) => {
let { code: o, msg: T } = t;
if (o !== 0)
return C(), k.value = T || "登录失败", x(t);
N(t), q && E();
});
}
}, E = () => {
var e, n;
typeof V == "function" ? V() : (n = (e = r.value.parentElement) == null ? void 0 : e.parentElement) == null || n.removeChild(r.value.parentElement);
};
return O(() => {
$(() => {
C();
});
}), (e, n) => {
var t;
return s(), l(
L,
null,
[
a(
"div",
{
ref_key: "el",
ref: r,
class: S(["tvu-login__form", { "tvu-login__form--modal": f(m) }])
},
[
(s(!0), l(
L,
null,
G(D.value, (o, T) => (s(), l("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" ? (s(), l("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)) : d("v-if", !0)
]))),
128
/* KEYED_FRAGMENT */
)),
i.value ? (s(), l("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 })
])) : d("v-if", !0),
f(U) && k.value ? (s(), l("div", Z, [
n[1] || (n[1] = a(
"i",
null,
null,
-1
/* HOISTED */
)),
P(
M(k.value),
1
/* TEXT */
)
])) : d("v-if", !0),
a("div", { class: "tvu-login__button" }, [
a("button", { onClick: z }, "登录")
]),
f(m) ? (s(), l("div", ee, [
a("button", { onClick: E }, "关闭")
])) : d("v-if", !0),
f(w) ? (s(), l(
"div",
te,
M((t = f(w)) == null ? void 0 : t.text),
1
/* TEXT */
)) : d("v-if", !0)
],
2
/* CLASS */
),
f(m) ? (s(), l("div", oe)) : d("v-if", !0)
],
64
/* STABLE_FRAGMENT */
);
};
}
});
function ne(v) {
const y = document.createElement("div");
document.body.appendChild(y);
let r = Q(h, {
asDialog: !0,
...v,
onClose: () => {
r.unmount(), document.body.removeChild(y);
}
});
r.mount(y);
}
function le(v) {
v.component("tms-login", h);
}
h.install = le;
h.open = ne;
export {
h as default
};