2026-08-19 16:45:51 +08:00
|
|
|
|
<script setup lang="ts">
|
2026-08-20 18:04:38 +08:00
|
|
|
|
import { computed, onMounted, ref } from 'vue'
|
2026-08-19 16:45:51 +08:00
|
|
|
|
import { useRoute, useRouter } from 'vue-router'
|
2026-08-20 18:04:38 +08:00
|
|
|
|
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'
|
2026-08-19 16:45:51 +08:00
|
|
|
|
import OverseasReadOnlyDetail from '../components/OverseasReadOnlyDetail.vue'
|
|
|
|
|
|
|
|
|
|
|
|
const route = useRoute()
|
|
|
|
|
|
const router = useRouter()
|
|
|
|
|
|
const palletId = computed(() => String(route.params.palletId || '—'))
|
2026-08-20 18:04:38 +08:00
|
|
|
|
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)
|
2026-08-19 16:45:51 +08:00
|
|
|
|
const groups = [
|
|
|
|
|
|
{ title: '基础信息', fields: ['托盘编码', '托盘类型', '仓库', '容积(m³)', '采购价格', '所属FBA仓', '状态'] },
|
2026-08-20 18:04:38 +08:00
|
|
|
|
{ title: '使用信息', fields: ['库位ID', '创建时间', '更新时间', '备注'] },
|
2026-08-19 16:45:51 +08:00
|
|
|
|
]
|
2026-08-20 18:04:38 +08:00
|
|
|
|
const values = computed(() => ({
|
|
|
|
|
|
托盘编码: detail.value?.palletCode || '—', 托盘类型: detail.value?.palletType || '—', 仓库: warehouseName.value,
|
2026-08-21 11:20:09 +08:00
|
|
|
|
'容积(m³)': detail.value?.capacityCbm ?? '—', 采购价格: detail.value?.unitPrice ?? '—', 所属FBA仓: detail.value?.fbaWarehouseCode || '—', 状态: detail.value?.status || '—',
|
2026-08-20 18:04:38 +08:00
|
|
|
|
库位ID: detail.value?.locationId || '—', 创建时间: detail.value?.createdAt || '—', 更新时间: detail.value?.updatedAt || '—', 备注: detail.value?.remark || '—',
|
|
|
|
|
|
}))
|
|
|
|
|
|
|
|
|
|
|
|
async function load() {
|
2026-08-21 11:20:09 +08:00
|
|
|
|
if (!warehouseId.value || palletId.value === '—') { loadError.value = getApiErrorDetails(new Error('托盘详情缺少仓库参数')); return }
|
2026-08-20 18:04:38 +08:00
|
|
|
|
loading.value = true; loadError.value = null
|
|
|
|
|
|
try {
|
2026-08-21 11:20:09 +08:00
|
|
|
|
const [pallet, warehouses] = await Promise.all([getPallet(warehouseId.value, palletId.value), listCustomerWarehouses()])
|
2026-08-20 18:04:38 +08:00
|
|
|
|
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 }
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2026-08-19 16:45:51 +08:00
|
|
|
|
function back() { void router.push({ name: 'overseas-pallets' }) }
|
2026-08-20 18:04:38 +08:00
|
|
|
|
onMounted(load)
|
2026-08-19 16:45:51 +08:00
|
|
|
|
</script>
|
|
|
|
|
|
|
2026-08-20 18:04:38 +08:00
|
|
|
|
<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>
|
