apps-key-guard 0.0.7 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +11 -1
- package/dist/index.d.ts +11 -1
- package/dist/index.js +201 -118
- package/dist/index.mjs +175 -93
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
|
|
3
|
+
interface TimerProps {
|
|
4
|
+
className?: string;
|
|
5
|
+
style?: React.CSSProperties;
|
|
6
|
+
}
|
|
7
|
+
declare const Timer: React.FC<TimerProps>;
|
|
8
|
+
|
|
3
9
|
declare enum Level {
|
|
4
10
|
None = "none",
|
|
5
11
|
Guest = "guest",
|
|
@@ -13,6 +19,10 @@ interface LevelBenefit {
|
|
|
13
19
|
interface LevelBenefitsConfig {
|
|
14
20
|
benefits: LevelBenefit[];
|
|
15
21
|
dialogTitle?: string;
|
|
22
|
+
price?: {
|
|
23
|
+
original: Record<Level.Guest | Level.VIP | Level.SuperVIP, string>;
|
|
24
|
+
current: Record<Level.Guest | Level.VIP | Level.SuperVIP, string>;
|
|
25
|
+
};
|
|
16
26
|
}
|
|
17
27
|
interface KeyGuardProps {
|
|
18
28
|
appName: string;
|
|
@@ -31,4 +41,4 @@ interface KeyGuardProps {
|
|
|
31
41
|
}
|
|
32
42
|
declare const KeyGuard: React.FC<KeyGuardProps>;
|
|
33
43
|
|
|
34
|
-
export { KeyGuard, type KeyGuardProps, Level, type LevelBenefit, type LevelBenefitsConfig, KeyGuard as default };
|
|
44
|
+
export { KeyGuard, type KeyGuardProps, Level, type LevelBenefit, type LevelBenefitsConfig, Timer, KeyGuard as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import React, { ReactNode } from 'react';
|
|
2
2
|
|
|
3
|
+
interface TimerProps {
|
|
4
|
+
className?: string;
|
|
5
|
+
style?: React.CSSProperties;
|
|
6
|
+
}
|
|
7
|
+
declare const Timer: React.FC<TimerProps>;
|
|
8
|
+
|
|
3
9
|
declare enum Level {
|
|
4
10
|
None = "none",
|
|
5
11
|
Guest = "guest",
|
|
@@ -13,6 +19,10 @@ interface LevelBenefit {
|
|
|
13
19
|
interface LevelBenefitsConfig {
|
|
14
20
|
benefits: LevelBenefit[];
|
|
15
21
|
dialogTitle?: string;
|
|
22
|
+
price?: {
|
|
23
|
+
original: Record<Level.Guest | Level.VIP | Level.SuperVIP, string>;
|
|
24
|
+
current: Record<Level.Guest | Level.VIP | Level.SuperVIP, string>;
|
|
25
|
+
};
|
|
16
26
|
}
|
|
17
27
|
interface KeyGuardProps {
|
|
18
28
|
appName: string;
|
|
@@ -31,4 +41,4 @@ interface KeyGuardProps {
|
|
|
31
41
|
}
|
|
32
42
|
declare const KeyGuard: React.FC<KeyGuardProps>;
|
|
33
43
|
|
|
34
|
-
export { KeyGuard, type KeyGuardProps, Level, type LevelBenefit, type LevelBenefitsConfig, KeyGuard as default };
|
|
44
|
+
export { KeyGuard, type KeyGuardProps, Level, type LevelBenefit, type LevelBenefitsConfig, Timer, KeyGuard as default };
|
package/dist/index.js
CHANGED
|
@@ -32,12 +32,72 @@ var index_exports = {};
|
|
|
32
32
|
__export(index_exports, {
|
|
33
33
|
KeyGuard: () => KeyGuard,
|
|
34
34
|
Level: () => Level,
|
|
35
|
+
Timer: () => Timer_default,
|
|
35
36
|
default: () => index_default
|
|
36
37
|
});
|
|
37
38
|
module.exports = __toCommonJS(index_exports);
|
|
38
|
-
var
|
|
39
|
+
var import_react2 = require("react");
|
|
39
40
|
var import_axios = __toESM(require("axios"));
|
|
41
|
+
|
|
42
|
+
// src/Timer.tsx
|
|
43
|
+
var import_react = require("react");
|
|
40
44
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
45
|
+
var Timer = ({ className, style }) => {
|
|
46
|
+
const [timeLeft, setTimeLeft] = (0, import_react.useState)({
|
|
47
|
+
days: 0,
|
|
48
|
+
hours: 0,
|
|
49
|
+
minutes: 0,
|
|
50
|
+
seconds: 0,
|
|
51
|
+
totalSeconds: 0
|
|
52
|
+
});
|
|
53
|
+
(0, import_react.useEffect)(() => {
|
|
54
|
+
const getWeekEnd = () => {
|
|
55
|
+
const now = /* @__PURE__ */ new Date();
|
|
56
|
+
const dayOfWeek = now.getDay();
|
|
57
|
+
const daysUntilSunday = (7 - dayOfWeek) % 7 || 7;
|
|
58
|
+
const sunday = new Date(now);
|
|
59
|
+
sunday.setDate(now.getDate() + daysUntilSunday);
|
|
60
|
+
sunday.setHours(23, 59, 59, 999);
|
|
61
|
+
return sunday;
|
|
62
|
+
};
|
|
63
|
+
const calculateTimeLeft = () => {
|
|
64
|
+
const now = (/* @__PURE__ */ new Date()).getTime();
|
|
65
|
+
const target = getWeekEnd().getTime();
|
|
66
|
+
const difference = target - now;
|
|
67
|
+
if (difference > 0) {
|
|
68
|
+
const days = Math.floor(difference / (1e3 * 60 * 60 * 24));
|
|
69
|
+
const hours = Math.floor(difference % (1e3 * 60 * 60 * 24) / (1e3 * 60 * 60));
|
|
70
|
+
const minutes = Math.floor(difference % (1e3 * 60 * 60) / (1e3 * 60));
|
|
71
|
+
const seconds = Math.floor(difference % (1e3 * 60) / 1e3);
|
|
72
|
+
const totalSeconds = Math.floor(difference / 1e3);
|
|
73
|
+
setTimeLeft({ days, hours, minutes, seconds, totalSeconds });
|
|
74
|
+
} else {
|
|
75
|
+
setTimeLeft({ days: 0, hours: 0, minutes: 0, seconds: 0, totalSeconds: 0 });
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
calculateTimeLeft();
|
|
79
|
+
const timer = setInterval(calculateTimeLeft, 1e3);
|
|
80
|
+
return () => clearInterval(timer);
|
|
81
|
+
}, []);
|
|
82
|
+
const formatTime = (value) => {
|
|
83
|
+
return value.toString().padStart(2, "0");
|
|
84
|
+
};
|
|
85
|
+
const renderTimeDisplay = () => {
|
|
86
|
+
if (timeLeft.days >= 1) {
|
|
87
|
+
return `${timeLeft.days}\u5929${timeLeft.hours}\u5C0F\u65F6\u540E\u7ED3\u675F`;
|
|
88
|
+
} else {
|
|
89
|
+
return `${formatTime(timeLeft.hours)}:${formatTime(timeLeft.minutes)}:${formatTime(timeLeft.seconds)}`;
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
if (timeLeft.totalSeconds === 0) {
|
|
93
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className, style, children: "\u5DF2\u7ED3\u675F" });
|
|
94
|
+
}
|
|
95
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className, style, children: renderTimeDisplay() });
|
|
96
|
+
};
|
|
97
|
+
var Timer_default = Timer;
|
|
98
|
+
|
|
99
|
+
// src/index.tsx
|
|
100
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
41
101
|
var Level = /* @__PURE__ */ ((Level2) => {
|
|
42
102
|
Level2["None"] = "none";
|
|
43
103
|
Level2["Guest"] = "guest";
|
|
@@ -61,17 +121,17 @@ var KeyGuard = ({
|
|
|
61
121
|
allowGuestAccess = false,
|
|
62
122
|
levelBenefits
|
|
63
123
|
}) => {
|
|
64
|
-
const [isValidated, setIsValidated] = (0,
|
|
65
|
-
const [keyValue, setKeyValue] = (0,
|
|
66
|
-
const [error, setError] = (0,
|
|
67
|
-
const [loading, setLoading] = (0,
|
|
68
|
-
const [initializing, setInitializing] = (0,
|
|
69
|
-
const [userInfo, setUserInfo] = (0,
|
|
70
|
-
const [showPanel, setShowPanel] = (0,
|
|
71
|
-
const [showKey, setShowKey] = (0,
|
|
72
|
-
const [showContactDialog, setShowContactDialog] = (0,
|
|
73
|
-
const [guestButtonHover, setGuestButtonHover] = (0,
|
|
74
|
-
const [showBenefitsDialog, setShowBenefitsDialog] = (0,
|
|
124
|
+
const [isValidated, setIsValidated] = (0, import_react2.useState)(false);
|
|
125
|
+
const [keyValue, setKeyValue] = (0, import_react2.useState)("");
|
|
126
|
+
const [error, setError] = (0, import_react2.useState)("");
|
|
127
|
+
const [loading, setLoading] = (0, import_react2.useState)(false);
|
|
128
|
+
const [initializing, setInitializing] = (0, import_react2.useState)(true);
|
|
129
|
+
const [userInfo, setUserInfo] = (0, import_react2.useState)(null);
|
|
130
|
+
const [showPanel, setShowPanel] = (0, import_react2.useState)(false);
|
|
131
|
+
const [showKey, setShowKey] = (0, import_react2.useState)(false);
|
|
132
|
+
const [showContactDialog, setShowContactDialog] = (0, import_react2.useState)(false);
|
|
133
|
+
const [guestButtonHover, setGuestButtonHover] = (0, import_react2.useState)(false);
|
|
134
|
+
const [showBenefitsDialog, setShowBenefitsDialog] = (0, import_react2.useState)(false);
|
|
75
135
|
const storageKey = `${STORAGE_KEY_PREFIX}${appName}`;
|
|
76
136
|
const storageInfoKey = `${STORAGE_KEY_PREFIX}${appName}_info`;
|
|
77
137
|
const defaultLevelBenefits = {
|
|
@@ -140,7 +200,7 @@ var KeyGuard = ({
|
|
|
140
200
|
return false;
|
|
141
201
|
}
|
|
142
202
|
};
|
|
143
|
-
(0,
|
|
203
|
+
(0, import_react2.useEffect)(() => {
|
|
144
204
|
const checkStoredKey = async () => {
|
|
145
205
|
const storedKey = localStorage.getItem(storageKey);
|
|
146
206
|
const storedInfo = localStorage.getItem(storageInfoKey);
|
|
@@ -224,19 +284,19 @@ var KeyGuard = ({
|
|
|
224
284
|
}
|
|
225
285
|
};
|
|
226
286
|
if (initializing) {
|
|
227
|
-
return /* @__PURE__ */ (0,
|
|
287
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { ...defaultContainerStyle, ...customStyle }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: defaultCardStyle, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: loadingStyle, children: "\u9A8C\u8BC1\u4E2D..." }) }) });
|
|
228
288
|
}
|
|
229
289
|
if (isValidated) {
|
|
230
|
-
return /* @__PURE__ */ (0,
|
|
290
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
231
291
|
children,
|
|
232
|
-
showFloatingButton && userInfo && /* @__PURE__ */ (0,
|
|
233
|
-
/* @__PURE__ */ (0,
|
|
292
|
+
showFloatingButton && userInfo && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
293
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
234
294
|
"button",
|
|
235
295
|
{
|
|
236
296
|
onClick: () => setShowPanel(!showPanel),
|
|
237
297
|
style: floatingButtonStyle,
|
|
238
298
|
"aria-label": "\u7528\u6237\u4FE1\u606F",
|
|
239
|
-
children: /* @__PURE__ */ (0,
|
|
299
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
240
300
|
"svg",
|
|
241
301
|
{
|
|
242
302
|
width: "24",
|
|
@@ -246,19 +306,19 @@ var KeyGuard = ({
|
|
|
246
306
|
stroke: "currentColor",
|
|
247
307
|
strokeWidth: "2",
|
|
248
308
|
children: [
|
|
249
|
-
/* @__PURE__ */ (0,
|
|
250
|
-
/* @__PURE__ */ (0,
|
|
309
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" }),
|
|
310
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "7", r: "4" })
|
|
251
311
|
]
|
|
252
312
|
}
|
|
253
313
|
)
|
|
254
314
|
}
|
|
255
315
|
),
|
|
256
|
-
showPanel && /* @__PURE__ */ (0,
|
|
257
|
-
/* @__PURE__ */ (0,
|
|
258
|
-
/* @__PURE__ */ (0,
|
|
259
|
-
/* @__PURE__ */ (0,
|
|
260
|
-
/* @__PURE__ */ (0,
|
|
261
|
-
/* @__PURE__ */ (0,
|
|
316
|
+
showPanel && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
317
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: overlayStyle, onClick: handleClosePanel }),
|
|
318
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: panelStyle, children: [
|
|
319
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: panelHeaderStyle, children: [
|
|
320
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { style: panelTitleStyle, children: "\u5BC6\u94A5\u4FE1\u606F" }),
|
|
321
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
262
322
|
"button",
|
|
263
323
|
{
|
|
264
324
|
onClick: handleClosePanel,
|
|
@@ -268,16 +328,16 @@ var KeyGuard = ({
|
|
|
268
328
|
}
|
|
269
329
|
)
|
|
270
330
|
] }),
|
|
271
|
-
/* @__PURE__ */ (0,
|
|
272
|
-
/* @__PURE__ */ (0,
|
|
273
|
-
/* @__PURE__ */ (0,
|
|
274
|
-
/* @__PURE__ */ (0,
|
|
331
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: panelBodyStyle, children: [
|
|
332
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: infoItemStyle, children: [
|
|
333
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoLabelStyle, children: "\u5E94\u7528\u540D\u79F0" }),
|
|
334
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoValueStyle, children: appName })
|
|
275
335
|
] }),
|
|
276
|
-
/* @__PURE__ */ (0,
|
|
277
|
-
/* @__PURE__ */ (0,
|
|
278
|
-
/* @__PURE__ */ (0,
|
|
279
|
-
/* @__PURE__ */ (0,
|
|
280
|
-
/* @__PURE__ */ (0,
|
|
336
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: infoItemStyle, children: [
|
|
337
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoLabelStyle, children: "\u5BC6\u94A5" }),
|
|
338
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: keyDisplayContainerStyle, children: [
|
|
339
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoValueStyle, children: showKey ? userInfo.keyValue : "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }),
|
|
340
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
281
341
|
"button",
|
|
282
342
|
{
|
|
283
343
|
onClick: () => setShowKey(!showKey),
|
|
@@ -285,7 +345,7 @@ var KeyGuard = ({
|
|
|
285
345
|
"aria-label": showKey ? "\u9690\u85CF\u5BC6\u94A5" : "\u663E\u793A\u5BC6\u94A5",
|
|
286
346
|
children: showKey ? (
|
|
287
347
|
// 睁眼图标
|
|
288
|
-
/* @__PURE__ */ (0,
|
|
348
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
289
349
|
"svg",
|
|
290
350
|
{
|
|
291
351
|
width: "18",
|
|
@@ -297,14 +357,14 @@ var KeyGuard = ({
|
|
|
297
357
|
strokeLinecap: "round",
|
|
298
358
|
strokeLinejoin: "round",
|
|
299
359
|
children: [
|
|
300
|
-
/* @__PURE__ */ (0,
|
|
301
|
-
/* @__PURE__ */ (0,
|
|
360
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
|
|
361
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "12", r: "3" })
|
|
302
362
|
]
|
|
303
363
|
}
|
|
304
364
|
)
|
|
305
365
|
) : (
|
|
306
366
|
// 闭眼图标
|
|
307
|
-
/* @__PURE__ */ (0,
|
|
367
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
308
368
|
"svg",
|
|
309
369
|
{
|
|
310
370
|
width: "18",
|
|
@@ -316,8 +376,8 @@ var KeyGuard = ({
|
|
|
316
376
|
strokeLinecap: "round",
|
|
317
377
|
strokeLinejoin: "round",
|
|
318
378
|
children: [
|
|
319
|
-
/* @__PURE__ */ (0,
|
|
320
|
-
/* @__PURE__ */ (0,
|
|
379
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
|
|
380
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
|
|
321
381
|
]
|
|
322
382
|
}
|
|
323
383
|
)
|
|
@@ -326,11 +386,11 @@ var KeyGuard = ({
|
|
|
326
386
|
)
|
|
327
387
|
] })
|
|
328
388
|
] }),
|
|
329
|
-
/* @__PURE__ */ (0,
|
|
330
|
-
/* @__PURE__ */ (0,
|
|
331
|
-
/* @__PURE__ */ (0,
|
|
332
|
-
/* @__PURE__ */ (0,
|
|
333
|
-
/* @__PURE__ */ (0,
|
|
389
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: infoItemStyle, children: [
|
|
390
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoLabelStyle, children: "\u7B49\u7EA7" }),
|
|
391
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: levelDisplayContainerStyle, children: [
|
|
392
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: levelBadgeStyle(userInfo.level), children: formatLevel(userInfo.level) }),
|
|
393
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
334
394
|
"button",
|
|
335
395
|
{
|
|
336
396
|
onClick: () => setShowBenefitsDialog(true),
|
|
@@ -341,13 +401,13 @@ var KeyGuard = ({
|
|
|
341
401
|
)
|
|
342
402
|
] })
|
|
343
403
|
] }),
|
|
344
|
-
/* @__PURE__ */ (0,
|
|
345
|
-
/* @__PURE__ */ (0,
|
|
346
|
-
/* @__PURE__ */ (0,
|
|
404
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: infoItemStyle, children: [
|
|
405
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoLabelStyle, children: "\u8FC7\u671F\u65F6\u95F4" }),
|
|
406
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: infoValueStyle, children: formatExpiresAt(userInfo.expiresAt) })
|
|
347
407
|
] })
|
|
348
408
|
] }),
|
|
349
|
-
/* @__PURE__ */ (0,
|
|
350
|
-
/* @__PURE__ */ (0,
|
|
409
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: panelFooterStyle, children: [
|
|
410
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
351
411
|
"button",
|
|
352
412
|
{
|
|
353
413
|
onClick: () => setShowContactDialog(true),
|
|
@@ -355,22 +415,22 @@ var KeyGuard = ({
|
|
|
355
415
|
children: "\u8054\u7CFB\u4F5C\u8005\u5347\u7EA7"
|
|
356
416
|
}
|
|
357
417
|
),
|
|
358
|
-
/* @__PURE__ */ (0,
|
|
418
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { onClick: handleLogout, style: logoutButtonStyle, children: "\u9000\u51FA\u767B\u5F55" })
|
|
359
419
|
] })
|
|
360
420
|
] })
|
|
361
421
|
] }),
|
|
362
|
-
showContactDialog && /* @__PURE__ */ (0,
|
|
363
|
-
/* @__PURE__ */ (0,
|
|
422
|
+
showContactDialog && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
423
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
364
424
|
"div",
|
|
365
425
|
{
|
|
366
426
|
style: overlayStyle,
|
|
367
427
|
onClick: () => setShowContactDialog(false)
|
|
368
428
|
}
|
|
369
429
|
),
|
|
370
|
-
/* @__PURE__ */ (0,
|
|
371
|
-
/* @__PURE__ */ (0,
|
|
372
|
-
/* @__PURE__ */ (0,
|
|
373
|
-
/* @__PURE__ */ (0,
|
|
430
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: contactDialogStyle, children: [
|
|
431
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: panelHeaderStyle, children: [
|
|
432
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { style: panelTitleStyle, children: "\u8054\u7CFB\u4F5C\u8005" }),
|
|
433
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
374
434
|
"button",
|
|
375
435
|
{
|
|
376
436
|
onClick: () => setShowContactDialog(false),
|
|
@@ -380,11 +440,11 @@ var KeyGuard = ({
|
|
|
380
440
|
}
|
|
381
441
|
)
|
|
382
442
|
] }),
|
|
383
|
-
/* @__PURE__ */ (0,
|
|
384
|
-
/* @__PURE__ */ (0,
|
|
385
|
-
/* @__PURE__ */ (0,
|
|
386
|
-
/* @__PURE__ */ (0,
|
|
387
|
-
/* @__PURE__ */ (0,
|
|
443
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: contactDialogBodyStyle, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: contactInfoStyle, children: [
|
|
444
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: wechatInfoStyle, children: [
|
|
445
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: wechatLabelStyle, children: "\u5FAE\u4FE1\u53F7\uFF1A" }),
|
|
446
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: wechatValueStyle, children: authorWechat }),
|
|
447
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
388
448
|
"button",
|
|
389
449
|
{
|
|
390
450
|
onClick: () => {
|
|
@@ -400,9 +460,9 @@ var KeyGuard = ({
|
|
|
400
460
|
}
|
|
401
461
|
)
|
|
402
462
|
] }),
|
|
403
|
-
/* @__PURE__ */ (0,
|
|
404
|
-
/* @__PURE__ */ (0,
|
|
405
|
-
/* @__PURE__ */ (0,
|
|
463
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: qrCodeContainerStyle, children: [
|
|
464
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: qrCodeLabelStyle, children: "\u626B\u7801\u6DFB\u52A0\u5FAE\u4FE1" }),
|
|
465
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: qrCodePlaceholderStyle, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
406
466
|
"img",
|
|
407
467
|
{
|
|
408
468
|
src: authorQrCode,
|
|
@@ -418,18 +478,18 @@ var KeyGuard = ({
|
|
|
418
478
|
] }) })
|
|
419
479
|
] })
|
|
420
480
|
] }),
|
|
421
|
-
showBenefitsDialog && /* @__PURE__ */ (0,
|
|
422
|
-
/* @__PURE__ */ (0,
|
|
481
|
+
showBenefitsDialog && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
482
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
423
483
|
"div",
|
|
424
484
|
{
|
|
425
485
|
style: overlayStyle,
|
|
426
486
|
onClick: () => setShowBenefitsDialog(false)
|
|
427
487
|
}
|
|
428
488
|
),
|
|
429
|
-
/* @__PURE__ */ (0,
|
|
430
|
-
/* @__PURE__ */ (0,
|
|
431
|
-
/* @__PURE__ */ (0,
|
|
432
|
-
/* @__PURE__ */ (0,
|
|
489
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: benefitsDialogStyle, children: [
|
|
490
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: panelHeaderStyle, children: [
|
|
491
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { style: panelTitleStyle, children: finalLevelBenefits.dialogTitle || "\u7B49\u7EA7\u6743\u76CA\u5BF9\u6BD4" }),
|
|
492
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
433
493
|
"button",
|
|
434
494
|
{
|
|
435
495
|
onClick: () => setShowBenefitsDialog(false),
|
|
@@ -439,56 +499,78 @@ var KeyGuard = ({
|
|
|
439
499
|
}
|
|
440
500
|
)
|
|
441
501
|
] }),
|
|
442
|
-
/* @__PURE__ */ (0,
|
|
443
|
-
/* @__PURE__ */ (0,
|
|
444
|
-
/* @__PURE__ */ (0,
|
|
445
|
-
/* @__PURE__ */ (0,
|
|
446
|
-
/* @__PURE__ */ (0,
|
|
447
|
-
/* @__PURE__ */ (0,
|
|
502
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: benefitsDialogBodyStyle, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: benefitsTableContainerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("table", { style: benefitsTableStyle, children: [
|
|
503
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tr", { children: [
|
|
504
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { style: benefitsTableHeaderStyle, children: "\u6743\u76CA" }),
|
|
505
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("guest" /* Guest */) }),
|
|
506
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("vip" /* VIP */) }),
|
|
507
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("super_vip" /* SuperVIP */) })
|
|
448
508
|
] }) }),
|
|
449
|
-
/* @__PURE__ */ (0,
|
|
450
|
-
/* @__PURE__ */ (0,
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
textAlign: "center"
|
|
467
|
-
},
|
|
468
|
-
dangerouslySetInnerHTML: { __html: benefit.values["vip" /* VIP */] }
|
|
469
|
-
}
|
|
470
|
-
),
|
|
471
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
472
|
-
"td",
|
|
473
|
-
{
|
|
474
|
-
style: {
|
|
475
|
-
...benefitsTableCellStyle,
|
|
476
|
-
textAlign: "center"
|
|
509
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tbody", { children: [
|
|
510
|
+
finalLevelBenefits.price && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tr", { children: [
|
|
511
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("td", { style: benefitsTableCellStyle, children: [
|
|
512
|
+
"\u4EF7\u683C(\u9650\u65F6\u7279\u60E0)",
|
|
513
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Timer_default, {})
|
|
514
|
+
] }),
|
|
515
|
+
(Object.keys(finalLevelBenefits.price.original || {}) || []).map((key) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
516
|
+
"td",
|
|
517
|
+
{
|
|
518
|
+
style: {
|
|
519
|
+
...benefitsTableCellStyle,
|
|
520
|
+
textAlign: "center"
|
|
521
|
+
},
|
|
522
|
+
children: [
|
|
523
|
+
finalLevelBenefits.price?.original[key] && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { textDecoration: "line-through" }, children: finalLevelBenefits.price?.original[key] }),
|
|
524
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: finalLevelBenefits.price?.original[key] ? { color: "red", fontWeight: "bold", fontSize: "16px" } : {}, children: finalLevelBenefits.price?.current[key] })
|
|
525
|
+
]
|
|
477
526
|
},
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
)
|
|
481
|
-
|
|
527
|
+
key
|
|
528
|
+
))
|
|
529
|
+
] }),
|
|
530
|
+
finalLevelBenefits.benefits.map((benefit, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tr", { children: [
|
|
531
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("td", { style: benefitsTableCellStyle, children: benefit.name }),
|
|
532
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
533
|
+
"td",
|
|
534
|
+
{
|
|
535
|
+
style: {
|
|
536
|
+
...benefitsTableCellStyle,
|
|
537
|
+
textAlign: "center"
|
|
538
|
+
},
|
|
539
|
+
dangerouslySetInnerHTML: { __html: benefit.values["guest" /* Guest */] }
|
|
540
|
+
}
|
|
541
|
+
),
|
|
542
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
543
|
+
"td",
|
|
544
|
+
{
|
|
545
|
+
style: {
|
|
546
|
+
...benefitsTableCellStyle,
|
|
547
|
+
textAlign: "center"
|
|
548
|
+
},
|
|
549
|
+
dangerouslySetInnerHTML: { __html: benefit.values["vip" /* VIP */] }
|
|
550
|
+
}
|
|
551
|
+
),
|
|
552
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
553
|
+
"td",
|
|
554
|
+
{
|
|
555
|
+
style: {
|
|
556
|
+
...benefitsTableCellStyle,
|
|
557
|
+
textAlign: "center"
|
|
558
|
+
},
|
|
559
|
+
dangerouslySetInnerHTML: { __html: benefit.values["super_vip" /* SuperVIP */] }
|
|
560
|
+
}
|
|
561
|
+
)
|
|
562
|
+
] }, index))
|
|
563
|
+
] })
|
|
482
564
|
] }) }) })
|
|
483
565
|
] })
|
|
484
566
|
] })
|
|
485
567
|
] })
|
|
486
568
|
] });
|
|
487
569
|
}
|
|
488
|
-
return /* @__PURE__ */ (0,
|
|
489
|
-
/* @__PURE__ */ (0,
|
|
490
|
-
/* @__PURE__ */ (0,
|
|
491
|
-
/* @__PURE__ */ (0,
|
|
570
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { ...defaultContainerStyle, ...customStyle }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: defaultCardStyle, children: [
|
|
571
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h2", { style: titleStyle, children: title }),
|
|
572
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("form", { onSubmit: handleSubmit, style: formStyle, children: [
|
|
573
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
492
574
|
"input",
|
|
493
575
|
{
|
|
494
576
|
type: "text",
|
|
@@ -499,10 +581,10 @@ var KeyGuard = ({
|
|
|
499
581
|
disabled: loading
|
|
500
582
|
}
|
|
501
583
|
),
|
|
502
|
-
error && /* @__PURE__ */ (0,
|
|
503
|
-
/* @__PURE__ */ (0,
|
|
584
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: errorStyle, children: error }),
|
|
585
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { type: "submit", style: buttonStyle, disabled: loading, children: loading ? "\u9A8C\u8BC1\u4E2D..." : buttonText })
|
|
504
586
|
] }),
|
|
505
|
-
allowGuestAccess && /* @__PURE__ */ (0,
|
|
587
|
+
allowGuestAccess && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: guestAccessContainerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
506
588
|
"button",
|
|
507
589
|
{
|
|
508
590
|
type: "button",
|
|
@@ -887,5 +969,6 @@ var index_default = KeyGuard;
|
|
|
887
969
|
// Annotate the CommonJS export names for ESM import in node:
|
|
888
970
|
0 && (module.exports = {
|
|
889
971
|
KeyGuard,
|
|
890
|
-
Level
|
|
972
|
+
Level,
|
|
973
|
+
Timer
|
|
891
974
|
});
|
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,66 @@
|
|
|
1
1
|
// src/index.tsx
|
|
2
|
-
import { useState, useEffect } from "react";
|
|
2
|
+
import { useState as useState2, useEffect as useEffect2 } from "react";
|
|
3
3
|
import axios from "axios";
|
|
4
|
-
|
|
4
|
+
|
|
5
|
+
// src/Timer.tsx
|
|
6
|
+
import { useState, useEffect } from "react";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
var Timer = ({ className, style }) => {
|
|
9
|
+
const [timeLeft, setTimeLeft] = useState({
|
|
10
|
+
days: 0,
|
|
11
|
+
hours: 0,
|
|
12
|
+
minutes: 0,
|
|
13
|
+
seconds: 0,
|
|
14
|
+
totalSeconds: 0
|
|
15
|
+
});
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
const getWeekEnd = () => {
|
|
18
|
+
const now = /* @__PURE__ */ new Date();
|
|
19
|
+
const dayOfWeek = now.getDay();
|
|
20
|
+
const daysUntilSunday = (7 - dayOfWeek) % 7 || 7;
|
|
21
|
+
const sunday = new Date(now);
|
|
22
|
+
sunday.setDate(now.getDate() + daysUntilSunday);
|
|
23
|
+
sunday.setHours(23, 59, 59, 999);
|
|
24
|
+
return sunday;
|
|
25
|
+
};
|
|
26
|
+
const calculateTimeLeft = () => {
|
|
27
|
+
const now = (/* @__PURE__ */ new Date()).getTime();
|
|
28
|
+
const target = getWeekEnd().getTime();
|
|
29
|
+
const difference = target - now;
|
|
30
|
+
if (difference > 0) {
|
|
31
|
+
const days = Math.floor(difference / (1e3 * 60 * 60 * 24));
|
|
32
|
+
const hours = Math.floor(difference % (1e3 * 60 * 60 * 24) / (1e3 * 60 * 60));
|
|
33
|
+
const minutes = Math.floor(difference % (1e3 * 60 * 60) / (1e3 * 60));
|
|
34
|
+
const seconds = Math.floor(difference % (1e3 * 60) / 1e3);
|
|
35
|
+
const totalSeconds = Math.floor(difference / 1e3);
|
|
36
|
+
setTimeLeft({ days, hours, minutes, seconds, totalSeconds });
|
|
37
|
+
} else {
|
|
38
|
+
setTimeLeft({ days: 0, hours: 0, minutes: 0, seconds: 0, totalSeconds: 0 });
|
|
39
|
+
}
|
|
40
|
+
};
|
|
41
|
+
calculateTimeLeft();
|
|
42
|
+
const timer = setInterval(calculateTimeLeft, 1e3);
|
|
43
|
+
return () => clearInterval(timer);
|
|
44
|
+
}, []);
|
|
45
|
+
const formatTime = (value) => {
|
|
46
|
+
return value.toString().padStart(2, "0");
|
|
47
|
+
};
|
|
48
|
+
const renderTimeDisplay = () => {
|
|
49
|
+
if (timeLeft.days >= 1) {
|
|
50
|
+
return `${timeLeft.days}\u5929${timeLeft.hours}\u5C0F\u65F6\u540E\u7ED3\u675F`;
|
|
51
|
+
} else {
|
|
52
|
+
return `${formatTime(timeLeft.hours)}:${formatTime(timeLeft.minutes)}:${formatTime(timeLeft.seconds)}`;
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
if (timeLeft.totalSeconds === 0) {
|
|
56
|
+
return /* @__PURE__ */ jsx("div", { className, style, children: "\u5DF2\u7ED3\u675F" });
|
|
57
|
+
}
|
|
58
|
+
return /* @__PURE__ */ jsx("div", { className, style, children: renderTimeDisplay() });
|
|
59
|
+
};
|
|
60
|
+
var Timer_default = Timer;
|
|
61
|
+
|
|
62
|
+
// src/index.tsx
|
|
63
|
+
import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
5
64
|
var Level = /* @__PURE__ */ ((Level2) => {
|
|
6
65
|
Level2["None"] = "none";
|
|
7
66
|
Level2["Guest"] = "guest";
|
|
@@ -25,17 +84,17 @@ var KeyGuard = ({
|
|
|
25
84
|
allowGuestAccess = false,
|
|
26
85
|
levelBenefits
|
|
27
86
|
}) => {
|
|
28
|
-
const [isValidated, setIsValidated] =
|
|
29
|
-
const [keyValue, setKeyValue] =
|
|
30
|
-
const [error, setError] =
|
|
31
|
-
const [loading, setLoading] =
|
|
32
|
-
const [initializing, setInitializing] =
|
|
33
|
-
const [userInfo, setUserInfo] =
|
|
34
|
-
const [showPanel, setShowPanel] =
|
|
35
|
-
const [showKey, setShowKey] =
|
|
36
|
-
const [showContactDialog, setShowContactDialog] =
|
|
37
|
-
const [guestButtonHover, setGuestButtonHover] =
|
|
38
|
-
const [showBenefitsDialog, setShowBenefitsDialog] =
|
|
87
|
+
const [isValidated, setIsValidated] = useState2(false);
|
|
88
|
+
const [keyValue, setKeyValue] = useState2("");
|
|
89
|
+
const [error, setError] = useState2("");
|
|
90
|
+
const [loading, setLoading] = useState2(false);
|
|
91
|
+
const [initializing, setInitializing] = useState2(true);
|
|
92
|
+
const [userInfo, setUserInfo] = useState2(null);
|
|
93
|
+
const [showPanel, setShowPanel] = useState2(false);
|
|
94
|
+
const [showKey, setShowKey] = useState2(false);
|
|
95
|
+
const [showContactDialog, setShowContactDialog] = useState2(false);
|
|
96
|
+
const [guestButtonHover, setGuestButtonHover] = useState2(false);
|
|
97
|
+
const [showBenefitsDialog, setShowBenefitsDialog] = useState2(false);
|
|
39
98
|
const storageKey = `${STORAGE_KEY_PREFIX}${appName}`;
|
|
40
99
|
const storageInfoKey = `${STORAGE_KEY_PREFIX}${appName}_info`;
|
|
41
100
|
const defaultLevelBenefits = {
|
|
@@ -104,7 +163,7 @@ var KeyGuard = ({
|
|
|
104
163
|
return false;
|
|
105
164
|
}
|
|
106
165
|
};
|
|
107
|
-
|
|
166
|
+
useEffect2(() => {
|
|
108
167
|
const checkStoredKey = async () => {
|
|
109
168
|
const storedKey = localStorage.getItem(storageKey);
|
|
110
169
|
const storedInfo = localStorage.getItem(storageInfoKey);
|
|
@@ -188,13 +247,13 @@ var KeyGuard = ({
|
|
|
188
247
|
}
|
|
189
248
|
};
|
|
190
249
|
if (initializing) {
|
|
191
|
-
return /* @__PURE__ */
|
|
250
|
+
return /* @__PURE__ */ jsx2("div", { style: { ...defaultContainerStyle, ...customStyle }, children: /* @__PURE__ */ jsx2("div", { style: defaultCardStyle, children: /* @__PURE__ */ jsx2("div", { style: loadingStyle, children: "\u9A8C\u8BC1\u4E2D..." }) }) });
|
|
192
251
|
}
|
|
193
252
|
if (isValidated) {
|
|
194
253
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
195
254
|
children,
|
|
196
255
|
showFloatingButton && userInfo && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
197
|
-
/* @__PURE__ */
|
|
256
|
+
/* @__PURE__ */ jsx2(
|
|
198
257
|
"button",
|
|
199
258
|
{
|
|
200
259
|
onClick: () => setShowPanel(!showPanel),
|
|
@@ -210,19 +269,19 @@ var KeyGuard = ({
|
|
|
210
269
|
stroke: "currentColor",
|
|
211
270
|
strokeWidth: "2",
|
|
212
271
|
children: [
|
|
213
|
-
/* @__PURE__ */
|
|
214
|
-
/* @__PURE__ */
|
|
272
|
+
/* @__PURE__ */ jsx2("path", { d: "M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" }),
|
|
273
|
+
/* @__PURE__ */ jsx2("circle", { cx: "12", cy: "7", r: "4" })
|
|
215
274
|
]
|
|
216
275
|
}
|
|
217
276
|
)
|
|
218
277
|
}
|
|
219
278
|
),
|
|
220
279
|
showPanel && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
221
|
-
/* @__PURE__ */
|
|
280
|
+
/* @__PURE__ */ jsx2("div", { style: overlayStyle, onClick: handleClosePanel }),
|
|
222
281
|
/* @__PURE__ */ jsxs("div", { style: panelStyle, children: [
|
|
223
282
|
/* @__PURE__ */ jsxs("div", { style: panelHeaderStyle, children: [
|
|
224
|
-
/* @__PURE__ */
|
|
225
|
-
/* @__PURE__ */
|
|
283
|
+
/* @__PURE__ */ jsx2("h3", { style: panelTitleStyle, children: "\u5BC6\u94A5\u4FE1\u606F" }),
|
|
284
|
+
/* @__PURE__ */ jsx2(
|
|
226
285
|
"button",
|
|
227
286
|
{
|
|
228
287
|
onClick: handleClosePanel,
|
|
@@ -234,14 +293,14 @@ var KeyGuard = ({
|
|
|
234
293
|
] }),
|
|
235
294
|
/* @__PURE__ */ jsxs("div", { style: panelBodyStyle, children: [
|
|
236
295
|
/* @__PURE__ */ jsxs("div", { style: infoItemStyle, children: [
|
|
237
|
-
/* @__PURE__ */
|
|
238
|
-
/* @__PURE__ */
|
|
296
|
+
/* @__PURE__ */ jsx2("span", { style: infoLabelStyle, children: "\u5E94\u7528\u540D\u79F0" }),
|
|
297
|
+
/* @__PURE__ */ jsx2("span", { style: infoValueStyle, children: appName })
|
|
239
298
|
] }),
|
|
240
299
|
/* @__PURE__ */ jsxs("div", { style: infoItemStyle, children: [
|
|
241
|
-
/* @__PURE__ */
|
|
300
|
+
/* @__PURE__ */ jsx2("span", { style: infoLabelStyle, children: "\u5BC6\u94A5" }),
|
|
242
301
|
/* @__PURE__ */ jsxs("div", { style: keyDisplayContainerStyle, children: [
|
|
243
|
-
/* @__PURE__ */
|
|
244
|
-
/* @__PURE__ */
|
|
302
|
+
/* @__PURE__ */ jsx2("span", { style: infoValueStyle, children: showKey ? userInfo.keyValue : "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022" }),
|
|
303
|
+
/* @__PURE__ */ jsx2(
|
|
245
304
|
"button",
|
|
246
305
|
{
|
|
247
306
|
onClick: () => setShowKey(!showKey),
|
|
@@ -261,8 +320,8 @@ var KeyGuard = ({
|
|
|
261
320
|
strokeLinecap: "round",
|
|
262
321
|
strokeLinejoin: "round",
|
|
263
322
|
children: [
|
|
264
|
-
/* @__PURE__ */
|
|
265
|
-
/* @__PURE__ */
|
|
323
|
+
/* @__PURE__ */ jsx2("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
|
|
324
|
+
/* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "3" })
|
|
266
325
|
]
|
|
267
326
|
}
|
|
268
327
|
)
|
|
@@ -280,8 +339,8 @@ var KeyGuard = ({
|
|
|
280
339
|
strokeLinecap: "round",
|
|
281
340
|
strokeLinejoin: "round",
|
|
282
341
|
children: [
|
|
283
|
-
/* @__PURE__ */
|
|
284
|
-
/* @__PURE__ */
|
|
342
|
+
/* @__PURE__ */ jsx2("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
|
|
343
|
+
/* @__PURE__ */ jsx2("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
|
|
285
344
|
]
|
|
286
345
|
}
|
|
287
346
|
)
|
|
@@ -291,10 +350,10 @@ var KeyGuard = ({
|
|
|
291
350
|
] })
|
|
292
351
|
] }),
|
|
293
352
|
/* @__PURE__ */ jsxs("div", { style: infoItemStyle, children: [
|
|
294
|
-
/* @__PURE__ */
|
|
353
|
+
/* @__PURE__ */ jsx2("span", { style: infoLabelStyle, children: "\u7B49\u7EA7" }),
|
|
295
354
|
/* @__PURE__ */ jsxs("div", { style: levelDisplayContainerStyle, children: [
|
|
296
|
-
/* @__PURE__ */
|
|
297
|
-
/* @__PURE__ */
|
|
355
|
+
/* @__PURE__ */ jsx2("span", { style: levelBadgeStyle(userInfo.level), children: formatLevel(userInfo.level) }),
|
|
356
|
+
/* @__PURE__ */ jsx2(
|
|
298
357
|
"button",
|
|
299
358
|
{
|
|
300
359
|
onClick: () => setShowBenefitsDialog(true),
|
|
@@ -306,12 +365,12 @@ var KeyGuard = ({
|
|
|
306
365
|
] })
|
|
307
366
|
] }),
|
|
308
367
|
/* @__PURE__ */ jsxs("div", { style: infoItemStyle, children: [
|
|
309
|
-
/* @__PURE__ */
|
|
310
|
-
/* @__PURE__ */
|
|
368
|
+
/* @__PURE__ */ jsx2("span", { style: infoLabelStyle, children: "\u8FC7\u671F\u65F6\u95F4" }),
|
|
369
|
+
/* @__PURE__ */ jsx2("span", { style: infoValueStyle, children: formatExpiresAt(userInfo.expiresAt) })
|
|
311
370
|
] })
|
|
312
371
|
] }),
|
|
313
372
|
/* @__PURE__ */ jsxs("div", { style: panelFooterStyle, children: [
|
|
314
|
-
/* @__PURE__ */
|
|
373
|
+
/* @__PURE__ */ jsx2(
|
|
315
374
|
"button",
|
|
316
375
|
{
|
|
317
376
|
onClick: () => setShowContactDialog(true),
|
|
@@ -319,12 +378,12 @@ var KeyGuard = ({
|
|
|
319
378
|
children: "\u8054\u7CFB\u4F5C\u8005\u5347\u7EA7"
|
|
320
379
|
}
|
|
321
380
|
),
|
|
322
|
-
/* @__PURE__ */
|
|
381
|
+
/* @__PURE__ */ jsx2("button", { onClick: handleLogout, style: logoutButtonStyle, children: "\u9000\u51FA\u767B\u5F55" })
|
|
323
382
|
] })
|
|
324
383
|
] })
|
|
325
384
|
] }),
|
|
326
385
|
showContactDialog && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
327
|
-
/* @__PURE__ */
|
|
386
|
+
/* @__PURE__ */ jsx2(
|
|
328
387
|
"div",
|
|
329
388
|
{
|
|
330
389
|
style: overlayStyle,
|
|
@@ -333,8 +392,8 @@ var KeyGuard = ({
|
|
|
333
392
|
),
|
|
334
393
|
/* @__PURE__ */ jsxs("div", { style: contactDialogStyle, children: [
|
|
335
394
|
/* @__PURE__ */ jsxs("div", { style: panelHeaderStyle, children: [
|
|
336
|
-
/* @__PURE__ */
|
|
337
|
-
/* @__PURE__ */
|
|
395
|
+
/* @__PURE__ */ jsx2("h3", { style: panelTitleStyle, children: "\u8054\u7CFB\u4F5C\u8005" }),
|
|
396
|
+
/* @__PURE__ */ jsx2(
|
|
338
397
|
"button",
|
|
339
398
|
{
|
|
340
399
|
onClick: () => setShowContactDialog(false),
|
|
@@ -344,11 +403,11 @@ var KeyGuard = ({
|
|
|
344
403
|
}
|
|
345
404
|
)
|
|
346
405
|
] }),
|
|
347
|
-
/* @__PURE__ */
|
|
406
|
+
/* @__PURE__ */ jsx2("div", { style: contactDialogBodyStyle, children: /* @__PURE__ */ jsxs("div", { style: contactInfoStyle, children: [
|
|
348
407
|
/* @__PURE__ */ jsxs("div", { style: wechatInfoStyle, children: [
|
|
349
|
-
/* @__PURE__ */
|
|
350
|
-
/* @__PURE__ */
|
|
351
|
-
/* @__PURE__ */
|
|
408
|
+
/* @__PURE__ */ jsx2("span", { style: wechatLabelStyle, children: "\u5FAE\u4FE1\u53F7\uFF1A" }),
|
|
409
|
+
/* @__PURE__ */ jsx2("span", { style: wechatValueStyle, children: authorWechat }),
|
|
410
|
+
/* @__PURE__ */ jsx2(
|
|
352
411
|
"button",
|
|
353
412
|
{
|
|
354
413
|
onClick: () => {
|
|
@@ -365,8 +424,8 @@ var KeyGuard = ({
|
|
|
365
424
|
)
|
|
366
425
|
] }),
|
|
367
426
|
/* @__PURE__ */ jsxs("div", { style: qrCodeContainerStyle, children: [
|
|
368
|
-
/* @__PURE__ */
|
|
369
|
-
/* @__PURE__ */
|
|
427
|
+
/* @__PURE__ */ jsx2("div", { style: qrCodeLabelStyle, children: "\u626B\u7801\u6DFB\u52A0\u5FAE\u4FE1" }),
|
|
428
|
+
/* @__PURE__ */ jsx2("div", { style: qrCodePlaceholderStyle, children: /* @__PURE__ */ jsx2(
|
|
370
429
|
"img",
|
|
371
430
|
{
|
|
372
431
|
src: authorQrCode,
|
|
@@ -383,7 +442,7 @@ var KeyGuard = ({
|
|
|
383
442
|
] })
|
|
384
443
|
] }),
|
|
385
444
|
showBenefitsDialog && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
386
|
-
/* @__PURE__ */
|
|
445
|
+
/* @__PURE__ */ jsx2(
|
|
387
446
|
"div",
|
|
388
447
|
{
|
|
389
448
|
style: overlayStyle,
|
|
@@ -392,8 +451,8 @@ var KeyGuard = ({
|
|
|
392
451
|
),
|
|
393
452
|
/* @__PURE__ */ jsxs("div", { style: benefitsDialogStyle, children: [
|
|
394
453
|
/* @__PURE__ */ jsxs("div", { style: panelHeaderStyle, children: [
|
|
395
|
-
/* @__PURE__ */
|
|
396
|
-
/* @__PURE__ */
|
|
454
|
+
/* @__PURE__ */ jsx2("h3", { style: panelTitleStyle, children: finalLevelBenefits.dialogTitle || "\u7B49\u7EA7\u6743\u76CA\u5BF9\u6BD4" }),
|
|
455
|
+
/* @__PURE__ */ jsx2(
|
|
397
456
|
"button",
|
|
398
457
|
{
|
|
399
458
|
onClick: () => setShowBenefitsDialog(false),
|
|
@@ -403,56 +462,78 @@ var KeyGuard = ({
|
|
|
403
462
|
}
|
|
404
463
|
)
|
|
405
464
|
] }),
|
|
406
|
-
/* @__PURE__ */
|
|
407
|
-
/* @__PURE__ */
|
|
408
|
-
/* @__PURE__ */
|
|
409
|
-
/* @__PURE__ */
|
|
410
|
-
/* @__PURE__ */
|
|
411
|
-
/* @__PURE__ */
|
|
465
|
+
/* @__PURE__ */ jsx2("div", { style: benefitsDialogBodyStyle, children: /* @__PURE__ */ jsx2("div", { style: benefitsTableContainerStyle, children: /* @__PURE__ */ jsxs("table", { style: benefitsTableStyle, children: [
|
|
466
|
+
/* @__PURE__ */ jsx2("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
467
|
+
/* @__PURE__ */ jsx2("th", { style: benefitsTableHeaderStyle, children: "\u6743\u76CA" }),
|
|
468
|
+
/* @__PURE__ */ jsx2("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("guest" /* Guest */) }),
|
|
469
|
+
/* @__PURE__ */ jsx2("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("vip" /* VIP */) }),
|
|
470
|
+
/* @__PURE__ */ jsx2("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("super_vip" /* SuperVIP */) })
|
|
412
471
|
] }) }),
|
|
413
|
-
/* @__PURE__ */
|
|
414
|
-
/* @__PURE__ */
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
textAlign: "center"
|
|
431
|
-
},
|
|
432
|
-
dangerouslySetInnerHTML: { __html: benefit.values["vip" /* VIP */] }
|
|
433
|
-
}
|
|
434
|
-
),
|
|
435
|
-
/* @__PURE__ */ jsx(
|
|
436
|
-
"td",
|
|
437
|
-
{
|
|
438
|
-
style: {
|
|
439
|
-
...benefitsTableCellStyle,
|
|
440
|
-
textAlign: "center"
|
|
472
|
+
/* @__PURE__ */ jsxs("tbody", { children: [
|
|
473
|
+
finalLevelBenefits.price && /* @__PURE__ */ jsxs("tr", { children: [
|
|
474
|
+
/* @__PURE__ */ jsxs("td", { style: benefitsTableCellStyle, children: [
|
|
475
|
+
"\u4EF7\u683C(\u9650\u65F6\u7279\u60E0)",
|
|
476
|
+
/* @__PURE__ */ jsx2(Timer_default, {})
|
|
477
|
+
] }),
|
|
478
|
+
(Object.keys(finalLevelBenefits.price.original || {}) || []).map((key) => /* @__PURE__ */ jsxs(
|
|
479
|
+
"td",
|
|
480
|
+
{
|
|
481
|
+
style: {
|
|
482
|
+
...benefitsTableCellStyle,
|
|
483
|
+
textAlign: "center"
|
|
484
|
+
},
|
|
485
|
+
children: [
|
|
486
|
+
finalLevelBenefits.price?.original[key] && /* @__PURE__ */ jsx2("div", { style: { textDecoration: "line-through" }, children: finalLevelBenefits.price?.original[key] }),
|
|
487
|
+
/* @__PURE__ */ jsx2("div", { style: finalLevelBenefits.price?.original[key] ? { color: "red", fontWeight: "bold", fontSize: "16px" } : {}, children: finalLevelBenefits.price?.current[key] })
|
|
488
|
+
]
|
|
441
489
|
},
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
)
|
|
445
|
-
|
|
490
|
+
key
|
|
491
|
+
))
|
|
492
|
+
] }),
|
|
493
|
+
finalLevelBenefits.benefits.map((benefit, index) => /* @__PURE__ */ jsxs("tr", { children: [
|
|
494
|
+
/* @__PURE__ */ jsx2("td", { style: benefitsTableCellStyle, children: benefit.name }),
|
|
495
|
+
/* @__PURE__ */ jsx2(
|
|
496
|
+
"td",
|
|
497
|
+
{
|
|
498
|
+
style: {
|
|
499
|
+
...benefitsTableCellStyle,
|
|
500
|
+
textAlign: "center"
|
|
501
|
+
},
|
|
502
|
+
dangerouslySetInnerHTML: { __html: benefit.values["guest" /* Guest */] }
|
|
503
|
+
}
|
|
504
|
+
),
|
|
505
|
+
/* @__PURE__ */ jsx2(
|
|
506
|
+
"td",
|
|
507
|
+
{
|
|
508
|
+
style: {
|
|
509
|
+
...benefitsTableCellStyle,
|
|
510
|
+
textAlign: "center"
|
|
511
|
+
},
|
|
512
|
+
dangerouslySetInnerHTML: { __html: benefit.values["vip" /* VIP */] }
|
|
513
|
+
}
|
|
514
|
+
),
|
|
515
|
+
/* @__PURE__ */ jsx2(
|
|
516
|
+
"td",
|
|
517
|
+
{
|
|
518
|
+
style: {
|
|
519
|
+
...benefitsTableCellStyle,
|
|
520
|
+
textAlign: "center"
|
|
521
|
+
},
|
|
522
|
+
dangerouslySetInnerHTML: { __html: benefit.values["super_vip" /* SuperVIP */] }
|
|
523
|
+
}
|
|
524
|
+
)
|
|
525
|
+
] }, index))
|
|
526
|
+
] })
|
|
446
527
|
] }) }) })
|
|
447
528
|
] })
|
|
448
529
|
] })
|
|
449
530
|
] })
|
|
450
531
|
] });
|
|
451
532
|
}
|
|
452
|
-
return /* @__PURE__ */
|
|
453
|
-
/* @__PURE__ */
|
|
533
|
+
return /* @__PURE__ */ jsx2("div", { style: { ...defaultContainerStyle, ...customStyle }, children: /* @__PURE__ */ jsxs("div", { style: defaultCardStyle, children: [
|
|
534
|
+
/* @__PURE__ */ jsx2("h2", { style: titleStyle, children: title }),
|
|
454
535
|
/* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, style: formStyle, children: [
|
|
455
|
-
/* @__PURE__ */
|
|
536
|
+
/* @__PURE__ */ jsx2(
|
|
456
537
|
"input",
|
|
457
538
|
{
|
|
458
539
|
type: "text",
|
|
@@ -463,10 +544,10 @@ var KeyGuard = ({
|
|
|
463
544
|
disabled: loading
|
|
464
545
|
}
|
|
465
546
|
),
|
|
466
|
-
error && /* @__PURE__ */
|
|
467
|
-
/* @__PURE__ */
|
|
547
|
+
error && /* @__PURE__ */ jsx2("div", { style: errorStyle, children: error }),
|
|
548
|
+
/* @__PURE__ */ jsx2("button", { type: "submit", style: buttonStyle, disabled: loading, children: loading ? "\u9A8C\u8BC1\u4E2D..." : buttonText })
|
|
468
549
|
] }),
|
|
469
|
-
allowGuestAccess && /* @__PURE__ */
|
|
550
|
+
allowGuestAccess && /* @__PURE__ */ jsx2("div", { style: guestAccessContainerStyle, children: /* @__PURE__ */ jsx2(
|
|
470
551
|
"button",
|
|
471
552
|
{
|
|
472
553
|
type: "button",
|
|
@@ -851,5 +932,6 @@ var index_default = KeyGuard;
|
|
|
851
932
|
export {
|
|
852
933
|
KeyGuard,
|
|
853
934
|
Level,
|
|
935
|
+
Timer_default as Timer,
|
|
854
936
|
index_default as default
|
|
855
937
|
};
|