fix(blindbox): 修复房间创建后返回大厅不可见 + 大厅房间列表管理

- 修复房主退出房间时误删整间房的问题,改为返回大厅(房间保留)
- 修复大厅页 fetchRooms 时序依赖导致导航回来不刷新的问题
- fetch 添加 cache:no-store + router.refresh() 确保数据始终最新
- 房间列表增加 max-h 滚动 + 底部渐变遮罩防溢出
- 大厅房间卡片支持内联删除/退出(··· 按钮 → 确认栏)
- rooms API 返回 creatorId 以区分房主/成员操作
This commit is contained in:
2026-02-27 18:38:05 +08:00
parent 2d49744dd0
commit 1e39c72a63
3 changed files with 270 additions and 108 deletions
+54 -23
View File
@@ -590,6 +590,12 @@ export default function BlindboxRoomPage() {
const isCreator = profile?.id === room?.creatorId;
const handleBackToLobby = useCallback(() => {
router.push("/blindbox");
router.refresh();
}, [router]);
/** Non-creator: leave room (remove membership). Creator: delete room (after confirm). */
const handleLeaveOrDelete = async () => {
if (!confirmLeave) {
setConfirmLeave(true);
@@ -608,7 +614,8 @@ export default function BlindboxRoomPage() {
const data = await res.json();
throw new Error(data.error || "操作失败");
}
router.replace("/blindbox");
router.push("/blindbox");
router.refresh();
} catch (e) {
toast.show(e instanceof Error ? e.message : "操作失败");
setConfirmLeave(false);
@@ -1130,34 +1137,58 @@ export default function BlindboxRoomPage() {
/>
)}
{/* Leave / Delete — hidden during plan view */}
{/* Leave / Back — hidden during plan view. Creator: 返回大厅 (no delete) + optional 删除房间. Non-creator: 退出房间. */}
{isMember && room && phase !== "plan_reveal" && phase !== "planning" && (
<motion.div
className="mt-12 w-full max-w-sm"
className="mt-12 flex w-full max-w-sm flex-col items-center gap-2"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ delay: 0.5 }}
>
<button
onClick={handleLeaveOrDelete}
disabled={leaving}
className={`flex w-full items-center justify-center gap-2 rounded-xl py-2.5 text-xs font-medium transition-colors ${
confirmLeave
? "bg-rose-600/15 text-rose-400 ring-1 ring-rose-500/30"
: "text-muted hover:text-rose-400/80"
}`}
>
{leaving ? (
<Loader2 size={13} className="animate-spin" />
) : isCreator ? (
<Trash2 size={13} />
) : (
<LogOut size={13} />
)}
{confirmLeave
? isCreator ? "确认删除房间?所有想法将被清除" : "确认退出房间?"
: isCreator ? "删除房间" : "退出房间"}
</button>
{isCreator ? (
<>
<button
onClick={handleBackToLobby}
className="flex w-full items-center justify-center gap-2 rounded-xl py-2.5 text-xs font-medium text-muted transition-colors hover:text-foreground active:bg-elevated"
>
<ArrowLeft size={13} />
</button>
<button
onClick={handleLeaveOrDelete}
disabled={leaving}
className={`flex w-full items-center justify-center gap-2 rounded-xl py-2 text-xs font-medium transition-colors ${
confirmLeave
? "bg-rose-600/15 text-rose-400 ring-1 ring-rose-500/30"
: "text-dim hover:text-rose-400/80"
}`}
>
{leaving ? (
<Loader2 size={12} className="animate-spin" />
) : (
<Trash2 size={12} />
)}
{confirmLeave ? "确认删除房间?所有想法将被清除" : "删除房间"}
</button>
</>
) : (
<button
onClick={handleLeaveOrDelete}
disabled={leaving}
className={`flex w-full items-center justify-center gap-2 rounded-xl py-2.5 text-xs font-medium transition-colors ${
confirmLeave
? "bg-rose-600/15 text-rose-400 ring-1 ring-rose-500/30"
: "text-muted hover:text-rose-400/80"
}`}
>
{leaving ? (
<Loader2 size={13} className="animate-spin" />
) : (
<LogOut size={13} />
)}
{confirmLeave ? "确认退出房间?" : "退出房间"}
</button>
)}
</motion.div>
)}