diff --git a/src/pages/05_quotation/QuotationForm.vue b/src/pages/05_quotation/QuotationForm.vue
index d34002f7..787b971c 100644
--- a/src/pages/05_quotation/QuotationForm.vue
+++ b/src/pages/05_quotation/QuotationForm.vue
@@ -601,7 +601,7 @@ function printPDF() {
 </script>
 
 <template>
-  <div class="column surface-0">
+  <div class="column surface-0 fullscreen">
     <div class="color-bar">
       <div class="orange-segment"></div>
       <div class="yellow-segment"></div>
@@ -848,6 +848,7 @@ function printPDF() {
           v-model:pay-split="quotationFormData.paySplit"
           :readonly
           v-model:final-discount="quotationFormData.discount"
+          v-model:pay-bill-date="quotationFormData.payBillDate"
           v-model:summary-price="summaryPrice"
         />
       </div>
diff --git a/src/pages/05_quotation/QuotationFormInfo.vue b/src/pages/05_quotation/QuotationFormInfo.vue
index af967516..17450d1c 100644
--- a/src/pages/05_quotation/QuotationFormInfo.vue
+++ b/src/pages/05_quotation/QuotationFormInfo.vue
@@ -33,7 +33,10 @@ const urgent = defineModel<boolean>('urgent', {
   required: true,
   default: false,
 });
-const actor = defineModel<string>('actor', { required: true });
+const actor = defineModel<string>('actor', { required: false });
+const payBillDate = defineModel<Date | null | undefined>('payBillDate', {
+  required: false,
+});
 const workName = defineModel<string>('workName', { required: true });
 const contactor = defineModel<string>('contactor', { required: true });
 const telephone = defineModel<string>('telephone', { required: true });
@@ -154,6 +157,25 @@ function calculateInstallments(param: {
   }
 }
 
+function installmentsDate(date: Date | string) {
+  const firstPayDateObj = new Date(date);
+
+  paySplit.value = paySplit.value.map((pay, index) => {
+    if (index === 0) {
+      return pay;
+    }
+
+    // Create a new Date object to avoid mutating the original one
+    let updatedDate = new Date(firstPayDateObj);
+    updatedDate.setMonth(updatedDate.getMonth() + index);
+
+    return {
+      ...pay,
+      date: updatedDate.toISOString(),
+    };
+  });
+}
+
 watch(
   () => payType.value,
   (v) => {
@@ -169,9 +191,22 @@ watch(
   () => [paySplitCount.value, summaryPrice.value.finalPrice],
   ([newCount, _newF], [oldCount, _oldF]) => {
     calculateInstallments({ newCount: newCount || 0, oldCount: oldCount || 0 });
+    if (newCount !== oldCount) {
+      console.log('asdas');
+      paySplit.value[0].date && installmentsDate(paySplit.value[0].date);
+    }
   },
   { deep: true },
 );
+
+watch(
+  () => paySplit.value[0]?.date,
+  (firstPayDate, beforeDate) => {
+    if (firstPayDate && firstPayDate !== beforeDate) {
+      installmentsDate(firstPayDate);
+    }
+  },
+);
 </script>
 
 <template>
@@ -386,6 +421,7 @@ watch(
           v-if="payType === 'BillFull'"
           class="col-12"
           :label="$t('quotation.callDueDate')"
+          v-model="payBillDate"
         />
 
         <!-- <q-select