@@ -1,11 +1,12 @@
< script setup lang = "ts" >
import { computed , onMounted , reactive , ref , watch } from 'vue'
import { ElMessage , ElMessageBox } from 'element-plus'
import { ArrowLeft , Download , Eye , Plus , Search , Trash2 , Upload } from '@lucide/vue'
import { ArrowLeft , Download , Eye , Plus , Printer , Search , Trash2 , Upload } from '@lucide/vue'
import SingleLineText from '@/components/common/SingleLineText.vue'
import {
createDiscard , createRelabel , createTransfer , getDiscard , getRelabel , getTransfer ,
confirmRelabelCompletion , downloadRelabelCompletionPhoto , uploadRelabelShippingLabel ,
getTransferCartonLabel ,
confirmRelabelCompletion , confirmTransferMeasurement , downloadRelabelCompletionPhoto , uploadRelabelShippingLabel ,
listDiscardCandidates , listDiscards , listRelabelInventoryCandidates , listRelabels , listTransfers ,
type RelabelInventoryCandidate ,
type RelabelCreate ,
@@ -22,10 +23,11 @@ type ServiceType = 'labeling' | 'transfer' | 'disposal' | 'relabel'
type PageMode = 'list' | 'create' | 'detail'
type LabelingMode = 'carton' | 'sku' | 'carton_and_sku'
type RelabelTemplateType = 'carton' | 'sku' | 'mixed'
interface CargoRow { id : number ; included ? : boolean ; sku : string ; name : string ; quantity : number ; availableQuantity ? : number ; sourceOrderId ? : string ; sourceInventoryBalanceId ? : string ; sourceInventoryPositionId ? : string ; sourceInboundOrderId ? : string ; sourceInboundOrderNo ? : string ; sourceInboundCode ? : string ; sourceWarehouseName ? : string ; palletNo ? : string ; warehouseLocationCode ? : string ; fnsku : string ; shipmentNo : string ; newSkuCode : string ; shippingMark : string ; cartonMark : string ; fbaCartonMark : string ; destinationWarehouseId : string ; remark : string }
interface CargoRow { id : number ; included ? : boolean ; sku : string ; name : string ; quantity : number ; availableQuantity ? : number ; sourceOrderId ? : string ; sourceInventoryBalanceId ? : string ; sourceInventoryPositionId ? : string ; sourceInboundOrderId ? : string ; sourceInboundOrderNo ? : string ; sourceInboundCode ? : string ; sourceWarehouseName ? : string ; palletNo ? : string ; warehouseLocationCode ? : string ; fnsku : string ; shipmentNo : string ; newSkuCode : string ; shippingMark : string ; customerCartonMarks : string ; cartonMark : string ; fbaCartonMark : string ; destinationWarehouseId : string ; remark : string }
interface SkuRelabelRow { id : number ; sourceRowId : number | null ; cartonMark : string ; originalSku : string ; newSku : string ; quantity : number ; fbaCartonMark : string ; destinationWarehouseId : string ; remark : string }
interface ImportedRelabelBinding extends SkuRelabelRow { templateType : RelabelTemplateType ; selected : boolean ; shipmentNo : string }
interface ServiceConfig { title : string ; createTitle : string ; numberLabel : string ; emptyText : string ; columns : string [ ] }
interface TransferCarton { cartonMark : string ; customerCartonMark ? : string ; cartonIndex : number ; totalCartons : number ; status : string }
const props = defineProps < { service : ServiceType } > ( )
const configs : Record < ServiceType , ServiceConfig > = {
@@ -42,7 +44,7 @@ const statusOptions = computed(() => props.service === 'labeling'
: [ { label : '待审核' , value : 'PENDING_REVIEW' } , { label : '已通过' , value : 'APPROVED' } , { label : '待分配' , value : 'PENDING_ASSIGNMENT' } , { label : '已分配' , value : 'ALLOCATED' } , { label : '已出库' , value : 'OUTBOUNDED' } , { label : '部分收货' , value : 'PARTIALLY_RECEIVED' } , { label : '已收货' , value : 'RECEIVED' } , { label : '已拒绝' , value : 'REJECTED' } ] )
const mode = ref < PageMode > ( 'list' )
const filters = reactive ( { number : '' , inboundNo : '' , warehouse : '' , destination : '' , status : '' , start : '' , end : '' } )
const form = reactive ( { customerNo : '' , inboundNo : '' , sourceWarehouse : '' , warehouse : '' , destination : '' , address : '' , contact : '' , phone : '' , deliveryMethod : '' , trackingNo : '' , reason : '' , requirement : '' , relabel : false , remark : '' , labelDeadline : '' , estimatedArrivalAt : '' , fbaShipmentNo : '' , volumeCbm : 0.01 , chargeAmount : 0 } )
const form = reactive ( { customerNo : '' , inboundNo : '' , sourceWarehouse : '' , warehouse : '' , destination : '' , address : '' , contact : '' , phone : '' , deliveryMethod : '' , relabelDeliveryMethod : '' , trackingNo : '' , reason : '' , requirement : '' , relabel : false , remark : '' , labelDeadline : '' , estimatedArrivalAt : '' , estimatedShipAt : '' , fbaShipmentNo : '' , volumeCbm : 0.01 , chargeAmount : 0 } )
const transferHasFbaDestination = ref ( false )
const selectedOperationWarehouse = ref < MerchantWarehouseDetail | null > ( null )
const operationWarehouseDetailLoading = ref ( false )
@@ -53,6 +55,7 @@ const operationWarehouseAddress = computed(() => {
. filter ( Boolean ) . join ( ', ' )
} )
const cargoRows = ref < CargoRow [ ] > ( [ ] )
const transferRelabelRows = ref < CargoRow [ ] > ( [ ] )
const labelingMode = ref < LabelingMode > ( 'carton' )
const shippingLabelFile = ref < File | null > ( null )
const skuRelabelRows = ref < SkuRelabelRow [ ] > ( [ ] )
@@ -64,12 +67,14 @@ const labelingModeHint = computed(() => labelingMode.value === 'carton'
? '只替换箱内商品 SKU 标签,保留原箱唛;同一箱唛可以添加多条 SKU 明细。'
: '同一箱同时替换商品 SKU 标签和外箱箱唛;同一箱唛的多条 SKU 使用同一个新 FBA 箱唛和目的仓。' )
const submittedRows = ref < Record < string , string > [ ] > ( [ ] )
const selectedDetail = ref < Record < string , string > | null > ( null )
interface ServiceDetail extends Record < string , unknown > { transferNo ? : string ; status ? : string ; estimatedShipAt ? : string ; actualShipAt ? : string ; cartons ? : TransferCarton [ ] }
const selectedDetail = ref < ServiceDetail | null > ( null )
const selectedRelabelDetail = ref < RelabelDetail | null > ( null )
const fbaWarehouses = ref < MerchantWarehouse [ ] > ( [ ] )
const operationWarehouses = ref < MerchantWarehouse [ ] > ( [ ] )
const fbaWarehousesLoading = ref ( false )
const fbaWarehousesError = ref ( '' )
const operationWarehousesError = ref ( '' )
const discardCandidates = ref < import ( ' .. / api / warehouseServices ' ) .DiscardCandidate [ ] > ( [ ] )
const selectedDiscardOrderId = ref ( '' )
const discardCandidatesLoading = ref ( false )
@@ -96,15 +101,22 @@ const saving = ref(false)
const cartonTemplateInput = ref < HTMLInputElement | null > ( null )
const skuTemplateInput = ref < HTMLInputElement | null > ( null )
const mixedTemplateInput = ref < HTMLInputElement | null > ( null )
const transferCartonMarkInput = ref < HTMLInputElement | null > ( null )
let cargoSequence = 0
let skuRelabelSequence = 0
watch ( ( ) => props . service , ( ) => { mode . value = 'list' ; resetFilters ( ) ; resetForm ( ) ; void load ( ) } )
watch ( ( ) => form . relabel , ( value ) => {
if ( props . service === 'transfer' && value ) {
labelingMode . value = 'carton_and_sku'
if ( ! transferRelabelRows . value . length ) addTransferRelabelRow ( )
}
} )
watch ( labelingMode , ( value ) => { if ( value !== 'carton' && ! skuRelabelRows . value . length ) addSkuRelabelRow ( ) } )
onMounted ( ( ) => { void load ( ) } )
function resetFilters ( ) { Object . assign ( filters , { number : '' , inboundNo : '' , warehouse : '' , destination : '' , status : '' , start : '' , end : '' } ) }
function resetForm ( ) {
Object . assign ( form , { customerNo : '' , inboundNo : '' , sourceWarehouse : '' , warehouse : '' , destination : '' , address : '' , contact : '' , phone : '' , deliveryMethod : '' , trackingNo : '' , reason : '' , requirement : '' , relabel : false , remark : '' , labelDeadline : '' , estimatedArrivalAt : '' , fbaShipmentNo : '' , volumeCbm : 0.01 , chargeAmount : 0 } )
Object . assign ( form , { customerNo : '' , inboundNo : '' , sourceWarehouse : '' , warehouse : '' , destination : '' , address : '' , contact : '' , phone : '' , deliveryMethod : '' , relabelDeliveryMethod : '' , trackingNo : '' , reason : '' , requirement : '' , relabel : false , remark : '' , labelDeadline : '' , estimatedArrivalAt : '' , estimatedShipAt : '' , fbaShipmentNo : '' , volumeCbm : 0.01 , chargeAmount : 0 } )
cargoRows . value = [ ]
labelingMode . value = 'carton'
skuRelabelRows . value = [ ]
@@ -126,7 +138,12 @@ async function openCreate() {
catch ( error ) { ElMessage . error ( error instanceof Error ? error . message : '可废弃入库单加载失败' ) }
finally { discardCandidatesLoading . value = false }
}
function addCargoRow ( ) { cargoRows . value . push ( { id : ++ cargoSequence , sku : '' , name : '' , quantity : 1 , fnsku : '' , shipmentNo : '' , newSkuCode : '' , shippingMark : '' , cartonMark : '' , fbaCartonMark : '' , destinationWarehouseId : '' , remark : '' } ) }
function createCargoRow ( ) : CargoRow { return { id : ++ cargoSequence , sku : '' , name : '' , quantity : 1 , fnsku : '' , shipmentNo : '' , newSkuCode : '' , shippingMark : '' , customerCartonMarks : '' , cartonMark : '' , fbaCartonMark : '' , destinationWarehouseId : '' , remark : '' } }
function addCargoRow ( ) { cargoRows . value . push ( createCargoRow ( ) ) }
function addTransferRelabelRow ( ) { transferRelabelRows . value . push ( createCargoRow ( ) ) }
function clearTransferRelabelRows ( ) {
transferRelabelRows . value = [ ]
}
function addSkuRelabelRow ( ) {
const source = cargoRows . value [ Math . min ( skuRelabelRows . value . length , Math . max ( 0 , cargoRows . value . length - 1 ) ) ]
skuRelabelRows . value . push ( { id : ++ skuRelabelSequence , sourceRowId : source ? . id || null ,
@@ -219,6 +236,39 @@ function clearRelabelRows() {
for ( const row of cargoRows . value ) Object . assign ( row , { included : false , shipmentNo : '' , cartonMark : '' , fbaCartonMark : '' , destinationWarehouseId : '' , remark : '' } )
}
function csvCell ( value : string | number | undefined ) { return ` " ${ String ( value ? ? '' ) . replaceAll ( '"' , '""' ) } " ` }
function transferCustomerMarks ( row : CargoRow ) {
return row . customerCartonMarks . split ( /[\r\n,, ]+/ ) . map ( ( value ) => value . trim ( ) ) . filter ( Boolean )
}
function downloadTransferCartonMarkTemplate ( ) {
if ( ! cargoRows . value . length || cargoRows . value . some ( ( row ) => ! row . sku . trim ( ) ) ) {
ElMessage . warning ( '请先填写完整的 SKU 明细' ) ; return
}
const header = [ 'SKU' , '客户箱唛号' ]
const rows = cargoRows . value . flatMap ( ( row ) => Array . from ( { length : row . quantity } , ( ) => [ row . sku , '' ] ) )
const blob = new Blob ( [ ` \ uFEFF ${ [ header , ... rows ] . map ( ( row ) => row . map ( csvCell ) . join ( ',' ) ) . join ( '\r\n' ) } \ r \ n ` ] , { type : 'text/csv;charset=utf-8' } )
const url = URL . createObjectURL ( blob ) ; const anchor = document . createElement ( 'a' )
anchor . href = url ; anchor . download = '仓储转运-客户箱唛模板.csv' ; anchor . click ( ) ; URL . revokeObjectURL ( url )
}
async function importTransferCartonMarks ( event : Event ) {
const input = event . target as HTMLInputElement ; const file = input . files ? . [ 0 ] ; input . value = ''
if ( ! file ) return
const lines = ( await file . text ( ) ) . replace ( /^\uFEFF/ , '' ) . split ( /\r?\n/ ) . filter ( ( line ) => line . trim ( ) )
if ( lines . length < 2 ) { ElMessage . error ( '模板中没有可导入的客户箱唛' ) ; return }
const headers = parseCsvLine ( lines [ 0 ] )
if ( ! headers . includes ( 'SKU' ) || ! headers . includes ( '客户箱唛号' ) ) { ElMessage . error ( '客户箱唛模板格式不正确,请重新下载模板' ) ; return }
const imported = lines . slice ( 1 ) . map ( parseCsvLine ) . map ( ( values ) => Object . fromEntries ( headers . map ( ( key , index ) => [ key , values [ index ] || '' ] ) ) ) . filter ( ( item ) => item . SKU || item [ '客户箱唛号' ] )
if ( ! imported . length || imported . some ( ( item ) => ! item . SKU || ! item [ '客户箱唛号' ] ) ) { ElMessage . error ( 'SKU 和客户箱唛号必须填写完整' ) ; return }
const marks = new Set < string > ( )
for ( const item of imported ) {
const row = cargoRows . value . find ( ( candidate ) => candidate . sku . trim ( ) . toUpperCase ( ) === item . SKU . trim ( ) . toUpperCase ( ) )
if ( ! row ) { ElMessage . error ( ` SKU ${ item . SKU } 不属于当前转运单 ` ) ; return }
const mark = item [ '客户箱唛号' ] . trim ( )
if ( marks . has ( mark . toUpperCase ( ) ) ) { ElMessage . error ( ` 客户箱唛 ${ mark } 不能重复 ` ) ; return }
marks . add ( mark . toUpperCase ( ) )
}
for ( const row of cargoRows . value ) row . customerCartonMarks = imported . filter ( ( item ) => item . SKU . trim ( ) . toUpperCase ( ) === row . sku . trim ( ) . toUpperCase ( ) ) . map ( ( item ) => item [ '客户箱唛号' ] . trim ( ) ) . join ( '\n' )
ElMessage . success ( ` 已导入 ${ imported . length } 个客户箱唛 ` )
}
function downloadRelabelTemplate ( templateType : RelabelTemplateType ) {
if ( ! cargoRows . value . length ) { ElMessage . warning ( '请先选择有库存的历史入仓单' ) ; return }
const cartonTemplate = templateType === 'carton'
@@ -364,7 +414,7 @@ function selectDiscardInbound(orderId: string) {
cargoRows . value = candidate . skus . map ( ( sku ) => ( {
id : ++ cargoSequence , sku : sku . skuCode , name : sku . productName , quantity : 0 ,
availableQuantity : sku . availablePackages , sourceOrderId : candidate . orderId ,
fnsku : '' , shipmentNo : '' , newSkuCode : '' , shippingMark : '' , cartonMark : '' , fbaCartonMark : '' , destinationWarehouseId : '' , remark : '' ,
fnsku : '' , shipmentNo : '' , newSkuCode : '' , shippingMark : '' , customerCartonMarks : '' , cartonMark : '' , fbaCartonMark : '' , destinationWarehouseId : '' , remark : '' ,
} ) )
}
function dateTime ( value : string , end = false ) { return value ? ` ${ value } T ${ end ? '23:59:59' : '00:00:00' } ` : undefined }
@@ -427,11 +477,11 @@ async function submit() {
const invalidCargo = props . service === 'disposal'
? ! selectedDiscardOrderId . value || cargoRows . value . every ( ( item ) => item . quantity < 1 )
|| cargoRows . value . some ( ( item ) => item . quantity < 0 || item . quantity > Number ( item . availableQuantity || 0 ) )
: relabelRows . length === 0 || ( props . service === 'labeling' && labelingMode . value !== 'carton'
: ( props . service === 'labeling' || props . service === 'relabel' ) && ( relabelRows . length === 0 || ( props . service === 'labeling' && labelingMode . value !== 'carton'
? skuRelabelRows . value . some ( ( item ) => ! item . cartonMark || ! item . originalSku || ! item . newSku || item . quantity < 1
|| ( labelingMode . value === 'carton_and_sku' && ( ! item . fbaCartonMark || ! item . destinationWarehouseId ) ) )
: cargoRows . value . some ( ( item ) => ( props . service !== 'labeling' && ! item . sku ) || ! item . name
|| ( props . service !== 'labeling' && item . quantity < 1 ) ) )
|| ( props . service !== 'labeling' && item . quantity < 1 ) ) ) )
if ( ( props . service === 'relabel' && ! form . inboundNo ) || ( props . service !== 'disposal' && ! primaryWarehouse ) || invalidCargo ) {
ElMessage . warning ( '请填写必填信息和完整的货物明细' ) ; return
}
@@ -457,12 +507,22 @@ async function submit() {
if ( props . service === 'relabel' && ( ! form . destination || ! form . address || ! form . deliveryMethod || ! form . estimatedArrivalAt || ! form . fbaShipmentNo || form . volumeCbm <= 0 ) ) {
ElMessage . warning ( '请填写完整的派送信息、体积、预计到达时间和 FBA 货件号' ) ; return
}
if ( props . service === 'transfer' && ( ! form . warehouse || ! form . deliveryMethod || ! form . address || ! form . estimatedArrivalAt || form . volumeCbm <= 0 ) ) {
ElMessage . warning ( form . deliveryMethod === 'WAREHOUSE_PICKUP' ? '请填写中转仓、提货地址和预计入仓时间' : '请选择中转仓并确认预计入仓时间' ) ; return
if ( props . service === 'transfer' && ( ! form . warehouse || ! form . deliveryMethod || ! form . address || ! form . estimatedArrivalAt || ! form . estimatedShipAt || form . volumeCbm < 0 ) ) {
const missing = [ ! form . warehouse && '中转仓' , ! form . deliveryMethod && '送货方式' , ! form . address && '地址' , ! form . estimatedArrivalAt && '预计入仓时间' , ! form . estimatedShipAt && '预计发货时间' , form . volumeCbm < 0 && '预估总体积' ] . filter ( Boolean ) . join ( '、' )
ElMessage . warning ( ` 请填写: ${ missing || '必填信息' } ` ) ; return
}
if ( props . service === 'transfer' && transferHasFbaDestination . value && ( ! form . destination || ! form . fbaShipmentNo ) ) {
ElMessage . warning ( '已选择有 FBA 去向,请填写 FBA 目的仓和货件编号' ) ; return
}
if ( props . service === 'transfer' && form . relabel ) {
if ( ! form . labelDeadline || ! form . contact || ! form . phone || form . chargeAmount < 0.01 || ( labelingMode . value !== 'sku' && ! form . relabelDeliveryMethod ) ) { ElMessage . warning ( '请填写换标截止时间、联系人、费用和换标后派送方式' ) ; return }
const relabelRows = transferRelabelRows . value
const allMarks = relabelRows . flatMap ( transferCustomerMarks )
if ( ! relabelRows . length || relabelRows . some ( ( row ) => transferCustomerMarks ( row ) . length !== row . quantity ) ) { ElMessage . warning ( '每个换标明细的客户箱唛数量必须与换标数量一致' ) ; return }
if ( new Set ( allMarks . map ( ( mark ) => mark . toUpperCase ( ) ) ) . size !== allMarks . length ) { ElMessage . warning ( '客户箱唛号不能重复' ) ; return }
if ( allMarks . join ( ',' ) . length > 2000 || relabelRows . some ( ( row ) => transferCustomerMarks ( row ) . join ( ',' ) . length > 255 ) ) { ElMessage . warning ( '客户箱唛内容过长,请减少单次提交箱数或缩短箱唛号' ) ; return }
if ( relabelRows . some ( ( row ) => row . quantity < 1 || ( labelingMode . value !== 'carton' && ! row . newSkuCode . trim ( ) ) || ( labelingMode . value !== 'sku' && ( ! row . fbaCartonMark . trim ( ) || ! row . destinationWarehouseId . trim ( ) ) ) ) ) { ElMessage . warning ( '请按当前换标类型完整填写换标明细' ) ; return }
}
try { await ElMessageBox . confirm ( ` 确认提交 ${ config . value . title } 吗? ` , '提交确认' , { confirmButtonText : '提交' , cancelButtonText : '取消' } ) } catch { return }
saving . value = true
try {
@@ -486,7 +546,10 @@ async function submit() {
await createDiscard ( { items , idempotencyKey , remark : [ form . reason , form . remark ] . filter ( Boolean ) . join ( '; ' ) || undefined } )
} else {
const packageCount = cargoRows . value . reduce ( ( sum , item ) => sum + item . quantity , 0 )
await createTransfer ( { operatingWarehouseId : primaryWarehouse , fbaWarehouseCode : form . destination || undefined , deliveryAddress : form . address , packageCount , volumeCbm : form . volumeCbm , deliveryMethod : form . deliveryMethod , estimatedArrivalAt : form . estimatedArrivalAt , fbaShipmentNo : form . fbaShipmentNo || undefined , trackingNo : form . deliveryMethod === 'CUSTOMER_DELIVERY' ? form . trackingNo || undefined : undefined , remark : form . remark || undefined , needRelabel : props . service === 'relabel' || form . relabel , idempotencyKey , items : cargoRows . value . map ( ( item ) => ( { skuCode : item . sku , productNameZh : item . name , packageCount : item . quantity } ) ) } )
const customerCartonMarks = ( form . relabel ? transferRelabelRows . value : cargoRows . value ) . flatMap ( transferCustomerMarks )
const transferRemark = [ form . remark , form . relabel && form . requirement ? ` 换标要求: ${ form . requirement } ` : '' ] . filter ( Boolean ) . join ( '; ' )
const operationType = labelingMode . value === 'carton' ? 'CARTON_LABEL' : labelingMode . value === 'sku' ? 'SKU_LABEL' : 'CARTON_AND_SKU'
await createTransfer ( { operatingWarehouseId : primaryWarehouse , fbaWarehouseCode : form . destination || undefined , deliveryAddress : form . address , packageCount , volumeCbm : form . volumeCbm , deliveryMethod : form . deliveryMethod , estimatedArrivalAt : form . estimatedArrivalAt , estimatedShipAt : form . estimatedShipAt || undefined , fbaShipmentNo : form . fbaShipmentNo || undefined , trackingNo : form . deliveryMethod === 'CUSTOMER_DELIVERY' ? form . trackingNo || undefined : undefined , fbaBoxNos : customerCartonMarks . length ? customerCartonMarks . join ( ',' ) : undefined , remark : transferRemark || undefined , needRelabel : props . service === 'relabel' || form . relabel , labelDeadline : form . relabel ? form . labelDeadline : undefined , relabelContactName : form . relabel ? form . contact : undefined , relabelContactPhone : form . relabel ? form . phone : undefined , relabelChargeAmount : form . relabel ? form . chargeAmount : undefined , relabelDeliveryMethod : form . relabel && labelingMode . value !== 'sku' ? form . relabelDeliveryMethod as 'TRUCK' | 'EXPRESS' | 'TRUCK_PICKUP' | 'EXPRESS_PICKUP' : undefined , idempotencyKey , items : cargoRows . value . map ( ( item ) => ( { skuCode : item . sku , productNameZh : item . name , packageCount : item . quantity , shippingMark : transferCustomerMarks ( item ) . join ( ',' ) || undefined } ) ) , relabelItems : form . relabel ? transferRelabelRows . value . map ( ( item ) => ( { operationType , customerCartonMarks : transferCustomerMarks ( item ) , originalSku : item . sku , newSku : item . newSkuCode || undefined , quantity : item . quantity , fbaCartonMark : item . fbaCartonMark || undefined , destinationWarehouseCode : item . destinationWarehouseId || undefined , remark : item . remark || undefined } ) ) : undefined } )
}
ElMessage . success ( ` ${ config . value . title } 提交成功 ` ) ; mode . value = 'list' ; await load ( )
} catch ( error ) { ElMessage . error ( error instanceof Error ? error . message : '提交失败' ) }
@@ -495,11 +558,30 @@ async function submit() {
async function openDetail ( value : Record < string , string > ) {
try {
const detail = props . service === 'labeling' ? await getRelabel ( value [ '0' ] ) : props . service === 'disposal' ? await getDiscard ( value [ '0' ] ) : await getTransfer ( value [ '0' ] )
selectedDetail . value = value
selectedDetail . value = { ... value , ... ( detail as ServiceDetail ) }
selectedRelabelDetail . value = props . service === 'labeling' ? detail as RelabelDetail : null
mode . value = 'detail'
} catch ( error ) { ElMessage . error ( error instanceof Error ? error . message : '详情加载失败' ) }
}
async function confirmTransferMeasurements ( ) {
const transferNo = String ( selectedDetail . value ? . transferNo || selectedDetail . value ? . [ '0' ] || '' )
if ( ! transferNo ) return
try { await ElMessageBox . confirm ( '确认 PDA 回传的箱数、尺寸、重量和打托数据吗?确认后将按实测数据入库。' , '确认实测数据' , { confirmButtonText : '确认入库' , cancelButtonText : '取消' } ) } catch { return }
try { selectedDetail . value = await confirmTransferMeasurement ( transferNo ) as ServiceDetail ; ElMessage . success ( '实测数据已确认并入库' ) }
catch ( error ) { ElMessage . error ( error instanceof Error ? error . message : '确认失败' ) }
}
async function printTransferCartons ( ) {
if ( props . service !== 'transfer' ) return
try {
const detail = selectedDetail . value
const transferNo = String ( detail ? . transferNo || detail ? . [ '0' ] || '' )
const label = await getTransferCartonLabel ( transferNo )
if ( ! label . cartons . length ) { ElMessage . warning ( '暂无可打印的箱唛' ) ; return }
const printWindow = window . open ( '' , '_blank' )
if ( ! printWindow ) { ElMessage . warning ( '浏览器阻止了打印窗口,请允许弹窗后重试' ) ; return }
printWindow . opener = null ; printWindow . document . open ( ) ; printWindow . document . write ( label . printableHtml ) ; printWindow . document . close ( ) ; printWindow . focus ( ) ; printWindow . print ( )
} catch ( error ) { ElMessage . error ( error instanceof Error ? error . message : '箱唛加载失败' ) }
}
async function confirmRelabel ( ) {
const relabelNo = selectedRelabelDetail . value ? . application . relabelNo
if ( ! relabelNo ) return
@@ -522,13 +604,15 @@ async function previewCompletionPhoto(fileId: string) {
async function loadWarehouses ( ) {
fbaWarehousesLoading . value = true
fbaWarehousesError . value = ''
operationWarehousesError . value = ''
try {
const [ fbaResult , operationResult ] = await Promise . all ( [
const [ fbaResult , operationResult ] = await Promise . allSettled ( [
getMerchantWarehouses ( { warehouseType : 'FBA' } ) ,
getMerchantWarehouses ( { warehouseType : 'OVERSEAS' } ) ,
] )
fbaWarehouses . value = fbaResult . records
operationWarehouses . value = operationResult . records
fbaWarehouses . value = fbaResult . status === 'fulfilled' ? fbaResult . value . records : [ ]
operationWarehouses . value = operationResult . status === 'fulfilled' ? operationResult . value . records : [ ]
if ( operationResult . status === 'rejected' ) operationWarehousesError . value = '海外仓候选加载失败,请检查仓库主数据或数据库迁移'
} catch ( error ) {
fbaWarehouses . value = [ ]
fbaWarehousesError . value = error instanceof Error ? error . message : 'FBA 目的仓加载失败'
@@ -540,7 +624,7 @@ async function selectTransferWarehouse() {
selectedOperationWarehouse . value = null
form . contact = ''
form . phone = ''
if ( form . deliveryMethod === 'CUSTOMER_DELIVERY' ) form . address = ''
if ( form . deliveryMethod === 'CUSTOMER_DELIVERY' ) form . address = ''
if ( ! form . warehouse ) return
operationWarehouseDetailLoading . value = true
try {
@@ -563,6 +647,7 @@ function selectTransferFbaAvailability(value: string | number | boolean | undefi
}
async function selectOperationWarehouse ( ) {
cargoRows . value = [ ]
transferRelabelRows . value = [ ]
skuRelabelRows . value = [ ]
importedRelabelBindings . value = [ ]
selectedRelabelInboundOrderId . value = ''
@@ -586,7 +671,7 @@ function selectRelabelInventory(inboundOrderId: string) {
sourceInboundOrderId : String ( candidate . inboundOrderId ) , sourceInboundOrderNo : candidate . inboundOrderNo ,
sourceInboundCode : candidate . inboundCode , sourceWarehouseName : candidate . overseasWarehouseName ,
palletNo : position . palletNo , warehouseLocationCode : position . warehouseLocationCode ,
fnsku : '' , shipmentNo : '' , newSkuCode : '' , shippingMark : '' , cartonMark : '' , fbaCartonMark : '' ,
fnsku : '' , shipmentNo : '' , newSkuCode : '' , shippingMark : '' , customerCartonMarks : '' , cartonMark : '' , fbaCartonMark : '' ,
destinationWarehouseId : candidate . destinationFbaWarehouseCode || '' , remark : '' ,
} ) ) ) ) . slice ( 0 , 500 )
if ( cargoRows . value . length ) cargoRows . value [ 0 ] . included = true
@@ -623,20 +708,21 @@ function selectRelabelInventory(inboundOrderId: string) {
< template v-else-if = "mode === 'create'" >
< div class = "warehouse-breadcrumb" > < button type = "button" @click ="mode = 'list'" > {{ config.title }} < / button > < b > / < / b > < strong > 新增 < / strong > < / div >
< div class = "warehouse-page-heading" > < h2 > { { config . createTitle } } < / h2 > < el-button @click ="mode = 'list'" > < ArrowLeft :size = "16" / > 返回列表 < / el-button > < / div >
< form @submit.prevent ="submit" >
< div class = "warehouse-card warehouse-form-section" > < h3 > { { props . service === 'transfer' ? '入库与转运信息' : props . service === 'relabel' ? '退货信息' : props . service === 'labeling' ? '订单信息' : '基础信息' } } < / h3 >
< form : class = "{ 'warehouse-transfer-form': props.service === 'transfer', 'warehouse-transfer-form--relabel': props.service === 'transfer' && form.relabel }" @submit.prevent ="submit" >
< div class = "warehouse-card warehouse-form-section warehouse-transfer-main-card " > < h3 > { { props . service === 'transfer' ? '入库与转运信息' : props . service === 'relabel' ? '退货信息' : props . service === 'labeling' ? '订单信息' : '基础信息' } } < / h3 >
< div class = "warehouse-form-grid" >
< label v-if = "props.service === 'disposal'" class="warehouse-span-2"><span><i>*</i>选择入库单</span><el-select v-model="selectedDiscardOrderId" filterable :loading="discardCandidatesLoading" placeholder="请选择有可用库存的入库单" @change="selectDiscardInbound"><el-option v-for="candidate in discardCandidates" :key="candidate.orderId" :label="`${candidate.inboundOrderNo || candidate.inboundCode || '—'}| ${candidate.inboundCode || '—'}| ${candidate.overseasWarehouseName || '—'}|可用 ${candidate.availablePackages} 箱`" :value="candidate.orderId" /></el-select><small class="warehouse-hint" > 仅显示一件代发中仍有可用箱数的入库单 。 < / small > < / label >
< label v-if = "props.service === 'relabel'"><span><i>*</i>进仓编号</span><el-input v-model="form.inboundNo" placeholder="请输入已有入仓编号" / > < / label >
< label v-if = "props.service === 'relabel'"><span><i>*</i>来源 FBA 仓库</span><el-select v-model="form.sourceWarehouse" :loading="fbaWarehousesLoading" :disabled="Boolean(fbaWarehousesError)" placeholder="请选择平台维护的 FBA 仓"><el-option v-for="warehouse in fbaWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="warehouse.warehouseCode" / > < / el-select > < / label >
< label v-else-if = "props.service === 'disposal'"><span>进仓编号</span><el-input v-model="form.inboundNo" readonly / > < / label >
< label v-else > < span > < i > * < / i > { { props . service === 'labeling' ? '海外操作仓(中转仓)' : props . service === 'transfer' ? '入库中转仓' : '操作仓' } } < / span > < el-select v-model = "form.warehouse" :loading="fbaWarehousesLoading || operationWarehouseDetailLoading" :disabled="Boolean(fba WarehousesError)" clearable placeholder="请选择国外中转仓" @change="props.service === 'labeling' ? selectOperationWarehouse() : props.service === 'transfer' && selectTransferWarehouse()"><el-option v-for="warehouse in operationWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="String(warehouse.id)" /></el-select><small v-if="props.service === 'labeling'" class="warehouse-hint">选择后仅查询当前客户在该中转仓的可用库存。</small><small v-else-if="props.service === 'transfer'" class="warehouse-hint" > 本批货物将先进入该仓完成签收和入库 。 < / small > < / label >
< label v-else > < span > < i > * < / i > { { props . service === 'labeling' ? '海外操作仓(中转仓)' : props . service === 'transfer' ? '入库中转仓' : '操作仓' } } < / span > < el-select v-model = "form.warehouse" :loading="fbaWarehousesLoading || operationWarehouseDetailLoading" :disabled="Boolean(operation WarehousesError)" clearable placeholder="请选择国外中转仓" @change="props.service === 'labeling' ? selectOperationWarehouse() : props.service === 'transfer' && selectTransferWarehouse()"><el-option v-for="warehouse in operationWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="String(warehouse.id)" /></el-select><small v-if="operationWarehousesError" class="warehouse-hint">{{ operationWarehousesError }}</small><small v-else-if=" props.service === 'labeling'" class="warehouse-hint">选择后仅查询当前客户在该中转仓的可用库存。</small><small v-else-if="props.service === 'transfer'" class="warehouse-hint" > 本批货物将先进入该仓完成签收和入库 。 < / small > < / label >
< label v-if = "props.service === 'labeling'" class="warehouse-span-2"><span><i>*</i>选择有库存的历史入仓单</span><el-select v-model="selectedRelabelInboundOrderId" filterable clearable :loading="relabelCandidatesLoading" :disabled="!form.warehouse" no-data-text="当前中转仓暂无已入库可用库存" placeholder="请选择曾经下单且当前仍有库存的入仓单" @change="selectRelabelInventory"><el-option v-for="option in relabelInboundOptions" :key="option.value" :label="`${option.inboundOrderNo}|入仓码 ${option.inboundCode}|可用 ${option.availablePackages} 箱`" :value="option.value" /></el-select><small class="warehouse-hint" > 仅显示当前客户在所选中转仓已经完成入库且仍有可用库存的历史入仓单 。 < / small > < / label >
< label v-if = "props.service === 'disposal'"><span>操作仓</span><el-input :model-value="discardCandidates.find((item) => item.orderId === selectedDiscardOrderId)?.overseasWarehouseName || form.warehouse" readonly / > < / label >
< div v-if = "props.service === 'transfer'" class="warehouse-choice-field warehouse-span-2"><span><i>*</i>货物如何送到中转仓</span><el-radio-group v-model="form.deliveryMethod" @change="selectTransferInboundMethod"><el-radio-button value="WAREHOUSE_PICKUP">仓库上门提货</el-radio-button><el-radio-button value="CUSTOMER_DELIVERY" > 客户送货到仓 < / el -radio -button > < / el-radio-group > < small > 仓库上门提货 : 填写货物当前地址 ; 客户送货到仓 : 下方自动展示中转仓收货信息 。 < / small > < / div >
< label v-if = "props.service === 'transfer' && form.deliveryMethod === 'WAREHOUSE_PICKUP'" class="warehouse-span-2"><span><i>*</i>提货地址</span><el-input v-model="form.address" placeholder="请输入仓库上门提货的详细地址" / > < / label >
< div v-if = "props.service === 'transfer' && form.deliveryMethod === 'CUSTOMER_DELIVERY'" v-loading="operationWarehouseDetailLoading" class="warehouse-receiving-card warehouse-span-2" >
< div > < span > 送货地址 < / span > < strong > { { operationWarehouseAddress || '该中转仓暂未维护收货地址' } } < / strong > < / div >
< div > < span > 仓库收货信息 < / span > < strong > { { operationWarehouseAddress || '该中转仓暂未维护收货地址' } } < / strong > < / div >
< label class = "warehouse-span-2" > < span > < i > * < / i > 送货地址 < / span > < el-input v-model = "form.address" placeholder="请输入实际送货地址" / > < / label >
< div > < span > 收货联系人 < / span > < strong > { { form . contact || '未维护' } } < / strong > < / div >
< div > < span > 联系电话 < / span > < strong > { { form . phone || '未维护' } } < / strong > < / div >
< / div >
@@ -651,19 +737,20 @@ function selectRelabelInventory(inboundOrderId: string) {
< div v-if = "props.service === 'labeling' && labelingMode !== 'sku' && (form.deliveryMethod === 'EXPRESS' || form.deliveryMethod === 'EXPRESS_PICKUP')" class="warehouse-checkbox-field"><span>是否打印面单</span><el-checkbox v-model="form.relabel" > 需要仓库打印面单 < / el -checkbox > < / div >
< label v-if = "props.service === 'labeling' && labelingMode !== 'sku' && (form.deliveryMethod === 'EXPRESS' || form.deliveryMethod === 'EXPRESS_PICKUP') && form.relabel"><span><i>*</i>上传面单文件</span><input class="warehouse-native-file" type="file" accept="application/pdf,image/*,.pdf" @change="selectShippingLabel"><small class="warehouse-hint" > 支持 PDF 或图片 , 最大 20 MB 。 < / small > < / label >
< label v-if = "props.service === 'relabel'" class="warehouse-span-2"><span><i>*</i>详细派送地址</span><el-input v-model="form.address" placeholder="请输入派送地址" / > < / label >
< label v-if = "props.service === 'transfer' || props.service === 'relabel'"><span><i>*</i>总体积(CBM) </span><el-input-number v-model="form.volumeCbm" :min="0.0001 " :precision="4" controls-position="right" placeholder="请输入总体积" / > < / label >
< label v-if = "props.service === 'transfer' || props.service === 'relabel'"><span><i>*</i>预估 总体积(CBM) </span><el-input-number v-model="form.volumeCbm" :min="0" :precision="4" :step="0.0001" controls-position="right" placeholder="请输入预估 总体积" / > < / label >
< label v-if = "props.service === 'transfer' || props.service === 'relabel'"><span><i>*</i>{{ props.service === 'transfer' ? '预计入仓时间' : '预计到达时间' }}</span><el-date-picker v-model="form.estimatedArrivalAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" :placeholder="props.service === 'transfer' ? '请选择预计入仓时间' : '请选择预计到达时间'" / > < / label >
< label v-if = "props.service === 'transfer'"><span><i>*</i>预计发货时间</span><el-date-picker v-model="form.estimatedShipAt" type="datetime" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="请选择预计发货时间" / > < / label >
< div v-if = "props.service === 'transfer'" class="warehouse-choice-field warehouse-span-2"><span><i>*</i>是否已有 FBA 去向</span><el-radio-group v-model="transferHasFbaDestination" @change="selectTransferFbaAvailability"><el-radio-button :value="false">暂未确定</el-radio-button><el-radio-button :value="true" > 已有 FBA 去向 < / el -radio -button > < / el-radio-group > < small > 暂未确定也可以提交 , 货物先正常入中转仓 , 后续再补充转运指令 。 < / small > < / div >
< label v-if = "props.service === 'transfer' && transferHasFbaDestination"><span><i>*</i>目的 FBA 仓</span><el-select v-model="form.destination" :loading="fbaWarehousesLoading" :disabled="Boolean(fbaWarehousesError)" filterable placeholder="请选择平台维护的 FBA 仓"><el-option v-for="warehouse in fbaWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="warehouse.warehouseCode" / > < / el-select > < / label >
< label v-if = "props.service === 'transfer' && transferHasFbaDestination"><span><i>*</i>FBA 货件编号</span><el-input v-model="form.fbaShipmentNo" placeholder="请输入 FBA 货件编号" / > < / label >
< label v-if = "props.service === 'transfer' && transferHasFbaDestination && !form.relabel "><span><i>*</i>目的 FBA 仓</span><el-select v-model="form.destination" :loading="fbaWarehousesLoading" :disabled="Boolean(fbaWarehousesError)" filterable placeholder="请选择平台维护的 FBA 仓"><el-option v-for="warehouse in fbaWarehouses" :key="warehouse.id" :label="warehouseLabel(warehouse)" :value="warehouse.warehouseCode" / > < / el-select > < / label >
< label v-if = "props.service === 'transfer' && transferHasFbaDestination && !form.relabel "><span><i>*</i>FBA 货件编号</span><el-input v-model="form.fbaShipmentNo" placeholder="请输入 FBA 货件编号" / > < / label >
< label v-if = "props.service === 'relabel'"><span><i>*</i>FBA 货件编号</span><el-input v-model="form.fbaShipmentNo" placeholder="请输入 FBA 货件编号" / > < / label >
< label v-if = "props.service === 'labeling'"><span>贴标要求</span><el-input v-model="form.requirement" placeholder="请输入贴标要求" / > < / label >
< label v-else-if = "props.service === 'relabel' || (props.service === 'transfer' && form.deliveryMethod === 'CUSTOMER_DELIVERY')"><span>物流跟踪号</span><el-input v-model="form.trackingNo" placeholder="请输入物流跟踪号(选填)" / > < / label >
< label class = "warehouse-span-2" > < span > 订单备注 < / span > < el-input v-model = "form.remark" type="textarea" :rows="3" placeholder="请输入备注信息" / > < / label >
< div v-if = "props.service === 'transfer'" class="warehouse-choice-field warehouse-span-2"><span><i>*</i>是否需要换标</span><el-radio-group v-model="form.relabel"><el-radio-button :value="false">不需要换标</el-radio-button><el-radio-button :value="true">需要换标</el-radio-button></el-radio-group><small v-if="form.relabel" > 转运单将显示换标标识 , 完成入库后再绑定换标单 。 < / small > < / div >
< div v-if = "props.service === 'transfer'" class="warehouse-choice-field warehouse-span-2"><span><i>*</i>是否需要换标</span><el-radio-group v-model="form.relabel"><el-radio-button :value="false">不需要换标</el-radio-button><el-radio-button :value="true" > 需要换标 < / el -radio -button > < / el-radio-group > < small > { { form . relabel ? '本次提交将同时登记换标申请,入库完成后自动进入换标作业。' : '入库完成且已有目的仓后,可直接进入排车流程。' } } < / small > < / div >
< / div >
< / div >
< div class = "warehouse-card warehouse-form-section" >
< div class = "warehouse-card warehouse-form-section warehouse-transfer-cargo-card " >
< template v-if = "props.service === 'labeling'" >
< div class = "warehouse-section-heading warehouse-labeling-heading" >
< h3 > 货物明细 < / h3 >
@@ -705,14 +792,32 @@ function selectRelabelInventory(inboundOrderId: string) {
<div class=" warehouse - table - scroll "><table class=" warehouse - edit - table "><thead><tr><th>商品 SKU *</th><th>中文品名 *</th><th v-if=" props . service === 'disposal' ">可用箱数</th><th v-if=" props . service === 'relabel' ">FNSKU / 箱唛</th><th>{{ props.service === 'disposal' ? '本次废弃箱数' : '预计箱数' }} *</th><th v-if=" props . service !== 'disposal' ">操作</th></tr></thead><tbody><tr v-for=" row in cargoRows " :key=" row . id "><td><el-input v-model=" row . sku " :readonly=" props . service === 'disposal' " placeholder=" 请输入商品 SKU " /></td><td><el-input v-model=" row . name " :readonly=" props . service === 'disposal' " placeholder=" 请输入中文品名 " /></td><td v-if=" props . service === 'disposal' "><strong>{{ row.availableQuantity }} 箱</strong></td><td v-if=" props . service === 'relabel' "><el-input v-model=" row . shippingMark " placeholder=" 请输入FNSKU或箱唛 " /></td><td><el-input-number v-model=" row . quantity " :min=" props . service === 'disposal' ? 0 : 1 " :max=" row . availableQuantity " controls-position=" right " placeholder=" 请输入箱数 " /></td><td v-if=" props . service !== 'disposal' "><button type=" button " class=" warehouse - delete " title=" 删除 " @click=" removeCargoRow ( row . id ) "><Trash2 :size=" 16 " />删除</button></td></tr><tr v-if=" cargoRows . length === 0 "><td :colspan=" props . service === 'disposal' ? 4 : props . service === 'relabel' ? 5 : 4 "><div class=" warehouse - empty ">{{ props.service === 'disposal' ? '请先选择入库单,系统将自动带出 SKU 和可用箱数' : '暂无货物明细,请点击“添加行”' }}</div></td></tr></tbody></table></div>
</template>
</div>
<div class=" warehouse - submit - bar "><el-button @click=" resetForm ">重置</el-button><el-button type=" primary " native-type=" submit " :loading=" saving ">提交{{ config.title }}</el-button></div >
<div v-if=" props . service === 'transfer' && form . relabel " class=" warehouse - card warehouse - form - section warehouse - transfer - relabel " >
<div class=" warehouse - section - heading warehouse - labeling - heading "><div><h3>货物明细</h3><p>换标明细与贴标申请保持一致;客户只填写自己的箱唛,我方箱唛由系统生成。</p></div><div class=" warehouse - template - actions "><el-button size=" small " :disabled=" ! cargoRows . length " @click=" downloadRelabelTemplate ( 'sku' ) "><Download :size=" 15 " />下载 SKU 关联模板</el-button><el-button size=" small " :disabled=" ! cargoRows . length " @click=" skuTemplateInput ? . click ( ) "><Upload :size=" 15 " />上传 SKU 关联</el-button><el-button size=" small " :disabled=" ! cargoRows . length " @click=" downloadRelabelTemplate ( 'carton' ) "><Download :size=" 15 " />下载箱号关联模板</el-button><el-button size=" small " :disabled=" ! cargoRows . length " @click=" cartonTemplateInput ? . click ( ) "><Upload :size=" 15 " />上传箱号关联</el-button><el-button size=" small " :disabled=" ! cargoRows . length " @click=" downloadRelabelTemplate ( 'mixed' ) "><Download :size=" 15 " />下载 SKU 混箱模板</el-button><el-button size=" small " :disabled=" ! cargoRows . length " @click=" mixedTemplateInput ? . click ( ) "><Upload :size=" 15 " />上传 SKU 混箱</el-button><input ref=" skuTemplateInput " class=" warehouse - hidden - input " type=" file " accept=" . csv , text / csv " @change=" importRelabelTemplate ( $event , 'sku' ) "><input ref=" cartonTemplateInput " class=" warehouse - hidden - input " type=" file " accept=" . csv , text / csv " @change=" importRelabelTemplate ( $event , 'carton' ) "><input ref=" mixedTemplateInput " class=" warehouse - hidden - input " type=" file " accept=" . csv , text / csv " @change=" importRelabelTemplate ( $event , 'mixed' ) "></div></div>
<div class=" warehouse - form - grid warehouse - transfer - relabel - fields "><label><span><i>*</i>换标截止时间</span><el-date-picker v-model=" form . labelDeadline " type=" datetime " value-format=" YYYY - MM - DDTHH : mm : ss " placeholder=" 请选择截止时间 " /></label><label><span><i>*</i>联系人</span><el-input v-model=" form . contact " placeholder=" 请输入联系人 " /></label><label><span><i>*</i>联系电话</span><el-input v-model=" form . phone " placeholder=" 请输入联系电话 " /></label><label><span><i>*</i>换标费用(CNY) </span><el-input-number v-model=" form . chargeAmount " :min=" 0.01 " :precision=" 2 " :step=" 0.01 " controls-position=" right " placeholder=" 请输入服务费用 " /></label><label v-if=" labelingMode !== 'sku' "><span><i>*</i>换标后派送方式</span><el-select v-model=" form . relabelDeliveryMethod " placeholder=" 请选择派送方式 "><el-option label=" 卡车派送 " value=" TRUCK " /><el-option label=" 快递派送 " value=" EXPRESS " /><el-option label=" 卡车自提 " value=" TRUCK _PICKUP " /><el-option label=" 快递自提 " value=" EXPRESS _PICKUP " /></el-select></label><label><span>FBA 货件编号</span><el-input v-model=" form . fbaShipmentNo " placeholder=" 选填 , 未填则使用转运单号 " /></label><label class=" warehouse - span - 2 "><span>贴标要求</span><el-input v-model=" form . requirement " type=" textarea " :rows=" 2 " maxlength=" 1000 " show-word-limit placeholder=" 请输入贴标要求 ( 选填 ) " /></label></div>
<div class=" warehouse - labeling - mode "><span>换标类型</span><el-radio-group v-model=" labelingMode " aria-label=" 换标类型 "><el-radio-button value=" carton ">只换箱唛</el-radio-button><el-radio-button value=" sku ">只换 SKU 标签</el-radio-button><el-radio-button value=" carton _and _sku ">SKU 和箱唛都换</el-radio-button></el-radio-group><p>{{ labelingModeHint }}</p></div>
<div v-if=" importedRelabelBindings . length " class=" warehouse - import - preview "><div class=" warehouse - section - heading "><div><strong>待导入绑定关系</strong><p>可只勾选本次需要换标的部分,也可以全选后一次导入。</p></div><div><el-checkbox :model-value=" importedRelabelBindings . every ( ( item ) => item . selected ) " @change=" selectAllImportedBindings ( Boolean ( $event ) ) ">全选</el-checkbox><el-button type=" primary " size=" small " @click=" importSelectedBindingsToDetails ">导入到明细</el-button></div></div><div class=" warehouse - table - scroll "><table class=" warehouse - binding - preview - table "><thead><tr><th>选择</th><th>关系类型</th><th>旧箱唛</th><th>旧 SKU</th><th>新 SKU</th><th>数量</th><th>新 FBA 箱唛</th><th>FBA 目的仓</th></tr></thead><tbody><tr v-for=" item in importedRelabelBindings " :key=" item . id "><td><el-checkbox v-model=" item . selected " /></td><td>{{ item.templateType === 'mixed' ? 'SKU 混箱换标' : item.templateType === 'carton' ? '箱号关联' : 'SKU 关联' }}</td><td>{{ item.cartonMark }}</td><td>{{ item.originalSku || '—' }}</td><td>{{ item.newSku || '—' }}</td><td>{{ item.quantity }}</td><td>{{ item.fbaCartonMark || '—' }}</td><td>{{ warehouseDisplay(item.destinationWarehouseId) }}</td></tr></tbody></table></div></div>
<div class=" warehouse - section - heading warehouse - tab - actions "><div><strong>绑定明细</strong><p>上传后在下方回显,也可以手动添加;客户箱唛作为旧箱唛来源,系统我方箱唛不需要手填。</p></div><div><el-button type=" primary " size=" small " @click=" addTransferRelabelRow "><Plus :size=" 15 " />添加 SKU 明细</el-button><el-button size=" small " @click=" clearTransferRelabelRows ">清空</el-button></div></div>
<div v-if=" labelingMode === 'carton' " class=" warehouse - table - scroll "><table class=" warehouse - edit - table warehouse - transfer - mark - table "><thead><tr><th>客户箱唛号 *</th><th>旧 SKU</th><th>新 FBA 箱唛 *</th><th>FBA 目的仓 *</th><th>备注</th><th>操作</th></tr></thead><tbody><tr v-for=" row in transferRelabelRows " :key=" row . id "><td><el-input v-model=" row . customerCartonMarks " type=" textarea " :rows=" 2 " placeholder=" 请输入客户箱唛号 " /></td><td><el-input :model-value=" row . sku " readonly /></td><td><el-input v-model=" row . fbaCartonMark " placeholder=" 请输入新的 FBA 箱唛 " /></td><td><el-select v-model=" row . destinationWarehouseId " :loading=" fbaWarehousesLoading " :disabled=" Boolean ( fbaWarehousesError ) " filterable placeholder=" 请选择 FBA 目的仓 "><el-option v-for=" warehouse in fbaWarehouses " :key=" warehouse . id " :label=" warehouseLabel ( warehouse ) " :value=" warehouse . warehouseCode " /></el-select></td><td><el-input v-model=" row . remark " type=" textarea " :rows=" 2 " placeholder=" 请输入备注 " /></td><td><button type=" button " class=" warehouse - delete " title=" 删除该明细 " @click=" transferRelabelRows = transferRelabelRows . filter ( ( item ) => item . id !== row . id ) "><Trash2 :size=" 16 " />删除</button></td></tr><tr v-if=" transferRelabelRows . length === 0 "><td colspan=" 6 "><div class=" warehouse - empty ">暂无绑定明细,请点击“添加 SKU 明细”</div></td></tr></tbody></table></div>
<div v-else-if=" labelingMode === 'sku' " class=" warehouse - table - scroll "><table class=" warehouse - edit - table warehouse - transfer - mark - table "><thead><tr><th>客户箱唛号 *</th><th>旧 SKU *</th><th>新 SKU *</th><th>换标数量(件)*</th><th>备注</th><th>操作</th></tr></thead><tbody><tr v-for=" row in transferRelabelRows " :key=" row . id "><td><el-input v-model=" row . customerCartonMarks " type=" textarea " :rows=" 2 " placeholder=" 请输入客户箱唛号 " /></td><td><el-input :model-value=" row . sku " readonly /></td><td><el-input v-model=" row . newSkuCode " placeholder=" 请输入新 SKU " /></td><td><el-input-number v-model=" row . quantity " :min=" 1 " :precision=" 0 " controls-position=" right " placeholder=" 请输入箱数 " /></td><td><el-input v-model=" row . remark " type=" textarea " :rows=" 2 " placeholder=" 请输入备注 " /></td><td><button type=" button " class=" warehouse - delete " title=" 删除该明细 " @click=" transferRelabelRows = transferRelabelRows . filter ( ( item ) => item . id !== row . id ) "><Trash2 :size=" 16 " />删除</button></td></tr><tr v-if=" transferRelabelRows . length === 0 "><td colspan=" 6 "><div class=" warehouse - empty ">暂无绑定明细,请点击“添加 SKU 明细”</div></td></tr></tbody></table></div>
<div v-else class=" warehouse - table - scroll "><table class=" warehouse - edit - table warehouse - transfer - mark - table "><thead><tr><th>客户箱唛号 *</th><th>旧 SKU *</th><th>新 SKU *</th><th>换标数量(件)*</th><th>新 FBA 箱唛 *</th><th>FBA 目的仓 *</th><th>备注</th><th>操作</th></tr></thead><tbody><tr v-for=" row in transferRelabelRows " :key=" row . id "><td><el-input v-model=" row . customerCartonMarks " type=" textarea " :rows=" 2 " placeholder=" 请输入客户箱唛号 " /></td><td><el-input :model-value=" row . sku " readonly /></td><td><el-input v-model=" row . newSkuCode " placeholder=" 请输入新 SKU " /></td><td><el-input-number v-model=" row . quantity " :min=" 1 " :precision=" 0 " controls-position=" right " placeholder=" 请输入数量 " /></td><td><el-input v-model=" row . fbaCartonMark " placeholder=" 请输入新的 FBA 箱唛 " /></td><td><el-select v-model=" row . destinationWarehouseId " :loading=" fbaWarehousesLoading " :disabled=" Boolean ( fbaWarehousesError ) " filterable placeholder=" 请选择 FBA 目的仓 "><el-option v-for=" warehouse in fbaWarehouses " :key=" warehouse . id " :label=" warehouseLabel ( warehouse ) " :value=" warehouse . warehouseCode " /></el-select></td><td><el-input v-model=" row . remark " type=" textarea " :rows=" 2 " placeholder=" 请输入备注 " /></td><td><button type=" button " class=" warehouse - delete " title=" 删除该明细 " @click=" transferRelabelRows = transferRelabelRows . filter ( ( item ) => item . id !== row . id ) "><Trash2 :size=" 16 " />删除</button></td></tr><tr v-if=" transferRelabelRows . length === 0 "><td colspan=" 8 "><div class=" warehouse - empty ">暂无绑定明细,请点击“添加 SKU 明细”</div></td></tr></tbody></table></div>
</div>
<div class=" warehouse - submit - bar warehouse - transfer - submit - bar "><el-button @click=" resetForm ">重置</el-button><el-button type=" primary " native-type=" submit " :loading=" saving ">提交{{ config.title }}</el-button></div>
</form>
</template>
<template v-else>
<div class=" warehouse - breadcrumb "><button type=" button " @click=" mode = 'list' ">{{ config.title }}</button><b>/</b><strong>订单详情</strong></div>
<div class=" warehouse - page - heading "><h2>{{ config.title }}详情</h2><el-button @click=" mode = 'list' "><ArrowLeft :size=" 16 " />返回列表</el-button></div>
<div class=" warehouse - page - heading "><h2>{{ config.title }}详情</h2><div><el-button v-if=" props . service === 'transfer' && selectedDetail ? . status === 'WAIT_CUSTOMER_CONFIRMATION' " type=" primary " @click=" confirmTransferMeasurements ">确认实测并入库</el-button>< el-button @click="mode = 'list' "><ArrowLeft :size=" 16 " />返回列表</el-button></div></div>
<div class=" warehouse - card warehouse - form - section "><h3>订单概览</h3><div class=" warehouse - detail - grid "><div v-for=" ( column , index ) in config . columns . slice ( 1 ) " :key=" column "><span>{{ column }}</span><strong>{{ selectedDetail?.[String(index)] || '—' }}</strong></div></div></div>
<div v-if=" props . service === 'transfer' " class=" warehouse - card warehouse - form - section warehouse - transfer - times "><h3>发货时间</h3><div class=" warehouse - detail - grid "><div><span>预计发货时间</span><strong>{{ formatDateTime(selectedDetail?.estimatedShipAt) }}</strong></div><div><span>实际发货时间</span><strong>{{ formatDateTime(selectedDetail?.actualShipAt) }}</strong></div></div><p>实际发货时间由仓库出库或 PDA 完成后回填,客户不能手动修改。</p></div>
<div v-if=" props . service === 'transfer' " class=" warehouse - card warehouse - form - section ">
<div class=" warehouse - section - heading "><h3>箱唛明细</h3><el-button type=" primary " @click=" printTransferCartons "><Printer :size=" 16 " />打印箱唛</el-button></div>
<div class=" warehouse - table - scroll "><table><thead><tr><th>系统箱唛</th><th>客户箱唛</th><th>箱序</th><th>状态</th></tr></thead><tbody>
<tr v-for=" carton in ( selectedDetail ? . cartons || [ ] ) " :key=" carton . cartonMark "><td><strong>{{ carton.cartonMark }}</strong></td><td>{{ carton.customerCartonMark || '—' }}</td><td>{{ carton.cartonIndex }} / {{ carton.totalCartons }}</td><td>{{ carton.status }}</td></tr>
<tr v-if=" ! ( selectedDetail ? . cartons || [ ] ) . length "><td colspan=" 4 "><div class=" warehouse - empty ">暂无箱唛明细</div></td></tr>
</tbody></table></div>
</div>
<div v-if=" props . service === 'labeling' " class=" warehouse - card warehouse - form - section ">
<div class=" warehouse - section - heading "><h3>换标完成与出库</h3><el-button v-if=" selectedRelabelDetail ? . application . status === 'CUSTOMER_CONFIRM_PENDING' " type=" primary " @click=" confirmRelabel ">换标完成确认</el-button></div>
<div class=" warehouse - detail - grid warehouse - fulfillment - grid ">
@@ -744,4 +849,7 @@ function selectRelabelInventory(inboundOrderId: string) {
. warehouse - relabel - detail - table { min - width : 1420 px } . warehouse - relabel - detail - table td strong { color : # 253 f67 }
. warehouse - native - file { min - height : 32 px ; padding : 5 px 8 px ; border : 1 px solid # dcdfe6 ; border - radius : 4 px ; background : # fff ; color : # 606266 } . warehouse - fulfillment - grid { margin - bottom : 18 px } . warehouse - evidence { display : flex ; align - items : center ; gap : 16 px ; padding : 14 px ; border : 1 px solid # e7ebf1 ; border - radius : 4 px ; background : # f8fafc } . warehouse - evidence > span { color : # 71809 a ; font - size : 12 px } . warehouse - evidence > strong { color : # 8 a95a5 ; font - size : 12 px ; font - weight : 400 } . warehouse - photo - actions { display : flex ; flex - wrap : wrap ; gap : 8 px } . warehouse - completion - remark { margin : 10 px 0 0 ; color : # 596579 ; font - size : 12 px }
. warehouse - template - actions { flex - wrap : wrap ; justify - content : flex - end } . warehouse - import - preview { margin : 0 0 16 px ; padding : 14 px ; border : 1 px solid # cfe0f5 ; border - radius : 5 px ; background : # f8fbff } . warehouse - import - preview . warehouse - section - heading { margin - bottom : 10 px } . warehouse - import - preview . warehouse - section - heading > div { display : flex ; align - items : center ; gap : 10 px } . warehouse - import - preview p { margin : 0 ; color : # 7 d8797 ; font - size : 12 px } . warehouse - binding - preview - table { min - width : 980 px ; background : # fff }
. warehouse - transfer - relabel . warehouse - labeling - heading > div : first - child { min - width : 0 } . warehouse - transfer - relabel . warehouse - labeling - heading h3 { margin - bottom : 6 px } . warehouse - transfer - relabel . warehouse - labeling - heading p { margin : 0 0 16 px ; color : # 7 d8797 ; font - size : 12 px } . warehouse - transfer - relabel - fields { margin - bottom : 18 px } . warehouse - transfer - mark - table { min - width : 1420 px } . warehouse - transfer - mark - table td { vertical - align : top } . warehouse - transfer - mark - table : deep ( . el - textarea ) { min - width : 220 px } . warehouse - transfer - mark - table : deep ( . el - input - number ) { width : 150 px } . warehouse - count - error { color : # d64545 }
. warehouse - transfer - form { display : grid ; grid - template - columns : minmax ( 0 , 1 fr ) ; gap : 12 px } . warehouse - transfer - form -- relabel { grid - template - columns : minmax ( 0 , 1 fr ) minmax ( 0 , 1.35 fr ) ; align - items : start } . warehouse - transfer - form -- relabel . warehouse - transfer - main - card { grid - column : 1 ; grid - row : 1 } . warehouse - transfer - form -- relabel . warehouse - transfer - cargo - card { grid - column : 1 ; grid - row : 2 } . warehouse - transfer - form -- relabel . warehouse - transfer - relabel { grid - column : 2 ; grid - row : 1 / span 2 ; margin - bottom : 0 } . warehouse - transfer - form -- relabel . warehouse - transfer - submit - bar { grid - column : 1 / - 1 } . warehouse - transfer - form : deep ( . el - input _ _wrapper ) , . warehouse - transfer - form : deep ( . el - textarea _ _inner ) , . warehouse - transfer - form : deep ( . el - select _ _wrapper ) , . warehouse - transfer - form : deep ( . el - date - editor . el - input _ _wrapper ) { min - height : 32 px } . warehouse - transfer - form . warehouse - form - section { padding : 16 px } . warehouse - transfer - form . warehouse - form - section h3 { margin - bottom : 12 px ; padding - bottom : 9 px ; font - size : 14 px } . warehouse - transfer - form . warehouse - form - grid { gap : 12 px 16 px } . warehouse - transfer - form . warehouse - choice - field { min - height : 34 px ; padding : 8 px 10 px ; grid - template - columns : 118 px auto 1 fr ; gap : 10 px } . warehouse - transfer - form . warehouse - choice - field > span { font - size : 12 px } . warehouse - transfer - form . warehouse - choice - field small { font - size : 11 px } . warehouse - transfer - form . warehouse - receiving - card { gap : 12 px ; padding : 10 px 12 px } . warehouse - transfer - form . warehouse - section - heading { margin - bottom : 8 px } . warehouse - transfer - form . warehouse - edit - table { font - size : 11 px } . warehouse - transfer - form . warehouse - edit - table th { height : 36 px ; padding : 0 9 px } . warehouse - transfer - form . warehouse - edit - table td { height : 42 px ; padding : 6 px 7 px } . warehouse - transfer - form . warehouse - transfer - mark - table : deep ( . el - textarea ) { min - width : 150 px } . warehouse - transfer - form . warehouse - transfer - mark - table : deep ( . el - input - number ) { width : 112 px } . warehouse - transfer - form . warehouse - hint { margin - top : 5 px ; font - size : 11 px } . warehouse - transfer - form . warehouse - labeling - mode { gap : 9 px ; margin - bottom : 10 px ; padding : 9 px 10 px } . warehouse - transfer - form . warehouse - labeling - mode > span { font - size : 12 px } . warehouse - transfer - form . warehouse - labeling - mode p { font - size : 11 px } . warehouse - transfer - form . warehouse - labeling - mode : deep ( . el - radio - button _ _inner ) { padding : 6 px 9 px } . warehouse - transfer - form . warehouse - template - actions { gap : 5 px ; padding - bottom : 8 px } . warehouse - transfer - form . warehouse - template - actions : deep ( . el - button ) { padding : 6 px 8 px ; font - size : 11 px } . warehouse - transfer - form . warehouse - submit - bar { padding : 4 px 0 18 px } . warehouse - transfer - form . warehouse - submit - bar : deep ( . el - button ) { min - height : 32 px ; padding : 7 px 14 px } . warehouse - transfer - form . warehouse - transfer - relabel { overflow : hidden } . warehouse - transfer - form . warehouse - transfer - relabel - fields { margin - bottom : 10 px }
@ media ( max - width : 1250 px ) { . warehouse - transfer - form -- relabel { grid - template - columns : minmax ( 0 , 1 fr ) minmax ( 0 , 1 fr ) } . warehouse - transfer - form . warehouse - template - actions { justify - content : flex - start } . warehouse - transfer - form . warehouse - labeling - heading { align - items : flex - start ; flex - direction : column } }
< / style >