refactor: remove demo timers and client-side timeout simulation
Remove lib/config/demo-timers.ts and all usages across stores and pages. Order timeout scheduling, dispute auto-progression, and hardcoded countdown displays are removed — timeouts are now handled server-side by the backend.
This commit is contained in:
@@ -7,14 +7,13 @@ import { Label } from "@/components/ui/label"
|
||||
import { Separator } from "@/components/ui/separator"
|
||||
import { StatusBadge, type StatusBadgeProps } from "@/components/ui/status-badge"
|
||||
import { Textarea } from "@/components/ui/textarea"
|
||||
import { getOrderById } from "@/lib/api"
|
||||
import { getOrderById, getPlayerById, uploadFile } from "@/lib/api"
|
||||
import {
|
||||
getDisputeByOrderId,
|
||||
submitDispute,
|
||||
submitDisputeAppeal,
|
||||
submitDisputeResponse,
|
||||
} from "@/lib/api/disputes"
|
||||
import { DISPUTE_TO_RESOLVED_MS } from "@/lib/config/demo-timers"
|
||||
import { notifyInfo } from "@/lib/toast"
|
||||
import { useAuthStore } from "@/store/auth"
|
||||
import { AlertTriangle, ArrowLeft, Clock, FileText, Upload, X } from "lucide-react"
|
||||
@@ -81,12 +80,14 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
const [existingDispute, setExistingDispute] = useState<Awaited<
|
||||
ReturnType<typeof getDisputeByOrderId>
|
||||
> | null>(null)
|
||||
const [playerUserId, setPlayerUserId] = useState<string | null>(null)
|
||||
|
||||
const [reason, setReason] = useState("")
|
||||
const [files, setFiles] = useState<string[]>([])
|
||||
const [responseReason, setResponseReason] = useState("")
|
||||
const [responseFiles, setResponseFiles] = useState<string[]>([])
|
||||
const [appealReason, setAppealReason] = useState("")
|
||||
const [uploading, setUploading] = useState(false)
|
||||
|
||||
const fileInputRef = useRef<HTMLInputElement>(null)
|
||||
const responseFileInputRef = useRef<HTMLInputElement>(null)
|
||||
@@ -100,6 +101,7 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
setLoading(true)
|
||||
setOrder(null)
|
||||
setExistingDispute(null)
|
||||
setPlayerUserId(null)
|
||||
}
|
||||
|
||||
const load = async () => {
|
||||
@@ -113,6 +115,13 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
if (cancelled) return
|
||||
setOrder(nextOrder ?? null)
|
||||
setExistingDispute(nextDispute ?? null)
|
||||
|
||||
if (nextOrder) {
|
||||
const player = await getPlayerById(String(nextOrder.playerId))
|
||||
if (cancelled) return
|
||||
setPlayerUserId(player?.user.id ?? null)
|
||||
}
|
||||
|
||||
setLoading(false)
|
||||
}
|
||||
|
||||
@@ -133,34 +142,36 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
|
||||
useEffect(
|
||||
() => () => {
|
||||
filesRef.current.forEach((url) => {
|
||||
URL.revokeObjectURL(url)
|
||||
})
|
||||
responseFilesRef.current.forEach((url) => {
|
||||
URL.revokeObjectURL(url)
|
||||
})
|
||||
filesRef.current = []
|
||||
responseFilesRef.current = []
|
||||
},
|
||||
[],
|
||||
)
|
||||
|
||||
const handleFileSelect = (
|
||||
const handleFileSelect = async (
|
||||
event: ChangeEvent<HTMLInputElement>,
|
||||
setter: Dispatch<SetStateAction<string[]>>,
|
||||
currentFiles: string[],
|
||||
) => {
|
||||
const selectedFiles = event.target.files
|
||||
if (!selectedFiles?.length) return
|
||||
|
||||
setter((prev) => {
|
||||
const remaining = 5 - prev.length
|
||||
if (remaining <= 0) return prev
|
||||
|
||||
const nextUrls = Array.from(selectedFiles)
|
||||
.slice(0, remaining)
|
||||
.map((file) => URL.createObjectURL(file))
|
||||
return [...prev, ...nextUrls]
|
||||
})
|
||||
|
||||
event.target.value = ""
|
||||
setUploading(true)
|
||||
try {
|
||||
const remaining = 5 - currentFiles.length
|
||||
if (remaining <= 0) return
|
||||
const nextUrls = await Promise.all(
|
||||
Array.from(selectedFiles)
|
||||
.slice(0, remaining)
|
||||
.map((file) => uploadFile(file, "dispute")),
|
||||
)
|
||||
setter((prev) => [...prev, ...nextUrls])
|
||||
} catch {
|
||||
notifyInfo("证据上传失败")
|
||||
} finally {
|
||||
setUploading(false)
|
||||
event.target.value = ""
|
||||
}
|
||||
}
|
||||
|
||||
const removeFile = (
|
||||
@@ -168,13 +179,14 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
filesState: string[],
|
||||
setter: Dispatch<SetStateAction<string[]>>,
|
||||
) => {
|
||||
const removed = filesState[index]
|
||||
if (removed) {
|
||||
URL.revokeObjectURL(removed)
|
||||
}
|
||||
setter((prev) => prev.filter((_, currentIndex) => currentIndex !== index))
|
||||
}
|
||||
|
||||
const reloadDispute = async () => {
|
||||
const nextDispute = await getDisputeByOrderId(id)
|
||||
setExistingDispute(nextDispute ?? null)
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
if (!userId || !reason.trim()) return
|
||||
|
||||
@@ -212,7 +224,7 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
}
|
||||
|
||||
const isParticipant = Boolean(
|
||||
userId && (order.consumerId === userId || order.playerId === userId),
|
||||
userId && (String(order.consumerId) === userId || playerUserId === userId),
|
||||
)
|
||||
if (!isParticipant) {
|
||||
return (
|
||||
@@ -337,12 +349,15 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
accept="image/*"
|
||||
multiple
|
||||
className="hidden"
|
||||
onChange={(event) => handleFileSelect(event, setResponseFiles)}
|
||||
onChange={(event) => {
|
||||
void handleFileSelect(event, setResponseFiles, responseFiles)
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
variant="outline"
|
||||
className="border-border/60"
|
||||
onClick={() => responseFileInputRef.current?.click()}
|
||||
disabled={uploading}
|
||||
>
|
||||
<Upload className="mr-1 h-4 w-4" />
|
||||
上传回应证据
|
||||
@@ -385,7 +400,11 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
).then((decision) => {
|
||||
if (!decision.ok) {
|
||||
notifyInfo(decision.error.msg)
|
||||
return
|
||||
}
|
||||
setResponseReason("")
|
||||
setResponseFiles([])
|
||||
return reloadDispute()
|
||||
})
|
||||
}}
|
||||
disabled={!responseReason.trim()}
|
||||
@@ -437,7 +456,10 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
).then((decision) => {
|
||||
if (!decision.ok) {
|
||||
notifyInfo(decision.error.msg)
|
||||
return
|
||||
}
|
||||
setAppealReason("")
|
||||
return reloadDispute()
|
||||
})
|
||||
}}
|
||||
disabled={!appealReason.trim()}
|
||||
@@ -477,7 +499,7 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
<div className="container mx-auto max-w-2xl px-4 py-8">
|
||||
<EmptyState
|
||||
title="争议已提交,请等待平台处理"
|
||||
description={`平台将在约 ${Math.floor(DISPUTE_TO_RESOLVED_MS / 1000)} 秒内给出模拟处理结果。`}
|
||||
description="争议已提交,请等待平台处理"
|
||||
icon={AlertTriangle}
|
||||
action={
|
||||
<Button variant="outline" className="border-border/60" asChild>
|
||||
@@ -527,13 +549,15 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
accept="image/*"
|
||||
multiple
|
||||
className="hidden"
|
||||
onChange={(event) => handleFileSelect(event, setFiles)}
|
||||
onChange={(event) => {
|
||||
void handleFileSelect(event, setFiles, files)
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
className="w-full rounded-md border-2 border-dashed border-border/60 bg-muted/20 p-6 text-center text-sm text-muted-foreground transition-colors hover:border-primary/60 hover:bg-muted/30 hover:text-foreground disabled:opacity-50"
|
||||
onClick={() => fileInputRef.current?.click()}
|
||||
disabled={files.length >= 5}
|
||||
disabled={files.length >= 5 || uploading}
|
||||
>
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
<Upload className="h-5 w-5" />
|
||||
@@ -566,13 +590,15 @@ export default function DisputePage({ params }: { params: Promise<{ id: string }
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<div className="text-xs text-muted-foreground">最多5张</div>
|
||||
<div className="text-xs text-muted-foreground">
|
||||
{uploading ? "证据上传中..." : "最多5张"}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1 rounded-lg border border-border/60 bg-muted/20 p-3 text-xs text-muted-foreground">
|
||||
<p>· 提交争议后,订单资金将继续托管</p>
|
||||
<p>· 聊天记录将作为证据保留</p>
|
||||
<p>· 平台将在约 {Math.floor(DISPUTE_TO_RESOLVED_MS / 1000)} 秒内完成模拟审核</p>
|
||||
<p>· 平台审核完成后将给出仲裁结果</p>
|
||||
<p>· 对仲裁结果不满可申诉一次</p>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -6,7 +6,6 @@ import { EmptyState } from "@/components/ui/empty-state"
|
||||
import { Separator } from "@/components/ui/separator"
|
||||
import { StatusBadge } from "@/components/ui/status-badge"
|
||||
import { getOrderById, listChatSessions, listReviewsByOrder } from "@/lib/api"
|
||||
import { ORDER_ACCEPT_TIMEOUT_MS, ORDER_CLOSE_TIMEOUT_MS } from "@/lib/config/demo-timers"
|
||||
import { statusLabels } from "@/lib/constants"
|
||||
import type { OrderStatus } from "@/lib/types"
|
||||
import { ArrowLeft, CheckCircle, Clock, Star } from "lucide-react"
|
||||
@@ -53,7 +52,6 @@ export default function OrderDetailPage({ params }: { params: Promise<{ id: stri
|
||||
undefined,
|
||||
)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [nowTs, setNowTs] = useState(0)
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false
|
||||
@@ -115,17 +113,6 @@ export default function OrderDetailPage({ params }: { params: Promise<{ id: stri
|
||||
}
|
||||
}, [id])
|
||||
|
||||
useEffect(() => {
|
||||
if (!order) return
|
||||
if (order.status !== "pending_accept" && order.status !== "pending_close") return
|
||||
|
||||
const timer = setInterval(() => {
|
||||
setNowTs(Date.now())
|
||||
}, 1000)
|
||||
|
||||
return () => clearInterval(timer)
|
||||
}, [order])
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="container mx-auto max-w-2xl px-4 py-8">
|
||||
@@ -150,21 +137,6 @@ export default function OrderDetailPage({ params }: { params: Promise<{ id: stri
|
||||
? cancelledStatusSteps
|
||||
: normalStatusSteps
|
||||
const currentStepIndex = statusSteps.indexOf(order.status)
|
||||
const timeoutHint = (() => {
|
||||
if (order.status !== "pending_accept" && order.status !== "pending_close") return null
|
||||
|
||||
const base =
|
||||
order.status === "pending_accept"
|
||||
? new Date(order.createdAt).getTime()
|
||||
: new Date(order.createdAt).getTime()
|
||||
const timeoutMs =
|
||||
order.status === "pending_accept" ? ORDER_ACCEPT_TIMEOUT_MS : ORDER_CLOSE_TIMEOUT_MS
|
||||
const remainSeconds = Math.max(0, Math.ceil((timeoutMs - (nowTs - base)) / 1000))
|
||||
|
||||
return order.status === "pending_accept"
|
||||
? `若 ${Math.floor(ORDER_ACCEPT_TIMEOUT_MS / 1000)} 秒内无人接单,订单将自动取消(剩余 ${remainSeconds} 秒)`
|
||||
: `若 ${Math.floor(ORDER_CLOSE_TIMEOUT_MS / 1000)} 秒内未确认,订单将自动进入待评价(剩余 ${remainSeconds} 秒)`
|
||||
})()
|
||||
|
||||
return (
|
||||
<div className="container mx-auto py-8 px-4 max-w-2xl">
|
||||
@@ -212,12 +184,6 @@ export default function OrderDetailPage({ params }: { params: Promise<{ id: stri
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{timeoutHint && (
|
||||
<Card className="mb-6 border-border/80 shadow-sm">
|
||||
<CardContent className="py-3 text-sm text-muted-foreground">{timeoutHint}</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
<Card className="mb-6 border-border/80 shadow-sm">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">服务信息</CardTitle>
|
||||
|
||||
Reference in New Issue
Block a user