tms-vue3-ui
Version:
Vue3基础UI库，提供JSONSchema编辑器，支持基于JSONSchema生成表单。
227 lines (226 loc) • 7.14 kB
JavaScript
import { defineComponent as $, ref as d, reactive as G, onMounted as J, nextTick as K, openBlock as u, createElementBlock as a, Fragment as L, createElementVNode as s, normalizeClass as P, unref as m, renderList as Q, withDirectives as D, vModelDynamic as R, vModelText as N, createCommentVNode as y, createTextVNode as W, toDisplayString as V, createApp as X } from "vue";
const Y = ["placeholder", "type", "onUpdate:modelValue"], Z = {
key: 0,
class: "tvu-captcha__code"
}, ee = ["placeholder"], te = {
key: 1,
class: "tvu-sms-code__code"
}, oe = ["placeholder"], le = ["disabled"], ne = {
key: 2,
class: "tvu-sms-code__error--tip"
}, se = { class: "tvu-sms-code__button" }, ue = {
key: 3,
class: "tvu-sms-code__button"
}, ae = {
key: 4,
class: "tvu-sms-code__tip"
}, ie = {
key: 0,
class: "tvu-sms-code__modal"
}, C = /* @__PURE__ */ $({
__name: "SmsCode",
props: {
schema: Array,
actionText: { default: "验证" },
smsCodeTip: Object,
errorTip: { type: Boolean, default: !0 },
fnSendCode: Function,
fnSendSmsCode: Function,
fnVerify: Function,
onSuccess: { type: Function, default: () => {
} },
onFail: { type: Function, default: () => {
} },
asDialog: { type: Boolean, default: !1 },
onClose: { type: Function },
waitInputSmsCodeTime: { type: Number, default: 60 },
closeAfterSuccess: { type: Boolean, default: !1 }
},
setup(v) {
const _ = v, f = d(null), h = d(null), S = d(null);
let {
schema: p,
smsCodeTip: x,
fnVerify: I,
fnSendCode: A,
fnSendSmsCode: E,
onSuccess: U,
onFail: T,
errorTip: q,
asDialog: b,
onClose: M,
waitInputSmsCodeTime: H
} = _;
const n = G({}), c = d(), B = d([]), i = d(), r = d(), g = d(!1);
p == null || p.forEach((e) => {
e.type === "smscode" ? i.value = e : e.type === "captcha" ? r.value = e : B.value.push(e);
});
const j = () => {
if (c.value = "", typeof E == "function" && i.value) {
n[i.value.key] = "", g.value = !0;
let e = H, t = setInterval(() => {
e == 0 ? (clearInterval(t), g.value = !1, S.value.innerHTML = "获取短信验证码") : (S.value.innerHTML = e + "秒后重发", e--);
}, 1e3);
E(n).then((o) => {
let { code: l, msg: k } = o;
if (l !== 0)
return c.value = k || "获取短信验证码失败", T(o);
});
}
}, F = () => {
r.value && (n[r.value.key] = "", n[i.value.key] = "", h != null && h.value && typeof A == "function" && A().then((e) => {
let { code: t, captcha: o } = e;
h.value.innerHTML = t !== 0 ? "获取失败" : o;
}));
}, z = () => {
if (c.value = "", Array.isArray(p) && p.length) {
if (p.map((o) => o.key).filter((o) => !n[o]).length)
return c.value = "缺少必填信息", T({ msg: "缺少必填信息" });
typeof I == "function" && I(n).then((o) => {
let { code: l, msg: k } = o;
if (l !== 0)
return F(), c.value = k || "验证失败", T(o);
U(o), closeAfterSuccess && w();
});
}
}, w = () => {
var e, t;
typeof M == "function" ? M() : (t = (e = f.value.parentElement) == null ? void 0 : e.parentElement) == null || t.removeChild(f.value.parentElement);
};
return J(() => {
K(() => F());
}), (e, t) => {
var o;
return u(), a(
L,
null,
[
s(
"div",
{
ref_key: "el",
ref: f,
class: P(["tvu-sms-code__form", { "tvu-sms-code__form--modal": m(b) }])
},
[
(u(!0), a(
L,
null,
Q(B.value, (l, k) => (u(), a("div", {
class: "tvu-sms-code__input",
key: k
}, [
D(s("input", {
placeholder: l.placeholder,
type: l.type,
"onUpdate:modelValue": (O) => n[l.key] = O,
required: ""
}, null, 8, Y), [
[R, n[l.key]]
])
]))),
128
/* KEYED_FRAGMENT */
)),
r.value ? (u(), a("div", Z, [
D(s("input", {
placeholder: r.value.placeholder,
"onUpdate:modelValue": t[0] || (t[0] = (l) => n[r.value.key] = l),
required: ""
}, null, 8, ee), [
[N, n[r.value.key]]
]),
s(
"div",
{
ref_key: "elCaptcha",
ref: h
},
null,
512
/* NEED_PATCH */
),
s("button", {
onClick: t[1] || (t[1] = (l) => F())
})
])) : y("v-if", !0),
i.value ? (u(), a("div", te, [
D(s("input", {
placeholder: i.value.placeholder,
"onUpdate:modelValue": t[2] || (t[2] = (l) => n[i.value.key] = l),
required: ""
}, null, 8, oe), [
[N, n[i.value.key]]
]),
s("button", {
ref_key: "elSmsCode",
ref: S,
disabled: g.value,
onClick: j
}, " 获取短信验证码 ", 8, le)
])) : y("v-if", !0),
m(q) && c.value ? (u(), a("div", ne, [
t[3] || (t[3] = s(
"i",
null,
null,
-1
/* HOISTED */
)),
W(
V(c.value || "error"),
1
/* TEXT */
)
])) : y("v-if", !0),
s("div", se, [
s(
"button",
{ onClick: z },
V(v.actionText),
1
/* TEXT */
)
]),
m(b) ? (u(), a("div", ue, [
s("button", { onClick: w }, "关闭")
])) : y("v-if", !0),
m(x) ? (u(), a(
"div",
ae,
V((o = m(x)) == null ? void 0 : o.text),
1
/* TEXT */
)) : y("v-if", !0)
],
2
/* CLASS */
),
m(b) ? (u(), a("div", ie)) : y("v-if", !0)
],
64
/* STABLE_FRAGMENT */
);
};
}
});
function de(v) {
const _ = document.createElement("div");
document.body.appendChild(_);
let f = X(C, {
asDialog: !0,
...v,
onClose: () => {
f.unmount(), document.body.removeChild(_);
}
});
f.mount(_);
}
function ce(v) {
v.component("tms-sms-code", C);
}
C.install = ce;
C.open = de;
export {
C as default
};