<template>
|
<div class="app-container">
|
<el-form :model="filters"
|
:inline="true">
|
<el-form-item label="收款单号:">
|
<el-input v-model="filters.collectionNumber"
|
placeholder="请输入收款单号"
|
clearable
|
style="width: 200px;" />
|
</el-form-item>
|
<el-form-item label="客户:">
|
<el-select v-model="filters.customerId"
|
placeholder="请选择客户"
|
clearable
|
filterable
|
style="width: 200px;">
|
<el-option v-for="item in customerList"
|
:key="item.id"
|
:label="item.customerName"
|
:value="item.id" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="收款方式:">
|
<el-select v-model="filters.collectionMethod"
|
placeholder="请选择收款方式"
|
clearable
|
style="width: 150px;">
|
<el-option v-for="item in payment_methods"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="收款日期:">
|
<el-date-picker v-model="filters.dateRange"
|
type="daterange"
|
value-format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
clearable
|
style="width: 240px;" />
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary"
|
@click="onSearch">搜索</el-button>
|
<el-button @click="resetFilters">重置</el-button>
|
</el-form-item>
|
</el-form>
|
<div class="table_list">
|
<div class="actions">
|
<div>
|
<el-statistic title="本页收款合计"
|
:value="totalReceiptAmount"
|
:precision="2"
|
prefix="¥" />
|
</div>
|
<div>
|
<el-button type="primary"
|
@click="add"
|
icon="Plus">新增收款</el-button>
|
<el-button type="success"
|
@click="handleExport"
|
icon="Download">导出</el-button>
|
</div>
|
</div>
|
<PIMTable rowKey="id"
|
v-loading="tableLoading"
|
:column="columns"
|
:tableData="dataList"
|
:page="{
|
current: pagination.currentPage,
|
size: pagination.pageSize,
|
total: pagination.total,
|
}"
|
@pagination="changePage">
|
<template #amount="{ row }">
|
<span class="text-success">¥{{ formatMoney(row.amount) }}</span>
|
</template>
|
<template #receiptMethod="{ row }">
|
<span>{{ getReceiptMethodLabel(row.receiptMethod) }}</span>
|
</template>
|
<template #operation="{ row }">
|
<el-button type="primary"
|
link
|
@click="view(row)">查看</el-button>
|
<el-button :disabled="row.accountStatemen"
|
type="primary"
|
link
|
@click="edit(row)">编辑</el-button>
|
<el-button :disabled="row.accountStatemen"
|
type="danger"
|
link
|
@click="handleDelete(row)">删除</el-button>
|
</template>
|
</PIMTable>
|
</div>
|
<FormDialog :title="dialogTitle"
|
v-model="dialogVisible"
|
width="800px"
|
:operation-type="isView ? 'detail' : ''"
|
@confirm="submitForm"
|
@cancel="closeDialog">
|
<el-form :model="form"
|
:rules="rules"
|
ref="formRef"
|
label-width="120px">
|
<el-row :gutter="20">
|
<el-col :span="24">
|
<el-form-item label="收款单号"
|
prop="receiptCode">
|
<el-input v-model="form.receiptCode"
|
placeholder="系统自动生成"
|
disabled />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="客户"
|
prop="customerId">
|
<el-select v-model="form.customerId"
|
placeholder="请选择客户"
|
style="width: 100%;"
|
:disabled="isEdit || isView"
|
filterable
|
@change="handleCustomerChange">
|
<el-option v-for="item in customerList"
|
:key="item.id"
|
:label="item.customerName"
|
:value="item.id" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="关联单据"
|
prop="stockOutRecordIds">
|
<el-input :model-value="outboundBatchDisplayText"
|
placeholder="请先选择客户"
|
readonly
|
:disabled="!form.customerId || isEdit || isView"
|
class="outbound-batch-input"
|
@click="handleOutboundInputClick">
|
<template v-if="!isEdit && !isView"
|
#append>
|
<el-button :disabled="!form.customerId"
|
:loading="outboundBatchLoading"
|
@click.stop="openOutboundSelectDialog">
|
选择
|
</el-button>
|
</template>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="收款日期"
|
prop="receiptDate">
|
<el-date-picker v-model="form.receiptDate"
|
type="date"
|
placeholder="选择日期"
|
value-format="YYYY-MM-DD"
|
style="width: 100%;"
|
:disabled="isView" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="收款金额"
|
prop="amount">
|
<el-input-number v-model="form.amount"
|
:min="0"
|
:precision="2"
|
style="width: 100%;"
|
:disabled="isView"
|
placeholder="根据关联单据自动汇总，可修改" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="20">
|
<el-col :span="12">
|
<el-form-item label="收款方式"
|
prop="receiptMethod">
|
<el-select v-model="form.receiptMethod"
|
placeholder="请选择收款方式"
|
style="width: 100%;"
|
:disabled="isView">
|
<el-option v-for="item in payment_methods"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value" />
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item label="备注"
|
prop="remark">
|
<el-input v-model="form.remark"
|
type="textarea"
|
:rows="3"
|
placeholder="请输入备注"
|
:disabled="isView" />
|
</el-form-item>
|
</el-form>
|
<template v-if="!isView"
|
#footer>
|
<el-button type="primary"
|
:loading="submitLoading"
|
@click="submitForm">确定</el-button>
|
<el-button @click="closeDialog">取消</el-button>
|
</template>
|
</FormDialog>
|
<el-dialog v-model="outboundSelectVisible"
|
title="选择关联单据"
|
width="1200px"
|
append-to-body
|
destroy-on-close
|
:close-on-click-modal="false"
|
@closed="handleOutboundDialogClosed">
|
<el-table ref="outboundTableRef"
|
v-loading="outboundBatchLoading"
|
:data="outboundBatchList"
|
row-key="id"
|
border
|
stripe
|
max-height="480"
|
@selection-change="handleOutboundDialogSelectionChange">
|
<el-table-column type="selection"
|
width="55"
|
align="center" />
|
<el-table-column prop="outboundBatches"
|
label="出库单号"
|
min-width="140"
|
show-overflow-tooltip />
|
<el-table-column prop="customerName"
|
label="客户名称"
|
min-width="120"
|
show-overflow-tooltip />
|
<el-table-column prop="productName"
|
label="产品名称"
|
min-width="120"
|
show-overflow-tooltip />
|
<el-table-column prop="specificationModel"
|
label="规格型号"
|
min-width="140"
|
show-overflow-tooltip />
|
<el-table-column prop="salesContractNo"
|
label="销售合同号"
|
min-width="140"
|
show-overflow-tooltip />
|
<el-table-column prop="shippingNo"
|
label="发货单号"
|
min-width="130"
|
show-overflow-tooltip />
|
<el-table-column prop="shippingDate"
|
label="发货日期"
|
width="110"
|
align="center" />
|
<el-table-column prop="outboundAmount"
|
label="出库金额"
|
width="110"
|
align="right">
|
<template #default="{ row }">¥{{ formatMoney(row.outboundAmount) }}</template>
|
</el-table-column>
|
<el-table-column prop="taxRate"
|
label="税率"
|
width="80"
|
align="center">
|
<template #default="{ row }">{{ row.taxRate }}%</template>
|
</el-table-column>
|
</el-table>
|
<template #footer>
|
<el-button type="primary"
|
@click="confirmOutboundSelection">确定</el-button>
|
<el-button @click="outboundSelectVisible = false">取消</el-button>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup>
|
import {
|
ref,
|
reactive,
|
computed,
|
onMounted,
|
nextTick,
|
getCurrentInstance,
|
} from "vue";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
import FormDialog from "@/components/Dialog/FormDialog.vue";
|
import { listCustomer } from "@/api/basicData/customer.js";
|
import {
|
getOutboundBatchesByCustomer,
|
addAccountSalesCollection,
|
listPageAccountSalesCollection,
|
updateAccountSalesCollection,
|
deleteAccountSalesCollection,
|
} from "@/api/financialManagement/accountSalesCollection.js";
|
|
defineOptions({
|
name: "收款单",
|
});
|
|
const { proxy } = getCurrentInstance();
|
const { payment_methods } = proxy.useDict("payment_methods");
|
|
const filters = reactive({
|
collectionNumber: "",
|
customerId: "",
|
collectionMethod: "",
|
dateRange: [],
|
});
|
|
const pagination = reactive({
|
currentPage: 1,
|
pageSize: 10,
|
total: 0,
|
});
|
|
const columns = [
|
{ label: "收款单号", prop: "receiptCode", width: "150" },
|
{ label: "客户名称", prop: "customerName", width: "180" },
|
{ label: "收款日期", prop: "receiptDate", width: "120" },
|
{ label: "收款金额", prop: "amount", dataType: "slot", slot: "amount" },
|
{
|
label: "收款方式",
|
prop: "receiptMethod",
|
dataType: "slot",
|
slot: "receiptMethod",
|
width: "120",
|
},
|
{ label: "备注", prop: "remark", showOverflowTooltip: true },
|
{
|
label: "操作",
|
prop: "operation",
|
dataType: "slot",
|
slot: "operation",
|
width: "200",
|
fixed: "right",
|
},
|
];
|
|
const dataList = ref([]);
|
const tableLoading = ref(false);
|
const dialogVisible = ref(false);
|
const dialogTitle = ref("");
|
const formRef = ref(null);
|
const isEdit = ref(false);
|
const isView = ref(false);
|
const currentId = ref(null);
|
const submitLoading = ref(false);
|
|
const customerList = ref([]);
|
const outboundBatchList = ref([]);
|
const outboundBatchOptions = ref([]);
|
const outboundBatchLoading = ref(false);
|
const outboundSelectVisible = ref(false);
|
const outboundTableRef = ref(null);
|
const dialogOutboundSelection = ref([]);
|
|
const getReceiptMethodLabel = value => {
|
if (value === undefined || value === null || value === "") return "-";
|
const item = payment_methods.value?.find(
|
m => String(m.value) === String(value)
|
);
|
return item?.label ?? value;
|
};
|
|
const getDefaultReceiptMethod = () => payment_methods.value?.[0]?.value ?? "";
|
|
const form = reactive({
|
receiptCode: "",
|
customerId: "",
|
receiptDate: "",
|
amount: 0,
|
receiptMethod: "",
|
stockOutRecordIds: [],
|
outboundBatches: "",
|
remark: "",
|
});
|
|
const rules = {
|
customerId: [{ required: true, message: "请选择客户", trigger: "change" }],
|
stockOutRecordIds: [
|
{
|
required: true,
|
type: "array",
|
min: 1,
|
message: "请选择关联单据",
|
trigger: "change",
|
},
|
],
|
receiptDate: [
|
{ required: true, message: "请选择收款日期", trigger: "change" },
|
],
|
amount: [{ required: true, message: "请输入收款金额", trigger: "blur" }],
|
receiptMethod: [
|
{ required: true, message: "请选择收款方式", trigger: "change" },
|
],
|
};
|
|
const totalReceiptAmount = computed(() =>
|
dataList.value.reduce((sum, item) => sum + Number(item.amount || 0), 0)
|
);
|
|
const formatMoney = value => {
|
if (value === undefined || value === null) return "0.00";
|
return Number(value)
|
.toFixed(2)
|
.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
};
|
|
const parseStockOutRecordIds = value => {
|
if (!value) return [];
|
if (Array.isArray(value)) return value;
|
return String(value)
|
.split(/[,，]/)
|
.map(s => s.trim())
|
.filter(Boolean)
|
.map(s => (/^\d+$/.test(s) ? Number(s) : s));
|
};
|
|
const formatOutboundBatches = value => {
|
if (value === undefined || value === null || value === "") return "";
|
if (Array.isArray(value)) return value.filter(Boolean).join("、");
|
return String(value)
|
.split(/[,，]/)
|
.map(s => s.trim())
|
.filter(Boolean)
|
.join("、");
|
};
|
|
const normalizeTableRow = row => ({
|
...row,
|
receiptCode: row.collectionNumber ?? row.receiptCode,
|
receiptDate: row.collectionDate ?? row.receiptDate,
|
amount: row.collectionAmount ?? row.amount,
|
receiptMethod: row.collectionMethod ?? row.receiptMethod ?? "",
|
stockOutRecordIds: row.stockOutRecordIds ?? row.stockOutRecordId ?? "",
|
outboundBatches: formatOutboundBatches(row.outboundBatches),
|
});
|
|
const getCustomerList = () => {
|
listCustomer({ current: -1, size: -1, type: 0 }).then(res => {
|
if (res.code === 200) {
|
customerList.value = res.data?.records || [];
|
}
|
});
|
};
|
|
const normalizeOutboundBatchOptions = data => {
|
const list = Array.isArray(data) ? data : [];
|
return list.map((item, index) => {
|
if (typeof item === "string" || typeof item === "number") {
|
const text = String(item);
|
return { label: text, value: text, outboundAmount: 0 };
|
}
|
const label =
|
item.outboundBatches ??
|
item.batchNo ??
|
item.shippingNo ??
|
item.outboundNo ??
|
item.label ??
|
`出库单${index + 1}`;
|
const value = item.id ?? item.stockOutRecordId ?? label;
|
return {
|
label: String(label),
|
value,
|
outboundAmount: Number(item.outboundAmount) || 0,
|
};
|
});
|
};
|
|
const isSameOutboundId = (a, b) => String(a) === String(b);
|
|
const getOutboundRowId = row => row?.id ?? row?.stockOutRecordId;
|
|
const outboundBatchDisplayText = computed(() => {
|
if (isEdit.value || isView.value) {
|
return form.outboundBatches || "";
|
}
|
if (form.outboundBatches) return form.outboundBatches;
|
const ids = form.stockOutRecordIds || [];
|
if (!ids.length) return "";
|
const labels = outboundBatchOptions.value
|
.filter(opt => ids.some(id => isSameOutboundId(id, opt.value)))
|
.map(opt => opt.label);
|
if (labels.length) return labels.join("、");
|
return ids.join("、");
|
});
|
|
const handleOutboundInputClick = () => {
|
if (isEdit.value || isView.value) return;
|
openOutboundSelectDialog();
|
};
|
|
/** 为已选 ID 补全选项（编辑/查看回显） */
|
const ensureOutboundOptionsForSelected = () => {
|
const ids = form.stockOutRecordIds || [];
|
ids.forEach(id => {
|
const exists = outboundBatchOptions.value.some(opt =>
|
isSameOutboundId(opt.value, id)
|
);
|
if (exists) return;
|
const fromList = outboundBatchList.value.find(row =>
|
isSameOutboundId(getOutboundRowId(row), id)
|
);
|
if (fromList) {
|
const [option] = normalizeOutboundBatchOptions([fromList]);
|
if (option) outboundBatchOptions.value.push(option);
|
return;
|
}
|
outboundBatchOptions.value.push({
|
label: String(id),
|
value: id,
|
outboundAmount: 0,
|
});
|
});
|
};
|
|
const syncCollectionAmount = () => {
|
const selected = form.stockOutRecordIds || [];
|
const sum = outboundBatchOptions.value
|
.filter(opt => selected.some(id => isSameOutboundId(id, opt.value)))
|
.reduce((acc, opt) => acc + (Number(opt.outboundAmount) || 0), 0);
|
form.amount = sum > 0 ? Number(sum.toFixed(2)) : 0;
|
};
|
|
const restoreOutboundTableSelection = () => {
|
nextTick(() => {
|
const table = outboundTableRef.value;
|
if (!table) return;
|
table.clearSelection();
|
const selectedIds = new Set(
|
(form.stockOutRecordIds || []).map(id => String(id))
|
);
|
outboundBatchList.value.forEach(row => {
|
const rowId = getOutboundRowId(row);
|
if (
|
rowId !== undefined &&
|
rowId !== null &&
|
selectedIds.has(String(rowId))
|
) {
|
table.toggleRowSelection(row, true);
|
}
|
});
|
});
|
};
|
|
const loadOutboundBatches = (customerId, keepSelected = false) => {
|
if (!customerId) {
|
outboundBatchList.value = [];
|
outboundBatchOptions.value = [];
|
if (!keepSelected) {
|
form.stockOutRecordIds = [];
|
form.amount = 0;
|
}
|
return Promise.resolve();
|
}
|
outboundBatchLoading.value = true;
|
return getOutboundBatchesByCustomer({ customerId })
|
.then(res => {
|
if (res.code === 200) {
|
const list = res.data?.records ?? res.data ?? [];
|
outboundBatchList.value = Array.isArray(list) ? list : [];
|
outboundBatchOptions.value = normalizeOutboundBatchOptions(list);
|
} else {
|
outboundBatchList.value = [];
|
outboundBatchOptions.value = [];
|
}
|
})
|
.catch(() => {
|
outboundBatchList.value = [];
|
outboundBatchOptions.value = [];
|
})
|
.finally(() => {
|
outboundBatchLoading.value = false;
|
if (keepSelected) {
|
ensureOutboundOptionsForSelected();
|
restoreOutboundTableSelection();
|
}
|
});
|
};
|
|
const handleCustomerChange = customerId => {
|
form.stockOutRecordIds = [];
|
form.outboundBatches = "";
|
form.amount = 0;
|
loadOutboundBatches(customerId);
|
};
|
|
const openOutboundSelectDialog = () => {
|
if (!form.customerId || isEdit.value || isView.value) return;
|
outboundSelectVisible.value = true;
|
loadOutboundBatches(form.customerId, true).then(() => {
|
restoreOutboundTableSelection();
|
});
|
};
|
|
const handleOutboundDialogSelectionChange = selection => {
|
dialogOutboundSelection.value = selection;
|
};
|
|
const confirmOutboundSelection = () => {
|
if (dialogOutboundSelection.value.length === 0) {
|
ElMessage.warning("请至少选择一条关联单据");
|
return;
|
}
|
form.stockOutRecordIds = dialogOutboundSelection.value
|
.map(row => getOutboundRowId(row))
|
.filter(id => id !== undefined && id !== null);
|
form.outboundBatches = dialogOutboundSelection.value
|
.map(row => row.outboundBatches ?? row.batchNo ?? row.shippingNo ?? "")
|
.filter(Boolean)
|
.join("、");
|
outboundSelectVisible.value = false;
|
syncCollectionAmount();
|
formRef.value?.validateField("stockOutRecordIds");
|
};
|
|
const handleOutboundDialogClosed = () => {
|
dialogOutboundSelection.value = [];
|
};
|
|
const appendFilterParams = params => {
|
if (filters.collectionNumber) {
|
params.collectionNumber = filters.collectionNumber;
|
}
|
if (filters.customerId) {
|
params.customerId = filters.customerId;
|
}
|
if (filters.collectionMethod) {
|
params.collectionMethod = filters.collectionMethod;
|
}
|
if (filters.dateRange?.length === 2) {
|
params.startDate = filters.dateRange[0];
|
params.endDate = filters.dateRange[1];
|
}
|
return params;
|
};
|
|
const buildListParams = () =>
|
appendFilterParams({
|
current: pagination.currentPage,
|
size: pagination.pageSize,
|
});
|
|
const buildExportParams = () => appendFilterParams({});
|
|
const buildSubmitPayload = (forUpdate = false) => {
|
const payload = {
|
customerId: form.customerId,
|
collectionDate: form.receiptDate,
|
collectionAmount: form.amount,
|
collectionMethod: form.receiptMethod,
|
collectionNumber: form.receiptCode || "",
|
remark: form.remark || "",
|
stockOutRecordIds: (form.stockOutRecordIds || []).join(","),
|
};
|
if (forUpdate) {
|
payload.id = currentId.value;
|
}
|
return payload;
|
};
|
|
const fillFormFromRow = row => {
|
const stockOutRecordIds = parseStockOutRecordIds(
|
row.stockOutRecordIds ?? row.stockOutRecordId
|
);
|
Object.assign(form, {
|
receiptCode: row.receiptCode ?? row.collectionNumber ?? "",
|
customerId: row.customerId,
|
receiptDate: row.receiptDate ?? row.collectionDate ?? "",
|
amount: Number(row.amount ?? row.collectionAmount ?? 0),
|
receiptMethod: row.receiptMethod ?? row.collectionMethod ?? "",
|
stockOutRecordIds,
|
outboundBatches: formatOutboundBatches(row.outboundBatches),
|
remark: row.remark ?? "",
|
});
|
};
|
|
const closeDialog = () => {
|
dialogVisible.value = false;
|
outboundSelectVisible.value = false;
|
isView.value = false;
|
isEdit.value = false;
|
};
|
|
const handleExport = () => {
|
const params = buildExportParams();
|
proxy.download(
|
"/accountSalesCollection/exportAccountSalesCollection",
|
params,
|
`收款单_${Date.now()}.xlsx`
|
);
|
};
|
|
const getTableData = () => {
|
tableLoading.value = true;
|
listPageAccountSalesCollection(buildListParams())
|
.then(res => {
|
const ok = res.code === 200 || res.code === 0;
|
if (ok && res.data) {
|
pagination.total = res.data.total ?? 0;
|
dataList.value = (res.data.records ?? []).map(normalizeTableRow);
|
} else {
|
ElMessage.error(res.msg || "查询失败");
|
dataList.value = [];
|
pagination.total = 0;
|
}
|
})
|
.catch(() => {
|
dataList.value = [];
|
pagination.total = 0;
|
ElMessage.error("查询失败");
|
})
|
.finally(() => {
|
tableLoading.value = false;
|
});
|
};
|
|
const onSearch = () => {
|
pagination.currentPage = 1;
|
getTableData();
|
};
|
|
const resetFilters = () => {
|
filters.collectionNumber = "";
|
filters.customerId = "";
|
filters.collectionMethod = "";
|
filters.dateRange = [];
|
pagination.currentPage = 1;
|
getTableData();
|
};
|
|
const changePage = ({ current, size }) => {
|
pagination.currentPage = current;
|
pagination.pageSize = size;
|
getTableData();
|
};
|
|
const add = () => {
|
isEdit.value = false;
|
isView.value = false;
|
dialogTitle.value = "新增收款";
|
Object.assign(form, {
|
receiptCode: "SK" + Date.now().toString().slice(-8),
|
customerId: "",
|
receiptDate: new Date().toISOString().split("T")[0],
|
amount: 0,
|
receiptMethod: getDefaultReceiptMethod(),
|
stockOutRecordIds: [],
|
outboundBatches: "",
|
remark: "",
|
});
|
outboundBatchList.value = [];
|
outboundBatchOptions.value = [];
|
dialogVisible.value = true;
|
};
|
|
const edit = row => {
|
isEdit.value = true;
|
isView.value = false;
|
currentId.value = row.id;
|
dialogTitle.value = "编辑收款";
|
fillFormFromRow(row);
|
dialogVisible.value = true;
|
};
|
|
const view = row => {
|
isView.value = true;
|
isEdit.value = false;
|
dialogTitle.value = "查看收款";
|
fillFormFromRow(row);
|
dialogVisible.value = true;
|
};
|
|
const handleDelete = row => {
|
ElMessageBox.confirm(
|
`确认删除收款单「${row.receiptCode ?? row.collectionNumber}」吗？`,
|
"提示",
|
{
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}
|
).then(() => {
|
deleteAccountSalesCollection([row.id])
|
.then(res => {
|
if (res.code === 200) {
|
ElMessage.success("删除成功");
|
getTableData();
|
} else {
|
ElMessage.error(res.msg || "删除失败");
|
}
|
})
|
.catch(() => {
|
ElMessage.error("删除失败");
|
});
|
});
|
};
|
|
const submitForm = () => {
|
formRef.value.validate(valid => {
|
if (!valid) return;
|
submitLoading.value = true;
|
const request = isEdit.value
|
? updateAccountSalesCollection(buildSubmitPayload(true))
|
: addAccountSalesCollection(buildSubmitPayload());
|
request
|
.then(res => {
|
if (res.code === 200) {
|
ElMessage.success(isEdit.value ? "修改成功" : "新增成功");
|
closeDialog();
|
getTableData();
|
} else {
|
ElMessage.error(res.msg || (isEdit.value ? "修改失败" : "新增失败"));
|
}
|
})
|
.catch(() => {
|
ElMessage.error(isEdit.value ? "修改失败" : "新增失败");
|
})
|
.finally(() => {
|
submitLoading.value = false;
|
});
|
});
|
};
|
|
onMounted(() => {
|
getCustomerList();
|
getTableData();
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
.actions {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 15px;
|
}
|
|
.text-success {
|
color: #67c23a;
|
font-weight: bold;
|
}
|
|
.outbound-batch-input:not(.is-disabled) {
|
:deep(.el-input__wrapper) {
|
cursor: pointer;
|
}
|
}
|
</style>
|
