update order page

frontend/src/pages/orders/index.vue

@@ -131,6 +131,16 @@ async function handleCopyOrderId(platformOrderId: string) {
   }
 }
 
+async function handleCopyRaw() {
+  if (!rawDetail.value?.raw) return
+  try {
+    await navigator.clipboard.writeText(JSON.stringify(rawDetail.value.raw, null, 2))
+    message.success('已复制到剪贴板')
+  } catch {
+    message.error('复制失败')
+  }
+}
+
 async function handleViewDetail(record: { id: number }) {
   const currentRequestId = ++detailRequestId
   drawerVisible.value = true
@@ -244,7 +254,13 @@ async function handleViewDetail(record: { id: number }) {
             {{ store.storeMap.get(record.store_id) || record.store_id }}
           </template>
           <template v-else-if="column.key === 'platform_order_id'">
-            {{ record.platform_order_id }}
+            <span class="inline-flex items-center gap-1">
+              <CopyOutlined
+                class="flex-shrink-0 cursor-pointer text-gray-400 hover:text-blue-500"
+                @click.stop="handleCopyOrderId(record.platform_order_id)"
+              />
+              <span class="truncate">{{ record.platform_order_id }}</span>
+            </span>
           </template>
           <template v-else-if="column.key === 'total_amount'">
             {{ formatAmount(record.total_amount) }}
@@ -296,13 +312,15 @@ async function handleViewDetail(record: { id: number }) {
     <a-drawer
       title="订单详情"
       :open="drawerVisible"
-      :width="720"
+      :width="1200"
       @close="drawerVisible = false"
     >
       <a-spin :spinning="drawerLoading">
-        <template v-if="orderDetail">
+        <a-row :gutter="24" v-if="orderDetail">
+          <!-- 左栏：业务详情 -->
+          <a-col :span="14">
           <!-- 基本信息 -->
-          <a-descriptions title="基本信息" :column="2" bordered class="mb-4">
+          <a-descriptions title="基本信息" :column="2" bordered size="small" class="mb-4">
             <a-descriptions-item label="ID">{{ orderDetail.id }}</a-descriptions-item>
             <a-descriptions-item label="状态">
               <a-tag
@@ -349,7 +367,7 @@ async function handleViewDetail(record: { id: number }) {
           </a-descriptions>
 
           <!-- 金额信息 -->
-          <a-descriptions title="金额信息" :column="2" bordered class="mb-4">
+          <a-descriptions title="金额信息" :column="2" bordered size="small" class="mb-4">
             <a-descriptions-item label="订单总金额">
               {{ formatAmount(orderDetail.total_amount) }}
             </a-descriptions-item>
@@ -383,7 +401,7 @@ async function handleViewDetail(record: { id: number }) {
           </a-descriptions>
 
           <!-- 时间与地址 -->
-          <a-descriptions title="时间与地址" :column="2" bordered class="mb-4">
+          <a-descriptions title="时间与地址" :column="2" bordered size="small" class="mb-4">
             <a-descriptions-item label="创建时间">
               {{ formatTime(orderDetail.created_date) }}
             </a-descriptions-item>
@@ -434,7 +452,7 @@ async function handleViewDetail(record: { id: number }) {
           </a-table>
 
           <!-- ext JSON -->
-          <a-descriptions title="扩展数据 (ext)" :column="1" bordered class="mb-4">
+          <a-descriptions title="扩展数据 (ext)" :column="1" bordered size="small" class="mb-4">
             <a-descriptions-item>
               <pre v-if="orderDetail.ext" class="m-0 text-xs max-h-80 overflow-auto">{{
                 JSON.stringify(orderDetail.ext, null, 2)
@@ -443,17 +461,36 @@ async function handleViewDetail(record: { id: number }) {
             </a-descriptions-item>
           </a-descriptions>
 
-          <!-- raw JSON -->
-          <a-descriptions title="原始数据 (raw)" :column="1" bordered>
-            <a-descriptions-item>
-              <pre
+          </a-col>
+
+          <!-- 右栏：原始 JSON 数据 -->
+          <a-col :span="10">
+            <div class="sticky top-0">
+              <div class="flex items-center justify-between mb-2">
+                <h4 class="text-base font-medium m-0">原始数据</h4>
+                <a-button
+                  v-if="rawDetail?.raw"
+                  type="text"
+                  size="small"
+                  @click="handleCopyRaw"
+                >
+                  <template #icon><CopyOutlined /></template>
+                  复制 JSON
+                </a-button>
+              </div>
+
+              <div
                 v-if="rawDetail?.raw"
-                class="m-0 text-xs max-h-80 overflow-auto"
-              >{{ JSON.stringify(rawDetail.raw, null, 2) }}</pre>
-              <span v-else class="text-gray-400">暂无数据</span>
-            </a-descriptions-item>
-          </a-descriptions>
-        </template>
+                class="bg-gray-50 rounded border border-gray-200 p-3 overflow-auto"
+                style="max-height: calc(100vh - 120px)"
+              >
+                <pre class="m-0 text-xs leading-relaxed whitespace-pre-wrap break-all">{{ JSON.stringify(rawDetail.raw, null, 2) }}</pre>
+              </div>
+
+              <a-empty v-else description="暂无原始数据" />
+            </div>
+          </a-col>
+        </a-row>
       </a-spin>
     </a-drawer>
   </div>