feat: computed and disable issue / expire date

src/components/03_customer-management/FormEmployeePassport.vue

@@ -618,6 +618,17 @@ watch(
           :id="`${prefixId}-date-picker-passport-issueance`"
           :label="$t('customerEmployee.form.passportIssueDate')"
           v-model="issueDate"
+          @update:model-value="
+            (v) => {
+              if (!v) return;
+              if (!expireDate) return;
+              if (new Date(v).getTime() >= new Date(expireDate).getTime()) {
+                const newValue = new Date(v);
+                newValue.setDate(newValue.getDate() + 1);
+                expireDate = newValue;
+              }
+            }
+          "
           class="col-6 col-md-3"
           :readonly="readonly"
           :rules="[
@@ -633,6 +644,11 @@ watch(
           :label="$t('customerEmployee.form.passportExpireDate')"
           v-model="expireDate"
           class="col-6 col-md-3"
+          :disabled-dates="
+            (date: Date) =>
+              date.getTime() <
+              ((issueDate && new Date(issueDate).getTime()) || Date.now())
+          "
           :readonly="readonly"
           :rules="[
             (val) =>

src/components/03_customer-management/FormEmployeeVisa.vue

@@ -304,6 +304,17 @@ watch(
               :readonly="readonly"
               :label="$t('customerEmployee.form.visaIssuance')"
               v-model="issueDate"
+              @update:model-value="
+                (v) => {
+                  if (!v) return;
+                  if (!expireDate) return;
+                  if (new Date(v).getTime() >= new Date(expireDate).getTime()) {
+                    const newValue = new Date(v);
+                    newValue.setDate(newValue.getDate() + 1);
+                    expireDate = newValue;
+                  }
+                }
+              "
               clearable
             />
           </div>
@@ -314,13 +325,19 @@ watch(
               :readonly="readonly"
               :label="$t('customerEmployee.form.visaExpire')"
               v-model="expireDate"
+              :disabled-dates="
+                (date: Date) =>
+                  date.getTime() <
+                  ((issueDate && new Date(issueDate).getTime()) || Date.now())
+              "
               clearable
             />
           </div>
           <div class="col">
             <DatePicker
               :id="`${prefixId}-date-picker-visa-issuance`"
-              :readonly="readonly"
+              :readonly
+              :disabled="!readonly"
               :label="$t('customerEmployee.form.visa90Day')"
               :model-value="calculatedVisaDate"
               clearable