fix: quotation pay split amount input behavior
This commit is contained in:
parent
cc8ef8c97b
commit
8e3ac4a264
1 changed files with 66 additions and 46 deletions
|
|
@ -20,7 +20,7 @@ defineEmits<{
|
||||||
(e: 'changePayType', type: PayCondition): void;
|
(e: 'changePayType', type: PayCondition): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const props = defineProps<{
|
defineProps<{
|
||||||
readonly?: boolean;
|
readonly?: boolean;
|
||||||
quotationNo?: string;
|
quotationNo?: string;
|
||||||
installmentNo?: number[];
|
installmentNo?: number[];
|
||||||
|
|
@ -111,42 +111,42 @@ function calculateInstallments(param: {
|
||||||
if (param.newCount !== null && param.oldCount !== null) {
|
if (param.newCount !== null && param.oldCount !== null) {
|
||||||
const totalAmount = summaryPrice.value.finalPrice;
|
const totalAmount = summaryPrice.value.finalPrice;
|
||||||
|
|
||||||
if (param.newCount > param.oldCount) {
|
// if (param.newCount > param.oldCount) {
|
||||||
const installmentAmount = +(totalAmount / param.newCount).toFixed(2);
|
// const installmentAmount = +(totalAmount / param.newCount).toFixed(2);
|
||||||
|
|
||||||
// Update existing
|
// // Update existing
|
||||||
paySplit.value.forEach((payment, i) => {
|
// paySplit.value.forEach((payment, i) => {
|
||||||
if (i !== param.customIndex) {
|
// if (i !== param.customIndex) {
|
||||||
payment.amount = installmentAmount;
|
// payment.amount = installmentAmount;
|
||||||
amount4Show.value[i] = installmentAmount.toString();
|
// amount4Show.value[i] = installmentAmount.toString();
|
||||||
}
|
// }
|
||||||
});
|
// });
|
||||||
|
|
||||||
// Add
|
// // Add
|
||||||
for (let i = param.oldCount; i < param.newCount; i++) {
|
// for (let i = param.oldCount; i < param.newCount; i++) {
|
||||||
paySplit.value.push({
|
// paySplit.value.push({
|
||||||
no: i + 1,
|
// no: i + 1,
|
||||||
amount: installmentAmount,
|
// amount: installmentAmount,
|
||||||
});
|
// });
|
||||||
amount4Show.value.push(installmentAmount.toString());
|
// amount4Show.value.push(installmentAmount.toString());
|
||||||
}
|
// }
|
||||||
} else if (param.newCount < param.oldCount) {
|
// } else if (param.newCount < param.oldCount) {
|
||||||
// Remove extra
|
// // Remove extra
|
||||||
paySplit.value.splice(param.newCount, param.oldCount - param.newCount);
|
// paySplit.value.splice(param.newCount, param.oldCount - param.newCount);
|
||||||
amount4Show.value.splice(param.newCount, param.oldCount - param.newCount);
|
// amount4Show.value.splice(param.newCount, param.oldCount - param.newCount);
|
||||||
|
|
||||||
// Recalculate
|
// // Recalculate
|
||||||
const installmentAmount = +(totalAmount / param.newCount).toFixed(2);
|
// const installmentAmount = +(totalAmount / param.newCount).toFixed(2);
|
||||||
paySplit.value.forEach((payment, i) => {
|
// paySplit.value.forEach((payment, i) => {
|
||||||
if (i !== param.customIndex) {
|
// if (i !== param.customIndex) {
|
||||||
payment.amount = installmentAmount;
|
// payment.amount = installmentAmount;
|
||||||
amount4Show.value[i] = installmentAmount.toString();
|
// amount4Show.value[i] = installmentAmount.toString();
|
||||||
}
|
// }
|
||||||
});
|
// });
|
||||||
} else if (param.newCount === param.oldCount) {
|
if (param.newCount === param.oldCount) {
|
||||||
if (param.customIndex !== undefined && param.customAmount !== undefined) {
|
if (param.customIndex !== undefined && param.customAmount !== undefined) {
|
||||||
paySplit.value[param.customIndex].amount = param.customAmount;
|
paySplit.value[param.customIndex].amount = param.customAmount;
|
||||||
amount4Show.value[param.customIndex] = param.customAmount.toString();
|
// amount4Show.value[param.customIndex] = param.customAmount.toString();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -159,8 +159,11 @@ function calculateInstallments(param: {
|
||||||
const remainingAmount = totalAmount - totalPreviousPayments;
|
const remainingAmount = totalAmount - totalPreviousPayments;
|
||||||
paySplit.value[paySplit.value.length - 1].amount =
|
paySplit.value[paySplit.value.length - 1].amount =
|
||||||
+remainingAmount.toFixed(2);
|
+remainingAmount.toFixed(2);
|
||||||
amount4Show.value[amount4Show.value.length - 1] =
|
amount4Show.value[amount4Show.value.length - 1] = commaInput(
|
||||||
(+remainingAmount.toFixed(2)).toString();
|
paySplit.value[paySplit.value.length - 1].amount.toString(),
|
||||||
|
);
|
||||||
|
// amount4Show.value[amount4Show.value.length - 1] =
|
||||||
|
// (+remainingAmount.toFixed(2)).toString();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -180,6 +183,15 @@ function calculateInstallments(param: {
|
||||||
// },
|
// },
|
||||||
// { deep: true },
|
// { deep: true },
|
||||||
// );
|
// );
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => paySplit.value,
|
||||||
|
() => {
|
||||||
|
amount4Show.value = paySplit.value.map((payment) =>
|
||||||
|
commaInput(payment.amount.toString()),
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -296,28 +308,36 @@ function calculateInstallments(param: {
|
||||||
:readonly="readonly || payType === 'Split'"
|
:readonly="readonly || payType === 'Split'"
|
||||||
class="col q-mx-sm"
|
class="col q-mx-sm"
|
||||||
:label="$t('quotation.amount')"
|
:label="$t('quotation.amount')"
|
||||||
:model-value="commaInput(period.amount.toString())"
|
:model-value="
|
||||||
|
amount4Show[i] || commaInput(period.amount.toString())
|
||||||
|
"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
debounce="500"
|
@blur="
|
||||||
@focus="(e) => (e.target as HTMLInputElement).select()"
|
() => {
|
||||||
|
period.amount = Number(amount4Show[i]?.replace(/,/g, ''));
|
||||||
|
if (period.amount % 1 === 0) {
|
||||||
|
const [, dec] = amount4Show[i].split('.');
|
||||||
|
if (!dec) {
|
||||||
|
amount4Show[i] += '.00';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
"
|
||||||
@update:model-value="
|
@update:model-value="
|
||||||
(v) => {
|
(v) => {
|
||||||
if (readonly) return;
|
if (readonly) return;
|
||||||
|
|
||||||
if (typeof v === 'string') amount4Show[i] = commaInput(v);
|
amount4Show[i] = commaInput(
|
||||||
const x = parseFloat(
|
v?.toString() || '0',
|
||||||
amount4Show[i] && typeof amount4Show[i] === 'string'
|
'string',
|
||||||
? amount4Show[i].replace(/,/g, '')
|
|
||||||
: '',
|
|
||||||
);
|
);
|
||||||
|
|
||||||
period.amount = precisionRound(x);
|
|
||||||
commaInput(period.amount.toString());
|
|
||||||
|
|
||||||
calculateInstallments({
|
calculateInstallments({
|
||||||
customIndex: i,
|
customIndex: i,
|
||||||
customAmount: x,
|
customAmount: parseFloat(
|
||||||
|
amount4Show[i].replace(/,/g, ''),
|
||||||
|
),
|
||||||
newCount: paySplit.length,
|
newCount: paySplit.length,
|
||||||
oldCount: paySplit.length,
|
oldCount: paySplit.length,
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue