b2894lxlx/tms-erp-web
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

✨ 完善导入结算单明细编辑、草稿刷新与历史运单选择

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
b2894lxlx
2026-10-18 20:35:28 +08:00
parent 6f2383a7e5
commit 1ac741f785
3 changed files with 425 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/settlement/settlement-import.vue
+182 -19
View File
@@ -23,8 +23,8 @@
<el-input v-else v-model="query[field.prop]" clearable placeholder="请输入" />
</el-form-item>
<div class="settlement-import-page__search-actions">
<el-button type="primary" @click="handleSearch">查询</el-button>
<el-button @click="resetSearch">重置</el-button>
<el-button type="primary" @click="handleSearch">搜索</el-button>
<el-button @click="resetSearch">清空</el-button>
<el-button text :icon="searchExpanded ? ArrowUp : ArrowDown" @click="toggleSearch">
{{ searchExpanded ? '收起' : '展开' }}
</el-button>
@@ -43,6 +43,7 @@
>
新增
</el-button>
<el-button plain @click="refreshTable">刷新</el-button>
</div>
</div>
@@ -53,6 +54,13 @@
<el-link type="primary" @click="openDetail(row)">{{ row.batchNo || '-' }}</el-link>
</template>
</el-table-column>
<el-table-column prop="importStatusName" label="状态" width="100" align="center">
<template #default="{ row }">
<el-tag :type="statusTagType(row.importStatus)" effect="plain">
{{ row.importStatusName || importStatusLabel(row.importStatus) }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="settlementTypeName" label="导入类型" min-width="100">
<template #default="{ row }">
{{ row.settlementTypeName || settlementTypeLabel(row.settlementType) }}
@@ -68,19 +76,35 @@
<el-table-column prop="carrierName" label="承运商" min-width="140" show-overflow-tooltip />
<el-table-column label="明细行数" width="100" align="center">
<template #default="{ row }">
{{ row.waybillCount ?? row.detailCount ?? 0 }}
{{ row.detailCount ?? row.waybillCount ?? 0 }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" min-width="170" />
<el-table-column prop="createUserName" label="创建人" min-width="120">
<template #default="{ row }">{{ row.createUserName || '-' }}</template>
</el-table-column>
<el-table-column label="操作" width="160" fixed="right">
<el-table-column label="操作" width="220" fixed="right">
<template #default="{ row }">
<div class="settlement-import-page__row-actions">
<el-link type="primary" @click="openDetail(row)">详情</el-link>
<el-link type="primary" @click="openDetail(row)">查看</el-link>
<el-link
v-if="row.importStatus !== 'voided' && hasPermission('settlement_import_void')"
v-if="row.importStatus === 'draft'"
type="primary"
@click="editDraft(row)"
>
编辑
</el-link>
<el-link
v-if="row.importStatus === 'draft' && hasPermission('settlement_import_delete')"
type="danger"
@click="handleDelete(row)"
>
删除
</el-link>
<el-link
v-if="
row.importStatus === 'completed' && hasPermission('settlement_import_void')
"
type="danger"
@click="openVoid(row)"
>
@@ -105,9 +129,19 @@
</div>
</section>
<el-dialog v-model="detailVisible" title="导入结算单详情" width="640px" append-to-body>
<el-descriptions :column="2" border>
<el-dialog
v-model="detailVisible"
title="导入结算单详情"
width="1100px"
append-to-body
destroy-on-close
class="settlement-import-detail-dialog"
>
<el-descriptions :column="3" border>
<el-descriptions-item label="导入批次号">{{ detail.batchNo || '-' }}</el-descriptions-item>
<el-descriptions-item label="状态">
{{ detail.importStatusName || importStatusLabel(detail.importStatus) }}
</el-descriptions-item>
<el-descriptions-item label="导入类型">
{{ detail.settlementTypeName || settlementTypeLabel(detail.settlementType) }}
</el-descriptions-item>
@@ -117,6 +151,9 @@
<el-descriptions-item label="运单类型">
{{ detail.waybillModeName || waybillModeLabel(detail.waybillMode) }}
</el-descriptions-item>
<el-descriptions-item label="明细行数">
{{ detail.detailCount ?? detail.waybillCount ?? detailRows.length }}
</el-descriptions-item>
<el-descriptions-item label="项目">{{ detail.projectName || '-' }}</el-descriptions-item>
<el-descriptions-item label="客户">{{ detail.customerName || '-' }}</el-descriptions-item>
<el-descriptions-item label="客户合同">
@@ -126,16 +163,10 @@
<el-descriptions-item label="承运商合同">
{{ detail.carrierContractName || '-' }}
</el-descriptions-item>
<el-descriptions-item label="明细行数">
{{ detail.waybillCount ?? detail.detailCount ?? 0 }}
</el-descriptions-item>
<el-descriptions-item label="导入状态">
{{ detail.importStatusName || detail.importStatus || '-' }}
</el-descriptions-item>
<el-descriptions-item label="创建人">{{ detail.createUserName || '-' }}</el-descriptions-item>
<el-descriptions-item label="创建时间">{{ detail.createTime || '-' }}</el-descriptions-item>
<el-descriptions-item label="备注" :span="2">{{ detail.remark || '-' }}</el-descriptions-item>
<el-descriptions-item label="关联结算单" :span="2">
<el-descriptions-item label="关联结算单" :span="3">
<el-link
v-if="detail.formalSettlementId"
type="primary"
@@ -153,6 +184,50 @@
<span v-else>-</span>
</el-descriptions-item>
</el-descriptions>
<div class="dialog-section-title settlement-import-page__detail-title">导入明细</div>
<el-table
v-loading="detailLoading"
:data="detailRows"
border
max-height="420"
class="settlement-import-page__table"
>
<el-table-column type="index" label="序号" width="64" align="center" />
<el-table-column
v-if="detail.waybillMode === 'history'"
prop="waybillNo"
label="运单号"
min-width="130"
/>
<el-table-column prop="vehicleNo" label="车牌号/航班号/船号/班列号" min-width="170" />
<el-table-column prop="transportType" label="运输方式" min-width="100" />
<el-table-column prop="departureAddress" label="发货地址" min-width="140" show-overflow-tooltip />
<el-table-column prop="arrivalAddress" label="到货地址" min-width="140" show-overflow-tooltip />
<el-table-column prop="cargoName" label="货物名称" min-width="120" show-overflow-tooltip />
<el-table-column prop="cargoType" label="货物类型" min-width="100" />
<el-table-column prop="model" label="型号" min-width="100" />
<el-table-column prop="quantity" label="数量" width="90" />
<el-table-column prop="quantityUnit" label="数量单位" width="90" />
<el-table-column prop="mileage" label="里程(km)" width="100" />
<el-table-column prop="unitPrice" label="运输单价" width="100" />
<el-table-column prop="transportFee" label="运输费" width="100" />
<el-table-column
v-for="name in detailFeeItemNames"
:key="name"
:label="name"
min-width="100"
>
<template #default="{ row }">
{{ formatFeeAmount(row, name) }}
</template>
</el-table-column>
<el-table-column prop="settlementAmount" label="结算金额" width="110" />
<el-table-column prop="actualStartDate" label="实际发货时间" min-width="120" />
<el-table-column prop="actualEndDate" label="实际完成时间" min-width="120" />
<el-table-column prop="remark" label="备注" min-width="120" show-overflow-tooltip />
</el-table>
<template #footer>
<el-button @click="detailVisible = false">关闭</el-button>
<el-button
@@ -200,6 +275,7 @@ import * as api from '@/api/settlement/settlementImport';
const emptyQuery = () => ({
batchNo: '',
settlementType: '',
importStatus: '',
projectName: '',
customerName: '',
carrierName: '',
@@ -207,8 +283,15 @@ const emptyQuery = () => ({
const SETTLEMENT_TYPE_OPTIONS = [
{ label: '全部', value: '' },
{ label: '应收正式结算单', value: 'receivable' },
{ label: '应付正式结算单', value: 'payable' },
{ label: '应收', value: 'receivable' },
{ label: '应付', value: 'payable' },
];
const IMPORT_STATUS_OPTIONS = [
{ label: '全部', value: '' },
{ label: '草稿', value: 'draft' },
{ label: '已完成', value: 'completed' },
{ label: '已作废', value: 'voided' },
];
const SETTLEMENT_IMPORT_LIST_REFRESH_KEY = 'settlement-import-list-refresh';
@@ -227,7 +310,10 @@ export default {
page: { current: 1, size: 10, total: 0 },
batchNoOptions: [],
detailVisible: false,
detailLoading: false,
detail: {},
detailRows: [],
detailFeeItemNames: [],
voidVisible: false,
voidLoading: false,
voidForm: { id: null, reason: '' },
@@ -253,6 +339,12 @@ export default {
type: 'select',
options: this.batchNoOptions,
},
{
prop: 'importStatus',
label: '状态',
type: 'select',
options: IMPORT_STATUS_OPTIONS,
},
{
prop: 'settlementType',
label: '导入类型',
@@ -298,6 +390,17 @@ export default {
hasPermission(code) {
return this.isAdmin || this.validData(this.permission?.[code], false);
},
importStatusLabel(value) {
return (
IMPORT_STATUS_OPTIONS.find(item => item.value === value)?.label || value || '-'
);
},
statusTagType(status) {
if (status === 'draft') return 'info';
if (status === 'completed') return 'success';
if (status === 'voided') return 'danger';
return '';
},
settlementTypeLabel(value) {
return (
SETTLEMENT_TYPE_OPTIONS.find(item => item.value === value)?.label || value || '-'
@@ -315,6 +418,13 @@ export default {
const body = response?.data || response || {};
return body?.data !== undefined ? body.data : body;
},
formatFeeAmount(row, name) {
const feeItems = row?.feeItems || {};
const value = feeItems[name] ?? row?.[name];
if (value === null || value === undefined || value === '') return '';
const number = Number(value);
return Number.isFinite(number) ? number.toFixed(2) : value;
},
async loadOptions() {
try {
const response = await api.getOptions();
@@ -341,6 +451,7 @@ export default {
const response = await api.getList(this.page.current, this.page.size, {
batchNo: this.query.batchNo || undefined,
settlementType: this.query.settlementType || undefined,
importStatus: this.query.importStatus || undefined,
projectName: this.query.projectName || undefined,
customerName: this.query.customerName || undefined,
carrierName: this.query.carrierName || undefined,
@@ -352,6 +463,10 @@ export default {
this.loading = false;
}
},
refreshTable() {
this.loadOptions();
this.loadTable();
},
handleSearch() {
this.page.current = 1;
this.loadTable();
@@ -372,13 +487,23 @@ export default {
},
async openDetail(row) {
if (!row?.id) return;
this.detailVisible = true;
this.detailLoading = true;
this.detail = { ...row };
this.detailRows = [];
this.detailFeeItemNames = [];
try {
const response = await api.getDetail(row.id);
this.detail = this.unwrapData(response) || { ...row };
const detail = this.unwrapData(response) || { ...row };
this.detail = detail;
this.detailRows = Array.isArray(detail.rows) ? detail.rows : [];
this.detailFeeItemNames = Array.isArray(detail.feeItemNames) ? detail.feeItemNames : [];
} catch (error) {
this.detail = { ...row };
this.$message.error(error?.message || '加载详情失败');
} finally {
this.detailLoading = false;
}
this.detailVisible = true;
},
editDraft(row) {
this.detailVisible = false;
@@ -387,6 +512,21 @@ export default {
query: { id: row.id },
});
},
async handleDelete(row) {
if (!row?.id) return;
try {
await this.$confirm('确认删除该草稿批次？删除后不可恢复。', '提示', {
type: 'warning',
});
await api.removeDraft(row.id);
this.$message.success('删除成功');
this.loadTable();
this.loadOptions();
} catch (error) {
if (error === 'cancel' || error === 'close') return;
this.$message.error(error?.message || '删除失败');
}
},
goFormalSettlement(row) {
if (!row?.formalSettlementId) return;
this.detailVisible = false;
@@ -513,6 +653,29 @@ export default {
padding: 12px 0;
}
.settlement-import-page__detail-title {
margin: 16px 0 8px;
}
.dialog-section-title {
position: relative;
padding-left: 12px;
color: #303133;
font-size: 16px;
font-weight: 600;
&::before {
position: absolute;
top: 2px;
left: 0;
width: 4px;
height: 16px;
border-radius: 2px;
background: #409eff;
content: '';
}
}
.settlement-import-page :deep(.basic-container__card > .el-card__body) {
padding: 0;
}