227 lines
7.5 KiB
Vue
227 lines
7.5 KiB
Vue
<script>
|
|
/** 实例敏感操作的短信验证码输入：先完成人机验证，再向当前账号发送 verify 场景验证码。 */
|
|
import "~/assets/styles/GeetestField.DiieTibK.css";
|
|
import "~/assets/styles/CaptchaField.BSN3ZbsD.css";
|
|
import "~/assets/styles/InstanceSmsCode.CsITfIEU.css";
|
|
import { toDisplayString } from "vue";
|
|
import { useId } from "vue";
|
|
import { onBeforeUnmount } from "vue";
|
|
import { mergeModels } from "vue";
|
|
import { useModel } from "vue";
|
|
import { createBlock } from "vue";
|
|
import { ref } from "vue";
|
|
import { withCtx } from "vue";
|
|
import { createCommentVNode } from "vue";
|
|
import { isRef } from "vue";
|
|
import { createElementBlock } from "vue";
|
|
import { createElementVNode } from "vue";
|
|
import { createTextVNode } from "vue";
|
|
import { unref } from "vue";
|
|
import { defineComponent } from "vue";
|
|
import { createVNode } from "vue";
|
|
import { openBlock } from "vue";
|
|
import { useApi } from "~/lib/auth.js";
|
|
import button from "primevue/button";
|
|
import { t as _plugin_vue_export_helper_t } from "~/lib/_plugin-vue_export-helper.js";
|
|
import message from "primevue/message";
|
|
import inputtext from "primevue/inputtext";
|
|
import CaptchaField from "~/components/CaptchaField.vue";
|
|
import { t as interval_t } from "~/lib/interval.js";
|
|
import { t as useCaptcha_t } from "~/lib/useCaptcha.js";
|
|
var T = {
|
|
class: `instance-code`,
|
|
},
|
|
E = [`for`],
|
|
D = {
|
|
class: `code-row`,
|
|
},
|
|
O = Object.assign(
|
|
_plugin_vue_export_helper_t(
|
|
defineComponent({
|
|
__name: `InstanceSmsCode`,
|
|
props: mergeModels(
|
|
{
|
|
disabled: {
|
|
type: Boolean,
|
|
},
|
|
},
|
|
{
|
|
modelValue: {
|
|
default: ``,
|
|
},
|
|
modelModifiers: {},
|
|
},
|
|
),
|
|
emits: [`update:modelValue`],
|
|
setup(r) {
|
|
let m = r,
|
|
y = useModel(r, `modelValue`),
|
|
O = useApi(),
|
|
k = useCaptcha_t(`verify`),
|
|
{
|
|
needed: A,
|
|
provider: j,
|
|
captchaId: M,
|
|
img: N,
|
|
value: P,
|
|
loading: F,
|
|
error: I,
|
|
} = k,
|
|
L = useId(),
|
|
R = ref(!1),
|
|
z = ref(``),
|
|
B = ref(0),
|
|
V,
|
|
H = !1;
|
|
async function U() {
|
|
// 发送成功才启动 60 秒倒计时；验证码挑战在使用后作废，失败交给统一挑战处理器更新。
|
|
if (
|
|
!(m.disabled || R.value || B.value || H) &&
|
|
((z.value = k.validationError()), !z.value)
|
|
) {
|
|
R.value = !0;
|
|
try {
|
|
if (
|
|
(await O.post(`/phone/code`, {
|
|
action: `verify`,
|
|
captcha: k.value.value.trim(),
|
|
token: k.token.value,
|
|
}),
|
|
H)
|
|
)
|
|
return;
|
|
(k.invalidate(),
|
|
(B.value = 60),
|
|
(V = interval_t(() => {
|
|
--B.value <= 0 && (clearInterval(V), (V = void 0));
|
|
}, 1e3)),
|
|
k.needed.value && k.load());
|
|
} catch (e) {
|
|
H ||
|
|
((z.value =
|
|
e instanceof Error ? e.message : `验证码发送失败`),
|
|
await k.handleError(e));
|
|
} finally {
|
|
H || (R.value = !1);
|
|
}
|
|
}
|
|
}
|
|
return (
|
|
onBeforeUnmount(() => {
|
|
// 离开实例操作时停止倒计时、废弃挑战并清空父级验证码，不能带到下一次操作。
|
|
((H = !0), clearInterval(V), k.invalidate(), (y.value = ``));
|
|
}),
|
|
(t, n) => {
|
|
let i = inputtext,
|
|
o = button,
|
|
m = CaptchaField,
|
|
_ = message;
|
|
return (
|
|
openBlock(),
|
|
createElementBlock(`div`, T, [
|
|
createElementVNode(
|
|
`label`,
|
|
{
|
|
for: `${unref(L)}-code`,
|
|
},
|
|
`账户手机验证码`,
|
|
8,
|
|
E,
|
|
),
|
|
createElementVNode(`div`, D, [
|
|
createVNode(
|
|
i,
|
|
{
|
|
id: `${unref(L)}-code`,
|
|
modelValue: y.value,
|
|
"onUpdate:modelValue": (n[0] ||= (e) => (y.value = e)),
|
|
autocomplete: `one-time-code`,
|
|
disabled: r.disabled,
|
|
},
|
|
null,
|
|
8,
|
|
[`id`, `modelValue`, `disabled`],
|
|
),
|
|
createVNode(
|
|
o,
|
|
{
|
|
label: unref(B) ? `${unref(B)}s 后重试` : `发送验证码`,
|
|
outlined: ``,
|
|
loading: unref(R),
|
|
disabled: r.disabled || unref(B) > 0,
|
|
onClick: U,
|
|
},
|
|
null,
|
|
8,
|
|
[`label`, `loading`, `disabled`],
|
|
),
|
|
]),
|
|
unref(A)
|
|
? (openBlock(),
|
|
createBlock(
|
|
m,
|
|
{
|
|
key: 0,
|
|
modelValue: unref(P),
|
|
"onUpdate:modelValue": (n[1] ||= (e) =>
|
|
isRef(P) ? (P.value = e) : null),
|
|
img: unref(N),
|
|
provider: unref(j),
|
|
"captcha-id": unref(M),
|
|
loading: unref(F),
|
|
disabled: r.disabled || unref(R),
|
|
onVerified: unref(k).complete,
|
|
onInvalid: unref(k).invalidate,
|
|
onRefresh: unref(k).load,
|
|
},
|
|
null,
|
|
8,
|
|
[
|
|
`modelValue`,
|
|
`img`,
|
|
`provider`,
|
|
`captcha-id`,
|
|
`loading`,
|
|
`disabled`,
|
|
`onVerified`,
|
|
`onInvalid`,
|
|
`onRefresh`,
|
|
],
|
|
))
|
|
: createCommentVNode(``, !0),
|
|
unref(z) || unref(I)
|
|
? (openBlock(),
|
|
createBlock(
|
|
_,
|
|
{
|
|
key: 1,
|
|
severity: `error`,
|
|
closable: !1,
|
|
},
|
|
{
|
|
default: withCtx(() => [
|
|
createTextVNode(
|
|
toDisplayString(unref(z) || unref(I)),
|
|
1,
|
|
),
|
|
]),
|
|
_: 1,
|
|
},
|
|
))
|
|
: createCommentVNode(``, !0),
|
|
])
|
|
);
|
|
}
|
|
);
|
|
},
|
|
}),
|
|
[[`__scopeId`, `data-v-741dd729`]],
|
|
),
|
|
{
|
|
__name: `InstanceSmsCode`,
|
|
},
|
|
);
|
|
export {};
|
|
export default O;
|
|
</script>
|