apps-key-guard 0.0.4 → 0.0.5
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 +10 -1
- package/dist/index.d.ts +10 -1
- package/dist/index.js +169 -4
- package/dist/index.mjs +169 -4
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -6,6 +6,14 @@ declare enum Level {
|
|
|
6
6
|
VIP = "vip",
|
|
7
7
|
SuperVIP = "super_vip"
|
|
8
8
|
}
|
|
9
|
+
interface LevelBenefit {
|
|
10
|
+
name: string;
|
|
11
|
+
values: Record<Level, string | boolean>;
|
|
12
|
+
}
|
|
13
|
+
interface LevelBenefitsConfig {
|
|
14
|
+
benefits: LevelBenefit[];
|
|
15
|
+
dialogTitle?: string;
|
|
16
|
+
}
|
|
9
17
|
interface KeyGuardProps {
|
|
10
18
|
appName: string;
|
|
11
19
|
apiBaseUrl?: string;
|
|
@@ -19,7 +27,8 @@ interface KeyGuardProps {
|
|
|
19
27
|
authorWechat?: string;
|
|
20
28
|
authorQrCode?: string;
|
|
21
29
|
allowGuestAccess?: boolean;
|
|
30
|
+
levelBenefits?: LevelBenefitsConfig;
|
|
22
31
|
}
|
|
23
32
|
declare const KeyGuard: React.FC<KeyGuardProps>;
|
|
24
33
|
|
|
25
|
-
export { KeyGuard, type KeyGuardProps, Level, KeyGuard as default };
|
|
34
|
+
export { KeyGuard, type KeyGuardProps, Level, type LevelBenefit, type LevelBenefitsConfig, KeyGuard as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -6,6 +6,14 @@ declare enum Level {
|
|
|
6
6
|
VIP = "vip",
|
|
7
7
|
SuperVIP = "super_vip"
|
|
8
8
|
}
|
|
9
|
+
interface LevelBenefit {
|
|
10
|
+
name: string;
|
|
11
|
+
values: Record<Level, string | boolean>;
|
|
12
|
+
}
|
|
13
|
+
interface LevelBenefitsConfig {
|
|
14
|
+
benefits: LevelBenefit[];
|
|
15
|
+
dialogTitle?: string;
|
|
16
|
+
}
|
|
9
17
|
interface KeyGuardProps {
|
|
10
18
|
appName: string;
|
|
11
19
|
apiBaseUrl?: string;
|
|
@@ -19,7 +27,8 @@ interface KeyGuardProps {
|
|
|
19
27
|
authorWechat?: string;
|
|
20
28
|
authorQrCode?: string;
|
|
21
29
|
allowGuestAccess?: boolean;
|
|
30
|
+
levelBenefits?: LevelBenefitsConfig;
|
|
22
31
|
}
|
|
23
32
|
declare const KeyGuard: React.FC<KeyGuardProps>;
|
|
24
33
|
|
|
25
|
-
export { KeyGuard, type KeyGuardProps, Level, KeyGuard as default };
|
|
34
|
+
export { KeyGuard, type KeyGuardProps, Level, type LevelBenefit, type LevelBenefitsConfig, KeyGuard as default };
|
package/dist/index.js
CHANGED
|
@@ -58,7 +58,8 @@ var KeyGuard = ({
|
|
|
58
58
|
showFloatingButton = true,
|
|
59
59
|
authorWechat = "zhoulixiang0305",
|
|
60
60
|
authorQrCode = "https://i.postimg.cc/bJz33sy2/saler.jpg",
|
|
61
|
-
allowGuestAccess = false
|
|
61
|
+
allowGuestAccess = false,
|
|
62
|
+
levelBenefits
|
|
62
63
|
}) => {
|
|
63
64
|
const [isValidated, setIsValidated] = (0, import_react.useState)(false);
|
|
64
65
|
const [keyValue, setKeyValue] = (0, import_react.useState)("");
|
|
@@ -70,8 +71,42 @@ var KeyGuard = ({
|
|
|
70
71
|
const [showKey, setShowKey] = (0, import_react.useState)(false);
|
|
71
72
|
const [showContactDialog, setShowContactDialog] = (0, import_react.useState)(false);
|
|
72
73
|
const [guestButtonHover, setGuestButtonHover] = (0, import_react.useState)(false);
|
|
74
|
+
const [showBenefitsDialog, setShowBenefitsDialog] = (0, import_react.useState)(false);
|
|
73
75
|
const storageKey = `${STORAGE_KEY_PREFIX}${appName}`;
|
|
74
76
|
const storageInfoKey = `${STORAGE_KEY_PREFIX}${appName}_info`;
|
|
77
|
+
const defaultLevelBenefits = {
|
|
78
|
+
dialogTitle: "\u7B49\u7EA7\u6743\u76CA\u5BF9\u6BD4",
|
|
79
|
+
benefits: [
|
|
80
|
+
{
|
|
81
|
+
name: "\u57FA\u7840\u8BBF\u95EE",
|
|
82
|
+
values: {
|
|
83
|
+
["none" /* None */]: "\u2717",
|
|
84
|
+
["guest" /* Guest */]: "\u2713",
|
|
85
|
+
["vip" /* VIP */]: "\u2713",
|
|
86
|
+
["super_vip" /* SuperVIP */]: "\u2713"
|
|
87
|
+
}
|
|
88
|
+
},
|
|
89
|
+
{
|
|
90
|
+
name: "\u9AD8\u7EA7\u529F\u80FD",
|
|
91
|
+
values: {
|
|
92
|
+
["none" /* None */]: "\u2717",
|
|
93
|
+
["guest" /* Guest */]: "\u2717",
|
|
94
|
+
["vip" /* VIP */]: "\u2713",
|
|
95
|
+
["super_vip" /* SuperVIP */]: "\u2713"
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
name: "\u4E13\u5C5E\u652F\u6301",
|
|
100
|
+
values: {
|
|
101
|
+
["none" /* None */]: "\u2717",
|
|
102
|
+
["guest" /* Guest */]: "\u2717",
|
|
103
|
+
["vip" /* VIP */]: "\u2717",
|
|
104
|
+
["super_vip" /* SuperVIP */]: "\u2713"
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
]
|
|
108
|
+
};
|
|
109
|
+
const finalLevelBenefits = levelBenefits || defaultLevelBenefits;
|
|
75
110
|
const verifyKey = async (key) => {
|
|
76
111
|
try {
|
|
77
112
|
const response = await import_axios.default.post(
|
|
@@ -171,6 +206,7 @@ var KeyGuard = ({
|
|
|
171
206
|
setShowPanel(false);
|
|
172
207
|
setShowKey(false);
|
|
173
208
|
setShowContactDialog(false);
|
|
209
|
+
setShowBenefitsDialog(false);
|
|
174
210
|
};
|
|
175
211
|
const formatLevel = (level) => {
|
|
176
212
|
const levelMap = {
|
|
@@ -295,7 +331,18 @@ var KeyGuard = ({
|
|
|
295
331
|
] }),
|
|
296
332
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: infoItemStyle, children: [
|
|
297
333
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: infoLabelStyle, children: "\u7B49\u7EA7" }),
|
|
298
|
-
/* @__PURE__ */ (0, import_jsx_runtime.
|
|
334
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: levelDisplayContainerStyle, children: [
|
|
335
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: levelBadgeStyle(userInfo.level), children: formatLevel(userInfo.level) }),
|
|
336
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
337
|
+
"button",
|
|
338
|
+
{
|
|
339
|
+
onClick: () => setShowBenefitsDialog(true),
|
|
340
|
+
style: viewBenefitsButtonStyle,
|
|
341
|
+
"aria-label": "\u67E5\u770B\u7B49\u7EA7\u6743\u76CA",
|
|
342
|
+
children: "\u67E5\u770B\u6743\u76CA"
|
|
343
|
+
}
|
|
344
|
+
)
|
|
345
|
+
] })
|
|
299
346
|
] }),
|
|
300
347
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: infoItemStyle, children: [
|
|
301
348
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: infoLabelStyle, children: "\u8FC7\u671F\u65F6\u95F4" }),
|
|
@@ -373,6 +420,70 @@ var KeyGuard = ({
|
|
|
373
420
|
] })
|
|
374
421
|
] }) })
|
|
375
422
|
] })
|
|
423
|
+
] }),
|
|
424
|
+
showBenefitsDialog && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
425
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
426
|
+
"div",
|
|
427
|
+
{
|
|
428
|
+
style: overlayStyle,
|
|
429
|
+
onClick: () => setShowBenefitsDialog(false)
|
|
430
|
+
}
|
|
431
|
+
),
|
|
432
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: benefitsDialogStyle, children: [
|
|
433
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: panelHeaderStyle, children: [
|
|
434
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { style: panelTitleStyle, children: finalLevelBenefits.dialogTitle || "\u7B49\u7EA7\u6743\u76CA\u5BF9\u6BD4" }),
|
|
435
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
436
|
+
"button",
|
|
437
|
+
{
|
|
438
|
+
onClick: () => setShowBenefitsDialog(false),
|
|
439
|
+
style: closeButtonStyle,
|
|
440
|
+
"aria-label": "\u5173\u95ED",
|
|
441
|
+
children: "\u2715"
|
|
442
|
+
}
|
|
443
|
+
)
|
|
444
|
+
] }),
|
|
445
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: benefitsDialogBodyStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: benefitsTableContainerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("table", { style: benefitsTableStyle, children: [
|
|
446
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("tr", { children: [
|
|
447
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { style: benefitsTableHeaderStyle, children: "\u6743\u76CA" }),
|
|
448
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("guest" /* Guest */) }),
|
|
449
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("vip" /* VIP */) }),
|
|
450
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("super_vip" /* SuperVIP */) })
|
|
451
|
+
] }) }),
|
|
452
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("tbody", { children: finalLevelBenefits.benefits.map((benefit, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("tr", { children: [
|
|
453
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { style: benefitsTableCellStyle, children: benefit.name }),
|
|
454
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
455
|
+
"td",
|
|
456
|
+
{
|
|
457
|
+
style: {
|
|
458
|
+
...benefitsTableCellStyle,
|
|
459
|
+
textAlign: "center"
|
|
460
|
+
},
|
|
461
|
+
children: typeof benefit.values["guest" /* Guest */] === "boolean" ? benefit.values["guest" /* Guest */] ? "\u2713" : "\u2717" : benefit.values["guest" /* Guest */]
|
|
462
|
+
}
|
|
463
|
+
),
|
|
464
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
465
|
+
"td",
|
|
466
|
+
{
|
|
467
|
+
style: {
|
|
468
|
+
...benefitsTableCellStyle,
|
|
469
|
+
textAlign: "center"
|
|
470
|
+
},
|
|
471
|
+
children: typeof benefit.values["vip" /* VIP */] === "boolean" ? benefit.values["vip" /* VIP */] ? "\u2713" : "\u2717" : benefit.values["vip" /* VIP */]
|
|
472
|
+
}
|
|
473
|
+
),
|
|
474
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
475
|
+
"td",
|
|
476
|
+
{
|
|
477
|
+
style: {
|
|
478
|
+
...benefitsTableCellStyle,
|
|
479
|
+
textAlign: "center"
|
|
480
|
+
},
|
|
481
|
+
children: typeof benefit.values["super_vip" /* SuperVIP */] === "boolean" ? benefit.values["super_vip" /* SuperVIP */] ? "\u2713" : "\u2717" : benefit.values["super_vip" /* SuperVIP */]
|
|
482
|
+
}
|
|
483
|
+
)
|
|
484
|
+
] }, index)) })
|
|
485
|
+
] }) }) })
|
|
486
|
+
] })
|
|
376
487
|
] })
|
|
377
488
|
] })
|
|
378
489
|
] });
|
|
@@ -512,8 +623,7 @@ var panelHeaderStyle = {
|
|
|
512
623
|
display: "flex",
|
|
513
624
|
justifyContent: "space-between",
|
|
514
625
|
alignItems: "center",
|
|
515
|
-
padding: "1.5rem"
|
|
516
|
-
borderBottom: "1px solid #e9ecef"
|
|
626
|
+
padding: "1.5rem"
|
|
517
627
|
};
|
|
518
628
|
var panelTitleStyle = {
|
|
519
629
|
margin: 0,
|
|
@@ -721,6 +831,61 @@ var guestAccessButtonStyle = {
|
|
|
721
831
|
padding: "0.25rem 0.5rem",
|
|
722
832
|
transition: "color 0.2s"
|
|
723
833
|
};
|
|
834
|
+
var levelDisplayContainerStyle = {
|
|
835
|
+
display: "flex",
|
|
836
|
+
alignItems: "center",
|
|
837
|
+
gap: "0.5rem"
|
|
838
|
+
};
|
|
839
|
+
var viewBenefitsButtonStyle = {
|
|
840
|
+
padding: "0.25rem 0.75rem",
|
|
841
|
+
fontSize: "0.75rem",
|
|
842
|
+
fontWeight: "500",
|
|
843
|
+
color: "#007bff",
|
|
844
|
+
backgroundColor: "transparent",
|
|
845
|
+
border: "1px solid #007bff",
|
|
846
|
+
borderRadius: "4px",
|
|
847
|
+
cursor: "pointer",
|
|
848
|
+
transition: "all 0.2s"
|
|
849
|
+
};
|
|
850
|
+
var benefitsDialogStyle = {
|
|
851
|
+
position: "fixed",
|
|
852
|
+
top: "50%",
|
|
853
|
+
left: "50%",
|
|
854
|
+
transform: "translate(-50%, -50%)",
|
|
855
|
+
backgroundColor: "white",
|
|
856
|
+
borderRadius: "12px",
|
|
857
|
+
boxShadow: "0 8px 32px rgba(0, 0, 0, 0.2)",
|
|
858
|
+
width: "90%",
|
|
859
|
+
maxWidth: "600px",
|
|
860
|
+
maxHeight: "80vh",
|
|
861
|
+
overflow: "auto",
|
|
862
|
+
zIndex: 1003,
|
|
863
|
+
animation: "slideIn 0.3s ease"
|
|
864
|
+
};
|
|
865
|
+
var benefitsDialogBodyStyle = {
|
|
866
|
+
padding: "1.5rem"
|
|
867
|
+
};
|
|
868
|
+
var benefitsTableContainerStyle = {
|
|
869
|
+
overflowX: "auto"
|
|
870
|
+
};
|
|
871
|
+
var benefitsTableStyle = {
|
|
872
|
+
width: "100%",
|
|
873
|
+
borderCollapse: "collapse",
|
|
874
|
+
fontSize: "0.875rem"
|
|
875
|
+
};
|
|
876
|
+
var benefitsTableHeaderStyle = {
|
|
877
|
+
padding: "0.75rem",
|
|
878
|
+
backgroundColor: "#f8f9fa",
|
|
879
|
+
borderBottom: "2px solid #dee2e6",
|
|
880
|
+
textAlign: "left",
|
|
881
|
+
fontWeight: "600",
|
|
882
|
+
color: "#333"
|
|
883
|
+
};
|
|
884
|
+
var benefitsTableCellStyle = {
|
|
885
|
+
padding: "0.75rem",
|
|
886
|
+
borderBottom: "1px solid #dee2e6",
|
|
887
|
+
color: "#666"
|
|
888
|
+
};
|
|
724
889
|
var index_default = KeyGuard;
|
|
725
890
|
// Annotate the CommonJS export names for ESM import in node:
|
|
726
891
|
0 && (module.exports = {
|
package/dist/index.mjs
CHANGED
|
@@ -22,7 +22,8 @@ var KeyGuard = ({
|
|
|
22
22
|
showFloatingButton = true,
|
|
23
23
|
authorWechat = "zhoulixiang0305",
|
|
24
24
|
authorQrCode = "https://i.postimg.cc/bJz33sy2/saler.jpg",
|
|
25
|
-
allowGuestAccess = false
|
|
25
|
+
allowGuestAccess = false,
|
|
26
|
+
levelBenefits
|
|
26
27
|
}) => {
|
|
27
28
|
const [isValidated, setIsValidated] = useState(false);
|
|
28
29
|
const [keyValue, setKeyValue] = useState("");
|
|
@@ -34,8 +35,42 @@ var KeyGuard = ({
|
|
|
34
35
|
const [showKey, setShowKey] = useState(false);
|
|
35
36
|
const [showContactDialog, setShowContactDialog] = useState(false);
|
|
36
37
|
const [guestButtonHover, setGuestButtonHover] = useState(false);
|
|
38
|
+
const [showBenefitsDialog, setShowBenefitsDialog] = useState(false);
|
|
37
39
|
const storageKey = `${STORAGE_KEY_PREFIX}${appName}`;
|
|
38
40
|
const storageInfoKey = `${STORAGE_KEY_PREFIX}${appName}_info`;
|
|
41
|
+
const defaultLevelBenefits = {
|
|
42
|
+
dialogTitle: "\u7B49\u7EA7\u6743\u76CA\u5BF9\u6BD4",
|
|
43
|
+
benefits: [
|
|
44
|
+
{
|
|
45
|
+
name: "\u57FA\u7840\u8BBF\u95EE",
|
|
46
|
+
values: {
|
|
47
|
+
["none" /* None */]: "\u2717",
|
|
48
|
+
["guest" /* Guest */]: "\u2713",
|
|
49
|
+
["vip" /* VIP */]: "\u2713",
|
|
50
|
+
["super_vip" /* SuperVIP */]: "\u2713"
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
name: "\u9AD8\u7EA7\u529F\u80FD",
|
|
55
|
+
values: {
|
|
56
|
+
["none" /* None */]: "\u2717",
|
|
57
|
+
["guest" /* Guest */]: "\u2717",
|
|
58
|
+
["vip" /* VIP */]: "\u2713",
|
|
59
|
+
["super_vip" /* SuperVIP */]: "\u2713"
|
|
60
|
+
}
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
name: "\u4E13\u5C5E\u652F\u6301",
|
|
64
|
+
values: {
|
|
65
|
+
["none" /* None */]: "\u2717",
|
|
66
|
+
["guest" /* Guest */]: "\u2717",
|
|
67
|
+
["vip" /* VIP */]: "\u2717",
|
|
68
|
+
["super_vip" /* SuperVIP */]: "\u2713"
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
]
|
|
72
|
+
};
|
|
73
|
+
const finalLevelBenefits = levelBenefits || defaultLevelBenefits;
|
|
39
74
|
const verifyKey = async (key) => {
|
|
40
75
|
try {
|
|
41
76
|
const response = await axios.post(
|
|
@@ -135,6 +170,7 @@ var KeyGuard = ({
|
|
|
135
170
|
setShowPanel(false);
|
|
136
171
|
setShowKey(false);
|
|
137
172
|
setShowContactDialog(false);
|
|
173
|
+
setShowBenefitsDialog(false);
|
|
138
174
|
};
|
|
139
175
|
const formatLevel = (level) => {
|
|
140
176
|
const levelMap = {
|
|
@@ -259,7 +295,18 @@ var KeyGuard = ({
|
|
|
259
295
|
] }),
|
|
260
296
|
/* @__PURE__ */ jsxs("div", { style: infoItemStyle, children: [
|
|
261
297
|
/* @__PURE__ */ jsx("span", { style: infoLabelStyle, children: "\u7B49\u7EA7" }),
|
|
262
|
-
/* @__PURE__ */
|
|
298
|
+
/* @__PURE__ */ jsxs("div", { style: levelDisplayContainerStyle, children: [
|
|
299
|
+
/* @__PURE__ */ jsx("span", { style: levelBadgeStyle(userInfo.level), children: formatLevel(userInfo.level) }),
|
|
300
|
+
/* @__PURE__ */ jsx(
|
|
301
|
+
"button",
|
|
302
|
+
{
|
|
303
|
+
onClick: () => setShowBenefitsDialog(true),
|
|
304
|
+
style: viewBenefitsButtonStyle,
|
|
305
|
+
"aria-label": "\u67E5\u770B\u7B49\u7EA7\u6743\u76CA",
|
|
306
|
+
children: "\u67E5\u770B\u6743\u76CA"
|
|
307
|
+
}
|
|
308
|
+
)
|
|
309
|
+
] })
|
|
263
310
|
] }),
|
|
264
311
|
/* @__PURE__ */ jsxs("div", { style: infoItemStyle, children: [
|
|
265
312
|
/* @__PURE__ */ jsx("span", { style: infoLabelStyle, children: "\u8FC7\u671F\u65F6\u95F4" }),
|
|
@@ -337,6 +384,70 @@ var KeyGuard = ({
|
|
|
337
384
|
] })
|
|
338
385
|
] }) })
|
|
339
386
|
] })
|
|
387
|
+
] }),
|
|
388
|
+
showBenefitsDialog && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
389
|
+
/* @__PURE__ */ jsx(
|
|
390
|
+
"div",
|
|
391
|
+
{
|
|
392
|
+
style: overlayStyle,
|
|
393
|
+
onClick: () => setShowBenefitsDialog(false)
|
|
394
|
+
}
|
|
395
|
+
),
|
|
396
|
+
/* @__PURE__ */ jsxs("div", { style: benefitsDialogStyle, children: [
|
|
397
|
+
/* @__PURE__ */ jsxs("div", { style: panelHeaderStyle, children: [
|
|
398
|
+
/* @__PURE__ */ jsx("h3", { style: panelTitleStyle, children: finalLevelBenefits.dialogTitle || "\u7B49\u7EA7\u6743\u76CA\u5BF9\u6BD4" }),
|
|
399
|
+
/* @__PURE__ */ jsx(
|
|
400
|
+
"button",
|
|
401
|
+
{
|
|
402
|
+
onClick: () => setShowBenefitsDialog(false),
|
|
403
|
+
style: closeButtonStyle,
|
|
404
|
+
"aria-label": "\u5173\u95ED",
|
|
405
|
+
children: "\u2715"
|
|
406
|
+
}
|
|
407
|
+
)
|
|
408
|
+
] }),
|
|
409
|
+
/* @__PURE__ */ jsx("div", { style: benefitsDialogBodyStyle, children: /* @__PURE__ */ jsx("div", { style: benefitsTableContainerStyle, children: /* @__PURE__ */ jsxs("table", { style: benefitsTableStyle, children: [
|
|
410
|
+
/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
411
|
+
/* @__PURE__ */ jsx("th", { style: benefitsTableHeaderStyle, children: "\u6743\u76CA" }),
|
|
412
|
+
/* @__PURE__ */ jsx("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("guest" /* Guest */) }),
|
|
413
|
+
/* @__PURE__ */ jsx("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("vip" /* VIP */) }),
|
|
414
|
+
/* @__PURE__ */ jsx("th", { style: { ...benefitsTableCellStyle, textAlign: "center" }, children: formatLevel("super_vip" /* SuperVIP */) })
|
|
415
|
+
] }) }),
|
|
416
|
+
/* @__PURE__ */ jsx("tbody", { children: finalLevelBenefits.benefits.map((benefit, index) => /* @__PURE__ */ jsxs("tr", { children: [
|
|
417
|
+
/* @__PURE__ */ jsx("td", { style: benefitsTableCellStyle, children: benefit.name }),
|
|
418
|
+
/* @__PURE__ */ jsx(
|
|
419
|
+
"td",
|
|
420
|
+
{
|
|
421
|
+
style: {
|
|
422
|
+
...benefitsTableCellStyle,
|
|
423
|
+
textAlign: "center"
|
|
424
|
+
},
|
|
425
|
+
children: typeof benefit.values["guest" /* Guest */] === "boolean" ? benefit.values["guest" /* Guest */] ? "\u2713" : "\u2717" : benefit.values["guest" /* Guest */]
|
|
426
|
+
}
|
|
427
|
+
),
|
|
428
|
+
/* @__PURE__ */ jsx(
|
|
429
|
+
"td",
|
|
430
|
+
{
|
|
431
|
+
style: {
|
|
432
|
+
...benefitsTableCellStyle,
|
|
433
|
+
textAlign: "center"
|
|
434
|
+
},
|
|
435
|
+
children: typeof benefit.values["vip" /* VIP */] === "boolean" ? benefit.values["vip" /* VIP */] ? "\u2713" : "\u2717" : benefit.values["vip" /* VIP */]
|
|
436
|
+
}
|
|
437
|
+
),
|
|
438
|
+
/* @__PURE__ */ jsx(
|
|
439
|
+
"td",
|
|
440
|
+
{
|
|
441
|
+
style: {
|
|
442
|
+
...benefitsTableCellStyle,
|
|
443
|
+
textAlign: "center"
|
|
444
|
+
},
|
|
445
|
+
children: typeof benefit.values["super_vip" /* SuperVIP */] === "boolean" ? benefit.values["super_vip" /* SuperVIP */] ? "\u2713" : "\u2717" : benefit.values["super_vip" /* SuperVIP */]
|
|
446
|
+
}
|
|
447
|
+
)
|
|
448
|
+
] }, index)) })
|
|
449
|
+
] }) }) })
|
|
450
|
+
] })
|
|
340
451
|
] })
|
|
341
452
|
] })
|
|
342
453
|
] });
|
|
@@ -476,8 +587,7 @@ var panelHeaderStyle = {
|
|
|
476
587
|
display: "flex",
|
|
477
588
|
justifyContent: "space-between",
|
|
478
589
|
alignItems: "center",
|
|
479
|
-
padding: "1.5rem"
|
|
480
|
-
borderBottom: "1px solid #e9ecef"
|
|
590
|
+
padding: "1.5rem"
|
|
481
591
|
};
|
|
482
592
|
var panelTitleStyle = {
|
|
483
593
|
margin: 0,
|
|
@@ -685,6 +795,61 @@ var guestAccessButtonStyle = {
|
|
|
685
795
|
padding: "0.25rem 0.5rem",
|
|
686
796
|
transition: "color 0.2s"
|
|
687
797
|
};
|
|
798
|
+
var levelDisplayContainerStyle = {
|
|
799
|
+
display: "flex",
|
|
800
|
+
alignItems: "center",
|
|
801
|
+
gap: "0.5rem"
|
|
802
|
+
};
|
|
803
|
+
var viewBenefitsButtonStyle = {
|
|
804
|
+
padding: "0.25rem 0.75rem",
|
|
805
|
+
fontSize: "0.75rem",
|
|
806
|
+
fontWeight: "500",
|
|
807
|
+
color: "#007bff",
|
|
808
|
+
backgroundColor: "transparent",
|
|
809
|
+
border: "1px solid #007bff",
|
|
810
|
+
borderRadius: "4px",
|
|
811
|
+
cursor: "pointer",
|
|
812
|
+
transition: "all 0.2s"
|
|
813
|
+
};
|
|
814
|
+
var benefitsDialogStyle = {
|
|
815
|
+
position: "fixed",
|
|
816
|
+
top: "50%",
|
|
817
|
+
left: "50%",
|
|
818
|
+
transform: "translate(-50%, -50%)",
|
|
819
|
+
backgroundColor: "white",
|
|
820
|
+
borderRadius: "12px",
|
|
821
|
+
boxShadow: "0 8px 32px rgba(0, 0, 0, 0.2)",
|
|
822
|
+
width: "90%",
|
|
823
|
+
maxWidth: "600px",
|
|
824
|
+
maxHeight: "80vh",
|
|
825
|
+
overflow: "auto",
|
|
826
|
+
zIndex: 1003,
|
|
827
|
+
animation: "slideIn 0.3s ease"
|
|
828
|
+
};
|
|
829
|
+
var benefitsDialogBodyStyle = {
|
|
830
|
+
padding: "1.5rem"
|
|
831
|
+
};
|
|
832
|
+
var benefitsTableContainerStyle = {
|
|
833
|
+
overflowX: "auto"
|
|
834
|
+
};
|
|
835
|
+
var benefitsTableStyle = {
|
|
836
|
+
width: "100%",
|
|
837
|
+
borderCollapse: "collapse",
|
|
838
|
+
fontSize: "0.875rem"
|
|
839
|
+
};
|
|
840
|
+
var benefitsTableHeaderStyle = {
|
|
841
|
+
padding: "0.75rem",
|
|
842
|
+
backgroundColor: "#f8f9fa",
|
|
843
|
+
borderBottom: "2px solid #dee2e6",
|
|
844
|
+
textAlign: "left",
|
|
845
|
+
fontWeight: "600",
|
|
846
|
+
color: "#333"
|
|
847
|
+
};
|
|
848
|
+
var benefitsTableCellStyle = {
|
|
849
|
+
padding: "0.75rem",
|
|
850
|
+
borderBottom: "1px solid #dee2e6",
|
|
851
|
+
color: "#666"
|
|
852
|
+
};
|
|
688
853
|
var index_default = KeyGuard;
|
|
689
854
|
export {
|
|
690
855
|
KeyGuard,
|