<template>
|
<el-dialog v-model="visible" :title="title" width="1300px" @close="handleClose">
|
<el-form :model="form" :rules="rules" ref="formRef" label-width="0">
|
<div class="custom-table-container">
|
<el-row class="row-border">
|
<el-col :span="3" class="cell label required">发票抬头公司</el-col>
|
<el-col :span="5" class="cell content">
|
<el-form-item prop="invoiceCompanyName">
|
<el-input v-if="title !== '关联账单' && title !== '查看关联账单'" v-model="form.invoiceCompanyName"
|
@click="openBankDialog('receiving')" readonly placeholder="请输入发票抬头公司">
|
<template #append>
|
<el-button icon="Search" @click="openBankDialog('receiving')" />
|
</template>
|
</el-input>
|
<span v-else>{{ form.invoiceCompanyName }}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="3" class="cell label">关联企业类型</el-col>
|
<el-col :span="5" class="cell content">
|
<span> {{ dictFormat(sys_affiliated_enterprises, form.enterpriseType) }}</span>
|
<!-- <el-input v-model="form.enterpriseType" placeholder="自动带出" readonly /> -->
|
</el-col>
|
<el-col :span="3" class="cell label">关联企业名称</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.customerName }}</span>
|
|
<!-- <el-input v-model="form.customerName" placeholder="自动带出" readonly /> -->
|
</el-col>
|
</el-row>
|
|
<el-row class="row-border">
|
<el-col :span="3" class="cell label">统一社会信用代码</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceCreditCode }}</span>
|
</el-col>
|
<el-col :span="3" class="cell label"> 注册场所地址</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceOperatingLicenseAddress }}</span>
|
</el-col>
|
|
<el-col :span="3" class="cell label">发票类型</el-col>
|
<el-col :span="5" class="cell content">
|
<span> {{ dictFormat(sys_invoice_type, form.invoiceType) }}</span>
|
|
<!-- <el-input v-model="form.invoiceType" placeholder="自动带出" readonly /> -->
|
</el-col>
|
</el-row>
|
|
<el-row class="row-border">
|
<el-col :span="3" class="cell label">固定电话</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceOperatingLicensePhone }}</span>
|
</el-col>
|
|
</el-row>
|
|
<el-row class="row-border">
|
<el-col :span="3" class="cell label required">发票销售方</el-col>
|
<el-col :span="5" class="cell content">
|
<el-form-item prop="invoiceSellerName">
|
<el-input v-if="title !== '关联账单' && title !== '查看关联账单'" v-model="form.invoiceSellerName"
|
@click="openInvoiceDialog('seller')" readonly placeholder="请点击发票销售方">
|
<template #append>
|
<el-button icon="Search" @click="openInvoiceDialog('seller')" />
|
</template>
|
</el-input>
|
<span v-else>{{ form.invoiceSellerName }}</span>
|
</el-form-item>
|
|
</el-col>
|
<el-col :span="3" class="cell label">销售方信用代码</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceSellerCreditCode }}</span>
|
|
<!-- <el-input v-model="form.invoiceSellerCreditCode" readonly /> -->
|
</el-col>
|
<el-col :span="3" class="cell label required">发票金额</el-col>
|
<el-col :span="5" class="cell content">
|
<el-form-item prop="invoiceAmount">
|
<el-input-number v-if="title !== '关联账单' && title !== '查看关联账单'" v-model="form.invoiceAmount" :min="0"
|
style="width: 100%" />
|
<span v-else>{{ form.invoiceAmount }}</span>
|
|
</el-form-item>
|
</el-col>
|
</el-row>
|
|
<el-row class="row-border">
|
|
<el-col :span="3" class="cell label">销售方地址</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceSellerAddress }}</span>
|
|
</el-col>
|
<el-col :span="3" class="cell label">销售方固定电话</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceSellerPhone }}</span>
|
|
</el-col>
|
</el-row>
|
|
|
<el-row class="row-border" v-if="title === '关联账单'">
|
<el-col :span="3" class="cell label required">关联账单已开票金额</el-col>
|
<el-col :span="5" class="cell content">
|
<el-form-item prop="invoiceSellerName">
|
<span>{{ form.invoiceSellerName }}</span>
|
</el-form-item>
|
</el-col>
|
<el-col :span="3" class="cell label"> 关联账单未开票金额</el-col>
|
<el-col :span="5" class="cell content">
|
<span>{{ form.invoiceSellerCreditCode }}</span>
|
<!-- <el-input v-model="form.invoiceSellerCreditCode" readonly /> -->
|
</el-col>
|
|
</el-row>
|
</div>
|
|
|
</el-form>
|
|
|
<div class="detail-section" v-if="title === '关联账单'" >
|
<div class="detail-header">
|
<span>发票商品明细</span>
|
</div>
|
<el-table :data="form.invoiceBillDetails" border class="custom-table">
|
<el-table-column label="商品名称" prop="goodsName" />
|
<el-table-column label="商品税号" prop="goodsCode" />
|
<el-table-column label="单价" prop="price" />
|
<el-table-column label="含税标志" prop="withTaxFlag">
|
<template #default="{ row }">
|
<el-radio-group disabled v-model="row.withTaxFlag">
|
<el-radio :value="0">含税</el-radio>
|
<el-radio :value="1">不含税</el-radio>
|
</el-radio-group>
|
</template>
|
</el-table-column>
|
|
|
</el-table>
|
|
<div class="detail-header" style="margin-top: 10px;">
|
<span>关联账单明细</span>
|
</div>
|
<el-button type="primary" style="margin-bottom: 15px;" @click="addRow">新增</el-button>
|
|
<el-table :data="form.invoiceDetailList" border class="custom-table">
|
<el-table-column label="应收账单编号" prop="receivableBillNo" min-width="150">
|
<template #default="{ row, $index }">
|
<el-input v-model="row.receivableBillNo" @click="openReceivableDialog($index)"
|
:disabled="row.isSaved" readonly placeholder="搜索单号">
|
<template #append>
|
<el-button icon="Search" @click="openReceivableDialog($index)"
|
:disabled="row.isSaved" />
|
</template>
|
</el-input>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="应收账单金额" prop="receivableBillAmount" width="120">
|
<template #default="{ row }">
|
<span>{{ row.receivableBillAmount || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="应收账单币制" prop="receivableBillCurrency" width="120">
|
<template #default="{ row }">
|
<span>{{ row.receivableBillCurrency || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="账单已开票金额" prop="billedAmount" width="130">
|
<template #default="{ row }">
|
<span>{{ row.billedAmount || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="账单未开票金额" prop="unbilledAmount" width="130">
|
<template #default="{ row }">
|
<span>{{ row.unbilledAmount || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="本次开票金额" prop="currentBilledAmount" width="150">
|
<template #default="{ row }">
|
<el-input-number v-model="row.currentBilledAmount" :disabled="row.isSaved"
|
:controls="!row.isSaved" style="width: 100%" />
|
</template>
|
</el-table-column>
|
|
<el-table-column label="操作" width="150" align="center" fixed="right">
|
<template #default="{ row, $index }">
|
<el-button v-if="!row.isSaved" type="primary" link
|
@click="validateAndSaveRow(row, $index)">保存</el-button>
|
<el-button v-else type="primary" link @click="row.isSaved = false">修改</el-button>
|
<el-button type="danger" link @click="removeRow($index)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
</div>
|
|
<el-tabs v-if="title !== '关联账单'" v-model="activeName" class="demo-tabs" @tab-click="handleClick">
|
<el-tab-pane label="发票商品明细" name="first">
|
<el-button type="primary" v-if="title !== '查看关联账单'" style="margin-bottom: 15px;" @click="addItemRow">新增商品</el-button>
|
|
<el-table :data="form.invoiceBillDetails" border class="custom-table">
|
<el-table-column label="商品税号" prop="goodsCode">
|
<template #default="{ row }">
|
<el-input v-model="row.goodsCode" :disabled="row.isSaved" placeholder="请输入商品税号" />
|
</template>
|
</el-table-column>
|
<el-table-column label="商品名称" prop="goodsName">
|
<template #default="{ row }">
|
<el-input v-model="row.goodsName" :disabled="row.isSaved" placeholder="请输入商品名称" />
|
</template>
|
</el-table-column>
|
|
<el-table-column label="单价" prop="price">
|
<template #default="{ row }">
|
<el-input-number v-model="row.price" :disabled="row.isSaved" :min="0" :precision="2"
|
:controls="!row.isSaved" style="width: 100%" />
|
</template>
|
</el-table-column>
|
|
<el-table-column label="含税标志" prop="withTaxFlag">
|
<template #default="{ row }">
|
<el-radio-group :disabled="row.isSaved"
|
v-model="row.withTaxFlag">
|
<el-radio :value="0">含税</el-radio>
|
<el-radio :value="1">不含税</el-radio>
|
</el-radio-group>
|
</template>
|
</el-table-column>
|
|
<el-table-column v-if="title !== '查看关联账单'" label="操作" align="center" fixed="right">
|
<template #default="{ row, $index }">
|
<el-button v-if="!row.isSaved" type="primary" link @click="saveItemRow(row)">保存</el-button>
|
<el-button v-else type="primary" link @click="row.isSaved = false">修改</el-button>
|
<el-button type="danger" link @click="removeItemRow($index)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-tab-pane>
|
<el-tab-pane label="关联账单明细" name="second">
|
<el-button type="primary" v-if="title !== '查看关联账单'" style="margin-bottom: 15px;" @click="addRow">新增</el-button>
|
|
<el-table :data="form.invoiceDetailList" border class="custom-table">
|
<el-table-column label="应收账单编号" prop="receivableBillNo" min-width="150">
|
<template #default="{ row, $index }">
|
<el-input v-model="row.receivableBillNo" @click="openReceivableDialog($index)"
|
:disabled="row.isSaved" readonly placeholder="搜索单号">
|
<template #append>
|
<el-button icon="Search" @click="openReceivableDialog($index)"
|
:disabled="row.isSaved" />
|
</template>
|
</el-input>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="应收账单金额" prop="receivableBillAmount" width="120">
|
<template #default="{ row }">
|
<span>{{ row.receivableBillAmount || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="应收账单币制" prop="receivableBillCurrency" width="120">
|
<template #default="{ row }">
|
<span>{{ row.receivableBillCurrency || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="账单已开票金额" prop="billedAmount" width="130">
|
<template #default="{ row }">
|
<span>{{ row.billedAmount || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="账单未开票金额" prop="unbilledAmount" width="130">
|
<template #default="{ row }">
|
<span>{{ row.unbilledAmount || '' }}</span>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="本次开票金额" prop="currentBilledAmount" width="150">
|
<template #default="{ row }">
|
<el-input-number v-model="row.currentBilledAmount" :disabled="row.isSaved"
|
:controls="!row.isSaved" style="width: 100%" />
|
</template>
|
</el-table-column>
|
|
<el-table-column label="操作" v-if="title !== '查看关联账单'" width="150" align="center" fixed="right">
|
<template #default="{ row, $index }">
|
<el-button v-if="!row.isSaved" type="primary" link
|
@click="validateAndSaveRow(row, $index)">保存</el-button>
|
<el-button v-else type="primary" link @click="row.isSaved = false">修改</el-button>
|
<el-button type="danger" link @click="removeRow($index)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-tab-pane>
|
|
</el-tabs>
|
|
|
|
<template #footer>
|
<el-button @click="handleClose">取消</el-button>
|
<el-button type="primary" v-if="title !== '查看关联账单'" @click="submit">确定</el-button>
|
</template>
|
</el-dialog>
|
|
<invoiceManagementDialog v-model:visible="supplierBankIsible" :default-selected-id="form.invoiceInfoId"
|
@confirm="handleBankCardfirm" />
|
<invoiceManagementDialog v-model:visible="supplierBankIshow" :default-selected-id="form.invoiceSellerId"
|
@confirm="invoiceAmountForm" />
|
<receivableBillManagementDialog v-model:visible="receivablIshow" :default-selected-id="form.invoiceManageId"
|
@confirm="receivablForm" />
|
</template>
|
|
<script setup>
|
import { ref, reactive, watch } from 'vue'
|
import { ElMessage } from 'element-plus' // 引入提示组件
|
import invoiceManagementDialog from "../invoiceManagementDialog/index.vue";
|
import receivableBillManagementDialog from "../receivableBillManagementDialog/index.vue";
|
|
import useCurrentInstance from "@/utils/useCurrentInstance";
|
|
const { proxy } = useCurrentInstance();
|
const { sys_invoice_type, sys_affiliated_enterprises } = proxy.useDict('sys_invoice_type', 'sys_affiliated_enterprises');
|
|
|
const dictFormat = (dict, value) => {
|
return proxy.selectDictLabel(dict, value);
|
};
|
const props = defineProps({
|
title: { type: String, default: '新增发票' },
|
detailData: { type: Object, default: () => null }
|
})
|
|
const emit = defineEmits(['submit'])
|
const visible = ref(false)
|
const formRef = ref(null)
|
|
// 初始表单结构：补全了所有漏掉的字段
|
const form = reactive({
|
invoiceCompanyName: '',
|
enterpriseType: '',
|
customerName: '',
|
invoiceCreditCode: '',
|
invoiceType: '',
|
invoiceSellerName: '',
|
invoiceSellerCreditCode: '',
|
currentBilledAmount: 1,
|
invoiceBillDetails: [], // 发票商品明细
|
invoiceDetailList: [] // 关联账单明细
|
})
|
|
const rules = {
|
invoiceCompanyName: [{ required: true, message: '请选择抬头', trigger: 'change' }],
|
invoiceSellerName: [{ required: true, message: '请输入销售方', trigger: 'blur' }],
|
invoiceAmount: [{ required: true, message: '请输入金额', trigger: 'blur' }]
|
}
|
|
// 监听回显数据
|
watch(() => props.detailData, (val) => {
|
if (val) {
|
Object.assign(form, val)
|
form.invoiceDetailList = (val.invoiceDetailList || []).map(d => ({ ...d, isSaved: true }))
|
}
|
}, { deep: true, immediate: true })
|
|
// 修改后的 open 方法
|
const open = (data) => {
|
visible.value = true
|
// 重置表单，防止上一次操作的数据残留
|
if (formRef.value) formRef.value.resetFields()
|
|
if (data) {
|
// 1. 基础信息回显
|
Object.assign(form, data)
|
|
// 2. 针对表格明细做特殊状态注入
|
if (data.invoiceDetailList) {
|
form.invoiceDetailList = JSON.parse(JSON.stringify(data.invoiceDetailList)).map(row => ({
|
...row,
|
isSaved: true // 回显数据默认锁定，点击“修改”才可编辑
|
}))
|
} else {
|
form.invoiceDetailList = []
|
}
|
// 3. 【新增】发票商品明细回显处理
|
if (data.invoiceBillDetails) {
|
form.invoiceBillDetails = JSON.parse(JSON.stringify(data.invoiceBillDetails)).map(row => ({
|
...row,
|
isSaved: true // 回显数据默认锁定
|
}));
|
} else {
|
form.invoiceBillDetails = [];
|
}
|
}
|
}
|
const addRow = () => {
|
form.invoiceDetailList.push({
|
receivableBillNo: '',
|
receivableBillAmount: 0,
|
receivableBillCurrency: '',
|
billedAmount: 0,
|
unbilledAmount: 0,
|
invoiceAmount: 0,
|
isSaved: false
|
})
|
}
|
|
const removeRow = (index) => { form.invoiceDetailList.splice(index, 1) }
|
|
const handleClose = () => {
|
// 1. 清除 Element Plus 的表单验证红字提示
|
if (formRef.value) {
|
formRef.value.resetFields();
|
}
|
|
// 2. 将 form 对象重置为初始状态
|
Object.assign(form, {
|
invoiceCompanyName: '', // 模板中实际使用的字段
|
enterpriseType: '',
|
customerName: '',
|
invoiceCreditCode: '',
|
invoiceType: '',
|
invoiceSellerName: '',
|
invoiceSellerCreditCode: '',
|
invoiceAmount: 0,
|
invoiceOperatingLicenseAddress:'',
|
invoiceOperatingLicensePhone:'',
|
invoiceSellerAddress:'',
|
invoiceSellerPhone:'',
|
invoiceInfoId: null,
|
invoiceSellerId: null,
|
invoiceManageId: null,
|
invoiceBillDetails: [], // 清空商品明细
|
invoiceDetailList: []
|
});
|
|
// 3. 重置内部状态变量
|
currentRowIndex.value = null;
|
valueString.value = '';
|
|
// 4. 关闭弹窗
|
visible.value = false;
|
};
|
|
const submit = async () => {
|
if (!formRef.value) return
|
|
// 1. 基础表头必填项校验
|
try {
|
const valid = await formRef.value.validate()
|
if (!valid) return
|
} catch (error) {
|
return
|
}
|
|
// 2. 检查是否有明细数据
|
if (form.invoiceDetailList.length === 0) {
|
ElMessage.warning('请至少添加一条账单明细')
|
return
|
}
|
|
// 3. 遍历校验表格每一行的业务逻辑，并累加金额
|
let totalDetailAmount = 0; // 用于累计明细总额
|
|
for (let i = 0; i < form.invoiceDetailList.length; i++) {
|
const row = form.invoiceDetailList[i];
|
const rowNum = i + 1;
|
|
// 校验应收账单编号是否为空
|
if (!row.receivableBillNo) {
|
ElMessage.error(`第 ${rowNum} 行未选择“应收账单编号”，请搜索并选择账单`);
|
return;
|
}
|
|
// 校验本次开票金额是否有效
|
if (row.currentBilledAmount === null || row.currentBilledAmount === undefined || row.currentBilledAmount <= 0) {
|
ElMessage.error(`第 ${rowNum} 行“本次开票金额”必须大于 0`);
|
return;
|
}
|
|
// 校验是否已保存
|
if (!row.isSaved) {
|
ElMessage.error(`第 ${rowNum} 行明细尚未保存，请点击操作栏的“保存”按钮`);
|
return;
|
}
|
|
// 校验本次开票金额是否超过单行账单未开票金额
|
if (row.currentBilledAmount > row.unbilledAmount) {
|
ElMessage.error(`第 ${rowNum} 行“本次开票金额”不能超过“账单未开票金额”`);
|
return;
|
}
|
|
// 累加金额 (处理浮点数精度)
|
totalDetailAmount = Number((totalDetailAmount + row.currentBilledAmount).toFixed(2));
|
}
|
for (let i = 0; i < form.invoiceBillDetails.length; i++) {
|
if (!form.invoiceBillDetails[i].isSaved) {
|
ElMessage.error(`发票商品明细第 ${i + 1} 行尚未保存`)
|
return
|
}
|
}
|
// --- 4. 核心逻辑：校验明细总额是否超过发票总金额 ---
|
if (totalDetailAmount > form.invoiceAmount) {
|
ElMessage.error(`明细开票金额总和 (${totalDetailAmount}) 不能大于发票金额 (${form.invoiceAmount})`);
|
return;
|
}
|
|
// 5. 所有校验通过，执行提交
|
console.log('提交的数据：', form)
|
emit('submit', JSON.parse(JSON.stringify(form)))
|
// visible.value = false // 根据业务需求决定是否在提交后关闭
|
}
|
// 弹窗显示状态
|
const supplierBankIsible = ref(false);
|
const valueString = ref('');
|
const openBankDialog = (stringValue) => {
|
valueString.value = stringValue;
|
supplierBankIsible.value = true;
|
};
|
const handleBankCardfirm = (data) => {
|
if (valueString.value === 'receiving') {
|
form.invoiceCompanyName = data.invoiceCompanyName;
|
form.enterpriseType = data.enterpriseType;
|
form.customerName = data.customerName;
|
form.invoiceCreditCode = data.invoiceCreditCode;
|
form.invoiceType = data.invoiceType;
|
form.invoiceInfoId = data.id; // 建议在 formData 增加此 ID 字段用于回显
|
form.invoiceOperatingLicenseAddress = data.invoiceOperatingLicenseAddress;
|
form.invoiceOperatingLicensePhone = data.invoiceOperatingLicensePhone;
|
|
|
} else if (valueString.value === 'seller') {
|
form.invoiceSellerName = data.invoiceCompanyName;
|
form.invoiceSellerCreditCode = data.invoiceCreditCode;
|
|
}
|
// form.supplierId = data.id; // 建议在 formData 增加此 ID 字段用于回显
|
// form.supplierReceivingAccount = data.accountNo;
|
// form.supplierReceivingBank = data.bankName;
|
|
};
|
const supplierBankIshow = ref(false);
|
const openInvoiceDialog = (stringValue) => {
|
supplierBankIshow.value = true;
|
};
|
const invoiceAmountForm = (data) => {
|
form.invoiceSellerName = data.invoiceCompanyName;
|
form.invoiceSellerCreditCode = data.invoiceCreditCode;
|
console.log(22);
|
|
form.invoiceSellerAddress = data.invoiceOperatingLicenseAddress;
|
form.invoiceSellerPhone = data.invoiceOperatingLicensePhone;
|
form.invoiceSellerId = data.id; // 建议在 formData 增加此 ID 字段用于回显
|
};
|
const receivablIshow = ref(false);
|
const currentRowIndex = ref(null);
|
// 2. 修改打开弹窗的方法，接收 index
|
const openReceivableDialog = (index) => {
|
currentRowIndex.value = index; // 记录索引
|
receivablIshow.value = true;
|
};
|
// 3. 修改回调函数，将数据赋值给指定的行对象
|
const receivablForm = (data) => {
|
if (currentRowIndex.value !== null) {
|
// 获取当前行引用
|
const row = form.invoiceDetailList[currentRowIndex.value];
|
// 1. 基础字段赋值
|
row.receivableBillNo = data.systemNo;
|
row.receivableBillAmount = data.totalAmount;
|
row.receivableBillCurrency = data.currency;
|
row.billedAmount = data.relatedBillBilledAmount || 0;
|
|
const calcUnbilled = (data.totalAmount || 0) - (data.relatedBillBilledAmount || 0);
|
row.unbilledAmount = Number(calcUnbilled.toFixed(2));
|
row.currentBilledAmount = row.unbilledAmount;
|
currentRowIndex.value = null;
|
}
|
};
|
const activeName = ref('first')
|
// 2. 新增商品行的方法
|
const addItemRow = () => {
|
form.invoiceBillDetails.push({
|
goodsName: '',
|
goodsCode: '',
|
withTaxFlag: 0,
|
price: 0,
|
isSaved: false
|
})
|
}
|
|
// 3. 删除商品行
|
const removeItemRow = (index) => {
|
form.invoiceBillDetails.splice(index, 1)
|
}
|
|
// 4. 保存商品行时的简单校验
|
const saveItemRow = (row) => {
|
if (!row.goodsName) {
|
ElMessage.error('请输入商品名称')
|
return
|
}
|
if (!row.goodsCode) {
|
ElMessage.error('请输入商品税号')
|
return
|
}
|
if (row.price <= 0) {
|
ElMessage.error('单价必须大于0')
|
return
|
}
|
row.isSaved = true
|
}
|
|
const handleClick = (tab, event) => {
|
console.log(tab, event)
|
}
|
|
|
/**
|
* 校验并保存关联账单明细行
|
*/
|
const validateAndSaveRow = (row, index) => {
|
const rowNum = index + 1;
|
|
// 1. 基础非空校验
|
if (!row.receivableBillNo) {
|
ElMessage.error(`第 ${rowNum} 行：应收账单编号不能为空`);
|
return;
|
}
|
|
if (row.currentBilledAmount === null || row.currentBilledAmount === undefined || row.currentBilledAmount === '') {
|
ElMessage.error(`第 ${rowNum} 行：本次开票金额不能为空`);
|
return;
|
}
|
|
if (row.currentBilledAmount <= 0) {
|
ElMessage.error(`第 ${rowNum} 行：本次开票金额必须大于 0`);
|
return;
|
}
|
|
// 2. 校验单行是否超过该账单的未开票金额
|
if (row.currentBilledAmount > row.unbilledAmount) {
|
ElMessage.error(`第 ${rowNum} 行：本次开票金额不能超过未开票金额 (${row.unbilledAmount})`);
|
return;
|
}
|
|
// --- 核心修改：校验总额逻辑开始 ---
|
|
// 计算总额：其他已保存行的金额 + 当前正在操作的这一行金额
|
const otherRowsTotal = form.invoiceDetailList.reduce((sum, item, idx) => {
|
// 只累加“已保存状态”且“不是当前操作行”的金额
|
if (item.isSaved && idx !== index) {
|
return sum + (Number(item.currentBilledAmount) || 0);
|
}
|
return sum;
|
}, 0);
|
|
const currentTotal = Number((otherRowsTotal + row.currentBilledAmount).toFixed(2));
|
|
if (currentTotal > form.invoiceAmount) {
|
ElMessage.error(
|
`保存失败！当前所有明细总额 (${currentTotal}) 将超过发票总金额 (${form.invoiceAmount})。` +
|
`剩余可用额度：${Number((form.invoiceAmount - otherRowsTotal).toFixed(2))}`
|
);
|
return;
|
}
|
|
// --- 核心修改：校验总额逻辑结束 ---
|
|
// 校验通过，锁定行
|
row.isSaved = true;
|
// ElMessage.success(`第 ${rowNum} 行已暂存，当前总开票进度：${currentTotal} / ${form.invoiceAmount}`);
|
};
|
defineExpose({ open, handleClose })
|
</script>
|
|
<style scoped>
|
.custom-table-container {
|
border-top: 1px solid #dcdfe6;
|
border-left: 1px solid #dcdfe6;
|
margin-bottom: 10px;
|
}
|
|
.row-border {
|
border-bottom: 1px solid #dcdfe6;
|
}
|
|
.cell {
|
height: 48px;
|
display: flex;
|
align-items: center;
|
padding: 0 10px;
|
border-right: 1px solid #dcdfe6;
|
font-size: 13px;
|
}
|
|
.label {
|
background-color: #f5f7fa;
|
color: #606266;
|
justify-content: flex-start;
|
}
|
|
.required::before {
|
content: '*';
|
color: #f56c6c;
|
margin-right: 4px;
|
}
|
|
.empty {
|
background-color: #fff;
|
}
|
|
.detail-section {
|
margin-top: 20px;
|
}
|
|
.detail-header {
|
display: flex;
|
justify-content: space-between;
|
margin-bottom: 10px;
|
font-weight: bold;
|
}
|
|
:deep(.el-form-item) {
|
margin-bottom: 0;
|
width: 100%;
|
}
|
|
:deep(.el-input.is-disabled .el-input__inner) {
|
background-color: #f9f9f9;
|
color: #999;
|
}
|
</style>
|
