Files
console-dev/app/components/instance/InstanceSmsCode.vue
T
2026-11-06 00:04:38 +08:00

224 lines
7.1 KiB
Vue

<script>
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() {
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>