feat(订单列表): 添加关联订单组件并优化订阅显示

添加 RelatedOrders 组件用于统一展示关联订单和订阅信息
在订单列表中增加订阅标签显示
移除未使用的 request 导入

src/pages/Order/List/RelatedOrders.tsx

@@ -0,0 +1,55 @@
+import React from 'react';
+import { Empty, Tag } from 'antd';
+import dayjs from 'dayjs';
+import relativeTime from 'dayjs/plugin/relativeTime';
+
+dayjs.extend(relativeTime);
+
+/**
+ * RelatedOrders 表格组件
+ * 用于展示订单详情中的关联数据（订阅/订单），按统一表格样式渲染
+ * 中文注释：本组件将订阅与订单统一归一化为五列展示，便于快速浏览
+ */
+const RelatedOrders: React.FC<{ data?: any[] }> = ({ data = [] }) => {
+  const rows = (Array.isArray(data) ? data : []).map((it: any) => {
+    const isSubscription = !!it?.externalSubscriptionId || !!it?.billing_period || !!it?.line_items;
+    const number = isSubscription ? `#${it?.externalSubscriptionId || it?.id}` : `#${it?.externalOrderId || it?.id}`;
+    const relationship = isSubscription ? 'Subscription' : 'Order';
+    const dateRaw = it?.start_date || it?.date_created || it?.createdAt || it?.updatedAt;
+    const dateText = dateRaw ? dayjs(dateRaw).fromNow() : '-';
+    const status = (isSubscription ? it?.status : it?.orderStatus) || '-';
+    const statusLower = String(status).toLowerCase();
+    const color = statusLower === 'active' ? 'green' : statusLower === 'cancelled' ? 'red' : 'default';
+    const totalNum = Number(it?.total || 0);
+    const totalText = isSubscription ? `$${totalNum.toFixed(2)} / ${it?.billing_period || 'period'}` : `$${totalNum.toFixed(2)}`;
+    return { key: `${isSubscription ? 'sub' : 'order'}-${it?.id}`, number, relationship, dateText, status, color, totalText };
+  });
+
+  if (rows.length === 0) return <Empty description="暂无关联" />;
+
+  return (
+    <div style={{ width: '100%' }}>
+      {/* 表头（英文文案，符合国际化默认英文的要求） */}
+      <div style={{ display: 'grid', gridTemplateColumns: '1.5fr 1fr 1fr 1fr 1fr', padding: '8px 0', fontWeight: 600 }}>
+        <div>订单编号</div>
+        <div>关系</div>
+        <div>日期</div>
+        <div>状态</div>
+        <div>金额</div>
+      </div>
+      <div>
+        {rows.map((r) => (
+          <div key={r.key} style={{ display: 'grid', gridTemplateColumns: '1.5fr 1fr 1fr 1fr 1fr', padding: '6px 0', borderTop: '1px solid #f0f0f0' }}>
+            <div><a>{r.number}</a></div>
+            <div>{r.relationship}</div>
+            <div style={{ color: '#1677ff' }}>{r.dateText}</div>
+            <div><Tag color={r.color}>{r.status}</Tag></div>
+            <div>{r.totalText}</div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
+
+export default RelatedOrders;

src/pages/Order/List/index.tsx

@@ -80,7 +80,11 @@ import {
   Tag,
 } from 'antd';
 import Item from 'antd/es/list/Item';
+<<<<<<< HEAD
 import RelatedOrders from '../../Subscription/Orders/RelatedOrders';
+=======
+import RelatedOrders from './RelatedOrders';
+>>>>>>> 43be89b (feat(订单列表): 添加关联订单组件并优化订阅显示)
 import React, { useMemo, useRef, useState } from 'react';
 import { printPDF } from '@/utils/util';
 
@@ -912,6 +916,7 @@ const Detail: React.FC<{
               );
             }}
           />
+<<<<<<< HEAD
           {/* TODO 显示 related order */}
           <ProDescriptions.Item
             label="关联订单"
@@ -929,6 +934,8 @@ const Detail: React.FC<{
               );
             }}
           />
+=======
+>>>>>>> 43be89b (feat(订单列表): 添加关联订单组件并优化订阅显示)
           {/* 显示 related order */}
 <ProDescriptions.Item
   label="关联"

src/pages/Subscription/Orders/index.tsx

@@ -13,8 +13,11 @@ import { App, Tag, Button, Drawer, List } from 'antd';
 import dayjs from 'dayjs';
 import { ordercontrollerGetorders } from '@/servers/api/order';
 import { sitecontrollerAll } from '@/servers/api/site';
+<<<<<<< HEAD
 import { request } from 'umi';
 >>>>>>> 90ea0f5 (feat(订单): 添加关联订单显示功能并创建订单商品和订阅订单页面)
+=======
+>>>>>>> 43be89b (feat(订单列表): 添加关联订单组件并优化订阅显示)
 
 interface OrderItemRow {
   id: number;