เพิ่มประเภท

src/modules/09_leave/views/06_ReportMain.vue

@@ -45,9 +45,19 @@ const dateMonth = ref<DataDateMonthObject>({
   year: new Date().getFullYear(),
 });
 
+const dateWeek = ref<Date[]>(getCurrentWeek());
+
 const typeReport = ref<string>("");
 const optionReport = ref<DataOption[]>([]);
 const optionReportMain = ref<DataOption[]>([
+  {
+    id: "3",
+    name: "รายงานการเข้างาน",
+  },
+  {
+    id: "4",
+    name: "รายงานการเข้างานสาย",
+  },
   { id: "1", name: "รายงานการลางานตามประเภทการลา" },
   {
     id: "2",
@@ -64,6 +74,7 @@ const employeeClassMain = ref<DataOption[]>([
 const yearTypeOptionMain = ref<DataOption[]>([
   { id: "FULL", name: "รายปี" },
   { id: "MONTH", name: "รายเดือน" },
+  { id: "WEEKLY", name: "รายสัปดาห์" },
   { id: "FIRSTHAFT", name: "ครึ่งปีแรก" },
   { id: "SECONDHAFT", name: "ครึ่งปีหลัง" },
 ]);
@@ -129,6 +140,14 @@ async function updateLeaveday() {
       dateEnd.value = new Date(dateMonth.value.year, mount, 0);
       break;
 
+    case "WEEKLY":
+      const startOfWeek = new Date(dateWeek.value[0]); // ใช้ค่า index 0 เป็นวันเริ่มต้น
+      const endOfWeek = new Date(dateWeek.value[1]);
+
+      dateStart.value = startOfWeek;
+      dateEnd.value = endOfWeek;
+      break;
+
     case "FIRSTHAFT":
       dateStart.value = new Date(year.value - 1, 9, 1);
       dateEnd.value = new Date(year.value, 2, 31);
@@ -170,7 +189,14 @@ async function fetchLeaveday(
   endDate: Date
 ) {
   const body = {
-    type: year === "FULL" ? "FULL" : year === "MONTH" ? "MONTH" : "HAFT",
+    type:
+      year === "FULL"
+        ? "FULL"
+        : year === "MONTH"
+        ? "MONTH"
+        : year == "HAFT"
+        ? "HAFT"
+        : "WEEKLY",
     startDate: dateToISO(startDate),
     endDate: dateToISO(endDate),
     nodeId: nodeId.value,
@@ -180,7 +206,11 @@ async function fetchLeaveday(
   const pathAPI =
     typeReport.value === "1"
       ? config.API.leaveReportLeaveday(type)
-      : config.API.leaveReportLeave2(type);
+      : typeReport.value === "2"
+      ? config.API.leaveReportLeave2(type)
+      : typeReport.value === "3"
+      ? config.API.leaveReportTimeRecords(type)
+      : config.API.leaveReportTimeLate(type);
 
   await http
     .post(pathAPI, body)
@@ -298,6 +328,23 @@ function onSearch() {
   );
 }
 
+/** ฟังก์ชันคำนวณวันเริ่มต้นและวันสิ้นสุดของสัปดาห์นี้ */
+function getCurrentWeek() {
+  const today = new Date();
+  const firstDayOfWeek = new Date(today);
+  firstDayOfWeek.setDate(today.getDate() - today.getDay() + 1); // วันจันทร์
+  const lastDayOfWeek = new Date(today);
+  lastDayOfWeek.setDate(today.getDate() - today.getDay() + 7); // วันอาทิตย์
+  return [firstDayOfWeek, lastDayOfWeek];
+}
+
+function formatWeekDisplay(week: Date[]) {
+  if (week) {
+    if (!week[0] || !week[1]) return "";
+    return `${date2Thai(week[0])} - ${date2Thai(week[1])}`;
+  }
+}
+
 onMounted(() => {
   fetchDataTree();
 });
@@ -561,7 +608,10 @@ onMounted(() => {
                         >
                         </q-select>
                       </div>
-                      <div class="col-12" v-if="yearType !== 'MONTH'">
+                      <div
+                        class="col-12"
+                        v-if="yearType !== 'MONTH' && yearType !== 'WEEKLY'"
+                      >
                         <datepicker
                           v-model="year"
                           :locale="'th'"
@@ -594,7 +644,10 @@ onMounted(() => {
                           </template>
                         </datepicker>
                       </div>
-                      <div class="col-12" v-if="yearType !== 'MONTH'">
+                      <div
+                        class="col-12"
+                        v-if="yearType !== 'MONTH' && yearType !== 'WEEKLY'"
+                      >
                         <datepicker
                           menu-class-name="modalfix"
                           v-model="dateStart"
@@ -631,7 +684,10 @@ onMounted(() => {
                           </template>
                         </datepicker>
                       </div>
-                      <div class="col-12" v-if="yearType !== 'MONTH'">
+                      <div
+                        class="col-12"
+                        v-if="yearType !== 'MONTH' && yearType !== 'WEEKLY'"
+                      >
                         <datepicker
                           menu-class-name="modalfix"
                           v-model="dateEnd"
@@ -698,6 +754,37 @@ onMounted(() => {
                           </template>
                         </datepicker>
                       </div>
+                      <div class="col-12" v-if="yearType == 'WEEKLY'">
+                        <datepicker
+                          v-model="dateWeek"
+                          :locale="'th'"
+                          autoApply
+                          :enableTimePicker="false"
+                          @update:model-value="updateLeaveday"
+                          week-picker
+                        >
+                          <template #year="{ year }">{{ year + 543 }}</template>
+                          <template #year-overlay-value="{ value }">{{
+                            parseInt(value + 543)
+                          }}</template>
+                          <template #trigger>
+                            <q-input
+                              class="bg-white"
+                              dense
+                              :label="`${'รายสัปดาห์'}`"
+                              :model-value="formatWeekDisplay(dateWeek)"
+                            >
+                              <template v-slot:prepend>
+                                <q-icon
+                                  name="event"
+                                  class="cursor-pointer"
+                                  color="primary"
+                                ></q-icon>
+                              </template>
+                            </q-input>
+                          </template>
+                        </datepicker>
+                      </div>
                     </div>
                   </div>
                 </q-card-section>
@@ -710,7 +797,13 @@ onMounted(() => {
                     unelevated
                     color="public"
                     type="submit"
-                    :disable="typeReport && typeReport == '2' && org"
+                    :disable="
+                      typeReport &&
+                      (typeReport == '2' ||
+                        typeReport == '3' ||
+                        typeReport == '4') &&
+                      org
+                    "
                   />
                 </q-card-actions>
               </q-card>