feat: AI 周末行程规划 — DeepSeek 智能排期 + 高德 POI + 多日翻页

- 接入 DeepSeek API,提交想法时自动 AI 打标(品类/时段/时长/搜索策略)
- 新增行程规划 API:智能选取想法 → 高德 POI 搜索 → AI 生成最优行程
- 支持多日计划("整个周末"拆分周六/周日,并行 AI 调用)
- 行程展示逐日翻页,时间线可滚动,操作按钮固定底部
- 分享卡适配多日格式,支持图片保存与原生分享
- Prisma schema 新增 WeekendPlan 模型及 BlindBoxIdea AI 标签字段
- Jenkinsfile 集成 DEEPSEEK_API_KEY 环境变量
This commit is contained in:
2026-02-27 01:51:47 +08:00
parent 8c6da410ca
commit 9c680ec11e
16 changed files with 1721 additions and 70 deletions
+310
View File
@@ -0,0 +1,310 @@
import { NextResponse } from "next/server";
import { prisma } from "@/lib/prisma";
import { requireMembership } from "@/lib/blindbox";
import { apiHandler, ApiError, requireUserId } from "@/lib/api";
import { requireAmapApiKey } from "@/lib/amap";
import { generateSchedule, type ScheduleContext } from "@/lib/ai";
interface AvailableTime {
date: string;
startHour: number;
endHour: number;
}
interface TaggedIdea {
id: string;
content: string;
category: string;
timeSlot: string;
estimatedMinutes: number;
searchQuery: string;
searchType: string;
}
const SLOT_CATEGORY_MAP: Record<string, string[]> = {
morning: ["outdoor", "sports", "culture"],
lunch: ["dining"],
afternoon: ["entertainment", "shopping", "relaxation", "outdoor", "culture"],
dinner: ["dining"],
evening: ["entertainment", "relaxation"],
};
function selectIdeasForSlots(ideas: TaggedIdea[], availableHours: number): TaggedIdea[] {
const byCategory = new Map<string, TaggedIdea[]>();
for (const idea of ideas) {
const list = byCategory.get(idea.category) || [];
list.push(idea);
byCategory.set(idea.category, list);
}
const slots: string[] = [];
if (availableHours >= 10) {
slots.push("morning", "lunch", "afternoon", "dinner", "evening");
} else if (availableHours >= 7) {
slots.push("morning", "lunch", "afternoon", "evening");
} else if (availableHours >= 5) {
slots.push("lunch", "afternoon", "evening");
} else {
slots.push("afternoon", "evening");
}
const selected: TaggedIdea[] = [];
const usedIds = new Set<string>();
for (const slot of slots) {
const preferredCategories = SLOT_CATEGORY_MAP[slot] || [];
let picked: TaggedIdea | null = null;
for (const cat of preferredCategories) {
const pool = (byCategory.get(cat) || []).filter((i) => !usedIds.has(i.id));
if (pool.length > 0) {
picked = pool[Math.floor(Math.random() * pool.length)];
break;
}
}
if (!picked) {
const remaining = ideas.filter((i) => !usedIds.has(i.id));
if (remaining.length > 0) {
picked = remaining[Math.floor(Math.random() * remaining.length)];
}
}
if (picked) {
selected.push(picked);
usedIds.add(picked.id);
}
}
return selected;
}
async function searchPois(
query: string,
searchType: string,
anchorLat: number,
anchorLng: number,
): Promise<{ name: string; address: string; lat: number; lng: number; rating?: number }[]> {
const apiKey = requireAmapApiKey();
if (searchType === "category") {
const url = new URL("https://restapi.amap.com/v5/place/around");
url.searchParams.set("key", apiKey);
url.searchParams.set("location", `${anchorLng},${anchorLat}`);
url.searchParams.set("keywords", query);
url.searchParams.set("radius", "5000");
url.searchParams.set("show_fields", "business");
url.searchParams.set("page_size", "8");
const res = await fetch(url.toString());
const data = await res.json();
if (data.status !== "1" || !data.pois?.length) return [];
return mapPois(data.pois);
}
// Text/brand search — bias results to the room's location
const url = new URL("https://restapi.amap.com/v5/place/text");
url.searchParams.set("key", apiKey);
url.searchParams.set("keywords", query);
url.searchParams.set("location", `${anchorLng},${anchorLat}`);
url.searchParams.set("show_fields", "business");
url.searchParams.set("page_size", "8");
const res = await fetch(url.toString());
const data = await res.json();
if (data.status !== "1" || !data.pois?.length) return [];
return mapPois(data.pois);
}
function mapPois(
pois: { name: string; address?: string; location?: string; business?: { rating?: string } }[],
) {
return pois
.filter((p) => p.location)
.map((p) => {
const [lng, lat] = (p.location ?? "0,0").split(",").map(Number);
const ratingStr = p.business?.rating;
return {
name: p.name,
address: p.address || "",
lat,
lng,
rating: ratingStr && ratingStr !== "[]" ? parseFloat(ratingStr) || undefined : undefined,
};
});
}
export const POST = apiHandler(async (req) => {
const { roomId, userId, availableTime } = await req.json();
requireUserId(userId);
if (!roomId) throw new ApiError("roomId 不能为空");
await requireMembership(roomId, userId);
const at = availableTime as AvailableTime;
if (
!at?.date ||
typeof at.startHour !== "number" ||
typeof at.endHour !== "number" ||
at.endHour <= at.startHour
) {
throw new ApiError("请选择有效的可用时间");
}
const room = await prisma.blindBoxRoom.findUnique({ where: { id: roomId } });
if (!room) throw new ApiError("房间不存在", 404);
if (!room.lat || !room.lng) {
throw new ApiError("请先设置房间位置", 400);
}
const allIdeas = await prisma.blindBoxIdea.findMany({
where: { roomId, status: "in_pool", category: { not: null } },
select: {
id: true,
content: true,
category: true,
timeSlot: true,
estimatedMinutes: true,
searchQuery: true,
searchType: true,
},
});
const taggedIdeas: TaggedIdea[] = allIdeas.filter(
(i): i is TaggedIdea =>
!!i.category && !!i.timeSlot && !!i.searchQuery && !!i.searchType &&
typeof i.estimatedMinutes === "number",
);
if (taggedIdeas.length < 2) {
throw new ApiError("盒子里至少需要 2 个已标记的想法才能生成计划", 400);
}
// Split into day configs — "整个周末" generates two separate days
const dayConfigs: AvailableTime[] =
at.date === "整个周末"
? [
{ date: "周六", startHour: at.startHour, endHour: at.endHour },
{ date: "周日", startHour: at.startHour, endHour: at.endHour },
]
: [at];
// Select ideas per day, avoiding duplicates across days when possible
const dayIdeas: TaggedIdea[][] = [];
const usedIds = new Set<string>();
for (const dayConfig of dayConfigs) {
const remaining = taggedIdeas.filter((i) => !usedIds.has(i.id));
const pool = remaining.length >= 2 ? remaining : taggedIdeas;
const selected = selectIdeasForSlots(pool, dayConfig.endHour - dayConfig.startHour);
for (const idea of selected) usedIds.add(idea.id);
dayIdeas.push(selected);
}
const allSelected = dayIdeas.flat();
if (allSelected.length === 0) {
throw new ApiError("无法从想法池中选出合适的活动", 400);
}
// Deduplicate search queries across all days
const uniqueByQuery = new Map<string, TaggedIdea>();
for (const idea of allSelected) {
if (!uniqueByQuery.has(idea.searchQuery)) uniqueByQuery.set(idea.searchQuery, idea);
}
// Phase 1: search brand/place type queries in parallel
const brandPlaceQueries = [...uniqueByQuery.values()].filter((i) => i.searchType !== "category");
const searchResults = await Promise.all(
brandPlaceQueries.map(async (idea) => {
try {
const pois = await searchPois(idea.searchQuery, idea.searchType, room.lat!, room.lng!);
return { query: idea.searchQuery, pois };
} catch {
return { query: idea.searchQuery, pois: [] };
}
}),
);
const candidates: ScheduleContext["candidates"] = {};
for (const result of searchResults) {
candidates[result.query] = result.pois;
}
// Phase 2: category-type queries anchored to centroid of found POIs
const catQueries = [...uniqueByQuery.values()].filter((i) => i.searchType === "category");
if (catQueries.length > 0) {
const allPois = Object.values(candidates).flat();
let anchorLat = room.lat;
let anchorLng = room.lng;
if (allPois.length > 0) {
anchorLat = allPois.reduce((s, p) => s + p.lat, 0) / allPois.length;
anchorLng = allPois.reduce((s, p) => s + p.lng, 0) / allPois.length;
}
const catResults = await Promise.all(
catQueries.map(async (idea) => {
try {
const pois = await searchPois(idea.searchQuery, idea.searchType, anchorLat, anchorLng);
return { query: idea.searchQuery, pois };
} catch {
return { query: idea.searchQuery, pois: [] };
}
}),
);
for (const result of catResults) {
candidates[result.query] = result.pois;
}
}
// Generate schedule for each day (parallel AI calls)
const schedules = await Promise.all(
dayConfigs.map((dayConfig, idx) => {
const ideas = dayIdeas[idx];
const ctx: ScheduleContext = {
ideas: ideas.map((i) => ({
content: i.content,
category: i.category,
timeSlot: i.timeSlot,
estimatedMinutes: i.estimatedMinutes,
searchQuery: i.searchQuery,
searchType: i.searchType,
})),
candidates,
userLocation: { lat: room.lat!, lng: room.lng! },
availableTime: dayConfig,
};
return generateSchedule(ctx);
}),
);
const days = schedules
.map((schedule, idx) =>
schedule
? { date: dayConfigs[idx].date, items: schedule.items, summary: schedule.summary }
: null,
)
.filter((d) => d !== null);
if (days.length === 0) {
throw new ApiError("AI 规划失败,请稍后重试", 500);
}
const plan = await prisma.weekendPlan.create({
data: {
roomId,
userId,
planData: JSON.stringify({
days,
selectedIdeaIds: allSelected.map((i) => i.id),
}),
},
});
return NextResponse.json({
id: plan.id,
days,
createdAt: plan.createdAt,
});
});
+42 -1
View File
@@ -1,6 +1,6 @@
import { NextResponse } from "next/server";
import { prisma } from "@/lib/prisma";
import { getRoomByCode } from "@/lib/blindbox";
import { getRoomByCode, requireMembership } from "@/lib/blindbox";
import { apiHandler, ApiError, requireUserId } from "@/lib/api";
export const GET = apiHandler(async (_req, { params }) => {
@@ -14,6 +14,9 @@ export const GET = apiHandler(async (_req, { params }) => {
code: room.code,
name: room.name,
creatorId: room.creatorId,
city: room.city,
lat: room.lat,
lng: room.lng,
poolCount: room._count.ideas,
members: room.members.map((m) => ({
...m.user,
@@ -22,6 +25,44 @@ export const GET = apiHandler(async (_req, { params }) => {
});
});
export const PATCH = apiHandler(async (req, { params }) => {
const { code } = await params;
const { userId, city, lat, lng } = await req.json();
requireUserId(userId);
const room = await prisma.blindBoxRoom.findUnique({
where: { code: code.toUpperCase() },
});
if (!room) throw new ApiError("房间不存在", 404);
await requireMembership(room.id, userId);
const numLat = Number(lat);
const numLng = Number(lng);
if (
!Number.isFinite(numLat) || !Number.isFinite(numLng) ||
numLat < -90 || numLat > 90 || numLng < -180 || numLng > 180
) {
throw new ApiError("位置坐标无效");
}
const updated = await prisma.blindBoxRoom.update({
where: { id: room.id },
data: {
city: typeof city === "string" ? city.trim() : null,
lat: numLat,
lng: numLng,
},
});
return NextResponse.json({
city: updated.city,
lat: updated.lat,
lng: updated.lng,
});
});
export const DELETE = apiHandler(async (req, { params }) => {
const { code } = await params;
const { userId } = await req.json();
+57 -3
View File
@@ -3,6 +3,9 @@ import { prisma } from "@/lib/prisma";
import { requireMembership } from "@/lib/blindbox";
import { apiHandler, ApiError, requireUserId } from "@/lib/api";
import { validateIdeaContent, requireString } from "@/lib/validation";
import { tagIdea } from "@/lib/ai";
const TAG_TIMEOUT_MS = 3000;
export const POST = apiHandler(async (req) => {
const { roomId, userId, content } = await req.json();
@@ -17,7 +20,29 @@ export const POST = apiHandler(async (req) => {
data: { roomId, userId, content: trimmedContent },
});
return NextResponse.json({ id: idea.id }, { status: 201 });
const tags = await Promise.race([
tagIdea(trimmedContent),
new Promise<null>((resolve) => setTimeout(() => resolve(null), TAG_TIMEOUT_MS)),
]);
if (tags) {
await prisma.blindBoxIdea.update({
where: { id: idea.id },
data: {
category: tags.category,
timeSlot: tags.timeSlot,
estimatedMinutes: tags.estimatedMinutes,
outdoor: tags.outdoor,
searchQuery: tags.searchQuery,
searchType: tags.searchType,
},
});
}
return NextResponse.json(
{ id: idea.id, ...tags && { tags } },
{ status: 201 },
);
});
export const GET = apiHandler(async (req) => {
@@ -33,7 +58,17 @@ export const GET = apiHandler(async (req) => {
prisma.blindBoxIdea.findMany({
where: { roomId, userId, status: "in_pool" },
orderBy: { createdAt: "desc" },
select: { id: true, content: true, createdAt: true },
select: {
id: true,
content: true,
createdAt: true,
category: true,
timeSlot: true,
estimatedMinutes: true,
outdoor: true,
searchQuery: true,
searchType: true,
},
}),
prisma.blindBoxIdea.findMany({
where: { roomId, status: "drawn" },
@@ -62,7 +97,26 @@ export const PUT = apiHandler(async (req) => {
if (count === 0) throw new ApiError("想法不存在、已被抽中或无权编辑", 404);
return NextResponse.json({ id: ideaId, content: trimmedContent });
const tags = await Promise.race([
tagIdea(trimmedContent),
new Promise<null>((resolve) => setTimeout(() => resolve(null), TAG_TIMEOUT_MS)),
]);
if (tags) {
await prisma.blindBoxIdea.updateMany({
where: { id: ideaId, userId, status: "in_pool" },
data: {
category: tags.category,
timeSlot: tags.timeSlot,
estimatedMinutes: tags.estimatedMinutes,
outdoor: tags.outdoor,
searchQuery: tags.searchQuery,
searchType: tags.searchType,
},
});
}
return NextResponse.json({ id: ideaId, content: trimmedContent, ...tags && { tags } });
});
export const DELETE = apiHandler(async (req) => {
+69
View File
@@ -0,0 +1,69 @@
import { NextResponse } from "next/server";
import { apiHandler, ApiError } from "@/lib/api";
import { requireAmapApiKey } from "@/lib/amap";
interface AmapPoiV5 {
id: string;
name: string;
address?: string;
location?: string;
type?: string;
business?: {
rating?: string;
cost?: string;
tel?: string;
};
}
export const GET = apiHandler(async (req) => {
const keywords = req.nextUrl.searchParams.get("keywords")?.trim();
if (!keywords) throw new ApiError("keywords 不能为空");
const city = req.nextUrl.searchParams.get("city")?.trim();
const types = req.nextUrl.searchParams.get("types")?.trim();
const apiKey = requireAmapApiKey();
const url = new URL("https://restapi.amap.com/v5/place/text");
url.searchParams.set("key", apiKey);
url.searchParams.set("keywords", keywords);
url.searchParams.set("show_fields", "business");
url.searchParams.set("page_size", "10");
if (city) url.searchParams.set("region", city);
if (types) url.searchParams.set("types", types);
let data;
try {
const res = await fetch(url.toString());
data = await res.json();
} catch {
throw new ApiError("位置服务暂时不可用,请稍后重试", 503);
}
if (data.status !== "1" || !data.pois?.length) {
return NextResponse.json([]);
}
const results = data.pois
.filter((poi: AmapPoiV5) => poi.location)
.map((poi: AmapPoiV5) => {
const [lng, lat] = (poi.location ?? "0,0").split(",").map(Number);
const ratingStr = poi.business?.rating;
const rating = ratingStr && ratingStr !== "[]" ? parseFloat(ratingStr) || null : null;
const costStr = poi.business?.cost;
const cost = costStr && costStr !== "[]" && costStr !== "0" ? Number(costStr) : null;
return {
id: poi.id,
name: poi.name,
address: poi.address || "",
lat,
lng,
rating,
cost,
};
});
return NextResponse.json(results);
});
+267 -59
View File
@@ -15,6 +15,9 @@ import {
Copy,
Trash2,
LogOut,
MapPin,
Calendar,
Sparkles,
} from "lucide-react";
import confetti from "canvas-confetti";
import { getCachedProfile, isRegistered } from "@/lib/userId";
@@ -22,21 +25,26 @@ import ShareCardModal from "@/components/ShareCardModal";
import Button from "@/components/Button";
import BlindboxMyIdeas, { type MyIdea } from "@/components/BlindboxMyIdeas";
import BlindboxDrawnHistory, { type DrawnIdea } from "@/components/BlindboxDrawnHistory";
import WeekendTimeSelector from "@/components/WeekendTimeSelector";
import BlindboxPlan from "@/components/BlindboxPlan";
import { useToast } from "@/hooks/useToast";
import { useShare } from "@/hooks/useShare";
import { BlindboxRoomSkeleton } from "@/components/Skeleton";
import type { UserProfile } from "@/types";
import type { UserProfile, WeekendPlanData } from "@/types";
interface RoomInfo {
id: string;
code: string;
name: string;
creatorId: string;
city: string | null;
lat: number | null;
lng: number | null;
poolCount: number;
members: { id: string; username: string; avatar: string }[];
}
type Phase = "pool" | "shaking" | "reveal";
type Phase = "pool" | "shaking" | "reveal" | "time_select" | "planning" | "plan_reveal";
export default function BlindboxRoomPage() {
const { code } = useParams<{ code: string }>();
@@ -62,6 +70,11 @@ export default function BlindboxRoomPage() {
const toast = useToast();
const [confirmLeave, setConfirmLeave] = useState(false);
const [leaving, setLeaving] = useState(false);
const [locating, setLocating] = useState(false);
const [planDays, setPlanDays] = useState<WeekendPlanData[]>([]);
const [planAccepted, setPlanAccepted] = useState(false);
const [generating, setGenerating] = useState(false);
const [showPlanShareCard, setShowPlanShareCard] = useState(false);
const boxControls = useAnimation();
const inputRef = useRef<HTMLInputElement>(null);
@@ -151,6 +164,66 @@ export default function BlindboxRoomPage() {
finally { setJoiningRoom(false); }
};
const handleSetLocation = useCallback(async () => {
if (locating || !profile || !room) return;
setLocating(true);
try {
const pos = await new Promise<GeolocationPosition>((resolve, reject) =>
navigator.geolocation.getCurrentPosition(resolve, reject, { timeout: 10000 }),
);
const { latitude: lat, longitude: lng } = pos.coords;
const regeoRes = await fetch(`/api/location/regeo?lat=${lat}&lng=${lng}`);
const regeo = regeoRes.ok ? await regeoRes.json() : {};
const cityName = regeo.name || "未知位置";
const patchRes = await fetch(`/api/blindbox/room/${room.code}`, {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ userId: profile.id, city: cityName, lat, lng }),
});
if (!patchRes.ok) throw new Error("保存位置失败");
setRoom((prev) => prev ? { ...prev, city: cityName, lat, lng } : prev);
toast.show("位置已设置");
} catch {
toast.show("获取位置失败,请允许定位权限");
} finally {
setLocating(false);
}
}, [locating, profile, room, toast]);
const handleGeneratePlan = useCallback(async (timeConfig: { date: string; startHour: number; endHour: number }) => {
if (generating || !profile || !room) return;
setGenerating(true);
setPhase("planning");
setError("");
try {
const res = await fetch("/api/blindbox/plan", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
roomId: room.id,
userId: profile.id,
availableTime: timeConfig,
}),
});
if (!res.ok) {
const data = await res.json();
throw new Error(data.error || "生成失败");
}
const data = await res.json();
setPlanDays(data.days);
setPlanAccepted(false);
setPhase("plan_reveal");
fireConfetti();
} catch (e) {
setError(e instanceof Error ? e.message : "生成计划失败");
setPhase("pool");
} finally {
setGenerating(false);
}
}, [generating, profile, room]);
const handleSubmit = async () => {
const text = input.trim();
if (!text || submitting || !profile || !room) return;
@@ -166,10 +239,22 @@ export default function BlindboxRoomPage() {
const data = await res.json();
throw new Error(data.error || "提交失败");
}
const { id } = await res.json();
const data = await res.json();
setInput("");
setPoolCount((c) => c + 1);
setMyIdeas((prev) => [{ id, content: text, createdAt: new Date().toISOString() }, ...prev]);
setMyIdeas((prev) => [{
id: data.id,
content: text,
createdAt: new Date().toISOString(),
...data.tags && {
category: data.tags.category,
timeSlot: data.tags.timeSlot,
estimatedMinutes: data.tags.estimatedMinutes,
outdoor: data.tags.outdoor,
searchQuery: data.tags.searchQuery,
searchType: data.tags.searchType,
},
}, ...prev]);
setSubmitFlash(true);
timersRef.current.push(setTimeout(() => setSubmitFlash(false), 600));
boxControls.start({
@@ -198,11 +283,23 @@ export default function BlindboxRoomPage() {
const data = await res.json();
throw new Error(data.error || "编辑失败");
}
setMyIdeas((prev) => prev.map((i) => (i.id === ideaId ? { ...i, content: trimmed } : i)));
const data = await res.json();
setMyIdeas((prev) => prev.map((i) => (i.id === ideaId ? {
...i,
content: trimmed,
...data.tags && {
category: data.tags.category,
timeSlot: data.tags.timeSlot,
estimatedMinutes: data.tags.estimatedMinutes,
outdoor: data.tags.outdoor,
searchQuery: data.tags.searchQuery,
searchType: data.tags.searchType,
},
} : i)));
} catch (e) {
toast.show(e instanceof Error ? e.message : "编辑失败");
}
}, [profile]);
}, [profile, toast]);
const handleDeleteIdea = useCallback(async (ideaId: string) => {
if (!profile) return;
@@ -328,7 +425,9 @@ export default function BlindboxRoomPage() {
if (!room) return null;
return (
<div className="relative flex min-h-dvh flex-col items-center bg-background px-5 py-6 overflow-y-auto scrollbar-none">
<div className={`relative flex h-dvh flex-col items-center bg-background px-5 py-6 scrollbar-none ${
phase === "plan_reveal" ? "overflow-hidden" : "overflow-y-auto"
}`}>
{/* Header */}
<div className="flex w-full max-w-sm items-center gap-3">
@@ -341,7 +440,21 @@ export default function BlindboxRoomPage() {
</button>
<div className="min-w-0 flex-1">
<p className="truncate text-sm font-bold text-heading">{room.name}</p>
<p className="text-[10px] text-dim"> {room.code}</p>
<div className="mt-0.5 flex items-center gap-2">
<p className="text-[10px] text-dim"> {room.code}</p>
<button
onClick={handleSetLocation}
disabled={locating}
className="flex items-center gap-0.5 text-[10px] font-medium text-purple-400/70 transition-colors active:text-purple-400"
>
{locating ? (
<Loader2 size={9} className="animate-spin" />
) : (
<MapPin size={9} />
)}
{room.city || "设置位置"}
</button>
</div>
</div>
{/* Members */}
@@ -424,44 +537,46 @@ export default function BlindboxRoomPage() {
</motion.div>
) : (
<>
{/* Blind Box Visual */}
<div className="mt-8 flex flex-col items-center">
<motion.div
animate={boxControls}
className="relative flex h-36 w-36 items-center justify-center"
>
<div className="absolute inset-0 rounded-3xl bg-linear-to-br from-purple-600/20 to-indigo-600/20 blur-xl" />
<div className="relative flex h-32 w-32 flex-col items-center justify-center rounded-2xl bg-linear-to-br from-indigo-900 to-purple-900 shadow-2xl shadow-purple-900/50 ring-1 ring-purple-700/30">
<div className="absolute -top-2 left-1/2 h-5 w-[90%] -translate-x-1/2 rounded-t-xl bg-linear-to-r from-purple-700 to-indigo-700 shadow-md" />
<div className="absolute top-3 h-full w-3 bg-linear-to-b from-amber-400/60 to-amber-400/10" />
<div className="absolute top-6 h-3 w-full bg-linear-to-r from-amber-400/0 via-amber-400/60 to-amber-400/0" />
<motion.div
animate={submitFlash ? { scale: [1, 1.3, 1] } : {}}
transition={{ duration: 0.3 }}
>
<Package size={40} className="relative z-10 text-purple-300/60" strokeWidth={1.5} />
</motion.div>
<motion.div
className="absolute -right-2 -top-2 text-lg"
animate={{ rotate: [0, 15, -15, 0], scale: [1, 1.2, 1] }}
transition={{ duration: 2, repeat: Infinity, repeatDelay: 3 }}
>
</motion.div>
</div>
</motion.div>
{/* Blind Box Visual — hidden during plan phases */}
{phase !== "planning" && phase !== "plan_reveal" && (
<div className="mt-8 flex flex-col items-center">
<motion.div
animate={boxControls}
className="relative flex h-36 w-36 items-center justify-center"
>
<div className="absolute inset-0 rounded-3xl bg-linear-to-br from-purple-600/20 to-indigo-600/20 blur-xl" />
<div className="relative flex h-32 w-32 flex-col items-center justify-center rounded-2xl bg-linear-to-br from-indigo-900 to-purple-900 shadow-2xl shadow-purple-900/50 ring-1 ring-purple-700/30">
<div className="absolute -top-2 left-1/2 h-5 w-[90%] -translate-x-1/2 rounded-t-xl bg-linear-to-r from-purple-700 to-indigo-700 shadow-md" />
<div className="absolute top-3 h-full w-3 bg-linear-to-b from-amber-400/60 to-amber-400/10" />
<div className="absolute top-6 h-3 w-full bg-linear-to-r from-amber-400/0 via-amber-400/60 to-amber-400/0" />
<motion.div
animate={submitFlash ? { scale: [1, 1.3, 1] } : {}}
transition={{ duration: 0.3 }}
>
<Package size={40} className="relative z-10 text-purple-300/60" strokeWidth={1.5} />
</motion.div>
<motion.div
className="absolute -right-2 -top-2 text-lg"
animate={{ rotate: [0, 15, -15, 0], scale: [1, 1.2, 1] }}
transition={{ duration: 2, repeat: Infinity, repeatDelay: 3 }}
>
</motion.div>
</div>
</motion.div>
<motion.p
className="mt-4 text-sm font-semibold text-muted"
key={poolCount}
initial={{ scale: 1.2, opacity: 0 }}
animate={{ scale: 1, opacity: 1 }}
>
{" "}
<span className="text-lg font-black text-purple-400">{poolCount}</span>{" "}
</motion.p>
</div>
<motion.p
className="mt-4 text-sm font-semibold text-muted"
key={poolCount}
initial={{ scale: 1.2, opacity: 0 }}
animate={{ scale: 1, opacity: 1 }}
>
{" "}
<span className="text-lg font-black text-purple-400">{poolCount}</span>{" "}
</motion.p>
</div>
)}
{/* Pool / Shaking / Reveal phases */}
<AnimatePresence mode="wait">
@@ -495,17 +610,35 @@ export default function BlindboxRoomPage() {
</button>
</div>
<motion.button
onClick={handleDraw}
disabled={poolCount === 0}
className="relative flex h-14 w-full items-center justify-center gap-2 overflow-hidden rounded-2xl bg-linear-to-r from-red-600 to-rose-500 text-base font-black text-white shadow-lg shadow-red-900/40 transition-shadow hover:shadow-xl hover:shadow-red-900/50 disabled:opacity-40 disabled:shadow-none"
whileHover={{ scale: 1.02 }}
whileTap={{ scale: 0.97 }}
>
<div className="absolute inset-0 bg-linear-to-r from-transparent via-white/10 to-transparent -translate-x-full animate-[shimmer_3s_infinite]" />
<Flame size={20} />
</motion.button>
<div className="flex w-full gap-2">
<motion.button
onClick={handleDraw}
disabled={poolCount === 0}
className="relative flex h-14 flex-1 items-center justify-center gap-2 overflow-hidden rounded-2xl bg-linear-to-r from-red-600 to-rose-500 text-sm font-black text-white shadow-lg shadow-red-900/40 transition-shadow hover:shadow-xl hover:shadow-red-900/50 disabled:opacity-40 disabled:shadow-none"
whileHover={{ scale: 1.02 }}
whileTap={{ scale: 0.97 }}
>
<div className="absolute inset-0 bg-linear-to-r from-transparent via-white/10 to-transparent -translate-x-full animate-[shimmer_3s_infinite]" />
<Flame size={18} />
</motion.button>
<motion.button
onClick={() => {
if (!room?.city) {
toast.show("请先点击房间名下方设置位置");
return;
}
setPhase("time_select");
}}
disabled={poolCount < 2}
className="relative flex h-14 flex-1 items-center justify-center gap-2 overflow-hidden rounded-2xl bg-linear-to-r from-purple-600 to-indigo-600 text-sm font-black text-white shadow-lg shadow-purple-900/40 transition-shadow hover:shadow-xl hover:shadow-purple-900/50 disabled:opacity-40 disabled:shadow-none"
whileHover={{ scale: 1.02 }}
whileTap={{ scale: 0.97 }}
>
<Calendar size={18} />
</motion.button>
</div>
{error && (
<motion.p
@@ -613,6 +746,69 @@ export default function BlindboxRoomPage() {
</div>
</motion.div>
)}
{phase === "planning" && (
<motion.div
key="planning"
className="mt-8 flex flex-col items-center gap-4"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
>
<motion.div
className="relative flex h-20 w-20 items-center justify-center"
animate={{ rotate: [0, 360] }}
transition={{ duration: 3, repeat: Infinity, ease: "linear" }}
>
<div className="absolute inset-0 rounded-full bg-purple-600/15 blur-lg" />
<Sparkles size={28} className="relative text-purple-400" />
</motion.div>
<p className="text-sm font-bold text-purple-300 animate-pulse">
AI ...
</p>
<p className="text-[11px] text-dim"> · 线 · </p>
</motion.div>
)}
{phase === "plan_reveal" && planDays.length > 0 && (
<motion.div
key="plan_reveal"
className="mt-4 flex min-h-0 flex-1 w-full"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
>
<BlindboxPlan
days={planDays}
accepted={planAccepted}
regenerating={generating}
onAccept={() => {
setPlanAccepted(true);
fireConfetti();
}}
onRegenerate={() => {
setPhase("time_select");
}}
onShare={() => setShowPlanShareCard(true)}
onBack={() => {
setPhase("pool");
setPlanDays([]);
setPlanAccepted(false);
}}
/>
</motion.div>
)}
</AnimatePresence>
{/* Time selector modal */}
<AnimatePresence>
{phase === "time_select" && (
<WeekendTimeSelector
onConfirm={handleGeneratePlan}
onClose={() => setPhase("pool")}
loading={generating}
/>
)}
</AnimatePresence>
{myIdeas.length > 0 && phase === "pool" && (
@@ -623,7 +819,7 @@ export default function BlindboxRoomPage() {
/>
)}
{phase !== "shaking" && (
{phase !== "shaking" && phase !== "planning" && (
<BlindboxDrawnHistory items={drawnHistory} />
)}
</>
@@ -643,8 +839,20 @@ export default function BlindboxRoomPage() {
/>
)}
{/* Leave / Delete */}
{isMember && room && (
{planDays.length > 0 && room && (
<ShareCardModal
open={showPlanShareCard}
onClose={() => setShowPlanShareCard(false)}
data={{
type: "plan",
days: planDays,
roomName: room.name,
}}
/>
)}
{/* Leave / Delete — hidden during plan view */}
{isMember && room && phase !== "plan_reveal" && phase !== "planning" && (
<motion.div
className="mt-12 w-full max-w-sm"
initial={{ opacity: 0 }}