fix(ticket): remove batch assign and restructure detail dialog

web/app/dashboard/tickets/_components/ticket-assign-dialog.tsx

@@ -21,7 +21,7 @@ import {
   fetchAgentProfilesAll,
   type AdminAgentProfile,
 } from "@/lib/api/admin"
-import { assignTicket, batchAssignTickets } from "@/lib/api/ticket"
+import { assignTicket } from "@/lib/api/ticket"
 
 const schema = z.object({
   toUserId: z.string().trim().min(1, "请选择处理人"),
@@ -44,7 +44,6 @@ const emptyForm: FormValues = {
 type TicketAssignDialogProps = {
   open: boolean
   ticketId: number | null
-  ticketIds?: number[]
   currentAssigneeId?: number
   onOpenChange: (open: boolean) => void
   onSuccess?: () => Promise<void> | void
@@ -53,7 +52,6 @@ type TicketAssignDialogProps = {
 export function TicketAssignDialog({
   open,
   ticketId,
-  ticketIds,
   currentAssigneeId,
   onOpenChange,
   onSuccess,
@@ -62,9 +60,8 @@ export function TicketAssignDialog({
     <Dialog open={open} onOpenChange={onOpenChange}>
       {open ? (
         <TicketAssignDialogBody
-          key={ticketId ?? ticketIds?.join(",") ?? "ticket-assign"}
+          key={ticketId ?? "ticket-assign"}
           ticketId={ticketId}
-          ticketIds={ticketIds}
           currentAssigneeId={currentAssigneeId}
           onOpenChange={onOpenChange}
           onSuccess={onSuccess}
@@ -76,7 +73,6 @@ export function TicketAssignDialog({
 
 function TicketAssignDialogBody({
   ticketId,
-  ticketIds,
   currentAssigneeId,
   onOpenChange,
   onSuccess,
@@ -140,34 +136,21 @@ function TicketAssignDialogBody({
   }, [])
 
   async function onFormSubmit(values: FormValues) {
-    const validTicketIds = (ticketIds ?? []).filter((item) => item > 0)
-    if (!ticketId && validTicketIds.length === 0) {
+    if (!ticketId) {
       toast.error("请选择工单")
       return
     }
     setSaving(true)
     try {
-      if (validTicketIds.length > 0) {
-        await batchAssignTickets({
-          ticketIds: validTicketIds,
-          toUserId: Number(values.toUserId),
-          reason: values.reason.trim() || undefined,
-        })
-        if (!activeRef.current) {
-          return
-        }
-        toast.success(`已批量指派 ${validTicketIds.length} 张工单`)
-      } else {
-        await assignTicket({
-          ticketId: ticketId!,
-          toUserId: Number(values.toUserId),
-          reason: values.reason.trim() || undefined,
-        })
-        if (!activeRef.current) {
-          return
-        }
-        toast.success("处理人已更新")
+      await assignTicket({
+        ticketId,
+        toUserId: Number(values.toUserId),
+        reason: values.reason.trim() || undefined,
+      })
+      if (!activeRef.current) {
+        return
       }
+      toast.success("处理人已更新")
       if (!activeRef.current) {
         return
       }
@@ -188,7 +171,7 @@ function TicketAssignDialogBody({
   return (
     <DialogContent className="max-w-lg gap-0 p-0 sm:max-w-lg">
       <DialogHeader className="px-6 pt-6">
-        <DialogTitle>{ticketIds?.length ? `批量指派工单（${ticketIds.length}）` : "指派工单"}</DialogTitle>
+        <DialogTitle>指派工单</DialogTitle>
       </DialogHeader>
       <form onSubmit={handleSubmit(onFormSubmit)}>
         <div className="space-y-4 p-6">

web/app/dashboard/tickets/_components/ticket-detail-dialog.tsx

@@ -4,15 +4,9 @@ import { useCallback, useEffect, useRef, useState } from "react"
 import { MessageSquareTextIcon, RefreshCcwIcon, SendIcon, UserRoundIcon } from "lucide-react"
 import { toast } from "sonner"
 
+import { ProjectDialog } from "@/components/project-dialog"
 import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog"
-import { ScrollArea } from "@/components/ui/scroll-area"
 import { Separator } from "@/components/ui/separator"
 import { Textarea } from "@/components/ui/textarea"
 import {
@@ -247,156 +241,163 @@ export function TicketDetailDialog({
 
   return (
     <>
-      <Dialog open={open} onOpenChange={onOpenChange}>
-        <DialogContent className="max-h-[88vh] gap-0 p-0 sm:max-w-3xl">
-          <DialogHeader className="border-b px-6 py-4">
-            <DialogTitle className="flex min-w-0 items-center gap-2 text-base">
-              <span className="truncate">{ticket?.title ?? "工单详情"}</span>
-              {ticket ? <TicketStatusBadge status={ticket.status} /> : null}
-            </DialogTitle>
-            {ticket ? (
-              <div className="mt-2 flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
-                <span className="font-mono">{ticket.ticketNo}</span>
-                <span>{sourceLabel(ticket.source)}</span>
-                <span>创建人：{metadataValue(ticket.createdByName || ticket.createdBy)}</span>
-              </div>
-            ) : null}
-          </DialogHeader>
+      <ProjectDialog
+        open={open}
+        onOpenChange={onOpenChange}
+        title={
+          <div className="flex min-w-0 items-center gap-2 pr-16 text-base">
+            <span className="truncate">{ticket?.title ?? "工单详情"}</span>
+            {ticket ? <TicketStatusBadge status={ticket.status} /> : null}
+          </div>
+        }
+        description={
+          ticket ? (
+            <div className="flex flex-wrap items-center gap-2 text-xs">
+              <span className="font-mono">{ticket.ticketNo}</span>
+              <span>{sourceLabel(ticket.source)}</span>
+              <span>创建人：{metadataValue(ticket.createdByName || ticket.createdBy)}</span>
+            </div>
+          ) : undefined
+        }
+        size="xl"
+        allowFullscreen
+        bodyScrollable={false}
+        contentClassName="sm:max-w-5xl"
+        bodyClassName="overflow-hidden"
+      >
+        {loading && !ticket ? (
+          <div className="flex h-[520px] items-center justify-center gap-2 text-sm text-muted-foreground">
+            <RefreshCcwIcon className="size-4 animate-spin" />
+            加载中...
+          </div>
+        ) : ticket ? (
+          <div className="grid h-[min(72vh,680px)] min-h-0 grid-cols-1 overflow-hidden lg:grid-cols-[minmax(0,1fr)_380px]">
+            <div className="min-h-0 space-y-5 overflow-y-auto border-b p-6 lg:border-r lg:border-b-0">
+              <section className="space-y-2">
+                <div className="text-xs font-medium text-muted-foreground">描述</div>
+                <div className="whitespace-pre-wrap rounded-md border bg-muted/30 px-3 py-2 text-sm leading-6">
+                  {ticket.description || "暂无描述"}
+                </div>
+              </section>
 
-          <ScrollArea className="max-h-[calc(88vh-74px)]">
-            {loading && !ticket ? (
-              <div className="flex items-center justify-center gap-2 px-6 py-12 text-sm text-muted-foreground">
-                <RefreshCcwIcon className="size-4 animate-spin" />
-                加载中...
-              </div>
-            ) : ticket ? (
-              <div className="space-y-5 p-6">
-                <section className="space-y-2">
-                  <div className="text-xs font-medium text-muted-foreground">描述</div>
-                  <div className="whitespace-pre-wrap rounded-md border bg-muted/30 px-3 py-2 text-sm leading-6">
-                    {ticket.description || "暂无描述"}
-                  </div>
-                </section>
-
-                <section className="grid gap-4 md:grid-cols-[minmax(0,1fr)_220px]">
-                  <div className="space-y-2">
-                    <div className="text-xs font-medium text-muted-foreground">状态</div>
-                    <div className="flex flex-wrap gap-2">
-                      {statusOptions.map((option) => (
-                        <Button
-                          key={option.value}
-                          type="button"
-                          size="sm"
-                          variant={ticket.status === option.value ? "default" : "outline"}
-                          disabled={!!statusSaving}
-                          onClick={() => void handleStatusChange(option.value)}
-                        >
-                          {statusSaving === option.value ? "更新中..." : option.label}
-                        </Button>
-                      ))}
-                    </div>
-                  </div>
-                  <div className="space-y-2">
-                    <div className="text-xs font-medium text-muted-foreground">负责人</div>
-                    <div className="flex items-center justify-between gap-2 rounded-md border px-3 py-2">
-                      <div className="flex min-w-0 items-center gap-2 text-sm">
-                        <UserRoundIcon className="size-4 shrink-0 text-muted-foreground" />
-                        <span className="truncate">{ticket.currentAssigneeName || "未分配"}</span>
-                      </div>
-                      <Button type="button" size="sm" variant="outline" onClick={() => setAssignOpen(true)}>
-                        指派
+              <section className="grid gap-4 md:grid-cols-[minmax(0,1fr)_220px]">
+                <div className="space-y-2">
+                  <div className="text-xs font-medium text-muted-foreground">状态</div>
+                  <div className="flex flex-wrap gap-2">
+                    {statusOptions.map((option) => (
+                      <Button
+                        key={option.value}
+                        type="button"
+                        size="sm"
+                        variant={ticket.status === option.value ? "default" : "outline"}
+                        disabled={!!statusSaving}
+                        onClick={() => void handleStatusChange(option.value)}
+                      >
+                        {statusSaving === option.value ? "更新中..." : option.label}
                       </Button>
-                    </div>
+                    ))}
                   </div>
-                </section>
-
-                <section className="space-y-2">
-                  <div className="flex items-center justify-between gap-2">
-                    <div className="text-xs font-medium text-muted-foreground">标签</div>
-                    <Button type="button" size="sm" variant="outline" onClick={() => setEditOpen(true)}>
-                      编辑
+                </div>
+                <div className="space-y-2">
+                  <div className="text-xs font-medium text-muted-foreground">负责人</div>
+                  <div className="flex items-center justify-between gap-2 rounded-md border px-3 py-2">
+                    <div className="flex min-w-0 items-center gap-2 text-sm">
+                      <UserRoundIcon className="size-4 shrink-0 text-muted-foreground" />
+                      <span className="truncate">{ticket.currentAssigneeName || "未分配"}</span>
+                    </div>
+                    <Button type="button" size="sm" variant="outline" onClick={() => setAssignOpen(true)}>
+                      指派
                     </Button>
                   </div>
-                  {ticket.tags && ticket.tags.length > 0 ? (
-                    <div className="flex flex-wrap gap-1.5">
-                      {ticket.tags.map((tag) => (
-                        <Badge key={tag.id} variant="outline">
-                          {tag.name}
-                        </Badge>
-                      ))}
-                    </div>
-                  ) : (
-                    <div className="text-sm text-muted-foreground">暂无标签</div>
-                  )}
-                </section>
+                </div>
+              </section>
 
-                <section className="grid gap-3 rounded-md border p-3 text-sm sm:grid-cols-2">
-                  <MetadataItem label="客户" value={ticket.customer?.name || ticket.customerId} />
-                  <MetadataItem label="联系方式" value={ticket.customer?.primaryMobile || ticket.customer?.primaryEmail} />
-                  <MetadataItem label="来源" value={sourceLabel(ticket.source)} />
-                  <MetadataItem label="渠道" value={ticket.channel} />
-                  <MetadataItem label="会话 ID" value={ticket.conversationId || undefined} />
-                  <MetadataItem label="最后更新" value={ticket.updatedAt ? formatDateTime(ticket.updatedAt) : undefined} />
-                </section>
-
-                <Separator />
-
-                <section className="space-y-3">
-                  <div className="flex items-center gap-2 text-sm font-medium">
-                    <MessageSquareTextIcon className="size-4 text-muted-foreground" />
-                    处理进展
-                  </div>
-                  <div className="space-y-2">
-                    <Textarea
-                      rows={3}
-                      placeholder="记录本次处理进展"
-                      value={progressContent}
-                      onChange={(event) => setProgressContent(event.target.value)}
-                    />
-                    <div className="flex justify-end">
-                      <Button type="button" size="sm" disabled={progressSaving} onClick={() => void handleCreateProgress()}>
-                        <SendIcon className="size-3.5" />
-                        {progressSaving ? "提交中..." : "添加进展"}
-                      </Button>
-                    </div>
+              <section className="space-y-2">
+                <div className="flex items-center justify-between gap-2">
+                  <div className="text-xs font-medium text-muted-foreground">标签</div>
+                  <Button type="button" size="sm" variant="outline" onClick={() => setEditOpen(true)}>
+                    编辑
+                  </Button>
+                </div>
+                {ticket.tags && ticket.tags.length > 0 ? (
+                  <div className="flex flex-wrap gap-1.5">
+                    {ticket.tags.map((tag) => (
+                      <Badge key={tag.id} variant="outline">
+                        {tag.name}
+                      </Badge>
+                    ))}
                   </div>
+                ) : (
+                  <div className="text-sm text-muted-foreground">暂无标签</div>
+                )}
+              </section>
 
-                  {detail.progresses && detail.progresses.length > 0 ? (
-                    <div className="space-y-3">
-                      {detail.progresses.map((progress, index) => (
-                        <div key={progress.id} className="flex gap-3">
-                          <div className="flex flex-col items-center">
-                            <span className="mt-1 size-2 rounded-full bg-primary" />
-                            <span
-                              className={cn(
-                                "mt-1 w-px flex-1 bg-border",
-                                index === detail.progresses!.length - 1 ? "opacity-0" : "opacity-100",
-                              )}
-                            />
-                          </div>
-                          <div className="min-w-0 flex-1 pb-3">
-                            <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
-                              <span>{progress.authorName || `用户#${progress.authorId}`}</span>
-                              <span>{progress.createdAt ? formatDateTime(progress.createdAt) : "-"}</span>
-                            </div>
-                            <div className="mt-1 whitespace-pre-wrap text-sm leading-6">{progress.content}</div>
-                          </div>
-                        </div>
-                      ))}
-                    </div>
-                  ) : (
-                    <div className="rounded-md border border-dashed px-3 py-6 text-center text-sm text-muted-foreground">
-                      暂无处理进展
-                    </div>
-                  )}
-                </section>
+              <section className="grid gap-3 rounded-md border p-3 text-sm sm:grid-cols-2">
+                <MetadataItem label="客户" value={ticket.customer?.name || ticket.customerId} />
+                <MetadataItem label="联系方式" value={ticket.customer?.primaryMobile || ticket.customer?.primaryEmail} />
+                <MetadataItem label="来源" value={sourceLabel(ticket.source)} />
+                <MetadataItem label="渠道" value={ticket.channel} />
+                <MetadataItem label="会话 ID" value={ticket.conversationId || undefined} />
+                <MetadataItem label="最后更新" value={ticket.updatedAt ? formatDateTime(ticket.updatedAt) : undefined} />
+              </section>
+            </div>
+
+            <aside className="flex min-h-0 flex-col p-6">
+              <div className="flex items-center gap-2 text-sm font-medium">
+                <MessageSquareTextIcon className="size-4 text-muted-foreground" />
+                处理进展
               </div>
-            ) : (
-              <div className="px-6 py-12 text-center text-sm text-muted-foreground">请选择工单</div>
-            )}
-          </ScrollArea>
-        </DialogContent>
-      </Dialog>
+              <div className="mt-3 space-y-2">
+                <Textarea
+                  rows={3}
+                  placeholder="记录本次处理进展"
+                  value={progressContent}
+                  onChange={(event) => setProgressContent(event.target.value)}
+                />
+                <div className="flex justify-end">
+                  <Button type="button" size="sm" disabled={progressSaving} onClick={() => void handleCreateProgress()}>
+                    <SendIcon className="size-3.5" />
+                    {progressSaving ? "提交中..." : "添加进展"}
+                  </Button>
+                </div>
+              </div>
+              <Separator className="my-4" />
+              <div className="min-h-0 flex-1 overflow-y-auto pr-1">
+                {detail.progresses && detail.progresses.length > 0 ? (
+                  <div className="space-y-3">
+                    {detail.progresses.map((progress, index) => (
+                      <div key={progress.id} className="flex gap-3">
+                        <div className="flex flex-col items-center">
+                          <span className="mt-1 size-2 rounded-full bg-primary" />
+                          <span
+                            className={cn(
+                              "mt-1 w-px flex-1 bg-border",
+                              index === detail.progresses!.length - 1 ? "opacity-0" : "opacity-100",
+                            )}
+                          />
+                        </div>
+                        <div className="min-w-0 flex-1 pb-3">
+                          <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
+                            <span>{progress.authorName || `用户#${progress.authorId}`}</span>
+                            <span>{progress.createdAt ? formatDateTime(progress.createdAt) : "-"}</span>
+                          </div>
+                          <div className="mt-1 whitespace-pre-wrap text-sm leading-6">{progress.content}</div>
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                ) : (
+                  <div className="rounded-md border border-dashed px-3 py-6 text-center text-sm text-muted-foreground">
+                    暂无处理进展
+                  </div>
+                )}
+              </div>
+            </aside>
+          </div>
+        ) : (
+          <div className="flex h-[360px] items-center justify-center text-sm text-muted-foreground">请选择工单</div>
+        )}
+      </ProjectDialog>
 
       <TicketAssignDialog
         open={assignOpen}