feat: add executable actions to order flow

2026-02-20 22:45:38 +08:00
parent fd58b81318
commit 977d19ed5c
4 changed files with 158 additions and 57 deletions
@@ -0,0 +1,121 @@
+"use client"
+
+import { AlertTriangle, CheckCircle2, MessageSquare, RefreshCw, Star, XCircle } from "lucide-react"
+import Link from "next/link"
+import { useState } from "react"
+import { Button } from "@/components/ui/button"
+import type { OrderStatus } from "@/lib/types"
+
+interface OrderActionsProps {
+  orderId: string
+  initialStatus: OrderStatus
+  chatSessionId?: string
+  serviceId: string
+}
+
+function showFeedback(message: string) {
+  if (typeof window === "undefined") return
+  window.alert(message)
+}
+
+export default function OrderActions({
+  orderId,
+  initialStatus,
+  chatSessionId,
+  serviceId,
+}: OrderActionsProps) {
+  const [status, setStatus] = useState<OrderStatus>(initialStatus)
+
+  return (
+    <div className="flex gap-2 flex-wrap">
+      {status === "pending_accept" && (
+        <>
+          <Button
+            variant="outline"
+            onClick={() => {
+              setStatus("cancelled")
+              showFeedback("订单已取消")
+            }}
+          >
+            <XCircle className="mr-1 h-4 w-4" />
+            取消订单
+          </Button>
+          <Button
+            onClick={() => {
+              setStatus("in_progress")
+              showFeedback("已接单")
+            }}
+          >
+            <CheckCircle2 className="mr-1 h-4 w-4" />
+            接单
+          </Button>
+        </>
+      )}
+
+      {(status === "in_progress" || status === "pending_close") && chatSessionId && (
+        <Button asChild>
+          <Link href={`/chat/${chatSessionId}`}>
+            <MessageSquare className="mr-1 h-4 w-4" />
+            聊天
+          </Link>
+        </Button>
+      )}
+
+      {status === "in_progress" && (
+        <>
+          <Button
+            onClick={() => {
+              setStatus("pending_close")
+              showFeedback("已发起结单")
+            }}
+          >
+            发起结单
+          </Button>
+          <Button variant="destructive" asChild>
+            <Link href={`/dispute/${orderId}`}>
+              <AlertTriangle className="mr-1 h-4 w-4" />
+              发起争议
+            </Link>
+          </Button>
+        </>
+      )}
+
+      {status === "pending_close" && (
+        <>
+          <Button
+            onClick={() => {
+              setStatus("completed")
+              showFeedback("订单已完成")
+            }}
+          >
+            确认结单
+          </Button>
+          <Button variant="destructive" asChild>
+            <Link href={`/dispute/${orderId}`}>
+              <AlertTriangle className="mr-1 h-4 w-4" />
+              发起争议
+            </Link>
+          </Button>
+        </>
+      )}
+
+      {status === "pending_review" && (
+        <Button asChild>
+          <Link href={`/review/${orderId}`}>
+            <Star className="mr-1 h-4 w-4" />
+            评价
+          </Link>
+        </Button>
+      )}
+
+      {status === "completed" && (
+        <Button variant="outline" asChild>
+          <Link href={`/order/new?serviceId=${serviceId}`}>
+            <RefreshCw className="mr-1 h-4 w-4" />
+            再来一单
+          </Link>
+        </Button>
+      )}
+    </div>
+  )
+}