This commit is contained in:
2026-08-26 16:50:25 +08:00
parent 5868e774d4
commit 083299602d
31 changed files with 816 additions and 239 deletions
@@ -0,0 +1,46 @@
<template>
<view class="receiving-summary">
<view class="receiving-summary-head">
<view><text class="receiving-summary-label">{{ $t('receivingSummary.container') }}</text><text class="receiving-summary-container">{{ session?.containerNo || '—' }}</text></view>
<text class="receiving-summary-status">{{ statusLabel }}</text>
</view>
<view class="receiving-summary-context">
<text>{{ $t('receivingSummary.warehouse') }}:{{ session?.overseasWarehouseName || '—' }}</text>
<text>{{ $t('receivingSummary.destinations') }}:{{ destinationSummary }}</text>
</view>
<view class="receiving-summary-metrics">
<view><text class="metric-value">{{ inboundCodeCount }}</text><text class="metric-label">{{ $t('receivingSummary.inboundCodes') }}</text></view>
<view><text class="metric-value">{{ plannedPalletCount }}</text><text class="metric-label">{{ $t('receivingSummary.plannedPallets') }}</text></view>
<view><text class="metric-value">{{ totalPackages }}</text><text class="metric-label">{{ $t('receivingSummary.plannedBoxes') }}</text></view>
<view><text class="metric-value metric-pending">{{ pendingPackages }}</text><text class="metric-label">{{ $t('receivingSummary.pendingBoxes') }}</text></view>
</view>
<view class="receiving-summary-progress"><view><text>{{ $t('operation.receivingProgress') }}</text><text>{{ receivedPackages }} / {{ totalPackages }} {{ $t('common.boxes') }}</text></view><view class="progress-track"><view class="progress-fill" :style="{ width: percent + '%' }"></view></view></view>
</view>
</template>
<script>
export default {
props: { session: { type: Object, default: null } },
computed: {
inboundCodeCount() { return Array.isArray(this.session?.inbounds) ? this.session.inbounds.length : 0 },
plannedPalletCount() { return (this.session?.inbounds || []).reduce((sum, item) => sum + Math.max(0, Number(item?.plannedPalletCount || 0)), 0) },
destinationSummary() { const values = (this.session?.inbounds || []).map((item) => item?.fbaWarehouseCode || item?.destinationWarehouseName || item?.destinationWarehouseCode).filter(Boolean); return [...new Set(values)].join(' / ') || '—' },
totalPackages() { return Math.max(0, Number(this.session?.totalPackages || 0)) },
receivedPackages() { return Math.max(0, Number(this.session?.receivedPackages || 0)) },
pendingPackages() { return Math.max(0, Number(this.session?.pendingPackages ?? this.totalPackages - this.receivedPackages)) },
percent() { return this.totalPackages ? Math.min(100, Math.round(this.receivedPackages / this.totalPackages * 100)) : 0 },
statusLabel() { return this.$t(({ WAIT_SIGN: 'operation.statusWait', SIGNED: 'operation.statusSigned', RECEIVING: 'operation.statusReceiving', COMPLETED: 'operation.statusCompleted' })[this.session?.status] || 'operation.statusWait') }
}
}
</script>
<style scoped>
.receiving-summary{box-sizing:border-box;margin-bottom:10px;padding:10px 12px;border:1px solid #b8d2f3;border-radius:13px;background:linear-gradient(145deg,#fff,#f2f7ff);box-shadow:0 3px 12px rgba(31,74,125,.08)}
.receiving-summary-head,.receiving-summary-progress>view:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}
.receiving-summary-label,.receiving-summary-container,.metric-value,.metric-label{display:block}.receiving-summary-label{color:#718095;font-size:9px;line-height:13px}.receiving-summary-container{margin-top:1px;color:#17324d;font-size:17px;font-weight:850;line-height:22px}
.receiving-summary-status{flex-shrink:0;padding:4px 8px;border-radius:99px;color:#1668dc;font-size:9px;font-weight:700;background:#e3efff}
.receiving-summary-context{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:8px;margin-top:7px;color:#617389;font-size:9px;line-height:14px}.receiving-summary-context text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.receiving-summary-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:7px;padding:7px 2px;border-radius:9px;background:rgba(255,255,255,.8)}.receiving-summary-metrics>view{display:flex;align-items:center;flex-direction:column;border-right:1px solid #e3eaf2}.receiving-summary-metrics>view:last-child{border-right:0}
.metric-value{color:#17324d;font-size:17px;font-weight:850;line-height:21px}.metric-pending{color:#b66a08}.metric-label{margin-top:1px;color:#718095;font-size:8px;line-height:12px;text-align:center}
.receiving-summary-progress{margin-top:7px;color:#607287;font-size:9px}.progress-track{height:5px;margin-top:5px;overflow:hidden;border-radius:99px;background:#dfe8f2}.progress-fill{height:100%;border-radius:inherit;background:#1677e8}
</style>