优化
This commit is contained in:
@@ -38,7 +38,7 @@ type BusinessForm = DemandFormModel
|
||||
|
||||
const configuration = computed(() => ({
|
||||
trucking: {
|
||||
title: '美国本土卡',
|
||||
title: '美国本土卡车',
|
||||
description: '查询并管理美国本土卡订单',
|
||||
columns: transportColumns(false),
|
||||
},
|
||||
@@ -50,16 +50,20 @@ const configuration = computed(() => ({
|
||||
})[props.kind])
|
||||
|
||||
function transportColumns(looseboard: boolean): ColumnDefinition[] {
|
||||
const originLabel = looseboard ? '起运地' : 'B点取货地'
|
||||
const destinationLabel = looseboard ? '目的地' : 'C点送达地'
|
||||
const pickupLabel = looseboard ? '取货时间' : 'B点取货时间'
|
||||
const deliveryLabel = looseboard ? '送货时间' : 'C点送达时间'
|
||||
return [
|
||||
{ key: 'orderNo', label: '订单编号', width: 180 },
|
||||
...(!looseboard ? [{ key: 'vehicleType', label: '车辆类型', width: 110 }] : []),
|
||||
{ key: 'origin', label: '起运地', width: 150 },
|
||||
{ key: 'destination', label: '目的地', width: 150 },
|
||||
{ key: 'origin', label: originLabel, width: 150 },
|
||||
{ key: 'destination', label: destinationLabel, width: 150 },
|
||||
...(looseboard ? [{ key: 'productName', label: '商品名称', width: 150 }, { key: 'estimatedPalletCount', label: '预计托数', width: 100 }] : []),
|
||||
{ key: 'totalWeightKg', label: '总重量(kg)', width: 120 },
|
||||
{ key: 'budgetAmount', label: '预算总价', width: 110 },
|
||||
...([
|
||||
{ key: 'pickupAt', label: '取货时间', width: 165 }, { key: 'deliveryAt', label: '送货时间', width: 165 },
|
||||
{ key: 'pickupAt', label: pickupLabel, width: 165 }, { key: 'deliveryAt', label: deliveryLabel, width: 165 },
|
||||
]),
|
||||
{ key: 'status', label: '状态', width: 130 },
|
||||
{ key: 'fleetArrangement', label: '承运安排', width: 190 },
|
||||
@@ -93,7 +97,7 @@ const queryModel = computed<QueryModel>({
|
||||
|
||||
const queryFields = computed<QueryField[]>(() => [
|
||||
{ key: 'orderNo', label: '订单号', type: 'input', placeholder: '请输入订单号' },
|
||||
{ key: 'routeKeyword', label: '运输路线', type: 'input', placeholder: '请输入起运地或目的地' },
|
||||
{ key: 'routeKeyword', label: '运输路线', type: 'input', placeholder: props.kind === 'trucking' ? '请输入 B 点或 C 点' : '请输入起运地或目的地' },
|
||||
{
|
||||
key: 'status',
|
||||
label: '状态',
|
||||
@@ -123,13 +127,13 @@ const detailFields = computed(() => {
|
||||
...(props.kind === 'looseboard' ? [
|
||||
['商品名称', summary.productName], ['预计托数', summary.estimatedPalletCount],
|
||||
] : [['车辆类型', vehicleTypeLabel(summary.vehicleType)]]),
|
||||
['起运地', read(summary, 'origin')], ['起运地址', current.originAddress],
|
||||
['目的地', read(summary, 'destination')], ['目的地址', current.destinationAddress],
|
||||
[props.kind === 'trucking' ? 'B点取货地' : '起运地', read(summary, 'origin')], [props.kind === 'trucking' ? 'B点取货地址' : '起运地址', current.originAddress],
|
||||
[props.kind === 'trucking' ? 'C点送达地' : '目的地', read(summary, 'destination')], [props.kind === 'trucking' ? 'C点送达地址' : '目的地址', current.destinationAddress],
|
||||
['件数', read(summary, 'packageCount')], ['总重量(kg)', read(summary, 'totalWeightKg')],
|
||||
['总体积(m³)', read(summary, 'totalVolumeCbm')], ['预算总价', money(read(summary, 'budgetAmount'), read(summary, 'currency'))],
|
||||
['起运地联系人', summary.originContactName], ['起运地联系电话', summary.originContactPhone],
|
||||
['目的地联系人', summary.destinationContactName], ['目的地联系电话', summary.destinationContactPhone],
|
||||
['取货时间', localMinute(summary.pickupAt)], ['送货时间', localMinute(summary.deliveryAt)], ['备注', current.remark],
|
||||
[props.kind === 'trucking' ? 'B点联系人' : '起运地联系人', summary.originContactName], [props.kind === 'trucking' ? 'B点联系电话' : '起运地联系电话', summary.originContactPhone],
|
||||
[props.kind === 'trucking' ? 'C点联系人' : '目的地联系人', summary.destinationContactName], [props.kind === 'trucking' ? 'C点联系电话' : '目的地联系电话', summary.destinationContactPhone],
|
||||
[props.kind === 'trucking' ? 'B点取货时间' : '取货时间', localMinute(summary.pickupAt)], [props.kind === 'trucking' ? 'C点送达时间' : '送货时间', localMinute(summary.deliveryAt)], ['备注', current.remark],
|
||||
]
|
||||
})
|
||||
|
||||
@@ -212,7 +216,7 @@ function getRowActions(candidate: object): TableAction[] {
|
||||
}
|
||||
|
||||
function detailFieldClass(label: unknown) {
|
||||
return ['备注', '起运地址', '目的地址'].includes(String(label)) ? 'is-wide' : ''
|
||||
return ['备注', props.kind === 'trucking' ? 'B点取货地址' : '起运地址', props.kind === 'trucking' ? 'C点送达地址' : '目的地址'].includes(String(label)) ? 'is-wide' : ''
|
||||
}
|
||||
|
||||
const listRouteName = computed(() => ({
|
||||
|
||||
@@ -1,107 +1,103 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import type { ProcurementDetail, ProcurementFee } from '../api/procurement'
|
||||
import { directionLabel, regionText, dateTime, feePurposes, feeStatus, feeTone, feeTotals, measurement, money, productHref, text } from '../procurementPresentation'
|
||||
|
||||
const props = defineProps<{ detail: ProcurementDetail }>()
|
||||
const t = (text: string) => regionText(text, props.detail.order.procurementDirection)
|
||||
import { computed, onBeforeUnmount, ref } from 'vue'
|
||||
import { getProcurementFile, type ProcurementDetail, type ProcurementFee, type ProcurementWorkflow } from '../api/procurement'
|
||||
import { directionLabel, dateTime, feeStatus, feeTone, feeTotals, money, productHref, statusLabel, text } from '../procurementPresentation'
|
||||
const props = defineProps<{ detail: ProcurementDetail; workflow: ProcurementWorkflow }>()
|
||||
const previewUrl = ref(''), previewName = ref(''), previewImage = ref(false), fileLoading = ref(''), fileError = ref('')
|
||||
let active = true
|
||||
function clearPreview() { if (previewUrl.value) URL.revokeObjectURL(previewUrl.value); previewUrl.value = '' }
|
||||
function fileName(fileId: string, index: string | number) { return props.workflow.files.find(file => file.fileId === fileId)?.fileName || '附件 ' + (Number(index) + 1) }
|
||||
async function openFile(fileId: string) {
|
||||
if (fileLoading.value) return
|
||||
fileLoading.value = fileId; fileError.value = ''
|
||||
try {
|
||||
const blob = await getProcurementFile(props.workflow.orderNo, fileId)
|
||||
if (!active) return
|
||||
clearPreview(); previewUrl.value = URL.createObjectURL(blob)
|
||||
previewName.value = props.workflow.files.find(file => file.fileId === fileId)?.fileName || '附件'
|
||||
previewImage.value = /^image\/(png|jpeg|gif|webp|bmp)$/i.test(blob.type)
|
||||
} catch (cause) { if (active) fileError.value = cause instanceof Error ? cause.message : '附件加载失败' }
|
||||
finally { fileLoading.value = '' }
|
||||
}
|
||||
onBeforeUnmount(() => { active = false; clearPreview() })
|
||||
const totals = computed(() => feeTotals(props.detail.fees))
|
||||
const progress = computed(() => props.detail.progress.filter(step => step.key !== 'closed_at' || step.completedAt))
|
||||
const ended = computed(() => ['REJECTED', 'CANCELLED', 'EXCEPTION_CLOSED', 'SHIPPED_TO_CUSTOMER'].includes(props.detail.order.status))
|
||||
const hasPending = computed(() => props.detail.fees.some(f => f.walletStatus?.endsWith('_PENDING') || f.walletStatus?.endsWith('_FAILED')))
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="procurement-section" aria-label="采购履约进度">
|
||||
<h3>履约进度</h3>
|
||||
<ol class="procurement-progress">
|
||||
<li v-for="step in progress" :key="step.key" :class="{ 'is-complete': step.completedAt }">
|
||||
<strong>{{ step.title }}</strong><span>{{ step.completedAt ? dateTime(step.completedAt) : ended ? '未执行' : '待处理' }}</span>
|
||||
</li>
|
||||
</ol>
|
||||
<p v-if="detail.purchaseNeedsAttention" class="procurement-note">购买资料正在核对，客服将协助处理。已发生的收货与费用结果仍保留在本单。</p>
|
||||
</section>
|
||||
<el-alert v-if="fileError" :title="fileError" type="error" :closable="false" />
|
||||
<section class="procurement-section" aria-label="商品与收件信息">
|
||||
<h3>商品与收件信息</h3>
|
||||
<dl class="procurement-grid"><div><dt>采购方向</dt><dd>{{ directionLabel(detail.order.procurementDirection) }}</dd></div>
|
||||
<div><dt>采购品类</dt><dd>{{ detail.order.purchaseCategory }}</dd></div>
|
||||
<dl class="procurement-grid">
|
||||
<div><dt>采购方向</dt><dd>{{ directionLabel(detail.order.procurementDirection) }}</dd></div>
|
||||
<div><dt>商品名称</dt><dd>{{ detail.order.productName }}</dd></div>
|
||||
<div><dt>商品规格</dt><dd>{{ text(detail.order.productSpecification) }}</dd></div>
|
||||
<div><dt>采购品类</dt><dd>{{ text(detail.order.purchaseCategory) }}</dd></div>
|
||||
<div><dt>采购数量</dt><dd>{{ detail.order.purchaseQuantity }} 件</dd></div>
|
||||
<div><dt>下单预算单价</dt><dd>{{ money(detail.order.budgetUnitPrice, detail.order.currency) }}</dd></div>
|
||||
<div><dt>货款预算总上限</dt><dd>{{ money(detail.budget.totalAmount, detail.budget.currency) }}</dd></div>
|
||||
<div><dt>预算核验时间</dt><dd>{{ dateTime(detail.budget.authorizedAt) }}</dd></div>
|
||||
<div><dt>{{ t('预计到海外仓') }}</dt><dd>{{ dateTime(detail.order.estimatedArrivalAt) }}</dd></div>
|
||||
<div><dt>预算单价</dt><dd>{{ money(detail.order.budgetUnitPrice, detail.order.currency) }}</dd></div>
|
||||
<div><dt>预算合计</dt><dd>{{ money(detail.budget.totalAmount, detail.budget.currency) }}</dd></div>
|
||||
<div><dt>采购仓</dt><dd>{{ detail.order.actualWarehouseName || detail.order.plannedWarehouseName || '待审核指定' }}<span v-if="detail.order.actualWarehouseCode">（{{ detail.order.actualWarehouseCode }}）</span></dd></div>
|
||||
<div><dt>收件人</dt><dd>{{ detail.order.contactName }}</dd></div>
|
||||
<div><dt>联系电话</dt><dd>{{ detail.order.contactPhone }}</dd></div>
|
||||
<div class="wide"><dt>下单收货地址</dt><dd>{{ detail.order.receivingAddress }}</dd></div>
|
||||
<div class="wide"><dt>{{ t('实际海外仓') }}</dt><dd>{{ text(detail.order.actualWarehouseName) }}<span v-if="detail.order.actualWarehouseCode">（{{ detail.order.actualWarehouseCode }}）</span></dd></div>
|
||||
<div class="wide"><dt>商品链接</dt><dd><a v-if="productHref(detail.order.productUrl)" :href="productHref(detail.order.productUrl)" target="_blank" rel="noopener noreferrer">{{ detail.order.productUrl }}</a><span v-else>{{ text(detail.order.productUrl) }}</span></dd></div>
|
||||
<div class="wide"><dt>收货地址</dt><dd>{{ detail.order.receivingAddress }}</dd></div>
|
||||
<div v-if="detail.order.productUrl" class="full"><dt>商品链接</dt><dd><a v-if="productHref(detail.order.productUrl)" :href="productHref(detail.order.productUrl)" target="_blank" rel="noopener noreferrer">查看商品</a><span v-else>{{ text(detail.order.productUrl) }}</span></dd></div>
|
||||
</dl>
|
||||
</section>
|
||||
<section class="procurement-section" :aria-label="t('已确认海外装箱清单')">
|
||||
<h3>{{ t('已确认海外装箱清单') }}</h3>
|
||||
<el-table :data="detail.boxes" border stripe empty-text="尚无已确认的装箱清单" row-key="cartonNo">
|
||||
<el-table-column prop="cartonNo" label="箱号" min-width="170" />
|
||||
<el-table-column label="箱内商品" min-width="200"><template #default>{{ detail.order.productName }}</template></el-table-column>
|
||||
<el-table-column label="规格" min-width="180"><template #default>{{ text(detail.order.productSpecification) }}</template></el-table-column>
|
||||
<el-table-column prop="quantity" label="数量（件）" width="120" />
|
||||
<el-table-column label="外箱长 × 宽 × 高（cm）" min-width="240"><template #default="{ row }">{{ measurement(row.lengthCm, 2) }} × {{ measurement(row.widthCm, 2) }} × {{ measurement(row.heightCm, 2) }}</template></el-table-column>
|
||||
<el-table-column label="封箱毛重（kg）" width="170"><template #default="{ row }">{{ measurement(row.grossWeightKg, 3) }}</template></el-table-column>
|
||||
</el-table>
|
||||
</section>
|
||||
<section class="procurement-section" aria-label="两段实际运输">
|
||||
<h3>两段实际运输</h3>
|
||||
<el-table :data="detail.shipments" border stripe empty-text="尚无实际交寄记录">
|
||||
<el-table-column label="运输段" width="150"><template #default="{ row }">{{ t(row.leg === 'OVERSEAS' ? '国际段 · 海外交寄' : '国内段 · 寄客户') }}</template></el-table-column>
|
||||
<el-table-column prop="shipmentNo" label="交寄编号" min-width="270" />
|
||||
<el-table-column prop="cartonNo" label="原箱号" min-width="150" />
|
||||
<el-table-column prop="quantity" label="实际件数" width="110" />
|
||||
<el-table-column prop="carrier" label="承运商" min-width="140" />
|
||||
<el-table-column prop="trackingNo" label="运单号" min-width="230" />
|
||||
<el-table-column label="实际交寄时间" width="185"><template #default="{ row }">{{ dateTime(row.shippedAt) }}</template></el-table-column>
|
||||
</el-table>
|
||||
|
||||
</section>
|
||||
<section class="procurement-section" aria-label="采购费用与资金结果">
|
||||
<h3>费用与资金结果</h3>
|
||||
<section class="procurement-section" aria-label="分批收货">
|
||||
<h3>收货记录</h3>
|
||||
<dl class="procurement-grid money-grid">
|
||||
<div><dt>累计成功扣款</dt><dd>{{ money(totals?.paid) }}</dd></div>
|
||||
<div><dt>累计成功退款</dt><dd>{{ money(totals?.refunded) }}</dd></div>
|
||||
<div><dt>净实扣</dt><dd>{{ money(totals?.net) }}</dd></div>
|
||||
<div><dt>预估国际运费占款</dt><dd>{{ money(totals?.estimatedHold) }}</dd></div>
|
||||
<div><dt>累计收货</dt><dd>{{ workflow.receivedQuantity }} 件</dd></div>
|
||||
<div><dt>采购库存</dt><dd>{{ workflow.stockQuantity }} 件</dd></div>
|
||||
<div><dt>出库处理中</dt><dd>{{ workflow.reservedQuantity }} 件</dd></div>
|
||||
<div><dt>可出库</dt><dd>{{ workflow.availableQuantity }} 件</dd></div>
|
||||
</dl>
|
||||
<p class="procurement-note">预算上限仅包含样品货款。预估国际运费只冻结、不直接扣款，最终以实际费用结算；表内保留原费用、追加及退款记录。</p>
|
||||
<el-table :data="detail.fees" border stripe empty-text="尚无已核定费用" row-key="feeNo">
|
||||
<el-table-column prop="feeNo" label="费用编号" min-width="270" />
|
||||
<el-table-column label="费用用途" min-width="145"><template #default="{ row }">{{ t(feePurposes[row.purpose] || '待核定') }}</template></el-table-column>
|
||||
<el-table-column prop="name" label="费用名称" min-width="145" />
|
||||
<el-table-column label="原币金额" min-width="130"><template #default="{ row }">{{ money(row.originalAmount, row.originalCurrency) }}</template></el-table-column>
|
||||
<el-table-column label="汇率 / 月份" min-width="150"><template #default="{ row }">{{ measurement(row.exchangeRate, 6) }}<br /><small>{{ text(row.exchangeRateMonth) }}</small></template></el-table-column>
|
||||
<el-table-column label="人民币金额" min-width="130"><template #default="{ row }">{{ money(row.amount) }}</template></el-table-column>
|
||||
<el-table-column label="处理结果" min-width="190"><template #default="{ row }"><el-tag :type="feeTone(row as ProcurementFee)" size="small">{{ feeStatus(row as ProcurementFee) }}</el-tag><small v-if="row.purpose !== 'INTERNATIONAL_ESTIMATE' && row.walletStatus === 'SETTLED' && !row.sourceLinked" class="fee-sync">费用结果同步中</small></template></el-table-column>
|
||||
<el-table-column prop="parentFeeNo" label="关联原费用 / 预估" min-width="270"><template #default="{ row }">{{ text(row.parentFeeNo) }}</template></el-table-column>
|
||||
<el-table :data="workflow.receipts" border stripe empty-text="暂无收货记录" row-key="id">
|
||||
<el-table-column label="批次" width="80" align="center"><template #default="{ $index }">{{ $index + 1 }}</template></el-table-column>
|
||||
<el-table-column prop="quantity" label="收货数量（件）" width="145" align="right" />
|
||||
<el-table-column label="收货时间" width="185"><template #default="{ row }">{{ dateTime(row.receivedAt) }}</template></el-table-column>
|
||||
<el-table-column label="收货照片" min-width="160"><template #default="{ row }"><span v-if="!row.fileIds.length">—</span><el-button v-for="(fileId, index) in row.fileIds" :key="fileId" link type="primary" :loading="fileLoading === fileId" :disabled="!!fileLoading" @click="openFile(fileId)">{{ fileName(fileId, index) }}</el-button></template></el-table-column>
|
||||
</el-table>
|
||||
<p v-if="hasPending" class="procurement-note">部分资金处理尚未完成，可点击页面“刷新”查看最新结果；如需协助请联系客户服务。</p>
|
||||
</section>
|
||||
<section v-if="detail.exceptionSummaries.length" class="procurement-section" aria-label="客服处理说明">
|
||||
<h3>客服处理说明</h3><ul class="procurement-summaries"><li v-for="(summary, index) in detail.exceptionSummaries" :key="index">{{ summary }}</li></ul>
|
||||
<section class="procurement-section" aria-label="分批出库">
|
||||
<h3>出库记录</h3>
|
||||
<el-table :data="workflow.outbounds" border stripe empty-text="暂无出库记录" row-key="id">
|
||||
<el-table-column prop="outboundNo" label="出库单号" min-width="180" />
|
||||
<el-table-column prop="quantity" label="出库数量（件）" width="145" align="right" />
|
||||
<el-table-column prop="trackingNo" label="物流跟踪号" min-width="160" />
|
||||
<el-table-column label="状态" width="100" align="center"><template #default="{ row }">{{ statusLabel(row.status) }}</template></el-table-column>
|
||||
<el-table-column label="创建时间" width="185"><template #default="{ row }">{{ dateTime(row.createdAt) }}</template></el-table-column>
|
||||
<el-table-column label="签收时间" width="185"><template #default="{ row }">{{ dateTime(row.completedAt) }}</template></el-table-column>
|
||||
<el-table-column label="签收凭证" min-width="220"><template #default="{ row }"><span v-if="!row.fileIds.length">—</span><el-button v-for="(fileId, index) in row.fileIds" :key="fileId" link type="primary" :loading="fileLoading === fileId" :disabled="!!fileLoading" @click="openFile(fileId)">{{ fileName(fileId, index) }}</el-button></template></el-table-column>
|
||||
</el-table>
|
||||
</section>
|
||||
<section class="procurement-section" aria-label="费用明细">
|
||||
<h3>费用明细 <span class="fee-total">已扣款 {{ money(totals?.net) }}</span></h3>
|
||||
<el-table :data="detail.fees" border stripe empty-text="暂无费用" row-key="feeNo">
|
||||
<el-table-column prop="name" label="费用名称" min-width="180" />
|
||||
<el-table-column label="原币金额" min-width="145" align="right"><template #default="{ row }">{{ money(row.originalAmount, row.originalCurrency) }}</template></el-table-column>
|
||||
<el-table-column label="人民币金额" min-width="145" align="right"><template #default="{ row }">{{ money(row.amount) }}</template></el-table-column>
|
||||
<el-table-column label="扣款结果" min-width="160" align="center"><template #default="{ row }"><el-tag :type="feeTone(row as ProcurementFee)" size="small">{{ feeStatus(row as ProcurementFee) }}</el-tag></template></el-table-column>
|
||||
</el-table>
|
||||
</section>
|
||||
<el-dialog :model-value="!!previewUrl" :title="previewName" width="800px" append-to-body @close="clearPreview">
|
||||
<img v-if="previewImage" :src="previewUrl" :alt="previewName" style="display: block; max-width: 100%; max-height: 70vh; margin: auto" />
|
||||
<a v-else :href="previewUrl" :download="previewName">下载 {{ previewName }}</a>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.procurement-section { margin-top: 18px; min-width: 0; }
|
||||
.fee-total { margin-left: 14px; font-weight: 400; font-size: 12px; color: var(--muted); }
|
||||
h3 { margin: 0 0 10px; padding-bottom: 7px; border-bottom: 1px solid var(--border); color: var(--navy); font-size: 14px; }
|
||||
.procurement-progress { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
|
||||
.procurement-progress li { display: grid; gap: 7px; padding: 12px; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); color: var(--muted); }
|
||||
.procurement-progress strong { font-size: 13px; font-weight: 600; }.procurement-progress span { font-size: 12px; }.procurement-progress .is-complete strong { color: var(--navy); }
|
||||
.procurement-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-left: 1px solid var(--border); border-top: 1px solid var(--border); }
|
||||
.procurement-grid > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 8px; padding: 9px 12px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); min-width: 0; }
|
||||
.procurement-grid dt { font-size: 12px; color: var(--muted); }.procurement-grid dd { margin: 0; font-size: 13px; line-height: 1.6; color: var(--navy); overflow-wrap: anywhere; }
|
||||
.procurement-grid .wide { grid-column: span 2; }.money-grid > div { grid-template-columns: minmax(0, 1fr); }.money-grid dd { font-size: 16px; font-weight: 600; }
|
||||
a { color: var(--client-action); } .procurement-note { margin: 10px 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
|
||||
.fee-sync { display: block; padding-top: 5px; color: var(--muted); }.procurement-summaries { margin: 0; padding-left: 22px; line-height: 1.8; color: var(--navy); font-size: 13px; white-space: pre-wrap; }
|
||||
.procurement-grid .full { grid-column: 1 / -1; }
|
||||
.procurement-section :deep(.el-table .cell) { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
|
||||
.procurement-section :deep(.el-table .el-button.is-link) { display: flex; justify-content: flex-start; max-width: 100%; height: auto; margin: 0; padding: 3px 0; white-space: normal; text-align: left; }
|
||||
.procurement-section :deep(.el-table .el-button.is-link > span) { min-width: 0; overflow-wrap: anywhere; }
|
||||
a { color: var(--client-action); }
|
||||
@media (max-width: 767px) {
|
||||
.procurement-progress, .procurement-grid { grid-template-columns: 1fr; }.procurement-grid .wide { grid-column: auto; }
|
||||
.procurement-grid { grid-template-columns: 1fr; }.procurement-grid .wide { grid-column: auto; }
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -29,14 +29,14 @@ defineExpose({
|
||||
<el-form-item v-if="kind === 'truck'" class="transport-demand-wide" label="车辆类型" prop="vehicleType">
|
||||
<el-select v-model="model.vehicleType" placeholder=""><el-option label="15拖" value="PALLET_15" /><el-option label="30拖" value="PALLET_30" /></el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="起运地" prop="origin"><el-input v-model.trim="model.origin" maxlength="255" placeholder="城市 / 港口 / 州" /></el-form-item>
|
||||
<el-form-item label="目的地" prop="destination"><el-input v-model.trim="model.destination" maxlength="255" placeholder="城市 / 州" /></el-form-item>
|
||||
<el-form-item label="起运地联系人" prop="originContactName"><el-input v-model.trim="model.originContactName" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item label="目的地联系人" prop="destinationContactName"><el-input v-model.trim="model.destinationContactName" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item label="起运地联系电话" prop="originContactPhone"><el-input v-model.trim="model.originContactPhone" type="tel" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item label="目的地联系电话" prop="destinationContactPhone"><el-input v-model.trim="model.destinationContactPhone" type="tel" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item label="起运详细地址"><el-input v-model.trim="model.originAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
|
||||
<el-form-item label="目的详细地址"><el-input v-model.trim="model.destinationAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'B点取货地' : '起运地'" prop="origin"><el-input v-model.trim="model.origin" maxlength="255" placeholder="城市 / 港口 / 州" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'C点送达地' : '目的地'" prop="destination"><el-input v-model.trim="model.destination" maxlength="255" placeholder="城市 / 州" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'B点联系人' : '起运地联系人'" prop="originContactName"><el-input v-model.trim="model.originContactName" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'C点联系人' : '目的地联系人'" prop="destinationContactName"><el-input v-model.trim="model.destinationContactName" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'B点联系电话' : '起运地联系电话'" prop="originContactPhone"><el-input v-model.trim="model.originContactPhone" type="tel" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'C点联系电话' : '目的地联系电话'" prop="destinationContactPhone"><el-input v-model.trim="model.destinationContactPhone" type="tel" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'B点取货地址' : '起运详细地址'"><el-input v-model.trim="model.originAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'C点送达地址' : '目的详细地址'"><el-input v-model.trim="model.destinationAddress" maxlength="500" placeholder="街道 / 门牌等补充信息（选填）" /></el-form-item>
|
||||
</div>
|
||||
</section>
|
||||
<section class="transport-demand-section">
|
||||
@@ -58,8 +58,8 @@ defineExpose({
|
||||
<el-select v-model="model.currency" aria-label="预算币种" placeholder=""><el-option label="USD" value="USD" /><el-option label="CNY" value="CNY" /></el-select>
|
||||
</div></el-form-item>
|
||||
<div />
|
||||
<el-form-item label="取货时间" prop="pickupAt"><el-date-picker v-model="model.pickupAt" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="" @change="formRef?.validateField('deliveryAt').catch(() => undefined)" /></el-form-item>
|
||||
<el-form-item label="送货时间" prop="deliveryAt"><el-date-picker v-model="model.deliveryAt" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'B点取货时间' : '取货时间'" prop="pickupAt"><el-date-picker v-model="model.pickupAt" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="" @change="formRef?.validateField('deliveryAt').catch(() => undefined)" /></el-form-item>
|
||||
<el-form-item :label="kind === 'truck' ? 'C点送达时间' : '送货时间'" prop="deliveryAt"><el-date-picker v-model="model.deliveryAt" type="datetime" format="YYYY-MM-DD HH:mm" time-format="HH:mm" value-format="YYYY-MM-DDTHH:mm:ss" placeholder="" /></el-form-item>
|
||||
<el-form-item class="transport-demand-wide" label="备注"><el-input v-model="model.remark" type="textarea" :rows="3" maxlength="1000" show-word-limit placeholder="" /></el-form-item>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user