feat: settings, wallet, notifications, and identity verification pages
This commit is contained in:
@@ -1,8 +1,125 @@
|
||||
"use client"
|
||||
|
||||
import { CheckCircle, Clock, ShieldCheck, Upload } from "lucide-react"
|
||||
import { useState } from "react"
|
||||
import { Badge } from "@/components/ui/badge"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select"
|
||||
import { Separator } from "@/components/ui/separator"
|
||||
import { Textarea } from "@/components/ui/textarea"
|
||||
|
||||
export default function VerifyPage() {
|
||||
const [submitted, setSubmitted] = useState(false)
|
||||
|
||||
if (submitted) {
|
||||
return (
|
||||
<div className="max-w-2xl space-y-6">
|
||||
<h1 className="text-2xl font-bold">身份认证</h1>
|
||||
<Card>
|
||||
<CardContent className="py-12 text-center space-y-4">
|
||||
<Clock className="h-12 w-12 mx-auto text-muted-foreground" />
|
||||
<h2 className="text-xl font-bold">认证申请已提交</h2>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
我们将在 1-3 个工作日内审核你的申请,审核结果将通过通知中心告知
|
||||
</p>
|
||||
<Badge variant="outline" className="text-sm">
|
||||
<Clock className="mr-1 h-3.5 w-3.5" />
|
||||
审核中
|
||||
</Badge>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="max-w-2xl space-y-6">
|
||||
<h1 className="text-2xl font-bold">身份认证</h1>
|
||||
<p className="mt-2 text-muted-foreground">申请打手或店主身份认证</p>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">认证说明</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<div className="flex items-start gap-2">
|
||||
<ShieldCheck className="h-4 w-4 shrink-0 mt-0.5 text-primary" />
|
||||
<span>通过身份认证后,你可以成为打手或店主,开始接单或经营店铺</span>
|
||||
</div>
|
||||
<div className="flex items-start gap-2">
|
||||
<CheckCircle className="h-4 w-4 shrink-0 mt-0.5 text-primary" />
|
||||
<span>认证信息仅用于平台审核,不会对外展示</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">申请认证</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-6">
|
||||
<div className="space-y-2">
|
||||
<Label>认证类型</Label>
|
||||
<Select>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="选择认证类型" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="player">打手认证</SelectItem>
|
||||
<SelectItem value="owner">店主认证</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="real-name">真实姓名</Label>
|
||||
<Input id="real-name" placeholder="请输入真实姓名" />
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="id-number">身份证号</Label>
|
||||
<Input id="id-number" placeholder="请输入身份证号" />
|
||||
</div>
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label>游戏资质(打手认证)</Label>
|
||||
<Textarea placeholder="请描述你的游戏经历、段位、擅长游戏等" rows={3} />
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label>证明材料</Label>
|
||||
<div className="flex gap-2">
|
||||
<div className="h-24 w-24 rounded-md border-2 border-dashed border-muted-foreground/25 flex flex-col items-center justify-center gap-1 text-muted-foreground cursor-pointer hover:border-muted-foreground/50 transition-colors">
|
||||
<Upload className="h-5 w-5" />
|
||||
<span className="text-[10px]">身份证正面</span>
|
||||
</div>
|
||||
<div className="h-24 w-24 rounded-md border-2 border-dashed border-muted-foreground/25 flex flex-col items-center justify-center gap-1 text-muted-foreground cursor-pointer hover:border-muted-foreground/50 transition-colors">
|
||||
<Upload className="h-5 w-5" />
|
||||
<span className="text-[10px]">身份证反面</span>
|
||||
</div>
|
||||
<div className="h-24 w-24 rounded-md border-2 border-dashed border-muted-foreground/25 flex flex-col items-center justify-center gap-1 text-muted-foreground cursor-pointer hover:border-muted-foreground/50 transition-colors">
|
||||
<Upload className="h-5 w-5" />
|
||||
<span className="text-[10px]">游戏截图</span>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-xs text-muted-foreground">支持 JPG、PNG 格式,单张不超过 5MB</p>
|
||||
</div>
|
||||
|
||||
<Button className="w-full" onClick={() => setSubmitted(true)}>
|
||||
提交认证申请
|
||||
</Button>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user