From 204a854a1cdb2e8d57ae9ae2899b6e155f81c8b7 Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Tue, 16 Jul 2024 03:23:45 +0000
Subject: [PATCH] fix: future birth date

---
 .../02_personnel-management/FormPerson.vue    | 13 +++++----
 src/utils/datetime.ts                         | 27 +++++++++++++++++++
 2 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/src/components/02_personnel-management/FormPerson.vue b/src/components/02_personnel-management/FormPerson.vue
index 7124f133..d61cc5db 100644
--- a/src/components/02_personnel-management/FormPerson.vue
+++ b/src/components/02_personnel-management/FormPerson.vue
@@ -1,9 +1,11 @@
 <script setup lang="ts">
-import useUserStore from 'src/stores/user';
 import useOptionStore from 'src/stores/options';
-import { dateFormat } from 'src/utils/datetime';
+import {
+  dateFormat,
+  calculateAge,
+  disabledAfterToday,
+} from 'src/utils/datetime';
 
-const userStore = useUserStore();
 const optionStore = useOptionStore();
 
 const firstName = defineModel<string>('firstName');
@@ -13,7 +15,7 @@ const lastNameEN = defineModel<string>('lastNameEN');
 const telephoneNo = defineModel<string>('telephoneNo');
 const email = defineModel<string>('email');
 const gender = defineModel<string>('gender');
-const birthDate = defineModel<Date | null>('birthDate');
+const birthDate = defineModel<Date | string | null>('birthDate');
 const nationality = defineModel<string>('nationality');
 
 defineProps<{
@@ -123,6 +125,7 @@ defineProps<{
       utc
       autoApply
       v-model="birthDate"
+      :disabled-dates="disabledAfterToday"
       :teleport="true"
       :dark="$q.dark.isActive"
       :locale="$i18n.locale === 'th-th' ? 'th' : 'en'"
@@ -168,7 +171,7 @@ defineProps<{
       readonly
       :label="$t('formDialogInputAge')"
       class="col-3"
-      :model-value="birthDate ? userStore.calculateAge(birthDate) : ''"
+      :model-value="birthDate ? calculateAge(birthDate) : ''"
     />
     <q-select
       v-if="employee"
diff --git a/src/utils/datetime.ts b/src/utils/datetime.ts
index a113e07f..1014988a 100644
--- a/src/utils/datetime.ts
+++ b/src/utils/datetime.ts
@@ -1,6 +1,7 @@
 import moment from 'moment';
 import 'moment/dist/locale/th';
 import 'moment/dist/locale/en-gb';
+import { useI18n } from 'vue-i18n';
 
 moment.locale('en-gb');
 
@@ -76,3 +77,29 @@ export function toISOStringWithTimezone(date: Date) {
     getTimezoneOffset(date)
   );
 }
+
+export function calculateAge(birthDate: Date | null | string) {
+  if (!birthDate) return null;
+  const { locale } = useI18n();
+
+  const birthDateTimeStamp = new Date(birthDate).getTime();
+  const now = new Date();
+  const diff = now.getTime() - birthDateTimeStamp;
+
+  const ageDate = new Date(diff);
+  const years = ageDate.getUTCFullYear() - 1970;
+  const months = ageDate.getUTCMonth();
+  const days = ageDate.getUTCDate() - 1;
+
+  if (locale.value === 'th-th') {
+    return `${years} ปี ${months !== 0 ? months + ' เดือน' : ''}  ${days !== 0 ? days + ' วัน' : ''} `;
+  } else {
+    return `${years} years ${months !== 0 ? months + ' months' : ''}  ${days !== 0 ? days + ' days' : ''} `;
+  }
+}
+
+export function disabledAfterToday(date: Date) {
+  const today = new Date();
+  today.setHours(0, 0, 0, 0);
+  return date > today;
+}