Merge branch 'develop' into devTee

# Conflicts:
#	src/modules/09_leave/components/2_Leave/DetailLeave.vue

src/modules/09_leave/components/2_Leave/DetailLeave.vue

@@ -30,7 +30,7 @@ function saveData() {
         class="q-mr-sm"
         @click="router.push(`/leave-list`)"
       />
-      รายละเอียดการลาของ {{ paramsId }}
+      รายละเอียดการลาของ นายปิยรมย์ ศิริธาราฟ
     </div>
     <div>
       <q-btn

src/modules/09_leave/components/2_Leave/TableList.vue

@@ -118,7 +118,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
           v-for="col in props.cols"
           :key="col.name"
           :props="props"
-          @click.prevent="router.push(`/leave/detail/${props.row.name}`)"
+          @click.prevent="router.push(`/leave/detail/${props.row.id}`)"
         >
           <div v-if="col.name == 'no'">
             {{ props.rowIndex + 1 }}

src/modules/09_leave/components/2_Leave/ToolBar.vue

@@ -53,7 +53,6 @@ const { searchDataFn, filterOption } = leaveStore;
     <div class="col-xs-12 col-sm-3 col-md-2">
       <q-select
         for="selectStatus"
-        v-if="leaveStore.tab == '2'"
         emit-value
         map-options
         outlined
@@ -101,5 +100,3 @@ const { searchDataFn, filterOption } = leaveStore;
     </div>
   </div>
 </template>
-
-<style scoped></style>

src/modules/09_leave/interface/request/leave.ts

@@ -0,0 +1,10 @@
+interface ListsData {
+    id: string;
+    leaveType: string
+    name: string
+    Date: string
+    status: string
+}
+export type {
+    ListsData
+}

src/modules/09_leave/interface/request/specialTime.ts

@@ -0,0 +1,12 @@
+interface ListData {
+  id: string;
+  fullname: string | null;
+  date: string | null;
+  dateFix: string | null;
+  startTimeMorning: string | null;
+  endTimeMorning: string | null;
+  startTimeAfternoon: string | null;
+  endTimeAfternoon: string | null;
+  status: string;
+}
+export type { ListData };

src/modules/09_leave/interface/response/specialTime.ts

@@ -1,11 +1,10 @@
 interface DataRows {
+  id: string;
   fullname: string | null;
   date: string | null;
   dateFix: string | null;
-  type: string;
+  timeMorning: string;
-  reason: string;
+  timeAfternoon: string;
-  timeStamp: string;
+  status: string;
-  unapprove?: string; // Make these properties optional
-  approve?: string;
 }
 export type { DataRows };

src/modules/09_leave/stores/LeaveStore.ts

@@ -5,12 +5,12 @@ import { useCounterMixin } from "@/stores/mixin";
 import type { DataOption } from "@/modules/09_leave/interface/index/Main";
 import type { QTableProps } from "quasar";
 import type { DataRows } from "@/modules/09_leave/interface/response/leave";
+import type { ListsData } from "@/modules/09_leave/interface/request/leave";
 
 const mixin = useCounterMixin();
 const { date2Thai, showLoader, hideLoader } = mixin;
 export const useLeavelistDataStore = defineStore("leave", () => {
   //TABMENU
-  const tab = ref<string>("1");
   const amounttab1 = ref<number>(0);
   const amounttab2 = ref<number>(0);
   //ข้อมูลในตาราง
@@ -19,20 +19,19 @@ export const useLeavelistDataStore = defineStore("leave", () => {
   const columns = ref<QTableProps["columns"]>([]);
   const visibleColumns = ref<string[]>([]);
   const loadTable = ref<boolean>(false);
-  async function fetchList(data: DataRows[]) {
+  async function fetchList(data: ListsData[]) {
-    let datalist = data.map((e: DataRows) => ({
+    let datalist = data.map((e: ListsData) => ({
+      id: e.id,
       leaveType: e.leaveType,
       name: e.name,
-      Date: e.Date,
+      Date: date2Thai(e.Date),
       status: convertSatatus(e.status),
     }));
-    tab.value !== "1"
+    mainData.value = datalist.filter(
-      ? (mainData.value = datalist)
+      (e) => e.status === "อยู่ระหว่างดำเนินการ"
-      : (mainData.value = datalist.filter(
+    );
-          (e) => e.status === "อยู่ระหว่างกำเนินการ"
-        ));
     const filteramounttab1 = datalist.filter(
-      (e) => e.status === "อยู่ระหว่างกำเนินการ"
+      (e) => e.status === "อยู่ระหว่างดำเนินการ"
     );
     amounttab1.value = filteramounttab1.length;
     amounttab2.value = datalist.length;
@@ -162,16 +161,17 @@ export const useLeavelistDataStore = defineStore("leave", () => {
   // convertSatatus
   function convertSatatus(val: string) {
     switch (val) {
-      case "1":
+      case "NEW":
         return "ใหม่";
-      case "2":
+      case "PENDING":
-        return "อยู่ระหว่างกำเนินการ";
+        return "อยู่ระหว่างดำเนินการ";
-      case "3":
+      case "APPROVE":
         return "อนุมัติ";
+      case "REJECT":
+        return "ไม่อนุมัติ";
     }
   }
   return {
-    tab,
     amounttab1,
     amounttab2,
     //ข้อมูลในตาราง

src/modules/09_leave/stores/SpecialTimeStore.ts

@@ -2,6 +2,7 @@ import { defineStore } from "pinia";
 import { ref } from "vue";
 import type { QTableProps } from "quasar";
 import type { DataRows } from "@/modules/09_leave/interface/response/specialTime";
+import type { ListData } from "@/modules/09_leave/interface/request/specialTime";
 import { useCounterMixin } from "@/stores/mixin";
 const mixin = useCounterMixin();
 const { date2Thai } = mixin;
@@ -11,14 +12,21 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
   const selectDate = ref<Date | null>(new Date());
   const fiscalYear = ref<string | null>("0");
   const DataMainOrig = ref<DataRows[]>([]); // ข้อมูลหลักดั้งเดิม
-  async function fecthList(data: DataRows[]) {
+  async function fecthList(data: ListData[]) {
-    let datalist: DataRows[] = data.map((e: any) => ({
+    let datalist: DataRows[] = data.map((e: ListData) => ({
+      id: e.id,
       fullname: e.fullname,
       date: date2Thai(new Date(e.date)),
-      dateFix: date2Thai(new Date(e.dateFix)) + (e.timeStamp || ""),
+      dateFix: date2Thai(new Date(e.dateFix)),
-      type: e.type,
+      timeMorning:
-      reason: e.reason,
+        e.startTimeMorning == null
-      timeStamp: e.timeStamp,
+          ? "-"
+          : e.startTimeMorning + " - " + e.endTimeMorning,
+      timeAfternoon:
+        e.startTimeAfternoon == null
+          ? "-"
+          : e.startTimeAfternoon + " - " + e.endTimeAfternoon,
+      status: e.status,
     }));
     rows.value = datalist;
     DataMainOrig.value = datalist;
@@ -77,8 +85,8 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
     "fullname",
     "date",
     "dateFix",
-    "type",
+    "timeMorning",
-    "reason",
+    "timeAfternoon",
   ]);
 
   const columns = ref<QTableProps["columns"]>([
@@ -108,8 +116,6 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
       field: "date",
       headerStyle: "font-size: 14px",
       style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
     {
       name: "dateFix",
@@ -119,32 +125,27 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
       field: "dateFix",
       headerStyle: "font-size: 14px",
       style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
     {
-      name: "type",
+      name: "timeMorning",
       align: "left",
-      label: "ประเภท",
+      label: "ช่วงเช้า",
       sortable: true,
-      field: "type",
+      field: "timeMorning",
       headerStyle: "font-size: 14px",
       style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
     {
-      name: "reason",
+      name: "timeAfternoon",
       align: "left",
-      label: "เหตุผล",
+      label: "ช่วงบ่าย",
       sortable: true,
-      field: "reason",
+      field: "timeAfternoon",
       headerStyle: "font-size: 14px",
       style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
   ]);
+
   return {
     fecthList,
     rows,

src/modules/09_leave/views/LeaveListMain.vue

@@ -15,30 +15,34 @@ onMounted(() => {
 });
 // เรียกข้อมูลจาก API
 function fecthLeaveList() {
-  const data: DataRows = [
+  const data = [
     {
+      id: "00000000-0000-0000-0000-000000000000",
       leaveType: "ลาป่วย",
       name: "นายกัณฐิมา  กาฬสินธ์ุ",
-      Date: "",
+      Date: "2023-11-03",
-      status: "1",
+      status: "NEW",
     },
     {
+      id: "00000000-0000-0000-0000-000000000000",
       leaveType: "ลากิจส่วนตัว",
       name: "นายนครชัย วันดี",
-      Date: "",
+      Date: "2023-11-01",
-      status: "3",
+      status: "APPROVE",
     },
     {
+      id: "00000000-0000-0000-0000-000000000000",
       leaveType: "ลากิจส่วนตัว",
       name: "นายกัณฐิมา  กาฬสินธ์ุ",
-      Date: "",
+      Date: "2023-11-02",
-      status: "2",
+      status: "PENDING",
     },
     {
+      id: "00000000-0000-0000-0000-000000000000",
       leaveType: "ลาป่วย",
       name: "นายปิยรมย์ ศิริธาราฟ",
-      Date: "",
+      Date: "2023-11-01",
-      status: "2",
+      status: "PENDING",
     },
   ];
   fetchList(data); // ส่งข้อมูลไป stores
@@ -52,65 +56,9 @@ function changTab() {
 <template>
   <div class="toptitle text-dark col-12 row items-center">รายการลา</div>
   <div>
-    <!-- <q-card flat bordered class="col-12 q-mt-sm"> -->
+    <q-card flat bordered class="col-12 q-mt-sm q-pt-sm q-pa-md">
-    <q-card bordered flat>
+      <ToolBar />
-      <q-tabs
+      <TableList />
-        v-model="leaveStore.tab"
-        dense
-        align="left"
-        inline-label
-        class="rounded-borders"
-        indicator-color="primary"
-        active-bg-color="teal-1"
-        active-class="text-primary"
-      >
-        <q-tab
-          @click="changTab"
-          name="1"
-          label="รายการลาที่อยู่ระหว่างดำเนินการ"
-        >
-          <q-badge
-            color="grey-4"
-            :class="
-              leaveStore.tab == '1'
-                ? 'q-px-sm text-weight-medium text-primary q-ml-xl bg-teal-1'
-                : 'q-px-sm text-weight-medium text-black q-ml-xl'
-            "
-            :label="leaveStore.amounttab1"
-            rounded
-          />
-        </q-tab>
-        <q-tab @click="changTab" name="2" label="รายการลาทั้งหมด">
-          <q-badge
-            color="grey-4"
-            :class="
-              leaveStore.tab == '2'
-                ? 'q-px-sm text-weight-medium text-primary q-ml-xl bg-teal-1'
-                : 'q-px-sm text-weight-medium text-black q-ml-xl'
-            "
-            :label="leaveStore.amounttab2"
-            rounded
-          />
-        </q-tab>
-      </q-tabs>
-      <q-separator />
-
-      <q-tab-panels v-model="leaveStore.tab" animated>
-        <q-tab-panel name="1">
-          <!-- <TableList1 /> -->
-          <ToolBar />
-          <TableList />
-        </q-tab-panel>
-
-        <q-tab-panel name="2">
-          <!-- <TabList2Vue /> -->
-          <ToolBar />
-          <TableList />
-        </q-tab-panel>
-      </q-tab-panels>
-      <!-- </q-card> -->
     </q-card>
   </div>
 </template>
-
-<style scoped></style>

src/modules/09_leave/views/SpecialTimeMain.vue

@@ -3,7 +3,6 @@ import { onMounted, ref, useAttrs } from "vue";
 import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
-import Table from "@/modules/09_leave/components/4_specialTime/Table.vue";
 import { useSpecialTimeStore } from "@/modules/09_leave/stores/SpecialTimeStore";
 import DialogReason from "@/components/Dialogs/PopupReason.vue";
 
@@ -14,11 +13,6 @@ const $q = useQuasar(); // show dialog
 const mixin = useCounterMixin();
 const router = useRouter();
 const { hideLoader, monthYear2Thai } = mixin;
-const filter = ref<string>(""); //search data table
-const initialPagination = ref<Pagination>({
-  rowsPerPage: 0,
-});
-const attrs = ref<any>(useAttrs());
 const modalUnapprove = ref(false);
 const pagination = ref({
   // sortBy: "desc",
@@ -53,38 +47,51 @@ const resetFilter = () => {
 onMounted(async () => {
   fecthList([
     {
+      id: "00000000-0000-0000-0000-000000000000",
       fullname: "นางสาวณัฐกา ชมสิน",
-      date: "2023-10-30",
+      date: "2023-11-01 08:54",
       dateFix: "2023-10-30",
-      type: "Checkin",
+      startTimeMorning: "08:00",
-      reason: "ลืม",
+      endTimeMorning: "12:00",
-      unapprove: "1",
+      startTimeAfternoon: "08:00",
-      approve: "0",
+      endTimeAfternoon: "12:00",
-      timeStamp: "  08:00 น.",
+      status: "PENDING",
     },
     {
+      id: "00000000-0000-0000-0000-000000000000",
       fullname: "นางสาวรัชภรณ์ ภักดี",
-      date: "2023-10-30",
+      date: "2023-10-30 08:55",
-      dateFix: "2023-10-30",
+      dateFix: "2023-10-29",
-      type: "Checkin",
+      startTimeMorning: "08:00",
-      reason: "ลืม",
+      endTimeMorning: "12:00",
-      unapprove: "1",
+      startTimeAfternoon: null,
-      approve: "0",
+      endTimeAfternoon: null,
-      timeStamp: "   08:00 น.",
+      status: "APPROVE",
     },
     {
+      id: "00000000-0000-0000-0000-000000000000",
       fullname: "นางสาวภาพรรณ ลออ",
-      date: "2023-10-30",
+      date: "2023-10-31 18:54",
       dateFix: "2023-10-30",
-      type: "Checkin",
+      startTimeMorning: null,
-      reason: "ลืม",
+      endTimeMorning: null,
-      unapprove: "1",
+      startTimeAfternoon: "13:00",
-      approve: "0",
+      endTimeAfternoon: "16:30",
-      timeStamp: "   08:00 น.",
+      status: "REJECT",
     },
   ]);
-  await hideLoader();
 });
+
+const selectedDate = ref<string>("");
+const dateMonth = ref<any>({
+  month: new Date().getMonth(),
+  year: new Date().getFullYear(),
+});
+
+const monthYearThai = (val: any) => {
+  if (val == null) return "";
+  else return monthYear2Thai(val.month, val.year);
+};
 </script>
 
 <template>
@@ -92,8 +99,139 @@ onMounted(async () => {
     รายการลงเวลากรณีพิเศษ
   </div>
   <q-card flat bordered class="col-12 q-mt-sm q-pt-sm q-pa-md">
-    <div>
+    <div class="row col-12 q-col-gutter-sm q-mb-sm">
-      <Table
+      <div class="q-gutter-sm">
+        <datepicker
+          v-model="selectedDate"
+          :locale="'th'"
+          autoApply
+          month-picker
+          :enableTimePicker="false"
+        >
+          <template #year="{ year }">{{ year + 543 }}</template>
+          <template #year-overlay-value="{ value }">{{
+            parseInt(value + 543)
+          }}</template>
+          <template #trigger>
+            <q-input
+              :model-value="monthYearThai(dateMonth)"
+              dense
+              outlined
+              hide-bottom-space
+              style="width: 130px"
+            >
+              <template v-slot:prepend>
+                <q-icon
+                  name="event"
+                  class="cursor-pointer"
+                  style="color: var(--q-primary)"
+                >
+                </q-icon>
+              </template>
+            </q-input>
+          </template>
+        </datepicker>
+      </div>
+
+      <q-space />
+
+      <q-input
+        class="col-xs-12 col-sm-3 col-md-2"
+        standout
+        dense
+        v-model="filterKeyword"
+        ref="filterRef"
+        outlined
+        debounce="300"
+        placeholder="ค้นหา"
+      >
+        <template v-slot:append>
+          <q-icon v-if="filterKeyword == ''" name="search" />
+          <q-icon
+            v-if="filterKeyword !== ''"
+            name="clear"
+            class="cursor-pointer"
+            @click="resetFilter"
+          />
+        </template>
+      </q-input>
+
+      <q-select
+        v-model="dataSpecialTime.visibleColumns"
+        multiple
+        outlined
+        dense
+        options-dense
+        :display-value="$q.lang.table.columns"
+        emit-value
+        map-options
+        :options="dataSpecialTime.columns"
+        option-value="name"
+        options-cover
+        style="min-width: 150px"
+        class="col-xs-12 col-sm-3 col-md-2"
+      />
+    </div>
+
+    <div class="col-12">
+      <d-table
+        :columns="dataSpecialTime.columns"
+        :rows="dataSpecialTime.rows"
+        :filter="filterKeyword"
+        row-key="tb-list"
+        flat
+        bordered
+        :paging="true"
+        dense
+        v-model:pagination="pagination"
+        :visible-columns="dataSpecialTime.visibleColumns"
+      >
+        <template v-slot:header="props">
+          <q-tr :props="props">
+            <q-th v-for="col in props.cols" :key="col.name" :props="props">
+              <span class="text-weight-medium">{{ col.label }}</span>
+            </q-th>
+            <q-th auto-width />
+          </q-tr>
+        </template>
+        <template v-slot:body="props">
+          <q-tr :props="props" class="cursor-pointer">
+            <q-td v-for="col in props.cols" :key="col.name" :props="props">
+              <div v-if="col.name == 'no'">
+                {{ props.rowIndex + 1 }}
+              </div>
+              <div v-else>
+                {{ col.value }}
+              </div>
+            </q-td>
+            <q-td auto-width>
+              <q-btn
+                v-if="props.row.status == 'PENDING'"
+                color="orange"
+                class="q-px-md"
+                dense
+                unelevated
+                @click="unapprove(props.row.fullname)"
+                >ไม่อนุมัติ</q-btn
+              >
+
+              <q-btn
+                v-if="props.row.status == 'PENDING'"
+                color="primary"
+                class="q-px-md q-ml-sm"
+                dense
+                unelevated
+                >อนุมัติ</q-btn
+              >
+
+              <q-badge v-if="props.row.status == 'APPROVE'" rounded outline color="green" label="อนุมัติ" />
+              <q-badge v-if="props.row.status == 'REJECT'" rounded outline color="red" label="ไม่อนุมัติ" />
+            </q-td>
+          </q-tr>
+        </template>
+      </d-table>
+
+      <!-- <Table
         style="max-height: 80vh"
         :rows="dataSpecialTime.rows"
         :columns="dataSpecialTime.columns"
@@ -120,6 +258,7 @@ onMounted(async () => {
             </q-td>
             <q-td auto-width>
               <q-btn
+                v-if="props.row.status == 'PENDING'"
                 color="orange"
                 class="q-px-md"
                 dense
@@ -130,14 +269,19 @@ onMounted(async () => {
               <span>{{ props.row.unapprove }}</span>
             </q-td>
             <q-td auto-width>
-              <q-btn color="primary" class="q-px-md" dense unelevated
+              <q-btn
+                v-if="props.row.status == 'PENDING'"
+                color="primary"
+                class="q-px-md"
+                dense
+                unelevated
                 >อนุมัติ</q-btn
               >
               <span>{{ props.row.approve }}</span>
             </q-td>
           </q-tr>
         </template>
-      </Table>
+      </Table> -->
     </div>
   </q-card>
   <DialogReason

src/modules/11_discipline/components/1_Complaint/AddComplaintPage.vue

@@ -561,7 +561,6 @@ function onSubmit() {
                 lazy-rules
               />
             </div>
-            <div class="col-xs-12 col-sm-12"></div>
             <div class="col-xs-12 col-sm-12" id="petitioner">
               <q-input
                 for="inputPetitioner"
@@ -576,7 +575,6 @@ function onSubmit() {
                 rows="5"
               />
             </div>
-            <div class="col-xs-12 col-sm-6"></div>
             <div class="col-xs-12 col-sm-6" id="files">
               <q-file
                 for="inputFiles"