业务逻辑在table里面 , 可以校验到每一行的单价的
html如下
<el-table-column
align="center"
prop="address"
label="单价"
width="100"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.unitPrice"
placeholder="请输入"
style="width: 80px"
maxlength="8"
@input="
(e) => {
totalCostsUnitPrice(e, scope.$index);
}
"
></el-input>
</template>
</el-table-column>
js如下
/* 单价校验 + 计算金额*/
totalCostsUnitPrice(e, ind) {
let Tom = [];
if (e.length > 6) e = e.slice(0, 8);
let Blo = 0;
for (let index = 0; index < e.length; index++) {
if (e[index] == ".") Blo++;
if (e[0] != ".") {
let R = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "."];
if (R.includes(e[index])) {
if (e[index] == "." && Blo <= 1) {
Tom.push(e[index]);
} else {
if (e[index] != ".") {
Tom.push(e[index]);
}
}
}
}
}
console.log(ind);
console.log(this.expenditures.expenseDetailedParams);
this.expenditures.expenseDetailedParams[ind].unitPrice = Tom.join("");
//计算金额
const { unitPrice, quantity } =
this.expenditures.expenseDetailedParams[ind];
if (unitPrice && quantity) {
this.expenditures.expenseDetailedParams[ind].expenseAmount = (
Number(unitPrice) * Number(quantity)
).toFixed(2);
} else {
this.expenditures.expenseDetailedParams[ind].expenseAmount = 0;
}
this.totalCosts();
},
只有学会分享,技能才会有进步(*^▽^*)