wuweihua
117 lines
5.8 KiB
Vue
117 lines
5.8 KiB
Vue
<template>
|
|
<el-drawer
|
|
:model-value="modelValue"
|
|
:title="title"
|
|
size="840px"
|
|
append-to-body
|
|
destroy-on-close
|
|
class="air-bill-detail-drawer"
|
|
@update:model-value="$emit('update:modelValue', $event)"
|
|
>
|
|
<div v-loading="loading" class="air-bill-detail-wrap">
|
|
<el-empty v-if="!detail" description="暂无详情" />
|
|
<div v-else class="air-bill-detail">
|
|
<section class="detail-block">
|
|
<div class="sec-title">基本信息</div>
|
|
<el-descriptions class="detail-desc" :column="2" border size="small">
|
|
<el-descriptions-item label="提单号">{{ detail.billCode || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="提单类型"><dict-tag :options="srv_air_bill_type" :value="detail.billType" /></el-descriptions-item>
|
|
<el-descriptions-item label="始发机场">{{ detail.startAirport || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="目的机场">{{ detail.endAirport || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="目的港">{{ detail.desPort || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="航线名称">{{ detail.routeName || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="航空公司">{{ detail.airCompany || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="总件数">{{ numOrDash(detail.pieceNumber) }}</el-descriptions-item>
|
|
<el-descriptions-item label="总体积">{{ numOrDash(detail.volume) }}</el-descriptions-item>
|
|
<el-descriptions-item label="实际重量">{{ numOrDash(detail.actualWeight) }}</el-descriptions-item>
|
|
<el-descriptions-item label="实际体积">{{ numOrDash(detail.actualVolume) }}</el-descriptions-item>
|
|
<el-descriptions-item label="体积重">{{ numOrDash(detail.volumeWeight) }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
</section>
|
|
|
|
<section class="detail-block">
|
|
<div class="sec-title">费用信息</div>
|
|
<el-descriptions class="detail-desc" :column="2" border size="small">
|
|
<el-descriptions-item label="报关费">{{ money(detail.baoguanFee) }}</el-descriptions-item>
|
|
<el-descriptions-item label="报关其他费用">{{ money(detail.baoguanOtherFee) }}</el-descriptions-item>
|
|
<el-descriptions-item label="仓储费">{{ money(detail.stockFee) }}</el-descriptions-item>
|
|
<el-descriptions-item label="目的港代理费">{{ money(detail.desPortAgentFee) }}</el-descriptions-item>
|
|
<el-descriptions-item label="空运其他费用">{{ money(detail.airOtherFee) }}</el-descriptions-item>
|
|
<el-descriptions-item label="其他费用">{{ money(detail.otherFee) }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
</section>
|
|
|
|
<section class="detail-block">
|
|
<div class="sec-title">航班与代理</div>
|
|
<el-descriptions class="detail-desc" :column="2" border size="small">
|
|
<el-descriptions-item label="航班号">{{ detail.airNo || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="实际航班号">{{ detail.actualAirNo || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="航空公司代理">{{ detail.airCompanyAgent || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="目的港代理编码">{{ detail.desPortAgentCode || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="报关公司编码">{{ detail.declareCode || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="清关编码">{{ detail.clearanceCode || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="清关代理">{{ detail.qingguanAgent || '-' }}</el-descriptions-item>
|
|
<el-descriptions-item label="出仓仓库地址">{{ detail.stockAddr || '-' }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
</section>
|
|
|
|
<section class="detail-block">
|
|
<div class="sec-title">时效信息</div>
|
|
<el-descriptions class="detail-desc" :column="2" border size="small">
|
|
<el-descriptions-item label="首程落地时间">{{ formatDateTime(detail.firstLandingTime) }}</el-descriptions-item>
|
|
<el-descriptions-item label="发货日期">{{ formatDateTime(detail.shippingDate) }}</el-descriptions-item>
|
|
<el-descriptions-item label="起飞时间">{{ formatDateTime(detail.startTime) }}</el-descriptions-item>
|
|
<el-descriptions-item label="到达时间">{{ formatDateTime(detail.arriveTime) }}</el-descriptions-item>
|
|
<el-descriptions-item label="到仓时间">{{ formatDateTime(detail.arriveStockTime) }}</el-descriptions-item>
|
|
<el-descriptions-item label="清关时间">{{ formatDateTime(detail.clearanceTime) }}</el-descriptions-item>
|
|
</el-descriptions>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</el-drawer>
|
|
</template>
|
|
|
|
<script setup name="AirBillDetail">
|
|
import { parseTime } from '@/utils/bms'
|
|
|
|
const { srv_air_bill_type } = useDict('srv_air_bill_type')
|
|
|
|
defineProps({
|
|
modelValue: { type: Boolean, default: false },
|
|
title: { type: String, default: '提单详情' },
|
|
loading: { type: Boolean, default: false },
|
|
detail: { type: Object, default: null }
|
|
})
|
|
|
|
defineEmits(['update:modelValue'])
|
|
|
|
function numOrDash(v) {
|
|
return v === null || v === undefined || v === '' ? '-' : v
|
|
}
|
|
|
|
function money(v) {
|
|
if (v === null || v === undefined || v === '') return '-'
|
|
const n = Number(v)
|
|
if (Number.isNaN(n)) return String(v)
|
|
return n.toFixed(4)
|
|
}
|
|
|
|
function formatDateTime(v) {
|
|
return v ? parseTime(v) : '-'
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.air-bill-detail-wrap {
|
|
min-height: 200px;
|
|
}
|
|
.detail-block + .detail-block {
|
|
margin-top: 16px;
|
|
}
|
|
.sec-title {
|
|
font-weight: 600;
|
|
margin-bottom: 8px;
|
|
color: var(--el-text-color-primary);
|
|
}
|
|
</style>
|