feat: 新增「喝什么」场景,支持奶茶/咖啡/酒吧等饮品店搜索
引入场景系统(SceneType),首页增加「吃什么」「喝什么」切换 Tab, 不同场景使用不同的高德 POI 类型、热门标签、价格区间和全链路文案。 场景信息存储在房间数据中,邀请/分享/匹配结果等页面自动适配。
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
import { NextResponse } from "next/server";
|
import { NextResponse } from "next/server";
|
||||||
import { createRoom } from "@/lib/store";
|
import { createRoom } from "@/lib/store";
|
||||||
import { Restaurant } from "@/types";
|
import { Restaurant, SceneType } from "@/types";
|
||||||
|
import { getSceneConfig } from "@/lib/sceneConfig";
|
||||||
|
|
||||||
interface AmapPoiV5 {
|
interface AmapPoiV5 {
|
||||||
id: string;
|
id: string;
|
||||||
@@ -20,9 +21,6 @@ interface AmapPoiV5 {
|
|||||||
photos?: { url: string }[];
|
photos?: { url: string }[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const DEFAULT_IMAGE =
|
|
||||||
"https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?w=800&q=80";
|
|
||||||
|
|
||||||
function extractCategory(type?: string): string {
|
function extractCategory(type?: string): string {
|
||||||
if (!type) return "";
|
if (!type) return "";
|
||||||
const parts = type.split(";");
|
const parts = type.split(";");
|
||||||
@@ -35,7 +33,7 @@ function cleanField(val: unknown): string {
|
|||||||
return String(val);
|
return String(val);
|
||||||
}
|
}
|
||||||
|
|
||||||
function mapPoiToRestaurant(poi: AmapPoiV5): Restaurant {
|
function mapPoiToRestaurant(poi: AmapPoiV5, defaultImage: string): Restaurant {
|
||||||
const ratingStr = poi.business?.rating;
|
const ratingStr = poi.business?.rating;
|
||||||
const rating =
|
const rating =
|
||||||
ratingStr && ratingStr !== "[]" ? parseFloat(ratingStr) || 4.0 : 4.0;
|
ratingStr && ratingStr !== "[]" ? parseFloat(ratingStr) || 4.0 : 4.0;
|
||||||
@@ -47,7 +45,7 @@ function mapPoiToRestaurant(poi: AmapPoiV5): Restaurant {
|
|||||||
const image =
|
const image =
|
||||||
poi.photos && poi.photos.length > 0 && poi.photos[0].url
|
poi.photos && poi.photos.length > 0 && poi.photos[0].url
|
||||||
? poi.photos[0].url
|
? poi.photos[0].url
|
||||||
: DEFAULT_IMAGE;
|
: defaultImage;
|
||||||
|
|
||||||
const openTime =
|
const openTime =
|
||||||
cleanField(poi.business?.opentime_week) ||
|
cleanField(poi.business?.opentime_week) ||
|
||||||
@@ -81,10 +79,16 @@ function filterByPrice(
|
|||||||
if (isNaN(cost)) return true;
|
if (isNaN(cost)) return true;
|
||||||
|
|
||||||
switch (priceRange) {
|
switch (priceRange) {
|
||||||
|
case "under20":
|
||||||
|
return cost < 20;
|
||||||
case "under50":
|
case "under50":
|
||||||
return cost < 50;
|
return cost < 50;
|
||||||
|
case "20to50":
|
||||||
|
return cost >= 20 && cost <= 50;
|
||||||
case "50to100":
|
case "50to100":
|
||||||
return cost >= 50 && cost <= 100;
|
return cost >= 50 && cost <= 100;
|
||||||
|
case "over50":
|
||||||
|
return cost > 50;
|
||||||
case "over100":
|
case "over100":
|
||||||
return cost > 100;
|
return cost > 100;
|
||||||
default:
|
default:
|
||||||
@@ -103,8 +107,11 @@ export async function POST(req: Request) {
|
|||||||
priceRange = "any",
|
priceRange = "any",
|
||||||
cuisine = "不限",
|
cuisine = "不限",
|
||||||
userId = "",
|
userId = "",
|
||||||
|
scene = "eat" as SceneType,
|
||||||
} = body;
|
} = body;
|
||||||
|
|
||||||
|
const sceneConfig = getSceneConfig(scene === "drink" ? "drink" : "eat");
|
||||||
|
|
||||||
if (!lat || !lng) {
|
if (!lat || !lng) {
|
||||||
return NextResponse.json(
|
return NextResponse.json(
|
||||||
{ error: "无法获取位置信息,请允许定位权限后重试" },
|
{ error: "无法获取位置信息,请允许定位权限后重试" },
|
||||||
@@ -125,7 +132,7 @@ export async function POST(req: Request) {
|
|||||||
url.searchParams.set("key", apiKey);
|
url.searchParams.set("key", apiKey);
|
||||||
url.searchParams.set("location", `${lng},${lat}`);
|
url.searchParams.set("location", `${lng},${lat}`);
|
||||||
url.searchParams.set("radius", String(radius));
|
url.searchParams.set("radius", String(radius));
|
||||||
url.searchParams.set("types", "050000");
|
url.searchParams.set("types", sceneConfig.poiTypes);
|
||||||
url.searchParams.set("show_fields", "business,photos");
|
url.searchParams.set("show_fields", "business,photos");
|
||||||
url.searchParams.set("sortrule", "weight");
|
url.searchParams.set("sortrule", "weight");
|
||||||
|
|
||||||
@@ -141,24 +148,26 @@ export async function POST(req: Request) {
|
|||||||
|
|
||||||
let restaurants: Restaurant[] = [];
|
let restaurants: Restaurant[] = [];
|
||||||
if (amapData.status === "1" && amapData.pois?.length > 0) {
|
if (amapData.status === "1" && amapData.pois?.length > 0) {
|
||||||
let results: Restaurant[] = amapData.pois.map(mapPoiToRestaurant);
|
let results: Restaurant[] = amapData.pois.map(
|
||||||
|
(poi: AmapPoiV5) => mapPoiToRestaurant(poi, sceneConfig.defaultImage),
|
||||||
|
);
|
||||||
results = filterByPrice(results, priceRange);
|
results = filterByPrice(results, priceRange);
|
||||||
restaurants = results.slice(0, 15);
|
restaurants = results.slice(0, 15);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (restaurants.length === 0) {
|
if (restaurants.length === 0) {
|
||||||
return NextResponse.json(
|
return NextResponse.json(
|
||||||
{ error: "附近没有找到餐厅,试试扩大搜索范围或换个菜系" },
|
{ error: sceneConfig.emptyError },
|
||||||
{ status: 404 },
|
{ status: 404 },
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const roomId = await createRoom(restaurants, userId);
|
const roomId = await createRoom(restaurants, userId, sceneConfig.key);
|
||||||
return NextResponse.json({ roomId, restaurants });
|
return NextResponse.json({ roomId, restaurants });
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error("Failed to create room:", e);
|
console.error("Failed to create room:", e);
|
||||||
return NextResponse.json(
|
return NextResponse.json(
|
||||||
{ error: "搜索餐厅失败,请检查网络后重试" },
|
{ error: "搜索失败,请检查网络后重试" },
|
||||||
{ status: 500 },
|
{ status: 500 },
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,8 +10,11 @@ import {
|
|||||||
Sparkles,
|
Sparkles,
|
||||||
ChevronRight,
|
ChevronRight,
|
||||||
Loader2,
|
Loader2,
|
||||||
|
Coffee,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { getUserId } from "@/lib/userId";
|
import { getUserId } from "@/lib/userId";
|
||||||
|
import { getSceneConfig } from "@/lib/sceneConfig";
|
||||||
|
import type { SceneType } from "@/types";
|
||||||
|
|
||||||
export default function InvitePage() {
|
export default function InvitePage() {
|
||||||
const params = useParams<{ id: string }>();
|
const params = useParams<{ id: string }>();
|
||||||
@@ -22,8 +25,11 @@ export default function InvitePage() {
|
|||||||
"loading",
|
"loading",
|
||||||
);
|
);
|
||||||
const [userCount, setUserCount] = useState(0);
|
const [userCount, setUserCount] = useState(0);
|
||||||
|
const [scene, setScene] = useState<SceneType>("eat");
|
||||||
const [joining, setJoining] = useState(false);
|
const [joining, setJoining] = useState(false);
|
||||||
|
|
||||||
|
const sceneConfig = getSceneConfig(scene);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
fetch(`/api/room/${roomId}`)
|
fetch(`/api/room/${roomId}`)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
@@ -32,6 +38,7 @@ export default function InvitePage() {
|
|||||||
})
|
})
|
||||||
.then((data) => {
|
.then((data) => {
|
||||||
setUserCount(data.userCount ?? 0);
|
setUserCount(data.userCount ?? 0);
|
||||||
|
if (data.scene) setScene(data.scene);
|
||||||
setStatus("ready");
|
setStatus("ready");
|
||||||
})
|
})
|
||||||
.catch(() => setStatus("not_found"));
|
.catch(() => setStatus("not_found"));
|
||||||
@@ -89,7 +96,7 @@ export default function InvitePage() {
|
|||||||
transition={{ duration: 0.5 }}
|
transition={{ duration: 0.5 }}
|
||||||
>
|
>
|
||||||
<div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-emerald-500 shadow-lg shadow-emerald-200">
|
<div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-emerald-500 shadow-lg shadow-emerald-200">
|
||||||
<Utensils size={28} className="text-white" />
|
{scene === "drink" ? <Coffee size={28} className="text-white" /> : <Utensils size={28} className="text-white" />}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<h1 className="mt-5 text-3xl font-black tracking-tight text-zinc-900">
|
<h1 className="mt-5 text-3xl font-black tracking-tight text-zinc-900">
|
||||||
@@ -107,7 +114,7 @@ export default function InvitePage() {
|
|||||||
transition={{ duration: 0.5, delay: 0.1 }}
|
transition={{ duration: 0.5, delay: 0.1 }}
|
||||||
>
|
>
|
||||||
<p className="text-center text-lg font-bold text-zinc-800">
|
<p className="text-center text-lg font-bold text-zinc-800">
|
||||||
有人邀请你一起选餐厅
|
{sceneConfig.inviteText}
|
||||||
</p>
|
</p>
|
||||||
<div className="flex items-center gap-2 text-sm text-zinc-500">
|
<div className="flex items-center gap-2 text-sm text-zinc-500">
|
||||||
<span className="rounded-full bg-white px-2.5 py-0.5 font-mono text-base font-bold tracking-widest text-emerald-600 shadow-sm">
|
<span className="rounded-full bg-white px-2.5 py-0.5 font-mono text-base font-bold tracking-widest text-emerald-600 shadow-sm">
|
||||||
|
|||||||
+46
-18
@@ -7,7 +7,8 @@ import { Plus, LogIn, Loader2, MapPin, Navigation, X, Users, Heart, Sparkles, Ch
|
|||||||
import { getUserId, getCachedProfile, getCachedPreferences } from "@/lib/userId";
|
import { getUserId, getCachedProfile, getCachedPreferences } from "@/lib/userId";
|
||||||
import { getAvatarBg } from "@/lib/avatars";
|
import { getAvatarBg } from "@/lib/avatars";
|
||||||
import AuthModal from "@/components/AuthModal";
|
import AuthModal from "@/components/AuthModal";
|
||||||
import type { UserProfile } from "@/types";
|
import { SCENES, getSceneConfig } from "@/lib/sceneConfig";
|
||||||
|
import type { UserProfile, SceneType } from "@/types";
|
||||||
|
|
||||||
interface LocationSuggestion {
|
interface LocationSuggestion {
|
||||||
id: string;
|
id: string;
|
||||||
@@ -26,15 +27,6 @@ const DISTANCE_OPTIONS = [
|
|||||||
{ label: "5km", value: 5000 },
|
{ label: "5km", value: 5000 },
|
||||||
] as const;
|
] as const;
|
||||||
|
|
||||||
const PRICE_OPTIONS = [
|
|
||||||
{ label: "不限", value: "any" },
|
|
||||||
{ label: "¥50以下", value: "under50" },
|
|
||||||
{ label: "¥50-100", value: "50to100" },
|
|
||||||
{ label: "¥100+", value: "over100" },
|
|
||||||
] as const;
|
|
||||||
|
|
||||||
const HOT_CUISINES = ["火锅", "日料", "烧烤", "西餐", "川菜", "咖啡甜品", "小吃快餐"] as const;
|
|
||||||
|
|
||||||
type GpsResult =
|
type GpsResult =
|
||||||
| { ok: true; lat: number; lng: number }
|
| { ok: true; lat: number; lng: number }
|
||||||
| { ok: false; reason: "unsupported" | "denied" | "timeout" | "unknown" };
|
| { ok: false; reason: "unsupported" | "denied" | "timeout" | "unknown" };
|
||||||
@@ -95,6 +87,9 @@ export default function LandingPage() {
|
|||||||
const [gpsCoords, setGpsCoords] = useState<{ lat: number; lng: number } | null>(null);
|
const [gpsCoords, setGpsCoords] = useState<{ lat: number; lng: number } | null>(null);
|
||||||
const [gpsLocationName, setGpsLocationName] = useState<string | null>(null);
|
const [gpsLocationName, setGpsLocationName] = useState<string | null>(null);
|
||||||
|
|
||||||
|
const [scene, setScene] = useState<SceneType>("eat");
|
||||||
|
const sceneConfig = getSceneConfig(scene);
|
||||||
|
|
||||||
const [profile, setProfile] = useState<UserProfile | null>(null);
|
const [profile, setProfile] = useState<UserProfile | null>(null);
|
||||||
const [authModalOpen, setAuthModalOpen] = useState(false);
|
const [authModalOpen, setAuthModalOpen] = useState(false);
|
||||||
|
|
||||||
@@ -108,6 +103,12 @@ export default function LandingPage() {
|
|||||||
if (prefs.radius) setRadius(prefs.radius);
|
if (prefs.radius) setRadius(prefs.radius);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
const handleSceneChange = useCallback((s: SceneType) => {
|
||||||
|
setScene(s);
|
||||||
|
setCuisine("");
|
||||||
|
setPriceRange("any");
|
||||||
|
}, []);
|
||||||
|
|
||||||
const doGpsLocate = useCallback(async () => {
|
const doGpsLocate = useCallback(async () => {
|
||||||
setGpsStatus("locating");
|
setGpsStatus("locating");
|
||||||
const result = await requestGps();
|
const result = await requestGps();
|
||||||
@@ -208,12 +209,12 @@ export default function LandingPage() {
|
|||||||
setLoading(true);
|
setLoading(true);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
setLoadingText("正在搜索周边美食...");
|
setLoadingText(sceneConfig.loadingText);
|
||||||
|
|
||||||
const res = await fetch("/api/room/create", {
|
const res = await fetch("/api/room/create", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: { "Content-Type": "application/json" },
|
headers: { "Content-Type": "application/json" },
|
||||||
body: JSON.stringify({ ...coords, radius, priceRange, cuisine, userId: getUserId() }),
|
body: JSON.stringify({ ...coords, radius, priceRange, cuisine, userId: getUserId(), scene }),
|
||||||
});
|
});
|
||||||
|
|
||||||
const data = await res.json();
|
const data = await res.json();
|
||||||
@@ -289,7 +290,7 @@ export default function LandingPage() {
|
|||||||
别说随便
|
别说随便
|
||||||
</p>
|
</p>
|
||||||
<p className="mt-3 max-w-xs text-center text-sm leading-relaxed text-zinc-500">
|
<p className="mt-3 max-w-xs text-center text-sm leading-relaxed text-zinc-500">
|
||||||
和朋友一起滑卡片,再也不用纠结吃什么
|
{sceneConfig.subtitle}
|
||||||
</p>
|
</p>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
|
||||||
@@ -329,7 +330,34 @@ export default function LandingPage() {
|
|||||||
</motion.div>
|
</motion.div>
|
||||||
|
|
||||||
<motion.div
|
<motion.div
|
||||||
className="mt-10 flex w-full max-w-xs flex-col gap-3"
|
className="mt-8 flex items-center justify-center gap-2"
|
||||||
|
initial={{ y: 10, opacity: 0 }}
|
||||||
|
animate={{ y: 0, opacity: 1 }}
|
||||||
|
transition={{ duration: 0.4, delay: 0.12 }}
|
||||||
|
>
|
||||||
|
{SCENES.map((s) => {
|
||||||
|
const cfg = getSceneConfig(s);
|
||||||
|
const active = scene === s;
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
key={s}
|
||||||
|
onClick={() => handleSceneChange(s)}
|
||||||
|
disabled={loading}
|
||||||
|
className={`flex items-center gap-1.5 rounded-full px-4 py-2 text-sm font-semibold transition-all disabled:opacity-50 ${
|
||||||
|
active
|
||||||
|
? "bg-emerald-500 text-white shadow-md shadow-emerald-200"
|
||||||
|
: "bg-zinc-100 text-zinc-500 hover:bg-zinc-200"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span className="text-base leading-none">{cfg.emoji}</span>
|
||||||
|
{cfg.label}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</motion.div>
|
||||||
|
|
||||||
|
<motion.div
|
||||||
|
className="mt-5 flex w-full max-w-xs flex-col gap-3"
|
||||||
initial={{ y: 20, opacity: 0 }}
|
initial={{ y: 20, opacity: 0 }}
|
||||||
animate={{ y: 0, opacity: 1 }}
|
animate={{ y: 0, opacity: 1 }}
|
||||||
transition={{ duration: 0.5, delay: 0.15 }}
|
transition={{ duration: 0.5, delay: 0.15 }}
|
||||||
@@ -438,11 +466,11 @@ export default function LandingPage() {
|
|||||||
|
|
||||||
<div className="flex flex-col gap-2 rounded-xl border border-zinc-100 bg-zinc-50/50 px-3 py-2.5">
|
<div className="flex flex-col gap-2 rounded-xl border border-zinc-100 bg-zinc-50/50 px-3 py-2.5">
|
||||||
<div className="flex items-center gap-3">
|
<div className="flex items-center gap-3">
|
||||||
<span className="w-8 shrink-0 text-xs font-medium text-zinc-400">美食</span>
|
<span className="w-8 shrink-0 text-xs font-medium text-zinc-400">{sceneConfig.tagLabel}</span>
|
||||||
<div className="relative flex flex-1 items-center">
|
<div className="relative flex flex-1 items-center">
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="想吃什么?(留空则不限)"
|
placeholder={sceneConfig.tagPlaceholder}
|
||||||
value={cuisine}
|
value={cuisine}
|
||||||
onChange={(e) => setCuisine(e.target.value)}
|
onChange={(e) => setCuisine(e.target.value)}
|
||||||
disabled={loading}
|
disabled={loading}
|
||||||
@@ -463,7 +491,7 @@ export default function LandingPage() {
|
|||||||
<span className="w-8 shrink-0 text-xs font-medium text-zinc-400"></span>
|
<span className="w-8 shrink-0 text-xs font-medium text-zinc-400"></span>
|
||||||
<div className="flex flex-wrap items-center gap-1.5">
|
<div className="flex flex-wrap items-center gap-1.5">
|
||||||
<Flame size={11} className="shrink-0 text-orange-400" />
|
<Flame size={11} className="shrink-0 text-orange-400" />
|
||||||
{HOT_CUISINES.map((tag) => (
|
{sceneConfig.hotTags.map((tag) => (
|
||||||
<button
|
<button
|
||||||
key={tag}
|
key={tag}
|
||||||
type="button"
|
type="button"
|
||||||
@@ -505,7 +533,7 @@ export default function LandingPage() {
|
|||||||
<div className="flex items-center gap-3">
|
<div className="flex items-center gap-3">
|
||||||
<span className="w-8 shrink-0 text-xs font-medium text-zinc-400">人均</span>
|
<span className="w-8 shrink-0 text-xs font-medium text-zinc-400">人均</span>
|
||||||
<div className="flex flex-wrap gap-1.5">
|
<div className="flex flex-wrap gap-1.5">
|
||||||
{PRICE_OPTIONS.map((opt) => (
|
{sceneConfig.priceOptions.map((opt) => (
|
||||||
<button
|
<button
|
||||||
key={opt.value}
|
key={opt.value}
|
||||||
type="button"
|
type="button"
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ import SwipeDeck from "@/components/SwipeDeck";
|
|||||||
import LeaveConfirmModal from "@/components/LeaveConfirmModal";
|
import LeaveConfirmModal from "@/components/LeaveConfirmModal";
|
||||||
import { useRoomPolling } from "@/hooks/useRoomPolling";
|
import { useRoomPolling } from "@/hooks/useRoomPolling";
|
||||||
import { getUserId } from "@/lib/userId";
|
import { getUserId } from "@/lib/userId";
|
||||||
|
import { getSceneConfig } from "@/lib/sceneConfig";
|
||||||
|
|
||||||
export default function RoomPage() {
|
export default function RoomPage() {
|
||||||
const params = useParams<{ id: string }>();
|
const params = useParams<{ id: string }>();
|
||||||
@@ -21,7 +22,7 @@ export default function RoomPage() {
|
|||||||
|
|
||||||
const {
|
const {
|
||||||
userCount, match, matchType, matchLikes, runnerUps, likeCounts, swipeCounts,
|
userCount, match, matchType, matchLikes, runnerUps, likeCounts, swipeCounts,
|
||||||
restaurants, notFound, mutate, creatorId, locked, users, userProfiles,
|
restaurants, notFound, mutate, creatorId, locked, users, userProfiles, scene,
|
||||||
} = useRoomPolling(roomId);
|
} = useRoomPolling(roomId);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -107,11 +108,13 @@ export default function RoomPage() {
|
|||||||
const initialIndex = swipeCounts[userId] ?? 0;
|
const initialIndex = swipeCounts[userId] ?? 0;
|
||||||
const ready = joined && userId && restaurants.length > 0;
|
const ready = joined && userId && restaurants.length > 0;
|
||||||
|
|
||||||
|
const sceneConfig = getSceneConfig(scene);
|
||||||
|
|
||||||
if (!ready) {
|
if (!ready) {
|
||||||
return (
|
return (
|
||||||
<div className="flex h-dvh flex-col items-center justify-center gap-3 bg-background">
|
<div className="flex h-dvh flex-col items-center justify-center gap-3 bg-background">
|
||||||
<div className="h-6 w-6 animate-spin rounded-full border-2 border-zinc-300 border-t-emerald-500" />
|
<div className="h-6 w-6 animate-spin rounded-full border-2 border-zinc-300 border-t-emerald-500" />
|
||||||
<p className="text-sm text-zinc-400">正在加载餐厅数据...</p>
|
<p className="text-sm text-zinc-400">正在加载数据...</p>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -129,6 +132,7 @@ export default function RoomPage() {
|
|||||||
swipeCounts={swipeCounts}
|
swipeCounts={swipeCounts}
|
||||||
totalCards={restaurants.length}
|
totalCards={restaurants.length}
|
||||||
userProfiles={userProfiles}
|
userProfiles={userProfiles}
|
||||||
|
scene={scene}
|
||||||
/>
|
/>
|
||||||
<SwipeDeck
|
<SwipeDeck
|
||||||
restaurants={restaurants}
|
restaurants={restaurants}
|
||||||
@@ -145,6 +149,7 @@ export default function RoomPage() {
|
|||||||
userProfiles={userProfiles}
|
userProfiles={userProfiles}
|
||||||
onReset={handleReset}
|
onReset={handleReset}
|
||||||
onNarrow={handleNarrow}
|
onNarrow={handleNarrow}
|
||||||
|
scene={scene}
|
||||||
/>
|
/>
|
||||||
<LeaveConfirmModal
|
<LeaveConfirmModal
|
||||||
open={showLeaveConfirm}
|
open={showLeaveConfirm}
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ import {
|
|||||||
Share2,
|
Share2,
|
||||||
Zap,
|
Zap,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { Restaurant, MatchType, RunnerUp } from "@/types";
|
import { Restaurant, MatchType, RunnerUp, SceneType } from "@/types";
|
||||||
import { fireCelebration, playChime } from "@/lib/celebrate";
|
import { fireCelebration, playChime } from "@/lib/celebrate";
|
||||||
import { isRegistered } from "@/lib/userId";
|
import { isRegistered } from "@/lib/userId";
|
||||||
|
|
||||||
@@ -36,6 +36,7 @@ interface MatchResultProps {
|
|||||||
onReset: () => Promise<void>;
|
onReset: () => Promise<void>;
|
||||||
onNarrow: (restaurantIds: string[]) => Promise<void>;
|
onNarrow: (restaurantIds: string[]) => Promise<void>;
|
||||||
resetting: boolean;
|
resetting: boolean;
|
||||||
|
scene?: SceneType;
|
||||||
}
|
}
|
||||||
|
|
||||||
function buildNavUrl(restaurant: Restaurant): string {
|
function buildNavUrl(restaurant: Restaurant): string {
|
||||||
@@ -85,7 +86,7 @@ function NoMatchResult({
|
|||||||
animate={{ y: 0, opacity: 1 }}
|
animate={{ y: 0, opacity: 1 }}
|
||||||
transition={{ delay: 0.45 }}
|
transition={{ delay: 0.45 }}
|
||||||
>
|
>
|
||||||
这一轮没有餐厅被选中,换个范围或菜系再试试?
|
这一轮没有店被选中,换个范围或类型再试试?
|
||||||
</motion.p>
|
</motion.p>
|
||||||
|
|
||||||
<motion.div
|
<motion.div
|
||||||
@@ -176,6 +177,7 @@ export default function MatchResult({
|
|||||||
onReset,
|
onReset,
|
||||||
onNarrow,
|
onNarrow,
|
||||||
resetting,
|
resetting,
|
||||||
|
scene = "eat",
|
||||||
}: MatchResultProps) {
|
}: MatchResultProps) {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const [showRunnerUps, setShowRunnerUps] = useState(false);
|
const [showRunnerUps, setShowRunnerUps] = useState(false);
|
||||||
@@ -220,10 +222,11 @@ export default function MatchResult({
|
|||||||
}, [userId, roomId, restaurant, matchType, userCount]);
|
}, [userId, roomId, restaurant, matchType, userCount]);
|
||||||
|
|
||||||
const handleShare = useCallback(async () => {
|
const handleShare = useCallback(async () => {
|
||||||
|
const verb = scene === "drink" ? "喝" : "吃";
|
||||||
const lines = [
|
const lines = [
|
||||||
isUnanimous
|
isUnanimous
|
||||||
? `🎉 默契度 100%!${userCount} 人全员一致选了同一家!`
|
? `🎉 默契度 100%!${userCount} 人全员一致选了同一家!`
|
||||||
: `🎉 我们用 NoWhatever 选好了!`,
|
: `🎉 我们用 NoWhatever 选好了去哪${verb}!`,
|
||||||
``,
|
``,
|
||||||
`📍 ${restaurant.name}`,
|
`📍 ${restaurant.name}`,
|
||||||
restaurant.rating ? `⭐ ${restaurant.rating}` : "",
|
restaurant.rating ? `⭐ ${restaurant.rating}` : "",
|
||||||
@@ -257,7 +260,7 @@ export default function MatchResult({
|
|||||||
} catch {
|
} catch {
|
||||||
showToast("复制失败,请手动复制");
|
showToast("复制失败,请手动复制");
|
||||||
}
|
}
|
||||||
}, [restaurant, showToast, isUnanimous, userCount]);
|
}, [restaurant, showToast, isUnanimous, userCount, scene]);
|
||||||
|
|
||||||
if (matchType === "no_match") {
|
if (matchType === "no_match") {
|
||||||
return <NoMatchResult onReset={onReset} resetting={resetting} />;
|
return <NoMatchResult onReset={onReset} resetting={resetting} />;
|
||||||
@@ -515,7 +518,7 @@ export default function MatchResult({
|
|||||||
className="flex items-center gap-1.5 text-sm font-medium text-amber-200 underline underline-offset-2 hover:text-white"
|
className="flex items-center gap-1.5 text-sm font-medium text-amber-200 underline underline-offset-2 hover:text-white"
|
||||||
>
|
>
|
||||||
<RefreshCw size={13} />
|
<RefreshCw size={13} />
|
||||||
换一批餐厅
|
换一批店
|
||||||
</motion.button>
|
</motion.button>
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
@@ -536,7 +539,7 @@ export default function MatchResult({
|
|||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
<RefreshCw size={13} />
|
<RefreshCw size={13} />
|
||||||
换一批餐厅
|
换一批店
|
||||||
</motion.button>
|
</motion.button>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -4,12 +4,15 @@ import { useCallback, useRef } from "react";
|
|||||||
import { motion, AnimatePresence } from "framer-motion";
|
import { motion, AnimatePresence } from "framer-motion";
|
||||||
import { QRCodeSVG } from "qrcode.react";
|
import { QRCodeSVG } from "qrcode.react";
|
||||||
import { X, Copy, Share2, QrCode } from "lucide-react";
|
import { X, Copy, Share2, QrCode } from "lucide-react";
|
||||||
|
import type { SceneType } from "@/types";
|
||||||
|
import { getSceneConfig } from "@/lib/sceneConfig";
|
||||||
|
|
||||||
interface QrInviteModalProps {
|
interface QrInviteModalProps {
|
||||||
open: boolean;
|
open: boolean;
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
roomId: string;
|
roomId: string;
|
||||||
onToast: (msg: string) => void;
|
onToast: (msg: string) => void;
|
||||||
|
scene?: SceneType;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function QrInviteModal({
|
export default function QrInviteModal({
|
||||||
@@ -17,7 +20,9 @@ export default function QrInviteModal({
|
|||||||
onClose,
|
onClose,
|
||||||
roomId,
|
roomId,
|
||||||
onToast,
|
onToast,
|
||||||
|
scene = "eat",
|
||||||
}: QrInviteModalProps) {
|
}: QrInviteModalProps) {
|
||||||
|
const sceneConfig = getSceneConfig(scene);
|
||||||
const inviteUrl =
|
const inviteUrl =
|
||||||
typeof window !== "undefined"
|
typeof window !== "undefined"
|
||||||
? `${window.location.origin}/invite/${roomId}`
|
? `${window.location.origin}/invite/${roomId}`
|
||||||
@@ -39,8 +44,8 @@ export default function QrInviteModal({
|
|||||||
|
|
||||||
const handleShare = useCallback(async () => {
|
const handleShare = useCallback(async () => {
|
||||||
const shareData = {
|
const shareData = {
|
||||||
title: "别说随便啦,来滑卡片决定吃什么!",
|
title: sceneConfig.shareTitle,
|
||||||
text: "我建好房间了,快点开链接一起选餐厅,滑中同一家就去吃!",
|
text: sceneConfig.shareText,
|
||||||
url: inviteUrl,
|
url: inviteUrl,
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -54,7 +59,7 @@ export default function QrInviteModal({
|
|||||||
}
|
}
|
||||||
|
|
||||||
handleCopy();
|
handleCopy();
|
||||||
}, [inviteUrl, handleCopy]);
|
}, [inviteUrl, handleCopy, sceneConfig]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<AnimatePresence>
|
<AnimatePresence>
|
||||||
@@ -88,7 +93,7 @@ export default function QrInviteModal({
|
|||||||
<h2 className="text-lg font-bold">邀请饭搭子</h2>
|
<h2 className="text-lg font-bold">邀请饭搭子</h2>
|
||||||
</div>
|
</div>
|
||||||
<p className="mt-1 text-xs text-zinc-400">
|
<p className="mt-1 text-xs text-zinc-400">
|
||||||
让朋友扫码加入房间,一起滑卡片选餐厅
|
{sceneConfig.qrSubtitle}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div className="mt-5 rounded-2xl border-2 border-dashed border-emerald-200 bg-emerald-50/30 p-4">
|
<div className="mt-5 rounded-2xl border-2 border-dashed border-emerald-200 bg-emerald-50/30 p-4">
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ import SwipeableCard from "./SwipeableCard";
|
|||||||
import ActionButtons from "./ActionButtons";
|
import ActionButtons from "./ActionButtons";
|
||||||
import MatchResult from "./MatchResult";
|
import MatchResult from "./MatchResult";
|
||||||
import SwipeGuide from "./SwipeGuide";
|
import SwipeGuide from "./SwipeGuide";
|
||||||
import { Restaurant, SwipeDirection, MatchType, RunnerUp, UserProfile } from "@/types";
|
import { Restaurant, SwipeDirection, MatchType, RunnerUp, UserProfile, SceneType } from "@/types";
|
||||||
import { Heart, Undo2, Check } from "lucide-react";
|
import { Heart, Undo2, Check } from "lucide-react";
|
||||||
import { getAvatar, getAvatarBg } from "@/lib/avatars";
|
import { getAvatar, getAvatarBg } from "@/lib/avatars";
|
||||||
|
|
||||||
@@ -149,6 +149,7 @@ interface SwipeDeckProps {
|
|||||||
userProfiles: Record<string, UserProfile>;
|
userProfiles: Record<string, UserProfile>;
|
||||||
onReset: () => Promise<void>;
|
onReset: () => Promise<void>;
|
||||||
onNarrow: (restaurantIds: string[]) => Promise<void>;
|
onNarrow: (restaurantIds: string[]) => Promise<void>;
|
||||||
|
scene?: SceneType;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function SwipeDeck({
|
export default function SwipeDeck({
|
||||||
@@ -166,6 +167,7 @@ export default function SwipeDeck({
|
|||||||
userProfiles,
|
userProfiles,
|
||||||
onReset,
|
onReset,
|
||||||
onNarrow,
|
onNarrow,
|
||||||
|
scene = "eat",
|
||||||
}: SwipeDeckProps) {
|
}: SwipeDeckProps) {
|
||||||
const [currentIndex, setCurrentIndex] = useState(initialIndex);
|
const [currentIndex, setCurrentIndex] = useState(initialIndex);
|
||||||
const [showMatch, setShowMatch] = useState(false);
|
const [showMatch, setShowMatch] = useState(false);
|
||||||
@@ -426,6 +428,7 @@ export default function SwipeDeck({
|
|||||||
onReset={handleReset}
|
onReset={handleReset}
|
||||||
onNarrow={handleNarrow}
|
onNarrow={handleNarrow}
|
||||||
resetting={resetting}
|
resetting={resetting}
|
||||||
|
scene={scene}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -5,7 +5,8 @@ import { Users, QrCode, LogOut, Crown, Lock } from "lucide-react";
|
|||||||
import { motion, AnimatePresence } from "framer-motion";
|
import { motion, AnimatePresence } from "framer-motion";
|
||||||
import QrInviteModal from "./QrInviteModal";
|
import QrInviteModal from "./QrInviteModal";
|
||||||
import RoomManageModal from "./RoomManageModal";
|
import RoomManageModal from "./RoomManageModal";
|
||||||
import type { UserProfile } from "@/types";
|
import type { UserProfile, SceneType } from "@/types";
|
||||||
|
import { getSceneConfig } from "@/lib/sceneConfig";
|
||||||
|
|
||||||
interface TopNavProps {
|
interface TopNavProps {
|
||||||
roomId: string;
|
roomId: string;
|
||||||
@@ -18,6 +19,7 @@ interface TopNavProps {
|
|||||||
swipeCounts?: Record<string, number>;
|
swipeCounts?: Record<string, number>;
|
||||||
totalCards?: number;
|
totalCards?: number;
|
||||||
userProfiles?: Record<string, UserProfile>;
|
userProfiles?: Record<string, UserProfile>;
|
||||||
|
scene?: SceneType;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function TopNav({
|
export default function TopNav({
|
||||||
@@ -31,7 +33,9 @@ export default function TopNav({
|
|||||||
swipeCounts = {},
|
swipeCounts = {},
|
||||||
totalCards = 0,
|
totalCards = 0,
|
||||||
userProfiles = {},
|
userProfiles = {},
|
||||||
|
scene = "eat",
|
||||||
}: TopNavProps) {
|
}: TopNavProps) {
|
||||||
|
const sceneConfig = getSceneConfig(scene);
|
||||||
const [toast, setToast] = useState("");
|
const [toast, setToast] = useState("");
|
||||||
const [showQr, setShowQr] = useState(false);
|
const [showQr, setShowQr] = useState(false);
|
||||||
const [showManage, setShowManage] = useState(false);
|
const [showManage, setShowManage] = useState(false);
|
||||||
@@ -110,6 +114,7 @@ export default function TopNav({
|
|||||||
onClose={() => setShowQr(false)}
|
onClose={() => setShowQr(false)}
|
||||||
roomId={roomId}
|
roomId={roomId}
|
||||||
onToast={showToast}
|
onToast={showToast}
|
||||||
|
scene={scene}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{isCreator && (
|
{isCreator && (
|
||||||
|
|||||||
@@ -75,6 +75,7 @@ export function useRoomPolling(roomId: string) {
|
|||||||
locked: data?.locked ?? false,
|
locked: data?.locked ?? false,
|
||||||
users: data?.users ?? [],
|
users: data?.users ?? [],
|
||||||
userProfiles: data?.userProfiles ?? {},
|
userProfiles: data?.userProfiles ?? {},
|
||||||
|
scene: data?.scene ?? "eat" as const,
|
||||||
notFound,
|
notFound,
|
||||||
isLoading,
|
isLoading,
|
||||||
error,
|
error,
|
||||||
|
|||||||
@@ -67,6 +67,7 @@ export async function buildRoomStatus(
|
|||||||
locked: data.locked,
|
locked: data.locked,
|
||||||
users: data.users,
|
users: data.users,
|
||||||
userProfiles,
|
userProfiles,
|
||||||
|
scene: data.scene,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,77 @@
|
|||||||
|
import type { SceneType } from "@/types";
|
||||||
|
|
||||||
|
export interface SceneConfig {
|
||||||
|
key: SceneType;
|
||||||
|
label: string;
|
||||||
|
emoji: string;
|
||||||
|
poiTypes: string;
|
||||||
|
defaultImage: string;
|
||||||
|
hotTags: readonly string[];
|
||||||
|
priceOptions: readonly { label: string; value: string }[];
|
||||||
|
tagLabel: string;
|
||||||
|
tagPlaceholder: string;
|
||||||
|
loadingText: string;
|
||||||
|
emptyError: string;
|
||||||
|
subtitle: string;
|
||||||
|
inviteText: string;
|
||||||
|
shareTitle: string;
|
||||||
|
shareText: string;
|
||||||
|
qrSubtitle: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const SCENE_CONFIGS: Record<SceneType, SceneConfig> = {
|
||||||
|
eat: {
|
||||||
|
key: "eat",
|
||||||
|
label: "吃什么",
|
||||||
|
emoji: "🍜",
|
||||||
|
poiTypes: "050000",
|
||||||
|
defaultImage:
|
||||||
|
"https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?w=800&q=80",
|
||||||
|
hotTags: ["火锅", "日料", "烧烤", "西餐", "川菜", "咖啡甜品", "小吃快餐"],
|
||||||
|
priceOptions: [
|
||||||
|
{ label: "不限", value: "any" },
|
||||||
|
{ label: "¥50以下", value: "under50" },
|
||||||
|
{ label: "¥50-100", value: "50to100" },
|
||||||
|
{ label: "¥100+", value: "over100" },
|
||||||
|
],
|
||||||
|
tagLabel: "美食",
|
||||||
|
tagPlaceholder: "想吃什么?(留空则不限)",
|
||||||
|
loadingText: "正在搜索周边美食...",
|
||||||
|
emptyError: "附近没有找到餐厅,试试扩大搜索范围或换个菜系",
|
||||||
|
subtitle: "和朋友一起滑卡片,再也不用纠结吃什么",
|
||||||
|
inviteText: "有人邀请你一起选餐厅",
|
||||||
|
shareTitle: "别说随便啦,来滑卡片决定吃什么!",
|
||||||
|
shareText: "我建好房间了,快点开链接一起选餐厅,滑中同一家就去吃!",
|
||||||
|
qrSubtitle: "让朋友扫码加入房间,一起滑卡片选餐厅",
|
||||||
|
},
|
||||||
|
drink: {
|
||||||
|
key: "drink",
|
||||||
|
label: "喝什么",
|
||||||
|
emoji: "🧋",
|
||||||
|
poiTypes: "050301|050302|050303|050400",
|
||||||
|
defaultImage:
|
||||||
|
"https://images.unsplash.com/photo-1556679343-c7306c1976bc?w=800&q=80",
|
||||||
|
hotTags: ["奶茶", "咖啡", "酒吧", "果茶", "甜品", "茶馆", "鸡尾酒"],
|
||||||
|
priceOptions: [
|
||||||
|
{ label: "不限", value: "any" },
|
||||||
|
{ label: "¥20以下", value: "under20" },
|
||||||
|
{ label: "¥20-50", value: "20to50" },
|
||||||
|
{ label: "¥50+", value: "over50" },
|
||||||
|
],
|
||||||
|
tagLabel: "饮品",
|
||||||
|
tagPlaceholder: "想喝什么?(留空则不限)",
|
||||||
|
loadingText: "正在搜索周边饮品店...",
|
||||||
|
emptyError: "附近没有找到饮品店,试试扩大搜索范围或换个类型",
|
||||||
|
subtitle: "和朋友一起滑卡片,再也不用纠结喝什么",
|
||||||
|
inviteText: "有人邀请你一起选饮品店",
|
||||||
|
shareTitle: "别说随便啦,来滑卡片决定喝什么!",
|
||||||
|
shareText: "我建好房间了,快点开链接一起选店,滑中同一家就去喝!",
|
||||||
|
qrSubtitle: "让朋友扫码加入房间,一起滑卡片选店",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
export const SCENES: SceneType[] = ["eat", "drink"];
|
||||||
|
|
||||||
|
export function getSceneConfig(scene: SceneType): SceneConfig {
|
||||||
|
return SCENE_CONFIGS[scene];
|
||||||
|
}
|
||||||
+5
-2
@@ -1,5 +1,5 @@
|
|||||||
import { prisma } from "./prisma";
|
import { prisma } from "./prisma";
|
||||||
import { Restaurant } from "@/types";
|
import { Restaurant, SceneType } from "@/types";
|
||||||
|
|
||||||
const ROOM_TTL_MS = 24 * 60 * 60 * 1000; // 24 hours
|
const ROOM_TTL_MS = 24 * 60 * 60 * 1000; // 24 hours
|
||||||
|
|
||||||
@@ -12,6 +12,7 @@ export interface RoomData {
|
|||||||
creatorId: string;
|
creatorId: string;
|
||||||
locked: boolean;
|
locked: boolean;
|
||||||
kickedUsers: string[];
|
kickedUsers: string[];
|
||||||
|
scene: SceneType;
|
||||||
}
|
}
|
||||||
|
|
||||||
function generateRoomId(): string {
|
function generateRoomId(): string {
|
||||||
@@ -28,6 +29,7 @@ function normalize(raw: Partial<RoomData>): RoomData {
|
|||||||
creatorId: raw.creatorId ?? "",
|
creatorId: raw.creatorId ?? "",
|
||||||
locked: raw.locked ?? false,
|
locked: raw.locked ?? false,
|
||||||
kickedUsers: raw.kickedUsers ?? [],
|
kickedUsers: raw.kickedUsers ?? [],
|
||||||
|
scene: raw.scene ?? "eat",
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -51,7 +53,7 @@ async function cleanupExpiredRooms() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function createRoom(restaurants: Restaurant[], creatorId: string): Promise<string> {
|
export async function createRoom(restaurants: Restaurant[], creatorId: string, scene: SceneType = "eat"): Promise<string> {
|
||||||
await cleanupExpiredRooms();
|
await cleanupExpiredRooms();
|
||||||
|
|
||||||
const data: RoomData = {
|
const data: RoomData = {
|
||||||
@@ -63,6 +65,7 @@ export async function createRoom(restaurants: Restaurant[], creatorId: string):
|
|||||||
creatorId,
|
creatorId,
|
||||||
locked: false,
|
locked: false,
|
||||||
kickedUsers: [],
|
kickedUsers: [],
|
||||||
|
scene,
|
||||||
};
|
};
|
||||||
|
|
||||||
const expiresAt = new Date(Date.now() + ROOM_TTL_MS);
|
const expiresAt = new Date(Date.now() + ROOM_TTL_MS);
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
|
export type SceneType = "eat" | "drink";
|
||||||
|
|
||||||
export interface Restaurant {
|
export interface Restaurant {
|
||||||
id: string;
|
id: string;
|
||||||
name: string;
|
name: string;
|
||||||
@@ -36,6 +38,7 @@ export interface RoomStatus {
|
|||||||
locked: boolean;
|
locked: boolean;
|
||||||
users: string[];
|
users: string[];
|
||||||
userProfiles: Record<string, UserProfile>;
|
userProfiles: Record<string, UserProfile>;
|
||||||
|
scene: SceneType;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface UserProfile {
|
export interface UserProfile {
|
||||||
|
|||||||
Reference in New Issue
Block a user