chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Merge pull request #33 from Frappet/feat/custom-installments

Browse source 
feat: custom installment
This commit is contained in:
Methapon Metanipat 2024-10-31 13:42:25 +07:00 • committed by Methapon Metanipat
commit 3cace45c5e
6 changed files with 70 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/components/05_quotation/ProductItem.vue
View file

@ -13,6 +13,7 @@ import { useConfigStore } from 'stores/config';
const props = defineProps<{
readonly?: boolean;
agentPrice: boolean;
installmentInput?: boolean;
employeeRows?: {
foreignRefNo: string;
employeeName: string;
@ -228,7 +229,20 @@ watch(
flat
bordered
hide-pagination
:columns="columns"
:columns="
installmentInput
? [
...columns.slice(0, 1),
{
name: 'periodNo',
align: 'left',
label: 'quotation.periodNo',
field: (v) => v.product.code,
},
...columns.slice(1),
]
: columns
"
:rows="item.product"
class="full-width"
:no-data-label="$t('general.noDataTable')"
@ -248,6 +262,19 @@ watch(
<template #body="props">
<q-tr>
<q-td class="text-center">{{ props.rowIndex + 1 }}</q-td>
<q-td v-if="installmentInput">
<q-input
v-model="props.row.installmentNo"
:readonly
:bg-color="readonly ? 'transparent' : ''"
dense
min="0"
outlined
input-class="text-right"
type="number"
style="width: 60px"
></q-input>
</q-td>
<q-td>{{ props.row.product.code }}</q-td>
<q-td style="width: 100%">
<q-avatar class="q-mr-sm" size="md">

6
src/pages/05_quotation/QuotationForm.vue
View file

@ -113,6 +113,7 @@ const { data: config } = storeToRefs(configStore);
const refSelectZoneEmployee = ref<InstanceType<typeof SelectZone>>();
const mrz = ref<Awaited<ReturnType<typeof parseResultMRZ>>>();
const toggleWorker = ref(true);
const tempPaySplitCount = ref(0);
const currentQuotationId = ref<string | undefined>(undefined);
const date = ref();
const preSelectedWorker = ref<Employee[]>([]);
@ -598,6 +599,7 @@ function convertToTable(nodes: Node[]) {
quotationFormData.value.paySplitCount = Math.max(
...list.map((v) => v.installmentNo || 0),
);
tempPaySplitCount.value = quotationFormData.value.paySplitCount;
list.forEach((v) => {
v.amount = Math.max(selectedWorker.value.length, 1);
@ -1168,6 +1170,9 @@ const view = ref<View>(View.Quotation);
</template>
<div class="surface-1 q-pa-md full-width">
<ProductItem
:installment-input="
quotationFormData.payCondition === 'SplitCustom'
"
:readonly="readonly"
:agent-price="agentPrice"
:employee-rows="
@ -1223,6 +1228,7 @@ const view = ref<View>(View.Quotation);
<QuotationFormInfo
:view="view"
:installment-no="selectedInstallmentNo"
:pay-split-fixed="tempPaySplitCount"
v-model:pay-type="quotationFormData.payCondition"
v-model:pay-bank="payBank"
v-model:pay-split-count="quotationFormData.paySplitCount"

45
src/pages/05_quotation/QuotationFormInfo.vue
View file

@ -25,10 +25,11 @@ enum View {
Complete,
}
defineProps<{
const props = defineProps<{
readonly?: boolean;
quotationNo?: string;
installmentNo?: number[];
paySplitFixed?: number;
view?: View;
data?: {
total: number;
@ -56,9 +57,10 @@ const payType = defineModel<
const paySplitCount = defineModel<number | null>('paySplitCount', {
default: 1,
});
const paySplit = defineModel<{ no: number; amount: number }[]>('paySplit', {
required: true,
});
const paySplit = defineModel<{ no: number; name?: string; amount: number }[]>(
'paySplit',
{ required: true },
);
const summaryPrice = defineModel<{
totalPrice: number;
totalDiscount: number;
@ -87,6 +89,10 @@ const payTypeOption = computed(() => [
value: 'Split',
label: t('quotation.type.installmentsCash'),
},
{
value: 'SplitCustom',
label: t('quotation.type.installmentsCustomCash'),
},
]);
const amount4Show = ref<string[]>([]);
@ -160,12 +166,8 @@ function calculateInstallments(param: {
watch(
() => payType.value,
(v) => {
if (!payType.value) return;
if (v === 'Split' || v === 'BillSplit') {
if (paySplitCount.value === 0) paySplitCount.value = 1;
} else {
paySplitCount.value = 0;
paySplit.value = [];
if (v === 'Split' && props.paySplitFixed) {
paySplitCount.value = props.paySplitFixed;
}
},
);
@ -177,8 +179,9 @@ watch(
paySplitCount.value === 0 ||
!paySplitCount.value ||
!summaryPrice.value.finalPrice
)
) {
return;
}
calculateInstallments({ newCount: newCount || 0, oldCount: oldCount || 0 });
},
{ deep: true },
@ -218,7 +221,7 @@ watch(
<div
class="col-6"
v-if="payType === 'Split' || payType === 'BillSplit'"
v-if="payType === 'Split' || payType === 'SplitCustom'"
>
<div class="row full-width items-center justify-between q-py-xs">
<div class="column">
@ -239,7 +242,7 @@ watch(
</div>
<q-input
v-model="paySplitCount"
:readonly
:readonly="readonly || payType === 'Split'"
class="col-3"
type="number"
dense
@ -252,12 +255,12 @@ watch(
</section>
<section
v-if="payType === 'Split' || payType === 'BillSplit'"
v-if="payType === 'Split' || payType === 'SplitCustom'"
class="col-12 text-caption"
style="padding-left: 20px"
>
<template
v-for="(period, i) in !!installmentNo
v-for="(period, i) in installmentNo?.length > 0
? paySplit.filter((value) => installmentNo?.includes(value.no))
: paySplit"
:key="period.no"
@ -268,7 +271,16 @@ watch(
>
{{ `${$t('quotation.periodNo')} ${i + 1}` }}
<q-input
:readonly
:readonly="readonly"
:label="$t('general.name')"
v-if="payType === 'SplitCustom'"
v-model="period.name"
class="col q-mx-sm"
dense
outlined
/>
<q-input
:readonly="readonly || payType === 'Split'"
class="col q-mx-sm"
:label="$t('quotation.amount')"
:model-value="commaInput(period.amount.toString())"
@ -323,6 +335,7 @@ watch(
</div>
</div>
</div>
<div class="col">
<div class="bordered-b q-px-md q-py-sm row bg-color-light items-center">
<div class="icon-wrapper bg-color q-mr-sm">

1
src/pages/05_quotation/form.ts
View file

@ -136,6 +136,7 @@ export const useQuotationForm = defineStore('form-quotation', () => {
paySplit: data.paySplit.map((p, index) => ({
no: index + 1,
invoiceId: p.invoiceId,
name: p.name,
amount: p.amount,
})),
worker: data.worker.map((v) =>

3
src/stores/quotations/index.ts
View file

@ -73,6 +73,7 @@ export const useQuotationStore = defineStore('quotation-store', () => {
const res = await api.post('/quotation', {
...payload,
paySplit: data.paySplit.map((v) => ({
name: v.name,
amount: v.amount,
})),
productServiceList: data.productServiceList.map((v) => ({
@ -108,6 +109,7 @@ export const useQuotationStore = defineStore('quotation-store', () => {
const res = await api.put(`/quotation/${data.id}`, {
...payload,
paySplit: data.paySplit.map((v) => ({
name: v.name,
amount: v.amount,
})),
productServiceList: payload.productServiceList.map((v) => ({
@ -119,6 +121,7 @@ export const useQuotationStore = defineStore('quotation-store', () => {
workId: v.work?.id,
serviceId: v.service?.id,
workerIndex: v.workerIndex,
installmentNo: v.installmentNo,
})),
id: undefined,
});

4
src/stores/quotations/types.ts
View file

@ -207,6 +207,7 @@ export type Quotation = {
no: number;
invoiceId: string;
amount: number;
name?: string;
}[];
payCondition:
| 'Full'
@ -290,6 +291,7 @@ export type QuotationFull = {
paySplit: {
no: number;
amount: number;
name?: string;
invoice: Invoice;
invoiceId: string;
}[];
@ -352,7 +354,7 @@ export type QuotationPayload = {
_count: { worker: number };
discount?: number;
payBillDate?: Date | null;
paySplit: { no: number; amount: number; invoice?: boolean }[];
paySplit: { no: number; amount: number; name?: string; invoice?: boolean }[];
paySplitCount?: number | null; // int
payCondition:
| 'Full'