소스 검색

fix: 退款详情弹窗(handleDetail)也加入订单视频展示

- 提取 fetchOrderMedia/renderVideoSection 公共方法
- handleDetail 和 handleOrderDetail 两个弹窗都展示视频

Co-Authored-By: Claude <noreply@anthropic.com>
skyline 1 개월 전
부모
커밋
d87e1e4a4a
1개의 변경된 파일41개의 추가작업 그리고 41개의 파일을 삭제
  1. 41 41
      haha-admin-web/src/views/order/refund/utils/hook.tsx

+ 41 - 41
haha-admin-web/src/views/order/refund/utils/hook.tsx

@@ -135,40 +135,46 @@ export function useRefund(tableRef: Ref) {
     handleCurrentPageChange(val, pagination, onSearch);
   }
 
+  /** 提取视频 URL */
+  function extractVideoUrl(media: any, order: any): string | null {
+    return media?.video_url || media?.videoUrl
+      || (media?.main_video?.length ? media.main_video[0] : null)
+      || order?.videoUrl || null;
+  }
+
+  /** 根据 activityId + orderNo 尝试获取订单媒体 */
+  async function fetchOrderMedia(activityId: string | undefined, orderNo: string): Promise<{ media: any; videoUrl: string | null }> {
+    let media: any = null;
+    if (activityId) {
+      try { const res = await getOrderMedia({ activityId }); media = res.data; } catch (e) { /* ignore */ }
+    }
+    if (!media?.video_url && !media?.main_video?.length && orderNo) {
+      try { const res = await getOrderMedia({ orderId: orderNo }); media = res.data; } catch (e) { /* ignore */ }
+    }
+    return { media, videoUrl: extractVideoUrl(media, null) };
+  }
+
+  /** 视频播放器 JSX 片段 */
+  function renderVideoSection(videoUrl: string | null) {
+    if (!videoUrl) return null;
+    return (
+      <>
+        <div style="font-size: 15px; font-weight: 600; margin: 14px 0 10px; color: var(--el-text-color-primary);">订单视频</div>
+        <video src={videoUrl} controls style="width:100%;max-height:400px;border-radius:8px;background:#000;">
+          您的浏览器不支持视频播放
+        </video>
+      </>
+    );
+  }
+
   async function handleOrderDetail(row: RefundApplicationItem) {
     try {
-      // 先获取订单详情
       const { data: order } = await getOrderById(row.orderId) as any;
       if (!order) { message("获取订单详情失败", { type: "error" }); return; }
 
-      // 尝试多种方式获取订单媒体(activityId > orderNo > order.videoUrl)
-      let media: any = null;
-      const activityId = order.activityId || row.activityId || "";
-      const orderNo = order.orderNo || row.orderNo || "";
-      console.log("[退款详情] 订单信息:", { orderId: row.orderId, activityId, orderNo, hasVideoUrl: !!order.videoUrl });
-
-      // 优先用 activityId 查哈哈平台
-      if (activityId) {
-        try {
-          const res = await getOrderMedia({ activityId });
-          media = res.data;
-          console.log("[退款详情] 媒体查询结果(activityId):", media);
-        } catch (e) { console.warn("[退款详情] activityId 查媒体失败:", e); }
-      }
-      // 如果 activityId 没查到,尝试用 orderNo(哈哈平台可能用内部 orderId 也能查)
-      if (!media?.video_url && !media?.main_video?.length && orderNo) {
-        try {
-          const res = await getOrderMedia({ orderId: orderNo });
-          media = res.data;
-          console.log("[退款详情] 媒体查询结果(orderNo):", media);
-        } catch (e) { console.warn("[退款详情] orderNo 查媒体失败:", e); }
-      }
-
-      // 提取视频URL
-      const videoUrl: string | null = media?.video_url || media?.videoUrl
-        || (media?.main_video?.length ? media.main_video[0] : null)
-        || order.videoUrl || null;
-      console.log("[退款详情] 最终 videoUrl:", videoUrl);
+      const { videoUrl } = await fetchOrderMedia(order.activityId, order.orderNo || row.orderNo);
+      // 如果 media 没视频,用 order 自带的 videoUrl
+      const finalVideoUrl = videoUrl || order.videoUrl || null;
 
       const payStatusMap: Record<string, { text: string; type: string }> = {
         "UNPAID": { text: "未支付", type: "warning" },
@@ -256,18 +262,7 @@ export function useRefund(tableRef: Ref) {
               </>
             )}
 
-            {videoUrl && (
-              <>
-                <div style="font-size: 15px; font-weight: 600; margin: 14px 0 10px; color: var(--el-text-color-primary);">订单视频</div>
-                <video
-                  src={videoUrl}
-                  controls
-                  style="width:100%;max-height:400px;border-radius:8px;background:#000;"
-                >
-                  您的浏览器不支持视频播放
-                </video>
-              </>
-            )}
+            {renderVideoSection(finalVideoUrl)}
           </div>
         ),
         hideFooter: true
@@ -282,6 +277,9 @@ export function useRefund(tableRef: Ref) {
       const { data } = await getRefundApplicationDetail(row.id);
       const app = data;
 
+      // 并行获取订单媒体
+      const { videoUrl } = await fetchOrderMedia(app.activityId, app.orderNo);
+
       const statusMap: Record<number, { text: string; type: string }> = {
         0: { text: "待审核", type: "warning" },
         1: { text: "已通过", type: "success" },
@@ -367,6 +365,8 @@ export function useRefund(tableRef: Ref) {
                 </ElTable>
               </>
             )}
+
+            {renderVideoSection(videoUrl)}
           </div>
         ),
         hideFooter: true