685 lines
26 KiB
Vue
685 lines
26 KiB
Vue
<script>
|
||
/**
|
||
* 会员中心首页:账户总览、登录提示及各业务概览面板的组合入口;问候语随本地时间更新,实名状态单独读取。
|
||
*/
|
||
import "~/assets/styles/WithdrawDialog.ks0wdKEK.css";
|
||
import "~/assets/styles/PaymentDialog.BNFKQF1U.css";
|
||
import "~/assets/styles/RechargeDialog.DpsMly4r.css";
|
||
import "~/assets/styles/HomeWalletCard.C5SHzGlJ.css";
|
||
import "~/assets/styles/HomeTicketPanel.LxPesukM.css";
|
||
import "~/assets/styles/HomeServerPanel.Do7AgMDx.css";
|
||
import "~/assets/styles/HomeReferralPanel.DsgN33ME.css";
|
||
import "~/assets/styles/HomeNoticePanel.e5-qgzAs.css";
|
||
import "~/assets/styles/HomeExpiringPanel.Ckflw2Hv.css";
|
||
import "~/assets/styles/SensitiveValue.BSZlaRHT.css";
|
||
import "~/assets/styles/pages.DytekQXu.css";
|
||
import { toDisplayString } from "vue";
|
||
import { renderList } from "vue";
|
||
import { onMounted } from "vue";
|
||
import { normalizeClass } from "vue";
|
||
import { onBeforeUnmount } from "vue";
|
||
import { createBlock } from "vue";
|
||
import { ref } from "vue";
|
||
import { withCtx } from "vue";
|
||
import { computed } 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 { NuxtLink } from "#components";
|
||
import { useApi } from "~/lib/auth.js";
|
||
import { useAuth } from "~/lib/auth.js";
|
||
import { Icon } from "#components";
|
||
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 { t as interval_t } from "~/lib/interval.js";
|
||
import skeleton from "primevue/skeleton";
|
||
import SensitiveValue from "~/components/SensitiveValue.vue";
|
||
import HomeExpiringPanel from "~/components/home/HomeExpiringPanel.vue";
|
||
import HomeNoticePanel from "~/components/home/HomeNoticePanel.vue";
|
||
import HomeReferralPanel from "~/components/home/HomeReferralPanel.vue";
|
||
import HomeServerPanel from "~/components/home/HomeServerPanel.vue";
|
||
import HomeTicketPanel from "~/components/home/HomeTicketPanel.vue";
|
||
import HomeWalletCard from "~/components/home/HomeWalletCard.vue";
|
||
// 按本地时段选择问候语,不影响服务端账户或计费时间。
|
||
function S(e) {
|
||
let t = e.getHours();
|
||
return t < 5 || t >= 22
|
||
? {
|
||
title: `夜深了`,
|
||
message: `忙碌之余,也记得早点休息。愿今晚的工作顺利收尾。`,
|
||
icon: `lucide:moon-star`,
|
||
}
|
||
: t < 11
|
||
? {
|
||
title: `早上好`,
|
||
message: `新的一天开始了,愿今天的每一份计划都顺利。`,
|
||
icon: `lucide:sunrise`,
|
||
}
|
||
: t < 14
|
||
? {
|
||
title: `中午好`,
|
||
message: `忙碌了半天,记得好好吃饭,给自己一点休息时间。`,
|
||
icon: `lucide:sun`,
|
||
}
|
||
: t < 18
|
||
? {
|
||
title: `下午好`,
|
||
message: `喝杯水,舒展一下,愿接下来的工作从容又顺利。`,
|
||
icon: `lucide:sun`,
|
||
}
|
||
: {
|
||
title: `晚上好`,
|
||
message: `辛苦一天了,愿你有个轻松的晚上。`,
|
||
icon: `lucide:sunset`,
|
||
};
|
||
}
|
||
// 把上次登录的秒级时间戳转换为可读时间;缺失或无效时展示无历史记录。
|
||
function C(e) {
|
||
let t = e?.previous_login,
|
||
n = Number(t?.time),
|
||
r = new Date(n * 1e3);
|
||
if (!Number.isFinite(n) || n <= 0 || !Number.isFinite(r.getTime()))
|
||
return {
|
||
available: !1,
|
||
time: `暂无历史记录`,
|
||
ip: `—`,
|
||
};
|
||
let i = (e) => String(e).padStart(2, `0`);
|
||
return {
|
||
available: !0,
|
||
time: `${r.getFullYear()}-${i(r.getMonth() + 1)}-${i(r.getDate())} ${i(r.getHours())}:${i(r.getMinutes())}`,
|
||
ip: typeof t?.ip == `string` && t.ip.trim() ? t.ip.trim() : `未记录`,
|
||
};
|
||
}
|
||
var w = {
|
||
class: `home-page`,
|
||
},
|
||
T = {
|
||
class: `home-grid`,
|
||
},
|
||
E = {
|
||
class: `home-card welcome-card home-welcome`,
|
||
"aria-labelledby": `welcome-title`,
|
||
},
|
||
D = {
|
||
class: `home-card-head welcome-head`,
|
||
},
|
||
O = {
|
||
class: `welcome-greeting`,
|
||
},
|
||
k = {
|
||
class: `welcome-heading`,
|
||
},
|
||
A = {
|
||
class: `welcome-icon`,
|
||
"aria-hidden": `true`,
|
||
},
|
||
j = {
|
||
id: `welcome-title`,
|
||
class: `home-card-title welcome-title`,
|
||
},
|
||
M = [`aria-label`],
|
||
N = {
|
||
key: 1,
|
||
class: `copy-id-placeholder`,
|
||
"aria-hidden": `true`,
|
||
},
|
||
P = {
|
||
class: `welcome-message`,
|
||
},
|
||
F = {
|
||
class: `welcome-meta`,
|
||
},
|
||
I = {
|
||
class: `welcome-login`,
|
||
},
|
||
L = {
|
||
key: 1,
|
||
},
|
||
R = {
|
||
class: `welcome-login`,
|
||
},
|
||
z = {
|
||
key: 1,
|
||
},
|
||
de = {
|
||
class: `home-card-body welcome-body`,
|
||
},
|
||
B = {
|
||
key: 1,
|
||
class: `tiles`,
|
||
},
|
||
V = {
|
||
key: 2,
|
||
class: `tiles`,
|
||
},
|
||
H = {
|
||
class: `tile-label`,
|
||
},
|
||
fe = {
|
||
class: `tile-value`,
|
||
},
|
||
pe = {
|
||
key: 2,
|
||
class: `tile-text`,
|
||
},
|
||
U = _plugin_vue_export_helper_t(
|
||
defineComponent({
|
||
__name: `index`,
|
||
setup(m) {
|
||
let b = useAuth(),
|
||
U = useApi(),
|
||
W = ref(!1),
|
||
G = ref(new Date()),
|
||
K = computed(() => S(G.value)),
|
||
q = computed(() => C(b.overview)),
|
||
J;
|
||
// 更新问候语使用的时间;定时与页面可见性事件共用此入口。
|
||
function Y() {
|
||
G.value = new Date();
|
||
}
|
||
// 复制账户 ID;剪贴板失败时只复位反馈,不影响账户数据。
|
||
async function me() {
|
||
if (b.overview)
|
||
try {
|
||
(await navigator.clipboard.writeText(String(b.overview.id)),
|
||
(W.value = !0));
|
||
} catch {
|
||
W.value = !1;
|
||
}
|
||
}
|
||
let X = ref(null),
|
||
Z = ref(!0),
|
||
Q = ref(``);
|
||
// 刷新账户总览;会话失效由鉴权层处理,其他失败在首页单独提示。
|
||
function $() {
|
||
((Q.value = ``),
|
||
b.fetchOverview().catch((e) => {
|
||
e?.status !== 401 &&
|
||
(Q.value = e instanceof Error ? e.message : `账户信息加载失败`);
|
||
}));
|
||
}
|
||
(onMounted(() => {
|
||
(Y(),
|
||
(J = interval_t(Y, 6e4)),
|
||
document.addEventListener(`visibilitychange`, Y),
|
||
$(),
|
||
U.get(`/certification/info`)
|
||
.then((e) => {
|
||
X.value = e;
|
||
})
|
||
.catch(() => {})
|
||
.finally(() => {
|
||
Z.value = !1;
|
||
}));
|
||
}),
|
||
onBeforeUnmount(() => {
|
||
(clearInterval(J),
|
||
document.removeEventListener(`visibilitychange`, Y));
|
||
}));
|
||
let he = computed(() => {
|
||
let e = b.overview;
|
||
if (!e) return [];
|
||
let t = [
|
||
e.phone
|
||
? {
|
||
label: `手机号`,
|
||
value: e.phone,
|
||
kind: `phone`,
|
||
prefix: `+${e.phone_code || 86}`,
|
||
}
|
||
: {
|
||
label: `手机号`,
|
||
value: `未绑定`,
|
||
action: `绑定手机`,
|
||
to: `/account?tab=phone`,
|
||
},
|
||
];
|
||
t.push(
|
||
e.email
|
||
? {
|
||
label: `邮箱`,
|
||
value: e.email,
|
||
kind: `email`,
|
||
}
|
||
: {
|
||
label: `邮箱`,
|
||
value: `未绑定`,
|
||
action: `绑定邮箱`,
|
||
to: `/account`,
|
||
},
|
||
);
|
||
let n = X.value;
|
||
return (
|
||
n
|
||
? (t.push(
|
||
n.certification_open === 0
|
||
? {
|
||
label: `实名认证`,
|
||
value: `暂未开放`,
|
||
}
|
||
: n.is_certification
|
||
? {
|
||
label: `实名认证`,
|
||
value: n.person?.card_name || `已认证`,
|
||
kind: n.person?.card_name ? `name` : void 0,
|
||
}
|
||
: n.person?.status
|
||
? {
|
||
label: `实名认证`,
|
||
value: `审核中`,
|
||
}
|
||
: {
|
||
label: `实名认证`,
|
||
value: `未认证`,
|
||
action: `去认证`,
|
||
to: `/account/realname`,
|
||
},
|
||
),
|
||
n.certification_company_open === 1
|
||
? t.push(
|
||
n.company?.status
|
||
? {
|
||
label: `组织机构认证`,
|
||
value: n.company?.company || `已认证`,
|
||
kind: n.company?.company ? `text` : void 0,
|
||
}
|
||
: {
|
||
label: `组织机构认证`,
|
||
value: `未认证`,
|
||
action: `去认证`,
|
||
to: `/account/realname`,
|
||
},
|
||
)
|
||
: t.push({
|
||
label: `组织机构认证`,
|
||
value: `暂未开放`,
|
||
}))
|
||
: t.push(
|
||
{
|
||
label: `实名认证`,
|
||
value: `暂不可用`,
|
||
loading: Z.value,
|
||
},
|
||
{
|
||
label: `组织机构认证`,
|
||
value: `暂不可用`,
|
||
loading: Z.value,
|
||
},
|
||
),
|
||
t
|
||
);
|
||
});
|
||
// 首页将账户提示和业务面板组合展示;各面板自行加载数据,不能把缺省空态当作已确认无资源。
|
||
return (n, i) => {
|
||
let o = Icon,
|
||
c = skeleton,
|
||
m = NuxtLink,
|
||
v = button,
|
||
y = message,
|
||
x = SensitiveValue,
|
||
S = HomeWalletCard,
|
||
C = HomeTicketPanel,
|
||
U = HomeServerPanel,
|
||
G = HomeExpiringPanel,
|
||
J = HomeNoticePanel,
|
||
Y = HomeReferralPanel;
|
||
return (
|
||
openBlock(),
|
||
createElementBlock(`div`, w, [
|
||
createElementVNode(`div`, T, [
|
||
createElementVNode(`section`, E, [
|
||
createElementVNode(`div`, D, [
|
||
createElementVNode(`div`, O, [
|
||
createElementVNode(`div`, k, [
|
||
createElementVNode(`span`, A, [
|
||
unref(K).icon === `lucide:moon-star`
|
||
? (openBlock(),
|
||
createBlock(o, {
|
||
key: 0,
|
||
name: `lucide:moon-star`,
|
||
}))
|
||
: unref(K).icon === `lucide:sunrise`
|
||
? (openBlock(),
|
||
createBlock(o, {
|
||
key: 1,
|
||
name: `lucide:sunrise`,
|
||
}))
|
||
: unref(K).icon === `lucide:sunset`
|
||
? (openBlock(),
|
||
createBlock(o, {
|
||
key: 2,
|
||
name: `lucide:sunset`,
|
||
}))
|
||
: (openBlock(),
|
||
createBlock(o, {
|
||
key: 3,
|
||
name: `lucide:sun`,
|
||
})),
|
||
]),
|
||
createElementVNode(`h1`, j, [
|
||
createTextVNode(
|
||
toDisplayString(unref(K).title) +
|
||
`,` +
|
||
toDisplayString(
|
||
unref(b).overview?.username || `会员`,
|
||
) +
|
||
` `,
|
||
1,
|
||
),
|
||
unref(b).overview
|
||
? (openBlock(),
|
||
createElementBlock(
|
||
`button`,
|
||
{
|
||
key: 0,
|
||
type: `button`,
|
||
class: `copy-id`,
|
||
"aria-label": unref(W)
|
||
? `用户 ID 已复制`
|
||
: `复制用户 ID`,
|
||
onClick: me,
|
||
},
|
||
[
|
||
createTextVNode(
|
||
` #` +
|
||
toDisplayString(unref(b).overview.id),
|
||
1,
|
||
),
|
||
createElementVNode(
|
||
`i`,
|
||
{
|
||
class: normalizeClass(
|
||
unref(W) ? `pi pi-check` : `pi pi-copy`,
|
||
),
|
||
"aria-hidden": `true`,
|
||
},
|
||
null,
|
||
2,
|
||
),
|
||
],
|
||
8,
|
||
M,
|
||
))
|
||
: (openBlock(), createElementBlock(`span`, N)),
|
||
]),
|
||
]),
|
||
createElementVNode(
|
||
`p`,
|
||
P,
|
||
toDisplayString(unref(K).message),
|
||
1,
|
||
),
|
||
createElementVNode(`dl`, F, [
|
||
createElementVNode(`div`, I, [
|
||
createElementVNode(`dt`, null, [
|
||
createVNode(o, {
|
||
name: `lucide:clock-3`,
|
||
"aria-hidden": `true`,
|
||
}),
|
||
(i[0] ||= createTextVNode(`上次登录`, -1)),
|
||
]),
|
||
createElementVNode(`dd`, null, [
|
||
!unref(b).overview && !unref(Q)
|
||
? (openBlock(),
|
||
createBlock(c, {
|
||
key: 0,
|
||
height: `18px`,
|
||
width: `138px`,
|
||
}))
|
||
: (openBlock(),
|
||
createElementBlock(
|
||
`span`,
|
||
L,
|
||
toDisplayString(unref(q).time),
|
||
1,
|
||
)),
|
||
]),
|
||
]),
|
||
createElementVNode(`div`, R, [
|
||
createElementVNode(`dt`, null, [
|
||
createVNode(o, {
|
||
name: `lucide:map-pin`,
|
||
"aria-hidden": `true`,
|
||
}),
|
||
(i[1] ||= createTextVNode(`IP 地址`, -1)),
|
||
]),
|
||
createElementVNode(`dd`, null, [
|
||
!unref(b).overview && !unref(Q)
|
||
? (openBlock(),
|
||
createBlock(c, {
|
||
key: 0,
|
||
height: `18px`,
|
||
width: `108px`,
|
||
}))
|
||
: (openBlock(),
|
||
createElementBlock(
|
||
`span`,
|
||
z,
|
||
toDisplayString(unref(q).ip),
|
||
1,
|
||
)),
|
||
]),
|
||
]),
|
||
]),
|
||
]),
|
||
createVNode(
|
||
m,
|
||
{
|
||
to: `/account`,
|
||
class: `home-card-more welcome-settings`,
|
||
"aria-label": `账户设置`,
|
||
title: `账户设置`,
|
||
},
|
||
{
|
||
default: withCtx(() => [
|
||
...(i[2] ||= [
|
||
createElementVNode(
|
||
`i`,
|
||
{
|
||
class: `pi pi-cog`,
|
||
"aria-hidden": `true`,
|
||
},
|
||
null,
|
||
-1,
|
||
),
|
||
]),
|
||
]),
|
||
_: 1,
|
||
},
|
||
),
|
||
]),
|
||
createElementVNode(`div`, de, [
|
||
unref(Q)
|
||
? (openBlock(),
|
||
createBlock(
|
||
y,
|
||
{
|
||
key: 0,
|
||
severity: `error`,
|
||
closable: !1,
|
||
},
|
||
{
|
||
default: withCtx(() => [
|
||
createTextVNode(toDisplayString(unref(Q)), 1),
|
||
createVNode(v, {
|
||
label: `重试`,
|
||
size: `small`,
|
||
severity: `secondary`,
|
||
text: ``,
|
||
onClick: $,
|
||
}),
|
||
]),
|
||
_: 1,
|
||
},
|
||
))
|
||
: unref(b).overview
|
||
? (openBlock(),
|
||
createElementBlock(`dl`, V, [
|
||
(openBlock(!0),
|
||
createElementBlock(
|
||
Fragment,
|
||
null,
|
||
renderList(
|
||
unref(he),
|
||
(t) => (
|
||
openBlock(),
|
||
createElementBlock(
|
||
`div`,
|
||
{
|
||
key: t.label,
|
||
class: `tile`,
|
||
},
|
||
[
|
||
createElementVNode(
|
||
`dt`,
|
||
H,
|
||
toDisplayString(t.label),
|
||
1,
|
||
),
|
||
createElementVNode(`dd`, fe, [
|
||
t.loading
|
||
? (openBlock(),
|
||
createBlock(c, {
|
||
key: 0,
|
||
width: `64px`,
|
||
height: `22px`,
|
||
}))
|
||
: t.kind
|
||
? (openBlock(),
|
||
createBlock(
|
||
x,
|
||
{
|
||
key: 1,
|
||
value: t.value,
|
||
kind: t.kind,
|
||
prefix: t.prefix,
|
||
label: t.label,
|
||
"reset-key":
|
||
unref(b).overview?.id,
|
||
},
|
||
null,
|
||
8,
|
||
[
|
||
`value`,
|
||
`kind`,
|
||
`prefix`,
|
||
`label`,
|
||
`reset-key`,
|
||
],
|
||
))
|
||
: t.action
|
||
? (openBlock(),
|
||
createBlock(
|
||
m,
|
||
{
|
||
key: 3,
|
||
to: t.to,
|
||
class: `tile-action`,
|
||
},
|
||
{
|
||
default: withCtx(() => [
|
||
createTextVNode(
|
||
toDisplayString(
|
||
t.action,
|
||
) + ` `,
|
||
1,
|
||
),
|
||
(i[3] ||=
|
||
createElementVNode(
|
||
`i`,
|
||
{
|
||
class: `pi pi-angle-right`,
|
||
"aria-hidden": `true`,
|
||
},
|
||
null,
|
||
-1,
|
||
)),
|
||
]),
|
||
_: 2,
|
||
},
|
||
1032,
|
||
[`to`],
|
||
))
|
||
: (openBlock(),
|
||
createElementBlock(
|
||
`span`,
|
||
pe,
|
||
toDisplayString(t.value),
|
||
1,
|
||
)),
|
||
]),
|
||
],
|
||
)
|
||
),
|
||
),
|
||
128,
|
||
)),
|
||
]))
|
||
: (openBlock(),
|
||
createElementBlock(`div`, B, [
|
||
(openBlock(),
|
||
createElementBlock(
|
||
Fragment,
|
||
null,
|
||
renderList(4, (e) =>
|
||
createElementVNode(
|
||
`div`,
|
||
{
|
||
key: e,
|
||
class: `tile`,
|
||
},
|
||
[
|
||
createVNode(c, {
|
||
height: `14px`,
|
||
width: `50%`,
|
||
}),
|
||
createVNode(c, {
|
||
height: `14px`,
|
||
width: `75%`,
|
||
style: {
|
||
"margin-top": `10px`,
|
||
},
|
||
}),
|
||
],
|
||
),
|
||
),
|
||
64,
|
||
)),
|
||
])),
|
||
]),
|
||
]),
|
||
createVNode(S, {
|
||
class: `home-wallet`,
|
||
}),
|
||
createVNode(C, {
|
||
class: `home-tickets`,
|
||
}),
|
||
createVNode(U, {
|
||
class: `home-servers`,
|
||
}),
|
||
createVNode(G, {
|
||
class: `home-expiring`,
|
||
}),
|
||
createVNode(J, {
|
||
class: `home-notices`,
|
||
}),
|
||
createVNode(Y),
|
||
]),
|
||
])
|
||
);
|
||
};
|
||
},
|
||
}),
|
||
[[`__scopeId`, `data-v-b43b228e`]],
|
||
);
|
||
export {};
|
||
export default U;
|
||
</script>
|