贯通商品编号全流程

frontend/src/features/orders/views/MobileOrderDetailView.vue

@@ -24,6 +24,7 @@ import {
 import { useSessionStore } from '@/stores/session'
 import { handoffStatusLabel, orderStatusLabel } from '@/utils/statusLabels'
 import { formatDateTime } from '@/utils/time'
+import { formatListingNo } from '@/utils/listingDisplay'
 
 const route = useRoute()
 const router = useRouter()
@@ -43,6 +44,9 @@ const uploadingEvidence = ref(false)
 const openingChat = ref(false)
 const order = ref<Order | null>(null)
 const handoffRecords = ref<HandoffRecord[]>([])
+const listingCode = computed(() =>
+  order.value ? formatListingNo(order.value.listing_no, order.value.listing_id) : '-'
+)
 const handoffContent = ref('')
 const checkoutForm = ref({
   content: '',
@@ -600,6 +604,16 @@ function getStatusTagType(status: string) {
   if (['cancelled', 'closed'].includes(status)) return 'danger'
   return 'danger'
 }
+
+async function copyListingCode() {
+  if (!order.value) return
+  try {
+    await navigator.clipboard.writeText(listingCode.value)
+    showToast({ message: '商品编号已复制', icon: 'passed' })
+  } catch {
+    showToast({ message: '复制失败', icon: 'cross' })
+  }
+}
 </script>
 
 <template>
@@ -634,6 +648,9 @@ function getStatusTagType(status: string) {
             {{ orderStatusLabel(order.status) }}
           </van-tag>
         </div>
+        <button class="listing-code-chip" type="button" @click="copyListingCode">
+          商品编号 {{ listingCode }}
+        </button>
         <h2 class="order-title">{{ order.title }}</h2>
         <div class="order-meta-grid">
           <div class="meta-item">
@@ -762,7 +779,7 @@ function getStatusTagType(status: string) {
 
       <!-- Handoff Records list -->
       <section class="card-section">
-        <h3 class="section-title">交接日志</h3>
+        <h3 class="section-title">交接日志 · 商品编号 {{ listingCode }}</h3>
         <van-empty
           v-if="handoffRecords.length === 0"
           image="search"
@@ -1276,6 +1293,17 @@ function getStatusTagType(status: string) {
   font-family: monospace;
 }
 
+.listing-code-chip {
+  margin-bottom: 10px;
+  padding: 4px 9px;
+  border: 1px solid #dbeafe;
+  border-radius: 999px;
+  background: #eff6ff;
+  color: #2563eb;
+  font-size: 12px;
+  font-weight: 800;
+}
+
 .order-title {
   font-size: 18px;
   font-weight: 700;