已取消工单在列表与详情展示取消原因来源操作人与时间

apps/frontend/src/pages/admin/panels/WorkOrdersPanel.tsx

@@ -896,21 +896,34 @@ export default function WorkOrdersPanel() {
       title: '状态',
       width: 150,
       render: (_, row) => {
+        const cancelText =
+          row.cancel?.reason || (row.cancel ? `${row.cancel.source}（未记录原因）` : '')
         return (
-          <Space wrap size={4}>
-            <Tag color={resolveStatusColor(row.status)}>{formatStatus(row.status)}</Tag>
-            {row.rawStatus === 'open' && row.pinnedAt ? (
-              <Tag color="gold" icon={<PushpinOutlined />}>
-                置顶
-              </Tag>
+          <div className="cell-stack">
+            <Space wrap size={4}>
+              <Tag color={resolveStatusColor(row.status)}>{formatStatus(row.status)}</Tag>
+              {row.rawStatus === 'open' && row.pinnedAt ? (
+                <Tag color="gold" icon={<PushpinOutlined />}>
+                  置顶
+                </Tag>
+              ) : null}
+              {row.acceptanceMode === 'friend_gift' ? <Tag color="purple">好友赠送</Tag> : null}
+              {row.acceptanceMode === 'friend_gift' && row.gift ? (
+                <Tag color={resolveGiftPhaseColor(row.gift.phase)}>
+                  {formatGiftPhase(row.gift.phase)}
+                </Tag>
+              ) : null}
+            </Space>
+            {row.cancel ? (
+              <Typography.Text
+                type="secondary"
+                style={{ fontSize: 12, maxWidth: 140 }}
+                ellipsis={{ tooltip: `${row.cancel.source}：${cancelText}` }}
+              >
+                {cancelText}
+              </Typography.Text>
             ) : null}
-            {row.acceptanceMode === 'friend_gift' ? <Tag color="purple">好友赠送</Tag> : null}
-            {row.acceptanceMode === 'friend_gift' && row.gift ? (
-              <Tag color={resolveGiftPhaseColor(row.gift.phase)}>
-                {formatGiftPhase(row.gift.phase)}
-              </Tag>
-            ) : null}
-          </Space>
+          </div>
         )
       },
     },
@@ -1418,6 +1431,22 @@ export default function WorkOrdersPanel() {
                     {String(detailOrder.problemNote || '').trim() || '-'}
                   </span>
                 </Descriptions.Item>
+                {detailOrder.cancel ? (
+                  <Descriptions.Item label="取消信息" span={2}>
+                    <span className="worker-order-detail-value">
+                      {detailOrder.cancel.source}
+                      {detailOrder.cancel.cancelledAt
+                        ? ` · ${formatAdminDateTime(detailOrder.cancel.cancelledAt)}`
+                        : ''}
+                      {detailOrder.cancel.actorType === 'admin' && detailOrder.cancel.actorName
+                        ? ` · 操作人 ${detailOrder.cancel.actorName}`
+                        : ''}
+                      {detailOrder.cancel.reason
+                        ? ` · 原因：${detailOrder.cancel.reason}`
+                        : ' · 原因未记录'}
+                    </span>
+                  </Descriptions.Item>
+                ) : null}
               </Descriptions>
             </Card>
 

apps/frontend/src/types/worker-platform.ts

@@ -548,6 +548,14 @@ export type WorkOrder = {
   /** 打手本人尚未点击查看或操作过该工单。 */
   isUnread?: boolean
   problemNote: string
+  /** 取消信息，仅已取消工单返回。 */
+  cancel?: {
+    reason: string
+    source: string
+    actorType: string
+    actorName: string
+    cancelledAt: string | null
+  } | null
   worker: null | {
     workerId: number
     username: string