From ac00bb7b8eae1bf6aabb7f1ae67c2e5aa5b8ae90 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期五, 12 六月 2026 10:21:12 +0800
Subject: [PATCH] 宝东 1.样式问题
---
src/views/financialManagement/payable/paymentApply.vue | 105 +++++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 91 insertions(+), 14 deletions(-)
diff --git a/src/views/financialManagement/payable/paymentApply.vue b/src/views/financialManagement/payable/paymentApply.vue
index 3937e96..b2e054c 100644
--- a/src/views/financialManagement/payable/paymentApply.vue
+++ b/src/views/financialManagement/payable/paymentApply.vue
@@ -21,6 +21,13 @@
<el-option label="瀹℃牳涓嶉�氳繃" :value="2" />
</el-select>
</el-form-item>
+ <el-form-item label="浠樻鐘舵��:">
+ <el-select v-model="filters.paymentStatus" placeholder="璇烽�夋嫨浠樻鐘舵��" clearable style="width: 150px;">
+ <el-option label="鏈粯娆�" :value="0" />
+ <el-option label="閮ㄥ垎浠樻" :value="1" />
+ <el-option label="宸蹭粯娆�" :value="2" />
+ </el-select>
+ </el-form-item>
<el-form-item label="鐢宠鏃ユ湡:">
<el-date-picker
v-model="filters.dateRange"
@@ -59,8 +66,11 @@
}"
@pagination="changePage"
>
- <template #amount="{ row }">
- <span class="text-danger">楼{{ formatMoney(row.amount) }}</span>
+ <template #paymentAmount="{ row }">
+ <span class="text-primary">楼{{ formatMoney(row.paymentAmount) }}</span>
+ </template>
+ <template #paidAmount="{ row }">
+ <span class="text-success">楼{{ formatMoney(row.paidAmount) }}</span>
</template>
<template #paymentMethod="{ row }">
<el-tag>{{ getPaymentMethodLabel(row.paymentMethod) }}</el-tag>
@@ -68,11 +78,14 @@
<template #status="{ row }">
<el-tag :type="getStatusType(row.status)">{{ getStatusLabel(row.status) }}</el-tag>
</template>
+ <template #paymentStatus="{ row }">
+ <el-tag :type="getPaymentStatusType(row.paymentStatus)">{{ getPaymentStatusLabel(row.paymentStatus) }}</el-tag>
+ </template>
<template #operation="{ row }">
<el-button type="primary" link @click="view(row)">鏌ョ湅</el-button>
<el-button type="primary" link @click="edit(row)" v-if="isPendingStatus(row.status)">缂栬緫</el-button>
<el-button type="success" link @click="handleAudit(row)" v-if="isPendingStatus(row.status)">瀹℃牳</el-button>
- <el-button type="warning" link @click="openPaymentDialog(row)" v-if="isApprovedStatus(row.status)">浠樻</el-button>
+ <el-button type="warning" link @click="openPaymentDialog(row)" v-if="canPay(row)">浠樻</el-button>
<el-button type="danger" link @click="handleDelete(row)" v-if="isPendingStatus(row.status)">鍒犻櫎</el-button>
</template>
</PIMTable>
@@ -162,7 +175,7 @@
<el-input-number
v-model="form.paymentAmount"
:min="0"
- :precision="2"
+ :precision="4"
style="width: 100%;"
:disabled="isView"
placeholder="鏍规嵁鍏ュ簱鍗曡嚜鍔ㄦ眹鎬伙紝鍙慨鏀�"
@@ -227,6 +240,23 @@
</el-col>
</el-row>
<el-row :gutter="20">
+ <el-col :span="8">
+ <el-form-item label="鐢宠閲戦">
+ <el-input :model-value="formatMoney(paymentForm.applyAmount)" disabled />
+ </el-form-item>
+ </el-col>
+ <el-col :span="8">
+ <el-form-item label="宸蹭粯娆鹃噾棰�">
+ <el-input :model-value="formatMoney(paymentForm.paidAmountInfo)" disabled />
+ </el-form-item>
+ </el-col>
+ <el-col :span="8">
+ <el-form-item label="鍓╀綑鍙粯娆�">
+ <el-input :model-value="formatMoney(paymentForm.remainAmount)" disabled />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20">
<el-col :span="12">
<el-form-item label="渚涘簲鍟�">
<el-input v-model="paymentForm.supplierName" disabled />
@@ -250,7 +280,7 @@
<el-input-number
v-model="paymentForm.paymentAmount"
:min="0"
- :precision="2"
+ :precision="4"
style="width: 100%;"
/>
</el-form-item>
@@ -354,6 +384,7 @@
invoiceApplicationNo: "",
supplierId: "",
status: "",
+ paymentStatus: "",
dateRange: [],
});
@@ -364,12 +395,14 @@
});
const columns = [
- { label: "鐢宠鍗曞彿", prop: "applyCode", width: "150" },
+ { label: "鐢宠鍗曞彿", prop: "invoiceApplicationNo", width: "150" },
{ label: "渚涘簲鍟�", prop: "supplierName", width: "180" },
- { label: "浠樻閲戦", prop: "amount", dataType: "slot", slot: "amount" },
+ { label: "鐢宠閲戦", prop: "paymentAmount", dataType: "slot", slot: "paymentAmount" },
+ { label: "宸蹭粯娆鹃噾棰�", prop: "paidAmount", dataType: "slot", slot: "paidAmount" },
{ label: "浠樻鏂瑰紡", prop: "paymentMethod", dataType: "slot", slot: "paymentMethod", width: "120" },
{ label: "鐢宠鏃ユ湡", prop: "applyDate", width: "120" },
- { label: "鐘舵��", prop: "status", dataType: "slot", slot: "status", width: "100" },
+ { label: "瀹℃牳鐘舵��", prop: "status", dataType: "slot", slot: "status", width: "100" },
+ { label: "浠樻鐘舵��", prop: "paymentStatus", dataType: "slot", slot: "paymentStatus", width: "100" },
{ label: "鎿嶄綔", prop: "operation", dataType: "slot", slot: "operation", width: "260", fixed: "right" },
];
@@ -407,6 +440,9 @@
bankAccount: "",
bankName: "",
remark: "",
+ applyAmount: 0,
+ paidAmountInfo: 0,
+ remainAmount: 0,
});
const paymentRules = {
@@ -417,6 +453,9 @@
const STATUS_LABEL_MAP = { 0: "寰呭鏍�", 1: "瀹℃牳閫氳繃", 2: "瀹℃牳涓嶉�氳繃" };
const STATUS_TYPE_MAP = { 0: "warning", 1: "success", 2: "danger" };
+
+const PAYMENT_STATUS_LABEL_MAP = { 0: "鏈粯娆�", 1: "閮ㄥ垎浠樻", 2: "宸蹭粯娆�" };
+const PAYMENT_STATUS_TYPE_MAP = { 0: "warning", 1: "primary", 2: "success" };
const form = reactive({
invoiceApplicationNo: "",
@@ -441,7 +480,9 @@
const formatMoney = (value) => {
if (value === undefined || value === null) return "0.00";
- return Number(value).toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+ const parts = Number(value).toFixed(4).split(".");
+ parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+ return parts.join(".");
};
const normalizeStatus = (status) => {
@@ -450,9 +491,21 @@
return Number.isNaN(num) ? 0 : num;
};
+const normalizePaymentStatus = (ps) => {
+ if (ps === undefined || ps === null || ps === "") return 0;
+ const num = Number(ps);
+ return Number.isNaN(num) ? 0 : num;
+};
+
const isPendingStatus = (status) => normalizeStatus(status) === 0;
const isApprovedStatus = (status) => normalizeStatus(status) === 1;
+
+const canPay = (row) => isApprovedStatus(row.status) && normalizePaymentStatus(row.paymentStatus) !== 2;
+
+const getPaymentStatusLabel = (ps) => PAYMENT_STATUS_LABEL_MAP[normalizePaymentStatus(ps)] ?? "鏈粯娆�";
+
+const getPaymentStatusType = (ps) => PAYMENT_STATUS_TYPE_MAP[normalizePaymentStatus(ps)] ?? "warning";
const isBankTransferPayment = (method) => {
if (method === undefined || method === null || method === "") return false;
@@ -526,7 +579,7 @@
.reduce((acc, row) => acc + getInboundRowTaxInclusiveAmount(row), 0);
}
- form.paymentAmount = sum > 0 ? Number(sum.toFixed(2)) : 0;
+ form.paymentAmount = sum > 0 ? Number(sum.toFixed(4)) : 0;
};
const inboundBatchDisplayText = computed(() => {
@@ -542,10 +595,10 @@
const normalizeTableRow = (row) => ({
...row,
- applyCode: row.invoiceApplicationNo ?? row.applyCode,
- amount: row.paymentAmount ?? row.amount,
reason: row.paymentContent ?? row.reason,
status: normalizeStatus(row.status),
+ paymentStatus: normalizePaymentStatus(row.paymentStatus),
+ paidAmount: Number(row.paidAmount ?? 0),
stockInRecordIds: row.stockInRecordIds ?? "",
inboundBatches: formatInboundBatches(row.inboundBatches),
});
@@ -618,6 +671,9 @@
if (filters.status !== "" && filters.status != null) {
params.status = filters.status;
}
+ if (filters.paymentStatus !== "" && filters.paymentStatus != null) {
+ params.paymentStatus = filters.paymentStatus;
+ }
if (filters.dateRange?.length === 2) {
params.startDate = filters.dateRange[0];
params.endDate = filters.dateRange[1];
@@ -673,6 +729,7 @@
filters.invoiceApplicationNo = "";
filters.supplierId = "";
filters.status = "";
+ filters.paymentStatus = "";
filters.dateRange = [];
pagination.currentPage = 1;
getTableData();
@@ -769,6 +826,8 @@
};
const openPaymentDialog = (row) => {
+ const applyAmount = Number(row.paymentAmount ?? row.amount ?? 0);
+ const paidAmount = Number(row.paidAmount ?? 0);
Object.assign(paymentForm, {
paymentNumber: "",
invoiceApplicationNo: row.invoiceApplicationNo ?? row.applyCode ?? "",
@@ -776,11 +835,14 @@
supplierId: row.supplierId,
accountPaymentApplicationId: row.id,
paymentDate: new Date().toISOString().split("T")[0],
- paymentAmount: Number(row.paymentAmount ?? row.amount ?? 0),
+ paymentAmount: Math.max(0, applyAmount - paidAmount),
paymentMethod: row.paymentMethod ?? getDefaultPaymentMethod(),
bankAccount: row.bankAccountNum ?? row.bankAccount ?? "",
bankName: row.bankAccountName ?? row.bankName ?? "",
remark: "",
+ applyAmount,
+ paidAmountInfo: paidAmount,
+ remainAmount: Math.max(0, applyAmount - paidAmount),
});
paymentDialogVisible.value = true;
nextTick(() => {
@@ -791,6 +853,11 @@
const submitPayment = () => {
paymentFormRef.value?.validate((valid) => {
if (!valid) return;
+ const maxRemain = paymentForm.applyAmount - paymentForm.paidAmountInfo;
+ if (paymentForm.paymentAmount > maxRemain) {
+ ElMessage.warning(`浠樻閲戦涓嶈兘瓒呰繃鍓╀綑鍙粯娆鹃噾棰� 楼${formatMoney(maxRemain)}`);
+ return;
+ }
paymentSubmitLoading.value = true;
addAccountPurchasePayment({
accountPaymentApplicationId: paymentForm.accountPaymentApplicationId,
@@ -820,7 +887,7 @@
};
const handleDelete = (row) => {
- ElMessageBox.confirm(`纭鍒犻櫎鐢宠鍗曘��${row.applyCode ?? row.invoiceApplicationNo}銆嶅悧锛焋, "鎻愮ず", {
+ ElMessageBox.confirm(`纭鍒犻櫎鐢宠鍗曘��${row.invoiceApplicationNo ?? row.applyCode}銆嶅悧锛焋, "鎻愮ず", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning",
@@ -1010,6 +1077,16 @@
font-weight: bold;
}
+.text-primary {
+ color: #409eff;
+ font-weight: bold;
+}
+
+.text-success {
+ color: #67c23a;
+ font-weight: bold;
+}
+
.inbound-batch-input :deep(.el-input__wrapper) {
cursor: pointer;
}
--
Gitblit v1.9.3