优化
This commit is contained in:
@@ -65,5 +65,10 @@ describe('overseas warehouse 1920px layout acceptance', () => {
|
||||
expect(page('PalletsView.vue')).toContain('.el-form :deep(.el-input-number) { width: 100%; }')
|
||||
expect(page('RelabelOrdersView.vue')).toContain('.el-form :deep(.el-row) { margin-left: 0 !important; margin-right: 0 !important; }')
|
||||
expect(page('PalletsView.vue')).toContain('.el-form :deep(.el-row) { margin-left: 0 !important; margin-right: 0 !important; }')
|
||||
const lastMileDetail = page('LastMileOrderDetailView.vue')
|
||||
expect(lastMileDetail).toContain('class="fee-form-grid"')
|
||||
expect(lastMileDetail).toContain('filterable allow-create clearable default-first-option')
|
||||
expect(lastMileDetail).toContain('.fee-form { min-width: 0; overflow-x: hidden; }')
|
||||
expect(lastMileDetail).toContain('.fee-form :deep(.el-select), .fee-form :deep(.el-input-number) { width: 100%; }')
|
||||
})
|
||||
})
|
||||
|
||||
@@ -34,6 +34,7 @@ const mutationError = ref<ApiErrorDetails | null>(null)
|
||||
const activeTab = ref('basic')
|
||||
const feeDialogOpen = ref(false)
|
||||
const feeForm = reactive({ item: '', currency: 'USD', amount: 0, status: 'PENDING_REVIEW', description: '' })
|
||||
const feeItemOptions = ['仓储费', '入库操作费', '出库操作费', '换标费', '托盘费', '派送费', '转仓费', '异常处理费', '其他']
|
||||
|
||||
function text(value: unknown) { return String(value ?? '').trim() || '—' }
|
||||
function yesNo(value: boolean | null | undefined) { return value == null ? '—' : value ? '是' : '否' }
|
||||
@@ -172,13 +173,13 @@ onMounted(load)
|
||||
</el-tabs>
|
||||
</section>
|
||||
<AppDialog v-model="feeDialogOpen" title="新增费用" width="min(720px, calc(100vw - 28px))" confirm-text="保存费用" :confirm-loading="saving" @confirm="saveFee">
|
||||
<el-form label-position="top"><el-row :gutter="20">
|
||||
<el-col :span="12"><el-form-item label="费用项目" required><el-input v-model="feeForm.item" maxlength="128" placeholder="如 派送费" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="供应商/说明"><el-input v-model="feeForm.description" maxlength="500" placeholder="请输入供应商或费用说明" /></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="币种" required><el-select v-model="feeForm.currency"><el-option v-for="currency in ['USD', 'CNY', 'EUR', 'GBP', 'CAD', 'MXN']" :key="currency" :label="currency" :value="currency" /></el-select></el-form-item></el-col>
|
||||
<el-col :span="12"><el-form-item label="金额" required><el-input-number v-model="feeForm.amount" :min="0" :precision="2" :step="10" controls-position="right" placeholder="请输入费用金额" /></el-form-item></el-col>
|
||||
<el-col :span="24"><el-form-item label="状态" required><el-select v-model="feeForm.status"><el-option label="待审核" value="PENDING_REVIEW" /><el-option label="审核通过" value="APPROVED" /><el-option label="已驳回" value="REJECTED" /></el-select></el-form-item></el-col>
|
||||
</el-row></el-form>
|
||||
<el-form class="fee-form" label-position="top"><div class="fee-form-grid">
|
||||
<el-form-item label="费用项目" required><el-select v-model="feeForm.item" filterable allow-create clearable default-first-option placeholder="选择或输入费用项目"><el-option v-for="item in feeItemOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
|
||||
<el-form-item label="供应商/说明"><el-input v-model="feeForm.description" maxlength="500" placeholder="请输入供应商或费用说明" /></el-form-item>
|
||||
<el-form-item label="币种" required><el-select v-model="feeForm.currency" placeholder="请选择币种"><el-option v-for="currency in ['USD', 'CNY', 'EUR', 'GBP', 'CAD', 'MXN']" :key="currency" :label="currency" :value="currency" /></el-select></el-form-item>
|
||||
<el-form-item label="金额" required><el-input-number v-model="feeForm.amount" :min="0" :precision="2" :step="10" controls-position="right" placeholder="请输入费用金额" /></el-form-item>
|
||||
<el-form-item class="fee-form-full" label="状态" required><el-select v-model="feeForm.status" placeholder="请选择费用状态"><el-option label="待审核" value="PENDING_REVIEW" /><el-option label="审核通过" value="APPROVED" /><el-option label="已驳回" value="REJECTED" /></el-select></el-form-item>
|
||||
</div></el-form>
|
||||
</AppDialog>
|
||||
</OverseasDetailShell>
|
||||
</template>
|
||||
@@ -202,6 +203,10 @@ onMounted(load)
|
||||
.plan-fields > div { grid-template-columns: minmax(90px, 42%) minmax(0, 1fr); }
|
||||
.related-panel { margin-top: 20px; }
|
||||
.table-panel :deep(.data-table__toolbar) { min-height: 58px; }
|
||||
.fee-form { min-width: 0; overflow-x: hidden; }
|
||||
.fee-form-grid { display: grid; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
|
||||
.fee-form-full { grid-column: 1 / -1; }
|
||||
.fee-form :deep(.el-select), .fee-form :deep(.el-input-number) { width: 100%; }
|
||||
@media (max-width: 1100px) { .basic-grid { grid-template-columns: 1fr; } .plan-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
|
||||
@media (max-width: 720px) { .detail-tabs :deep(.el-tabs__header) { padding: 0 10px; } .detail-tabs :deep(.el-tabs__content) { padding: 12px; } .detail-tabs :deep(.el-tabs__item) { padding: 0 12px; } .detail-fields, .plan-fields { grid-template-columns: 1fr; } }
|
||||
@media (max-width: 720px) { .detail-tabs :deep(.el-tabs__header) { padding: 0 10px; } .detail-tabs :deep(.el-tabs__content) { padding: 12px; } .detail-tabs :deep(.el-tabs__item) { padding: 0 12px; } .detail-fields, .plan-fields, .fee-form-grid { grid-template-columns: 1fr; } .fee-form-full { grid-column: auto; } }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user