优化
This commit is contained in:
@@ -36,4 +36,17 @@ test('covers list detail create loading error empty pagination and actions-first
|
||||
assert.match(view, /empty-text="暂无订单"/)
|
||||
assert.match(view, /<el-pagination/)
|
||||
assert.match(view, /<el-table-column label="操作"[^>]*fixed="left"/)
|
||||
assert.match(view, /PENDING_OUTBOUND: '待出库'/)
|
||||
assert.match(view, /PARTIALLY_OUTBOUND: '部分出库'/)
|
||||
assert.match(view, /OUTBOUNDED: '全部出库'/)
|
||||
assert.match(view, /\['入库量', read\(summary, 'inboundQuantity'\)\]/)
|
||||
assert.match(view, /\['审核备注', current\.reviewRemark\]/)
|
||||
})
|
||||
|
||||
test('keeps procurement filters, details and forms readable at PDA width', () => {
|
||||
assert.match(view, /@media \(max-width: 767px\)/)
|
||||
assert.match(view, /\.filter-card :deep\(\.el-form\) \{ display: grid; grid-template-columns: 1fr; \}/)
|
||||
assert.match(view, /\.detail-grid \{ grid-template-columns: 1fr; \}/)
|
||||
assert.match(view, /\.form-card :deep\(\.el-form-item\) \{ display: block; \}/)
|
||||
assert.match(view, /\.budget-form-item :deep\(\.el-form-item__content\) \{ display: flex; flex-wrap: nowrap; \}/)
|
||||
})
|
||||
|
||||
@@ -61,6 +61,9 @@ const configuration = computed(() => ({
|
||||
{ key: 'productSpecification', label: '商品规格', width: 160 },
|
||||
{ key: 'purchaseQuantity', label: '采购数量', width: 100 },
|
||||
{ key: 'budgetUnitPrice', label: '预算单价', width: 110 },
|
||||
{ key: 'inboundQuantity', label: '入库量', width: 90 },
|
||||
{ key: 'outboundQuantity', label: '出库量', width: 90 },
|
||||
{ key: 'inventoryQuantity', label: '库存量', width: 90 },
|
||||
{ key: 'status', label: '状态', width: 120 },
|
||||
{ key: 'createdAt', label: '创建时间', width: 170 },
|
||||
] satisfies ColumnDefinition[],
|
||||
@@ -125,11 +128,13 @@ const detailFields = computed(() => {
|
||||
['订单号', summary.orderNo], ['采购品类', read(summary, 'purchaseCategory')],
|
||||
['商品名称', read(summary, 'productName')], ['商品规格', read(summary, 'productSpecification')],
|
||||
['采购数量', read(summary, 'purchaseQuantity')], ['预算单价', money(read(summary, 'budgetUnitPrice'), read(summary, 'currency'))],
|
||||
['入库量', read(summary, 'inboundQuantity')], ['出库量', read(summary, 'outboundQuantity')],
|
||||
['库存量', read(summary, 'inventoryQuantity')], ['预计到达时间', dateTime(current.estimatedArrivalAt)],
|
||||
['联系人', current.contactName], ['联系电话', current.contactPhone],
|
||||
['收货地址', current.receivingAddress], ['商品链接', current.productUrl],
|
||||
['国内运单', joinText(current.domesticCarrier, current.domesticTrackingNo)],
|
||||
['海外运单', joinText(current.overseasCarrier, current.overseasTrackingNo)],
|
||||
['状态', statusLabel(summary.status)], ['备注', current.remark],
|
||||
['状态', statusLabel(summary.status)], ['审核备注', current.reviewRemark], ['备注', current.remark],
|
||||
]
|
||||
}
|
||||
const current = detail.value as TransportDetail
|
||||
@@ -166,7 +171,7 @@ function yesNo(value: unknown) { return value === 'YES' ? '是' : value === 'NO'
|
||||
function transportTypeLabel(value: unknown) { return ({ PORT_PICKUP: '港口提柜', WAREHOUSE_TO_WAREHOUSE: '仓到仓', WAREHOUSE_TO_DOOR: '仓到门' } as Record<string, string>)[String(value)] || text(value) }
|
||||
function transportModeLabel(value: unknown) { return ({ SHARED_TRUCK: '拼车', PRIORITY_CONSOLIDATION: '优先拼载' } as Record<string, string>)[String(value)] || text(value) }
|
||||
function statusLabel(value: unknown) {
|
||||
return ({ PENDING_REVIEW: '待审核', APPROVED: '已通过', REJECTED: '已拒绝', PENDING_ACCEPTANCE: '待接单', PROCESSING: '处理中', IN_TRANSIT: '运输中', COMPLETED: '已完成', CANCELLED: '已取消' } as Record<string, string>)[String(value)] || text(value)
|
||||
return ({ PENDING_REVIEW: '待审核', APPROVED: '已通过', REJECTED: '已拒绝', PENDING_OUTBOUND: '待出库', PARTIALLY_OUTBOUND: '部分出库', OUTBOUNDED: '全部出库', PENDING_ACCEPTANCE: '待接单', PROCESSING: '处理中', IN_TRANSIT: '运输中', COMPLETED: '已完成', CANCELLED: '已取消' } as Record<string, string>)[String(value)] || text(value)
|
||||
}
|
||||
function displayCell(candidate: unknown, key: string) {
|
||||
const row = candidate as BusinessRow
|
||||
@@ -330,7 +335,7 @@ onMounted(() => void load())
|
||||
<el-form-item label="总体积(m³)"><el-input-number v-model="form.totalVolumeCbm" :min="0" :precision="3" placeholder="请输入总体积" /></el-form-item>
|
||||
<el-form-item label="要求时间" :prop="kind === 'trucking' ? 'requestedDate' : undefined"><el-date-picker v-model="form.requestedDate" type="date" value-format="YYYY-MM-DD" /></el-form-item>
|
||||
</template>
|
||||
<el-form-item :label="kind === 'procurement' ? '预算单价' : '预算金额'"><el-input-number v-model="form.budgetAmount" :min="0" :precision="2" placeholder="请输入预算金额" /><el-select v-model="form.currency" class="currency"><el-option label="USD" value="USD" /><el-option label="CNY" value="CNY" /></el-select></el-form-item>
|
||||
<el-form-item class="budget-form-item" :label="kind === 'procurement' ? '预算单价' : '预算金额'"><el-input-number v-model="form.budgetAmount" :min="0" :precision="2" placeholder="请输入预算金额" /><el-select v-model="form.currency" class="currency"><el-option label="USD" value="USD" /><el-option label="CNY" value="CNY" /></el-select></el-form-item>
|
||||
<el-form-item label="联系人" prop="contactName"><el-input v-model.trim="form.contactName" maxlength="128" placeholder="请输入联系人" /></el-form-item>
|
||||
<el-form-item label="联系方式" prop="contactInfo"><el-input v-model.trim="form.contactInfo" maxlength="128" placeholder="请输入电话、微信或邮箱" /></el-form-item>
|
||||
<el-form-item label="备注"><el-input v-model="form.remark" type="textarea" :rows="4" maxlength="1000" show-word-limit placeholder="请输入其他要求" /></el-form-item>
|
||||
@@ -355,4 +360,35 @@ onMounted(() => void load())
|
||||
.form-card :deep(.el-form) { max-width: 860px; }
|
||||
.form-card :deep(.el-input), .form-card :deep(.el-textarea), .form-card :deep(.el-select) { width: 100%; }
|
||||
.form-card .currency { width: 110px; margin-left: 12px; }
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.business-orders { gap: 14px; }
|
||||
.page-head { align-items: flex-start; gap: 12px; }
|
||||
.page-head h2 { font-size: 24px; }
|
||||
.page-head > div { min-width: 0; }
|
||||
|
||||
.filter-card :deep(.el-form) { display: grid; grid-template-columns: 1fr; }
|
||||
.filter-card :deep(.el-form-item) { width: 100%; margin-right: 0; margin-bottom: 12px; }
|
||||
.filter-card :deep(.el-form-item:last-child) { margin-bottom: 0; }
|
||||
.filter-card :deep(.el-form-item__content),
|
||||
.filter-card :deep(.el-input) { width: 100%; }
|
||||
|
||||
.detail-grid { grid-template-columns: 1fr; }
|
||||
.detail-grid div { padding: 14px 16px; border-right: 0; }
|
||||
.detail-grid dd { overflow-wrap: break-word; word-break: normal; }
|
||||
|
||||
.form-card :deep(.el-form-item) { display: block; }
|
||||
.form-card :deep(.el-form-item__label) {
|
||||
width: auto !important;
|
||||
height: auto;
|
||||
margin-bottom: 7px;
|
||||
line-height: 1.4;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.form-card :deep(.el-form-item__content) { width: 100%; margin-left: 0 !important; }
|
||||
.form-card :deep(.el-input-number) { width: 100%; }
|
||||
.form-card .budget-form-item :deep(.el-form-item__content) { display: flex; flex-wrap: nowrap; }
|
||||
.form-card .budget-form-item :deep(.el-input-number) { width: auto; min-width: 0; flex: 1 1 auto; }
|
||||
.form-card .currency { width: 96px; flex: 0 0 96px; margin-left: 8px; }
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user