Files
console-dev/app/components/RechargeDialog.vue
T

256 lines
9.1 KiB
Vue

<script>
// 余额充值分为创建充值订单和渠道支付两步;支付成功事件再通知父级更新余额。
import "~/assets/styles/PaymentDialog.BNFKQF1U.css";
import "~/assets/styles/RechargeDialog.DpsMly4r.css";
import { toDisplayString } from "vue";
import { renderList } from "vue";
import { useId } from "vue";
import { normalizeClass } 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 { Fragment } 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 dialog from "primevue/dialog";
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 inputnumber from "primevue/inputnumber";
import PaymentDialog from "~/components/PaymentDialog.vue";
var E = {
class: `step`,
},
D = [`for`],
O = {
class: `recharge-options`,
},
k = [`disabled`, `aria-pressed`, `onClick`],
A = Object.assign(
_plugin_vue_export_helper_t(
defineComponent({
__name: `RechargeDialog`,
props: {
modelValue: {
type: Boolean,
default: !1,
},
modelModifiers: {},
},
emits: mergeModels([`success`], [`update:modelValue`]),
setup(i, { emit: g }) {
let S = useModel(i, `modelValue`),
A = g,
j = useApi(),
M = useId(),
N = ref(null),
P = ref(!1),
F = ref(``),
I = ref(!1),
L = ref(null),
R = ref(``);
// 创建订单后保存订单 ID 与金额,关闭金额表单并打开通用支付弹窗。
async function z() {
if (!P.value) {
if (((F.value = ``), !N.value || N.value <= 0)) {
F.value = `请输入充值金额`;
return;
}
P.value = !0;
try {
let e = await j.post(`/recharge`, {
amount: N.value,
});
((L.value = e.id),
(R.value = Number(N.value).toFixed(2)),
(N.value = null),
(S.value = !1),
(I.value = !0));
} catch (e) {
F.value = e instanceof Error ? e.message : `创建充值订单失败`;
} finally {
P.value = !1;
}
}
}
function B() {
A(`success`);
}
return (n, i) => {
let a = inputnumber,
s = message,
g = button,
y = dialog,
A = PaymentDialog;
return (
openBlock(),
createElementBlock(
Fragment,
null,
[
createVNode(
y,
{
visible: S.value,
"onUpdate:visible": (i[2] ||= (e) => (S.value = e)),
header: `充值`,
modal: ``,
draggable: !1,
style: {
width: `min(640px, calc(100vw - 28px))`,
},
},
{
footer: withCtx(() => [
createVNode(g, {
label: `取消`,
icon: `pi pi-times`,
severity: `secondary`,
outlined: ``,
onClick: (i[1] ||= (e) => (S.value = !1)),
}),
createVNode(
g,
{
label: `充值`,
icon: `pi pi-check`,
loading: unref(P),
onClick: z,
},
null,
8,
[`loading`],
),
]),
default: withCtx(() => [
createElementVNode(`div`, E, [
createElementVNode(
`label`,
{
for: `${unref(M)}-amount`,
class: `field-label`,
},
`充值金额`,
8,
D,
),
createElementVNode(`div`, O, [
(openBlock(),
createElementBlock(
Fragment,
null,
renderList([30, 50, 100, 200, 400, 800], (t) =>
createElementVNode(
`button`,
{
key: t,
type: `button`,
disabled: unref(P),
"aria-pressed": unref(N) === t,
class: normalizeClass([
`recharge-option`,
{
active: unref(N) === t,
},
]),
onClick: (e) => (N.value = t),
},
`¥ ` + toDisplayString(t),
11,
k,
),
),
64,
)),
createVNode(
a,
{
"input-id": `${unref(M)}-amount`,
modelValue: unref(N),
"onUpdate:modelValue": (i[0] ||= (e) =>
isRef(N) ? (N.value = e) : null),
disabled: unref(P),
"aria-label": `自定义充值金额`,
class: `custom-amount`,
mode: `currency`,
currency: `CNY`,
locale: `zh-CN`,
min: 0,
minFractionDigits: 2,
maxFractionDigits: 2,
placeholder: `请输入充值金额`,
fluid: ``,
},
null,
8,
[`input-id`, `modelValue`, `disabled`],
),
]),
unref(F)
? (openBlock(),
createBlock(
s,
{
key: 0,
severity: `error`,
closable: !1,
},
{
default: withCtx(() => [
createTextVNode(
toDisplayString(unref(F)),
1,
),
]),
_: 1,
},
))
: createCommentVNode(``, !0),
]),
]),
_: 1,
},
8,
[`visible`],
),
createVNode(
A,
{
modelValue: unref(I),
"onUpdate:modelValue": (i[3] ||= (e) =>
isRef(I) ? (I.value = e) : null),
"order-id": unref(L),
amount: unref(R),
onSuccess: B,
},
null,
8,
[`modelValue`, `order-id`, `amount`],
),
],
64,
)
);
};
},
}),
[[`__scopeId`, `data-v-c038cb91`]],
),
{
__name: `RechargeDialog`,
},
);
export {};
export default A;
</script>