From 00cd513292bad1db6b078acea6a1cd89578b1586 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期三, 06 五月 2026 13:31:15 +0800
Subject: [PATCH] 升级pro 1.财务页面删除掉一些功能 2.财务管理应付管理、应收管理逻辑修改 3.生成凭证页面重构 4.整体样式修改
---
src/views/financialManagement/receivable/reconciliation.vue | 249 ++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 230 insertions(+), 19 deletions(-)
diff --git a/src/views/financialManagement/receivable/reconciliation.vue b/src/views/financialManagement/receivable/reconciliation.vue
index fc6d7c1..883e12e 100644
--- a/src/views/financialManagement/receivable/reconciliation.vue
+++ b/src/views/financialManagement/receivable/reconciliation.vue
@@ -55,7 +55,7 @@
</PIMTable>
</div>
- <el-dialog title="瀵硅处鏄庣粏" v-model="detailDialogVisible" width="900px" append-to-body>
+ <FormDialog title="瀵硅处鏄庣粏" v-model="detailDialogVisible" width="900px" @confirm="printDetail" @cancel="detailDialogVisible = false" operationType="detail">
<div class="statement-header">
<h3>{{ currentCustomer }} 搴旀敹瀵硅处鍗�</h3>
<p>瀵硅处鏈熼棿: {{ currentPeriod }}</p>
@@ -88,16 +88,72 @@
<el-table-column prop="remark" label="澶囨敞" show-overflow-tooltip />
</el-table>
<template #footer>
- <el-button @click="detailDialogVisible = false">鍏抽棴</el-button>
<el-button type="primary" @click="printDetail">鎵撳嵃</el-button>
+ <el-button @click="detailDialogVisible = false">鍏抽棴</el-button>
</template>
- </el-dialog>
+ </FormDialog>
+
+ <FormDialog title="鐢熸垚瀵硅处鍗�" v-model="generateDialogVisible" width="1000px" @confirm="confirmGenerate" @cancel="generateDialogVisible = false">
+ <el-form :model="generateForm" label-width="100px">
+ <el-row :gutter="20">
+ <el-col :span="12">
+ <el-form-item label="閫夋嫨瀹㈡埛" prop="customerId">
+ <el-select v-model="generateForm.customerId" placeholder="璇烽�夋嫨瀹㈡埛" style="width: 100%;" @change="onCustomerChange">
+ <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.id" />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="瀵硅处鏈堜唤" prop="period">
+ <el-date-picker v-model="generateForm.period" type="month" placeholder="閫夋嫨鏈堜唤" value-format="YYYY-MM" style="width: 100%;" @change="onPeriodChange" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+
+ <div v-if="salesData.length > 0" class="sales-section">
+ <div class="section-title">鏈湀閿�鍞暟鎹�</div>
+ <el-table :data="salesData" border style="width: 100%; margin-bottom: 15px;" v-loading="salesLoading" @selection-change="handleSalesSelectionChange">
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column prop="date" label="鏃ユ湡" width="120" />
+ <el-table-column prop="code" label="鍗曟嵁缂栧彿" width="150" />
+ <el-table-column prop="type" label="绫诲瀷" width="100">
+ <template #default="{ row }">
+ <el-tag :type="row.type === '鍑哄簱' ? 'success' : row.type === '鏀舵' ? 'primary' : 'danger'">{{ row.type }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="amount" label="閲戦" width="120">
+ <template #default="{ row }">
+ <span :class="row.type === '鍑哄簱' ? 'text-primary' : row.type === '鏀舵' ? 'text-success' : 'text-danger'">楼{{ formatMoney(row.amount) }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column prop="remark" label="澶囨敞" />
+ </el-table>
+
+ <div class="summary-row">
+ <span>鏈熷垵浣欓: <strong class="text-primary">楼{{ formatMoney(generateForm.beginBalance) }}</strong></span>
+ <span>鏈湡搴旀敹: <strong class="text-primary">楼{{ formatMoney(generateForm.currentReceivable) }}</strong></span>
+ <span>鏈湡鏀舵: <strong class="text-success">楼{{ formatMoney(generateForm.currentReceipt) }}</strong></span>
+ <span>鏈熸湯浣欓: <strong :class="calculateEndBalance(generateForm.beginBalance, generateForm.currentReceivable, generateForm.currentReceipt) >= 0 ? 'text-success' : 'text-danger'">楼{{ formatMoney(calculateEndBalance(generateForm.beginBalance, generateForm.currentReceivable, generateForm.currentReceipt)) }}</strong></span>
+ </div>
+ </div>
+
+ <div v-else-if="generateForm.customerId && !salesLoading" class="empty-tip">
+ <el-empty description="璇ュ鎴锋湰鏈堟殏鏃犻攢鍞暟鎹�" />
+ </div>
+
+ <template #footer>
+ <el-button type="primary" @click="confirmGenerate" :disabled="!canGenerate">纭鐢熸垚</el-button>
+ <el-button @click="generateDialogVisible = false">鍙栨秷</el-button>
+ </template>
+ </FormDialog>
</div>
</template>
<script setup>
-import { ref, reactive, onMounted } from "vue";
+import { ref, reactive, onMounted, computed } from "vue";
import { ElMessage } from "element-plus";
+import FormDialog from "@/components/Dialog/FormDialog.vue";
defineOptions({
name: "搴旀敹瀵硅处",
@@ -132,6 +188,24 @@
const currentPeriod = ref("");
const detailData = ref([]);
+const generateDialogVisible = ref(false);
+const salesLoading = ref(false);
+const salesData = ref([]);
+const selectedSales = ref([]);
+
+const generateForm = reactive({
+ customerId: "",
+ customerName: "",
+ period: "",
+ beginBalance: 0,
+ currentReceivable: 0,
+ currentReceipt: 0,
+});
+
+const canGenerate = computed(() => {
+ return generateForm.customerId && generateForm.period && selectedSales.value.length > 0;
+});
+
const customerList = [
{ id: 1, name: "鍖椾含绉戞妧鏈夐檺鍏徃" },
{ id: 2, name: "涓婃捣璐告槗鍏徃" },
@@ -144,6 +218,10 @@
{ id: 2, statementCode: "DZ202401002", customerId: 2, customerName: "涓婃捣璐告槗鍏徃", period: "2024-01", beginBalance: 5000, currentReceivable: 12000, currentReceipt: 10000, endBalance: 7000 },
{ id: 3, statementCode: "DZ202402001", customerId: 1, customerName: "鍖椾含绉戞妧鏈夐檺鍏徃", period: "2024-02", beginBalance: 17000, currentReceivable: 20000, currentReceipt: 15000, endBalance: 22000 },
];
+
+const calculateEndBalance = (beginBalance, currentReceivable, currentReceipt) => {
+ return beginBalance + currentReceivable - currentReceipt;
+};
const formatMoney = (value) => {
if (value === undefined || value === null) return "0.00";
@@ -177,34 +255,133 @@
};
const generateStatement = () => {
- ElMessage.success("瀵硅处鍗曠敓鎴愭垚鍔�");
+ generateForm.customerId = "";
+ generateForm.customerName = "";
+ generateForm.period = "";
+ generateForm.beginBalance = 0;
+ generateForm.currentReceivable = 0;
+ generateForm.currentReceipt = 0;
+ salesData.value = [];
+ selectedSales.value = [];
+ generateDialogVisible.value = true;
+};
+
+const onCustomerChange = (customerId) => {
+ const customer = customerList.find(item => item.id === customerId);
+ if (customer) {
+ generateForm.customerName = customer.name;
+ }
+ loadSalesData();
+};
+
+const onPeriodChange = () => {
+ loadSalesData();
+};
+
+const loadSalesData = () => {
+ if (!generateForm.customerId || !generateForm.period) {
+ salesData.value = [];
+ return;
+ }
+
+ salesLoading.value = true;
+
+ setTimeout(() => {
+ const mockSalesData = [
+ { id: 1, date: generateForm.period + "-03", code: "CK2024001", type: "鍑哄簱", amount: 8000, remark: "浜у搧A閿�鍞�" },
+ { id: 2, date: generateForm.period + "-08", code: "SK2024001", type: "鏀舵", amount: 5000, remark: "瀹㈡埛鍥炴" },
+ { id: 3, date: generateForm.period + "-12", code: "CK2024002", type: "鍑哄簱", amount: 12000, remark: "浜у搧B閿�鍞�" },
+ { id: 4, date: generateForm.period + "-15", code: "TH2024001", type: "閫�璐�", amount: 2000, remark: "璐ㄩ噺闂閫�璐�" },
+ { id: 5, date: generateForm.period + "-20", code: "CK2024003", type: "鍑哄簱", amount: 5000, remark: "浜у搧C閿�鍞�" },
+ { id: 6, date: generateForm.period + "-25", code: "SK2024002", type: "鏀舵", amount: 8000, remark: "瀹㈡埛鍥炴" },
+ ];
+
+ salesData.value = mockSalesData;
+
+ const lastPeriod = getLastPeriod(generateForm.period);
+ const lastStatement = mockData.find(item =>
+ item.customerId === generateForm.customerId && item.period === lastPeriod
+ );
+ generateForm.beginBalance = lastStatement ? lastStatement.endBalance : 0;
+
+ calculateSummary();
+
+ salesLoading.value = false;
+ }, 500);
+};
+
+const getLastPeriod = (period) => {
+ const [year, month] = period.split("-").map(Number);
+ if (month === 1) {
+ return `${year - 1}-12`;
+ }
+ return `${year}-${String(month - 1).padStart(2, "0")}`;
+};
+
+const calculateSummary = () => {
+ let receivable = 0;
+ let receipt = 0;
+
+ selectedSales.value.forEach(item => {
+ if (item.type === "鍑哄簱") {
+ receivable += item.amount;
+ } else if (item.type === "閫�璐�") {
+ receivable -= item.amount;
+ } else if (item.type === "鏀舵") {
+ receipt += item.amount;
+ }
+ });
+
+ generateForm.currentReceivable = receivable;
+ generateForm.currentReceipt = receipt;
+};
+
+const handleSalesSelectionChange = (selection) => {
+ selectedSales.value = selection;
+ calculateSummary();
+};
+
+const confirmGenerate = () => {
const newId = mockData.length > 0 ? Math.max(...mockData.map(item => item.id)) + 1 : 1;
- const customer = customerList[Math.floor(Math.random() * customerList.length)];
+ const endBalance = calculateEndBalance(generateForm.beginBalance, generateForm.currentReceivable, generateForm.currentReceipt);
+
mockData.unshift({
id: newId,
statementCode: "DZ" + Date.now(),
- customerId: customer.id,
- customerName: customer.name,
- period: "2024-03",
- beginBalance: Math.floor(Math.random() * 10000),
- currentReceivable: Math.floor(Math.random() * 20000),
- currentReceipt: Math.floor(Math.random() * 15000),
- endBalance: Math.floor(Math.random() * 20000),
+ customerId: generateForm.customerId,
+ customerName: generateForm.customerName,
+ period: generateForm.period,
+ beginBalance: generateForm.beginBalance,
+ currentReceivable: generateForm.currentReceivable,
+ currentReceipt: generateForm.currentReceipt,
+ endBalance,
});
+
+ generateDialogVisible.value = false;
+ ElMessage.success("瀵硅处鍗曠敓鎴愭垚鍔�");
getTableData();
};
const viewDetail = (row) => {
currentCustomer.value = row.customerName;
currentPeriod.value = row.period;
+
+ const saleOutAmount = Math.floor(row.currentReceivable * 0.6);
+ const returnAmount = Math.floor(row.currentReceivable * 0.1);
+ const firstReceipt = Math.floor(row.currentReceipt * 0.4);
+ const secondReceipt = row.currentReceipt - firstReceipt;
+
+ let runningBalance = row.beginBalance;
+
detailData.value = [
- { date: row.period + "-01", type: "鏈熷垵", code: "-", debit: 0, credit: 0, balance: row.beginBalance, remark: "鏈熷垵浣欓" },
- { date: row.period + "-05", type: "鍑哄簱", code: "CK2024001", debit: 5000, credit: 0, balance: row.beginBalance + 5000, remark: "" },
- { date: row.period + "-10", type: "鏀舵", code: "SK2024001", debit: 0, credit: 3000, balance: row.beginBalance + 2000, remark: "" },
- { date: row.period + "-15", type: "鍑哄簱", code: "CK2024002", debit: 8000, credit: 0, balance: row.beginBalance + 10000, remark: "" },
- { date: row.period + "-20", type: "閫�璐�", code: "TH2024001", debit: 0, credit: 2000, balance: row.beginBalance + 8000, remark: "" },
- { date: row.period + "-25", type: "鏀舵", code: "SK2024002", credit: row.currentReceipt - 3000, balance: row.endBalance, remark: "" },
+ { date: row.period + "-01", type: "鏈熷垵", code: "-", debit: 0, credit: 0, balance: runningBalance, remark: "鏈熷垵浣欓" },
+ { date: row.period + "-05", type: "鍑哄簱", code: "CK2024001", debit: saleOutAmount, credit: 0, balance: runningBalance += saleOutAmount, remark: "閿�鍞嚭搴�" },
+ { date: row.period + "-10", type: "鏀舵", code: "SK2024001", debit: 0, credit: firstReceipt, balance: runningBalance -= firstReceipt, remark: "瀹㈡埛鍥炴" },
+ { date: row.period + "-15", type: "鍑哄簱", code: "CK2024002", debit: row.currentReceivable - saleOutAmount - returnAmount, credit: 0, balance: runningBalance += (row.currentReceivable - saleOutAmount - returnAmount), remark: "閿�鍞嚭搴�" },
+ { date: row.period + "-20", type: "閫�璐�", code: "TH2024001", debit: 0, credit: returnAmount, balance: runningBalance -= returnAmount, remark: "閿�鍞��璐�" },
+ { date: row.period + "-25", type: "鏀舵", code: "SK2024002", debit: 0, credit: secondReceipt, balance: runningBalance -= secondReceipt, remark: "瀹㈡埛鍥炴" },
];
+
detailDialogVisible.value = true;
};
@@ -255,4 +432,38 @@
margin: 0;
}
}
+
+.sales-section {
+ margin-top: 20px;
+
+ .section-title {
+ font-size: 16px;
+ font-weight: bold;
+ margin-bottom: 15px;
+ padding-left: 10px;
+ border-left: 4px solid #409eff;
+ }
+}
+
+.summary-row {
+ display: flex;
+ justify-content: space-around;
+ padding: 15px;
+ background-color: #f5f7fa;
+ border-radius: 4px;
+ margin-top: 15px;
+
+ span {
+ font-size: 14px;
+
+ strong {
+ font-size: 16px;
+ margin-left: 5px;
+ }
+ }
+}
+
+.empty-tip {
+ margin-top: 30px;
+}
</style>
--
Gitblit v1.9.3