探索
目的地
+
命运转盘
省钱对比
费用计算器
签证指南
@@ -28,7 +29,9 @@ export default function Footer() {
diff --git a/frontend/src/components/HomeClient.tsx b/frontend/src/components/HomeClient.tsx
index 6b52c84..55f2fd8 100644
--- a/frontend/src/components/HomeClient.tsx
+++ b/frontend/src/components/HomeClient.tsx
@@ -34,6 +34,9 @@ import CoworkingGuide from "./CoworkingGuide";
import PackingChecklist from "./PackingChecklist";
import SeasonGuide from "./SeasonGuide";
import NomadTips from "./NomadTips";
+import SpinGlobe from "./SpinGlobe";
+import FlightCost from "./FlightCost";
+import NomadEvents from "./NomadEvents";
import KeyboardShortcuts from "./KeyboardShortcuts";
import BackToTop from "./BackToTop";
@@ -103,10 +106,12 @@ export default function HomeClient(props: Props) {
setMatcherOpen(true)} />
+
+
@@ -115,6 +120,7 @@ export default function HomeClient(props: Props) {
+
diff --git a/frontend/src/components/KeyboardShortcuts.tsx b/frontend/src/components/KeyboardShortcuts.tsx
index 2b13221..e27282b 100644
--- a/frontend/src/components/KeyboardShortcuts.tsx
+++ b/frontend/src/components/KeyboardShortcuts.tsx
@@ -9,6 +9,7 @@ interface Props {
const SHORTCUTS = [
{ keys: ["Ctrl", "K"], label: "全局搜索", icon: "🔍" },
{ keys: ["M"], label: "智能匹配", icon: "🎯" },
+ { keys: ["G"], label: "命运转盘", icon: "🎲" },
{ keys: ["?"], label: "快捷键帮助", icon: "⌨️" },
{ keys: ["Esc"], label: "关闭弹窗", icon: "✕" },
{ keys: ["↑", "↓"], label: "搜索导航", icon: "↕️" },
@@ -31,6 +32,10 @@ export default function KeyboardShortcuts({ onOpenMatcher }: Props) {
e.preventDefault();
onOpenMatcher?.();
}
+ if (e.key === "g" && !typing && !e.metaKey && !e.ctrlKey) {
+ e.preventDefault();
+ document.getElementById("spin")?.scrollIntoView({ behavior: "smooth" });
+ }
if (e.key === "Escape" && open) setOpen(false);
};
window.addEventListener("keydown", onKey);
diff --git a/frontend/src/components/NomadEvents.tsx b/frontend/src/components/NomadEvents.tsx
new file mode 100644
index 0000000..2c91ac7
--- /dev/null
+++ b/frontend/src/components/NomadEvents.tsx
@@ -0,0 +1,119 @@
+"use client";
+
+import { useMemo, useState } from "react";
+
+interface EventItem {
+ id: string;
+ emoji: string;
+ title: string;
+ city: string;
+ date: string;
+ type: string;
+ desc: string;
+ online: boolean;
+}
+
+const EVENTS: EventItem[] = [
+ {
+ id: "1", emoji: "☕", title: "清迈咖啡馆 Meetup", city: "清迈",
+ date: "2026-09-12", type: "meetup", online: false,
+ desc: "每周五下午，Punspace 门口集合，结识本地游民与远程开发者。",
+ },
+ {
+ id: "2", emoji: "🏄", title: "巴厘岛冲浪 + Cowork 日", city: "巴厘岛",
+ date: "2026-09-20", type: "lifestyle", online: false,
+ desc: "上午 Canggu 冲浪，下午 Hubud 联合办公，傍晚沙滩社交。",
+ },
+ {
+ id: "3", emoji: "💻", title: "远程工作效率工作坊", city: "线上",
+ date: "2026-09-08", type: "workshop", online: true,
+ desc: "时区管理、异步协作与深度工作方法分享，Zoom 直播。",
+ },
+ {
+ id: "4", emoji: "🍷", title: "里斯本游民之夜", city: "里斯本",
+ date: "2026-09-27", type: "meetup", online: false,
+ desc: "Alfama 区酒窖聚会，葡萄牙 D7 签证经验交流。",
+ },
+ {
+ id: "5", emoji: "🗺️", title: "签证政策 AMA", city: "线上",
+ date: "2026-10-05", type: "workshop", online: true,
+ desc: "移民顾问在线答疑：西班牙 Nomad Visa、泰国 LTR、印尼 B211A。",
+ },
+ {
+ id: "6", emoji: "🌮", title: "墨西哥城美食徒步", city: "墨西哥城",
+ date: "2026-10-11", type: "lifestyle", online: false,
+ desc: "Roma Norte 街头美食 + 共享办公空间探访。",
+ },
+];
+
+const FILTERS = [
+ { key: "all", label: "🌏 全部" },
+ { key: "meetup", label: "🤝 聚会" },
+ { key: "workshop", label: "📚 工作坊" },
+ { key: "lifestyle", label: "🌴 生活方式" },
+ { key: "online", label: "💻 线上" },
+];
+
+export default function NomadEvents() {
+ const [filter, setFilter] = useState("all");
+ const [joined, setJoined] = useState>({});
+
+ const filtered = useMemo(() => {
+ if (filter === "all") return EVENTS;
+ if (filter === "online") return EVENTS.filter((e) => e.online);
+ return EVENTS.filter((e) => e.type === filter);
+ }, [filter]);
+
+ const toggleJoin = (id: string) => {
+ setJoined((prev) => ({ ...prev, [id]: !prev[id] }));
+ };
+
+ return (
+
+
+
+
📅 EVENTS
+
游民活动日历
+
线下 Meetup、线上工作坊，找到你的下一场社交
+
+
+
+ {FILTERS.map((f) => (
+
+ ))}
+
+
+
+ {filtered.map((e, i) => (
+
+
+ {e.emoji}
+
+ {e.online ? "💻 线上" : `📍 ${e.city}`}
+
+
+
{e.title}
+
📅 {e.date}
+
{e.desc}
+
+
+ ))}
+
+ {filtered.length === 0 && (
+
该分类暂无活动
+ )}
+
+
+
🎲 SPIN
+
命运转盘 · 下一站去哪？
+
不知道去哪？让命运帮你选一座游民城市
+
+
+
+
+
{shown?.emoji || "🌍"}
+
+
+
+
+
+ {shown ? `${shown.name}, ${shown.country}` : "准备就绪"}
+
+ {shown && !spinning && !result && (
+
点击下方按钮，开启随机旅居冒险
+ )}
+ {spinning &&
正在穿越时区… ✈️
}
+
+ {result && !spinning && (
+
+
🎯 命运指引你去
+
+ 💰 ¥{result.cost.toLocaleString()}/月
+ 📶 {result.speed}Mbps
+ ⭐ {result.rating}
+
+
{result.description}
+
+
+ 查看详情 →
+
+
+
+
+ )}
+
+ {!result && (
+
+ )}
+
+