diff --git a/app/chat/[id]/page.tsx b/app/chat/[id]/page.tsx new file mode 100644 index 0000000..f39824a --- /dev/null +++ b/app/chat/[id]/page.tsx @@ -0,0 +1,106 @@ +"use client" +import { useRouter } from "next/navigation" +import { ArrowLeft, Mic, Plus, Video, MoreHorizontal, Users } from "lucide-react" +import Image from "next/image" + +export default function ChatRoomPage({ params }: { params: { id: string } }) { + const router = useRouter() + + return ( +
+ {/* Header */} +
+
+ +
+

电竞明星派对 - 玩值杯备战

+
+ + 8/10人 + | + 匹配成功，已自动入群 +
+
+
+ +
+ + {/* Live Stream Preview within Chat */} +
router.push("/live/101")} + > +
+ Live +
+ LIVE +
+
+
+

正在直播：国服第一盲僧冲分

+

点击进入直播间一起互动 >

+
+
+
+
+ + {/* Messages */} +
+
12:30
+ +
+
+ User +
+
+

带粉狂魔

+
+ 有没有一起打灵活的？缺个中单，来个会玩的。 +
+
+
+ +
+
+ User +
+
+
我来我来，我亚索贼溜！
+
+
+ +
+
+ User +
+
+

软辅妹妹

+
托儿索别来沾边 😂
+
+
+
+ + {/* Input Area */} +
+ +
+ +
+ +
+
+ ) +} diff --git a/app/coupons/page.tsx b/app/coupons/page.tsx new file mode 100644 index 0000000..87e70c8 --- /dev/null +++ b/app/coupons/page.tsx @@ -0,0 +1,105 @@ +"use client" + +import { ArrowLeft, Ticket, Clock, ChevronRight } from "lucide-react" +import { useRouter } from "next/navigation" +import { Button } from "@/components/ui/button" +import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" + +export default function CouponsPage() { + const router = useRouter() + + const coupons = [ + { id: 1, name: "电竞酒店满200减50", type: "酒店", discount: "50", condition: "满200可用", expires: "2025-02-28" }, + { id: 2, name: "网咖通用8折券", type: "网咖", discount: "8折", condition: "无门槛", expires: "2025-03-15" }, + { id: 3, name: "商城满100减20", type: "商城", discount: "20", condition: "满100可用", expires: "2025-02-20" }, + ] + + return ( +
+ {/* Header */} +
+ +

我的卡券

+
+ +
+ + + + 可使用 + + + 已使用 + + + 已过期 + + + + + {coupons.map((coupon) => ( +
+
+
+ +
+ {coupon.discount.includes("折") ? coupon.discount : `¥${coupon.discount}`} +
+
{coupon.type}
+
+
+
+

{coupon.name}

+

{coupon.condition}

+
+
+
+ + {coupon.expires}到期 +
+ +
+
+
+
+ ))} + + + + +

暂无已使用的卡券

+ + + + +

暂无过期的卡券

+ + + + {/* Get More Coupons CTA */} +
+
+
+

领取更多优惠券

+

每日签到可领取专属福利

+
+ +
+
+
+
+ ) +} diff --git a/app/dress-up/page.tsx b/app/dress-up/page.tsx new file mode 100644 index 0000000..dbf2e29 --- /dev/null +++ b/app/dress-up/page.tsx @@ -0,0 +1,152 @@ +"use client" + +import { ArrowLeft, TrendingUp, ShoppingCart, Sparkles } from "lucide-react" +import { useRouter } from "next/navigation" +import Image from "next/image" +import { Button } from "@/components/ui/button" +import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" +import { toast } from "@/hooks/use-toast" + +export default function DressUpPage() { + const router = useRouter() + + const avatars = [ + { id: 1, name: "赛博朋克战士", price: 98, rarity: "传说", sales: 1205, image: "cyberpunk warrior avatar neon" }, + { id: 2, name: "甜心电竞少女", price: 68, rarity: "稀有", sales: 3420, image: "cute esports girl avatar pink" }, + { id: 3, name: "暗影刺客", price: 128, rarity: "传说", sales: 856, image: "shadow assassin avatar dark" }, + { id: 4, name: "机甲战神", price: 88, rarity: "史诗", sales: 2100, image: "mecha warrior avatar blue" }, + ] + + const decorations = [ + { id: 101, name: "星空边框", price: 38, type: "边框", image: "starry frame decoration" }, + { id: 102, name: "炫光特效", price: 58, type: "特效", image: "neon glow effect" }, + { id: 103, name: "王者徽章", price: 48, type: "徽章", image: "champion badge gold" }, + ] + + return ( +
+ {/* Header */} +
+ +

我的装扮

+
+ + 数字头像商城 +
+
+ +
+ {/* Current Avatar Display */} +
+
+ Current Avatar +
+ LV.8 +
+
+

当前形象

+

展示您的独特个性

+ +
+ + {/* Marketplace Tabs */} + + + + 数字头像 + + + 装饰道具 + + + 我的藏品 + + + + +
+

热门头像

+ +
+
+ {avatars.map((avatar) => ( +
+ toast({ + title: "即将购买", + description: `${avatar.name} - ¥${avatar.price}`, + }) + } + > +
+ {avatar.name} +
+ {avatar.rarity} +
+
+

{avatar.name}

+
+ {avatar.sales}人购买 + ¥{avatar.price} +
+ +
+ ))} +
+ + + +
+ {decorations.map((item) => ( +
+
+ {item.name} +
+
+

{item.name}

+
+ {item.type} + ¥{item.price} +
+
+ +
+ ))} +
+ + + + +

暂无藏品

+

购买数字头像和装扮后会显示在这里

+ + +
+
+ ) +} diff --git a/app/footprint/page.tsx b/app/footprint/page.tsx new file mode 100644 index 0000000..621cb82 --- /dev/null +++ b/app/footprint/page.tsx @@ -0,0 +1,117 @@ +"use client" + +import { ArrowLeft, MapPin, Clock, Star, Heart } from "lucide-react" +import { useRouter } from "next/navigation" +import Image from "next/image" + +export default function FootprintPage() { + const router = useRouter() + + const history = [ + { + date: "2025-01-20", + type: "hotel", + name: "玩值电竞酒店(旗舰店)", + rating: 5, + image: "esports hotel room", + }, + { + date: "2025-01-18", + type: "match", + name: "与GM-远洋的粉丝群匹配成功", + detail: "在线聊天2小时", + }, + { + date: "2025-01-15", + type: "purchase", + name: "购买了王者荣耀皮肤", + detail: "白龙吟", + }, + { + date: "2025-01-10", + type: "cafe", + name: "网鱼网咖(万达店)", + rating: 4, + image: "internet cafe", + }, + ] + + return ( +
+ {/* Header */} +
+ +

我的足迹

+
+ +
+ {/* Stats Overview */} +
+
+
12
+
总访问
+
+
+
8
+
线下体验
+
+
+
24
+
游戏局数
+
+
+ + {/* Timeline */} +
+ {history.map((item, i) => ( +
+
+
+ {item.type === "hotel" && } + {item.type === "match" && } + {item.type === "purchase" && } + {item.type === "cafe" && } +
+ {i < history.length - 1 &&
} +
+ +
+
+
+
+

{item.name}

+ {item.detail &&

{item.detail}

} + {item.rating && ( +
+ {Array.from({ length: item.rating }).map((_, j) => ( + + ))} +
+ )} +
+ {item.image && ( +
+ {item.name} +
+ )} +
+
+ + {item.date} +
+
+
+
+ ))} +
+
+
+ ) +} diff --git a/app/guild/[id]/page.tsx b/app/guild/[id]/page.tsx new file mode 100644 index 0000000..3312eb4 --- /dev/null +++ b/app/guild/[id]/page.tsx @@ -0,0 +1,142 @@ +"use client" + +import { ArrowLeft, Users, Trophy, Star, Shield, CheckCircle2, MessageCircle } from "lucide-react" +import { useRouter } from "next/navigation" +import Image from "next/image" +import { Button } from "@/components/ui/button" +import { toast } from "@/hooks/use-toast" + +export default function GuildDetailPage({ params }: { params: { id: string } }) { + const router = useRouter() + + const handleApply = () => { + toast({ + title: "申请已提交", + description: "公会管理员将在24小时内审核您的申请", + }) + } + + return ( +
+ {/* Hero Section */} +
+ Cover +
+ +
+ +
+
+
+ Logo +
+
+ + +
+
+ +
+
+

东东电竞

+ + LV.10 顶级公会 + +
+

+ 国服顶尖路人王聚集地，专注高端局陪练与代练业务。月入百万不是梦，加入我们，成就电竞梦想！ +

+
+ + + 1,205 成员 + + + + 全区第 1 名 + + + + 4.9 评分 + +
+
+ + {/* Benefits */} +
+

+ + 公会权益 +

+
+
+
专属培训体系
+
王者荣耀/LOL职业教练一对一指导，快速提升技术
+
+
+
优先派单特权
+
优质高价单优先派送，月收入提升50%
+
+
+
法律援助支持
+
专业律师团队，保障您的合法权益与收入
+
+
+
线下基地入驻
+
杭州/上海5000平米电竞基地免费入住
+
+
+
+ + {/* Requirements */} +
+

+ + 入驻要求 +

+
+
+
+
+ 游戏段位： + 王者荣耀荣耀王者50星以上 / LOL大师以上 / 无畏契约超凡入圣 +
+
+
+
+
+ 语音要求： + 普通话标准，声音清晰，具备良好的沟通能力 +
+
+
+
+
+ 设备要求： + 拥有专业的电竞设备（电脑/手机）和安静的直播/游戏环境 +
+
+
+
+
+ 在线时间： + 每天稳定在线时长不低于4小时 +
+
+
+
+
+
+ ) +} diff --git a/app/guild/page.tsx b/app/guild/page.tsx index d1e1166..4b21786 100644 --- a/app/guild/page.tsx +++ b/app/guild/page.tsx @@ -109,7 +109,7 @@ export default function GuildPage() {
{guild.name} toast({ title: "即将开放", description: "公会详情页面正在开发中" })} + onClick={() => router.push(`/guild/${guild.name}`)} > 了解详情 diff --git a/app/hotel/loading.tsx b/app/hotel/loading.tsx new file mode 100644 index 0000000..f15322a --- /dev/null +++ b/app/hotel/loading.tsx @@ -0,0 +1,3 @@ +export default function Loading() { + return null +} diff --git a/app/hotel/page.tsx b/app/hotel/page.tsx new file mode 100644 index 0000000..60ea550 --- /dev/null +++ b/app/hotel/page.tsx @@ -0,0 +1,234 @@ +"use client" + +import { useState } from "react" +import { Search, MapPin, Filter, Star, ArrowLeft, ChevronDown } from "lucide-react" +import { useRouter } from "next/navigation" +import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" +import { toast } from "@/hooks/use-toast" + +const hotels = [ + { + id: 1, + name: "玩值电竞酒店(旗舰店)", + rating: 4.9, + reviews: 1205, + price: 398, + distance: "0.8km", + tags: ["RTX4090", "电竞椅", "24h餐饮"], + district: "西湖区/黄龙体育中心", + }, + { + id: 2, + name: "极客空间电竞公寓", + rating: 4.7, + reviews: 856, + price: 268, + distance: "1.2km", + tags: ["五黑房", "投影", "免费停车"], + district: "拱墅区/万达广场", + }, + { + id: 3, + name: "异次元电竞酒店", + rating: 4.8, + reviews: 2341, + price: 328, + distance: "2.5km", + tags: ["情侣房", "PS5", "VR体验"], + district: "滨江区/网易园区", + }, +] + +const cafes = [ + { + id: 101, + name: "网鱼网咖(万达店)", + rating: 4.8, + reviews: 5620, + price: 12, + distance: "0.5km", + tags: ["3080显卡", "特权公馆", "现磨咖啡"], + district: "武林广场商圈", + }, + { + id: 102, + name: "杰拉电竞馆", + rating: 4.6, + reviews: 3210, + price: 10, + distance: "1.8km", + tags: ["赛事级配置", "美女陪玩", "独立包间"], + district: "城西银泰", + }, +] + +export default function HotelPage() { + const router = useRouter() + const [activeTab, setActiveTab] = useState("hotel") + + const handleBook = (name: string) => { + toast({ + title: "预订成功", + description: `您已成功预订 ${name}`, + }) + } + + return ( +
+ {/* Header with Search */} +
+
+ +
+ + +
+
+ + 地图 +
+
+ + {/* Tab Switcher & Filters */} + +
+ + + 电竞酒店 + + + 附近网咖 + + +
+ +
+
+ + + + +
+
+ + + {hotels.map((hotel) => ( +
handleBook(hotel.name)} + > +
+
+
+

{hotel.name}

+ {hotel.id === 1 && ( + + 热门 + + )} +
+
+
+ + {hotel.rating} +
+ | + {hotel.reviews}条评论 + | + {hotel.distance} +
+
{hotel.district}
+
+
+
+ ¥ + {hotel.price} +
+ +
+
+
+ {hotel.tags.map((tag, i) => ( + + {tag} + + ))} +
+
+ ))} + + + + {cafes.map((cafe) => ( +
handleBook(cafe.name)} + > +
+
+

{cafe.name}

+
+
+ + {cafe.rating} +
+ | + 人均 ¥{(cafe.price * 3).toFixed(0)} + | + {cafe.distance} +
+
{cafe.district}
+
+
+
+ ¥ + {cafe.price} + /时 +
+
+
+
+ {cafe.tags.map((tag, i) => ( + + {tag} + + ))} +
+
+ ))} + + +
+
+ ) +} diff --git a/app/live/[id]/page.tsx b/app/live/[id]/page.tsx new file mode 100644 index 0000000..ab87910 --- /dev/null +++ b/app/live/[id]/page.tsx @@ -0,0 +1,110 @@ +"use client" + +import { useState } from "react" +import { useRouter } from "next/navigation" +import { ArrowLeft, Heart, Share2, Gift, Send, MoreHorizontal } from "lucide-react" +import Image from "next/image" + +export default function LiveRoomPage({ params }: { params: { id: string } }) { + const router = useRouter() + const [comment, setComment] = useState("") + const [isFollowed, setIsFollowed] = useState(false) + + return ( +
+ {/* Background Live Stream */} +
+ Live +
+
+ + {/* Header */} +
+
+ +
+
+ Avatar +
+
+

GM-远洋

+

12.5w观看

+
+
+ +
+ +
+
+ {[1, 2, 3].map((i) => ( +
+ Viewer +
+ ))} +
+ +
+
+ + {/* Main Content Spacer */} +
+ + {/* Chat Area */} +
+
+ LV.12 +

+ 小飞侠: 主播这波操作太细了！666 +

+
+
+ LV.5 +

+ 电竞迷: 求BGM +

+
+
+ 管理员 +

系统公告: 严禁违规发言，文明直播间

+
+
+ + {/* Bottom Actions */} +
+
+ setComment(e.target.value)} + /> + +
+ + + +
+
+ ) +} diff --git a/app/mall/page.tsx b/app/mall/page.tsx index abec691..8f57ad2 100644 --- a/app/mall/page.tsx +++ b/app/mall/page.tsx @@ -12,13 +12,14 @@ import { GraduationCap, Monitor, Hotel, - MapPin, Coffee, + Trophy, + User, } from "lucide-react" import { Button } from "@/components/ui/button" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { useAppContext } from "@/components/providers/app-provider" -import { toast } from "@/hooks/use-toast" +import Link from "next/link" // Import Link export default function MallPage() { const { wallet, pay, recharge } = useAppContext() @@ -72,19 +73,67 @@ export default function MallPage() {
{[ - { name: "知识付费", icon: BookOpen, color: "text-blue-400", bg: "bg-blue-500/10", desc: "大神课程" }, - { name: "陪玩课程", icon: GraduationCap, color: "text-pink-400", bg: "bg-pink-500/10", desc: "专业指导" }, - { name: "电竞外设", icon: Monitor, color: "text-purple-400", bg: "bg-purple-500/10", desc: "职业装备" }, - { name: "电竞酒店", icon: Hotel, color: "text-orange-400", bg: "bg-orange-500/10", desc: "订阅特权" }, - { name: "附近网吧", icon: Coffee, color: "text-cyan-400", bg: "bg-cyan-500/10", desc: "上网优惠" }, - { name: "欢乐之路", icon: MapPin, color: "text-green-400", bg: "bg-green-500/10", desc: "趣味闯关" }, - { name: "网咖特权", icon: Coffee, color: "text-teal-400", bg: "bg-teal-500/10", desc: "会员专享" }, - { name: "更多服务", icon: Sparkles, color: "text-yellow-400", bg: "bg-yellow-500/10", desc: "敬请期待" }, + { + name: "知识付费", + icon: BookOpen, + color: "text-blue-400", + bg: "bg-blue-500/10", + href: "/my-courses", + }, + { + name: "陪玩课程", + icon: GraduationCap, + color: "text-pink-400", + bg: "bg-pink-500/10", + href: "/creator/apply", + }, + { + name: "电竞外设", + icon: Monitor, + color: "text-purple-400", + bg: "bg-purple-500/10", + href: "/mall/gear", + }, + { + name: "电竞酒店", + icon: Hotel, + color: "text-orange-400", + bg: "bg-orange-500/10", + href: "/hotel", + }, + { + name: "附近网吧", + icon: Coffee, + color: "text-cyan-400", + bg: "bg-cyan-500/10", + href: "/hotel", + }, + { + name: "游戏代练", + icon: Trophy, + color: "text-yellow-400", + bg: "bg-yellow-500/10", + href: "/services/leveling", + }, + { + name: "账号交易", + icon: User, + color: "text-green-400", + bg: "bg-green-500/10", + href: "/services/account", + }, + { + name: "更多服务", + icon: Sparkles, + color: "text-white/40", + bg: "bg-white/5", + href: "#", + }, ].map((item, i) => ( -
toast({ title: "即将开放", description: `${item.name}板块正在筹备中` })} + href={item.href} + className="glass-card p-3 rounded-xl flex flex-col items-center gap-2 cursor-pointer hover:bg-white/10 transition-colors" >
@@ -92,7 +141,7 @@ export default function MallPage() {

{item.name}

-
+ ))}
diff --git a/app/moments/create/page.tsx b/app/moments/create/page.tsx new file mode 100644 index 0000000..8b01fab --- /dev/null +++ b/app/moments/create/page.tsx @@ -0,0 +1,69 @@ +"use client" + +import { useState } from "react" +import { useRouter } from "next/navigation" +import { ChevronLeft, ImageIcon, Hash, MapPin, Smile } from "lucide-react" +import { Button } from "@/components/ui/button" +import { Textarea } from "@/components/ui/textarea" +import { toast } from "@/hooks/use-toast" + +export default function CreateMomentPage() { + const router = useRouter() + const [content, setContent] = useState("") + + const handlePublish = () => { + if (!content.trim()) { + toast({ title: "内容不能为空", variant: "destructive" }) + return + } + toast({ title: "发布成功", description: "您的动态已发布" }) + setTimeout(() => router.back(), 1000) + } + + return ( +
+
+ +

发布动态

+ +
+ +
+