优化提交

src/modules/overseas-warehouse/pages/PalletDetailView.vue

@@ -1,16 +1,47 @@
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, onMounted, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
+import { getApiErrorDetails, type ApiErrorDetails } from '@/shared/api/http'
+import ApiErrorMeta from '@/shared/components/ApiErrorMeta.vue'
+import LoadErrorState from '@/shared/components/LoadErrorState.vue'
+import { getPallet, listCustomerWarehouses, type PalletDto } from '../api/pallets'
 import OverseasReadOnlyDetail from '../components/OverseasReadOnlyDetail.vue'
 
 const route = useRoute()
 const router = useRouter()
 const palletId = computed(() => String(route.params.palletId || '—'))
+const customerId = computed(() => String(route.query.customerId || ''))
+const warehouseId = computed(() => String(route.query.warehouseId || ''))
+const detail = ref<PalletDto | null>(null)
+const warehouseName = ref('—')
+const loading = ref(false)
+const loadError = ref<ApiErrorDetails | null>(null)
 const groups = [
   { title: '基础信息', fields: ['托盘编码', '托盘类型', '仓库', '容积(m³)', '采购价格', '所属FBA仓', '状态'] },
-  { title: '使用信息', fields: ['关联入库单', '关联箱数', '创建时间', '更新时间', '备注'] },
+  { title: '使用信息', fields: ['库位ID', '创建时间', '更新时间', '备注'] },
 ]
+const values = computed(() => ({
+  托盘编码: detail.value?.palletCode || '—', 托盘类型: detail.value?.palletType || '—', 仓库: warehouseName.value,
+  '容积(m³)': detail.value?.capacityCbm ?? '—', 采购价格: detail.value?.unitPrice ?? '—', 所属FBA仓: '—', 状态: detail.value?.status || '—',
+  库位ID: detail.value?.locationId || '—', 创建时间: detail.value?.createdAt || '—', 更新时间: detail.value?.updatedAt || '—', 备注: detail.value?.remark || '—',
+}))
+
+async function load() {
+  if (!customerId.value || !warehouseId.value || palletId.value === '—') { loadError.value = getApiErrorDetails(new Error('托盘详情缺少客户或仓库参数')); return }
+  loading.value = true; loadError.value = null
+  try {
+    const [pallet, warehouses] = await Promise.all([getPallet(customerId.value, warehouseId.value, palletId.value), listCustomerWarehouses(customerId.value)])
+    detail.value = pallet
+    const warehouse = warehouses.records.find((item) => String(item.id) === warehouseId.value)
+    warehouseName.value = warehouse ? `${warehouse.warehouseName}（${warehouse.warehouseCode}）` : warehouseId.value
+  } catch (error) { loadError.value = getApiErrorDetails(error, '托盘详情加载失败，请重试') }
+  finally { loading.value = false }
+}
+
 function back() { void router.push({ name: 'overseas-pallets' }) }
+onMounted(load)
 </script>
 
-<template><OverseasReadOnlyDetail title="托盘详情" reference-label="托盘编码" :reference-value="palletId" back-label="返回托盘管理" domain="托盘详情" :groups="groups" @back="back" /></template>
+<template><OverseasReadOnlyDetail title="托盘详情" reference-label="托盘编码" :reference-value="detail?.palletCode || palletId" back-label="返回托盘管理" domain="托盘详情" :groups="groups" :field-values="values" :pending="false" status-text="真实数据" :loading="loading" :show-content="!loadError" @back="back">
+  <template v-if="loadError" #state><LoadErrorState title="托盘详情加载失败" :message="loadError.message" :loading="loading" @retry="load"><template #details><ApiErrorMeta :details="loadError" /></template></LoadErrorState></template>
+</OverseasReadOnlyDetail></template>