Merge branch 'develop' into warunee-dev

src/components/Dialogs/AddPersonal.vue

@@ -21,7 +21,7 @@ interface typeOp {
 }
 
 interface tableType {
-  id: string;
+  personId: string;
   idcard: string;
   prefix: string;
   firstName: string;
@@ -46,10 +46,6 @@ const typeOps = ref<typeOp[]>([
 
 /** รับค่ามาจาก หน้าหลัก */
 const props = defineProps({
-  checkId: {
-    type: Array,
-    default: [],
-  },
   modal: {
     type: Boolean,
     default: false,
@@ -67,6 +63,10 @@ const props = defineProps({
     type: String,
     default: "",
   },
+  selectedData: {
+    type: Array,
+    default: [],
+  },
   close: {
     type: Function,
     default: () => console.log("not function"),
@@ -145,10 +145,16 @@ async function searchInput() {
   }
 }
 
+
 /** update เมื่อเปลี่ยน option */
 function updateSelect() {
   search.value = "";
 }
+watch(()=>props.selectedData,()=>{
+  if(props.selectedData){
+    selected.value = props.selectedData
+  }
+})
 </script>
 
 <template>
@@ -214,7 +220,7 @@ function updateSelect() {
             ref="table"
             :columns="mainStore.columnsRespondent"
             :rows="rows"
-            row-key="personId"
+            row-key="idcard"
             flat
             bordered
             :paging="true"

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

@@ -53,27 +53,38 @@ function upLoadFile() {
 /** Form รายละเอียดข้อมูล*/
 const formData = reactive<FremData>({
   id: "", //Id การยื่นขอลา
+  reasonCommander: "", //เหตุผลผู้บังคับบัญชา
+  reasonOligarch: "", //เหตุผลผู้มีอำนาจ
+  positionName: "", //ตำแหน่งผู้ยื่นขอ
+  positionLevelName: "", //ระดับผู้ยื่นขอ
+  organizationName: "", //สังกัดผู้ยื่นขอ
   leaveTypeName: "", // Name ประเภทการลา
   leaveTypeId: "", //Id ประเภทการลา
   fullname: "", //คำนำหน้า ชื่อ นามสกุล คนขอลา
   dateSendLeave: new Date(), // วันที่ยืนใบลา
+  leaveDateStart: new Date(), //วันเริ่มการลา
+  leaveDateEnd: new Date(), //วันสิ้นสุดการลา
+  leaveCount: 0, //จำนวนวันลา
   status: "", //สถานะการของลา
   leaveLimit: 0, //โควต้าลา(แต่ละประเภท)หน่วยเป็นวัน
-  leaveTotal: 0, //ลาป่วยไปแล้ว(แต่ละประเภท)หน่วยเป็นวัน
+  leaveSummary: 0, //ลาป่วยไปแล้ว(แต่ละประเภท)หน่วยเป็นวัน
   leaveRemain: 0, //คงเหลือโควต้า(แต่ละประเภท)หน่วยเป็นวัน
-  leaveStartDate: new Date(), //*วัน เดือน ปีเริ่มต้นลา
+  // leaveStartDate: new Date(), //*วัน เดือน ปีเริ่มต้นลา
-  leaveEndDate: new Date(), //*วัน เดือน ปีสิ้นสุดลา
+  // leaveEndDate: new Date(), //*วัน เดือน ปีสิ้นสุดลา
   leaveWrote: "", //เขียนที่
   leaveAddress: "", //สถานที่ติดต่อขณะลา
   leaveNumber: "", //หมายเลขที่ติดต่อขณะลา
   leaveDetail: "", //รายละเอียดการลา
   leaveDocument: "", //อัปโหลดเอกสารประกอบรายละเอียด
-  leaveLast: new Date(), //ลาครั้งสุดท้ายในประเภทนั้น ๆ เมื่อวันที่(ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว)(Auto)
+  leaveDraftDocument: "", //อัปโหลดแบบฟอร์มการลา
-  leaveDateTotal: 0, //จำนวนวันที่ลา(Auto)
+  leaveLastStart: new Date(), //ลาครั้งสุดท้ายในประเภทนั้น ๆ เริ่มเมื่อวันที่(ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว)(Auto)
+  leaveLastEnd: new Date(), //ลาครั้งสุดท้ายในประเภทนั้น ๆ สิ้นสุดเมื่อวันที่(ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว)(Auto)
+  leaveTotal: 0, //จำนวนวันที่ลา(Auto)
   leavebirthDate: new Date(), //วันเดือนปีเกิด(Auto)
   leavegovernmentDate: new Date(), //วันที่เข้ารับราชการ(Auto)
   leaveSalary: 0, //เงินเดือนปัจจุบัน(Auto)
   leaveSalaryText: "", //เงินเดือนปัจจุบัน(เขียนเป็นคำอ่าน)
+  leaveTypeDay: "", //ประเภทการลาในวันนั้นเช่น
   wifeDayName: "", //ชื่อภรรยา(ลาไปช่วยเหลือภริยาที่คลอดบุตร)
   wifeDayDateBorn: new Date(), //วันที่คลอด(ลาไปช่วยเหลือภริยาที่คลอดบุตร)
   restDayOldTotal: 0, //จำนวนวันลาพักผ่อนสะสม จากปีที่ผ่านมา(ลาพักผ่อน)(Auto)
@@ -127,31 +138,40 @@ function fetchDetailLeave(paramsId: string) {
   console.log(data);
   data.map((e: any) => {
     formData.id = e.id;
+    formData.reasonCommander = e.reasonCommander;
+    formData.reasonOligarch = e.reasonOligarch;
+    formData.positionName = e.positionName;
+    formData.positionLevelName = e.positionLevelName;
+    formData.organizationName = e.organizationName;
     formData.leaveTypeName = e.leaveTypeName
       ? e.leaveTypeName
       : stores.convertLeave(e.leaveTypeId);
     formData.leaveTypeId = e.leaveTypeId;
     formData.fullname = e.fullname;
     formData.dateSendLeave = e.dateSendLeave && date2Thai(e.dateSendLeave);
+    formData.leaveDateStart = e.leaveDateStart && date2Thai(e.leaveDateStart);
+    formData.leaveDateEnd = e.leaveDateEnd && date2Thai(e.leaveDateEnd);
+    formData.leaveCount = e.leaveCount;
     formData.status = e.status && e.status;
     formData.leaveLimit = e.leaveLimit;
-    formData.leaveTotal = e.leaveTotal;
+    formData.leaveSummary = e.leaveSummary;
     formData.leaveRemain = e.leaveRemain;
-    formData.leaveStartDate = e.leaveStartDate && date2Thai(e.leaveStartDate);
-    formData.leaveEndDate = e.leaveEndDate && date2Thai(e.leaveEndDate);
-    formData.status = e.status;
     formData.leaveWrote = e.leaveWrote;
     formData.leaveAddress = e.leaveAddress;
     formData.leaveNumber = e.leaveNumber;
     formData.leaveDetail = e.leaveDetail;
     formData.leaveDocument = e.leaveDocument;
-    formData.leaveLast = e.leaveLast && date2Thai(e.leaveLast);
+    formData.leaveDraftDocument = e.leaveDraftDocument;
-    formData.leaveDateTotal = e.leaveDateTotal;
+    formData.leaveLastStart = e.leaveLastStart && date2Thai(e.leaveLastStart);
+    formData.leaveLastEnd = e.leaveLastStart && date2Thai(e.leaveLastEnd);
+    formData.leaveTotal = e.leaveTotal;
     formData.leavebirthDate = e.leavebirthDate && date2Thai(e.leavebirthDate);
     formData.leavegovernmentDate =
       e.leavegovernmentDate && date2Thai(e.leavegovernmentDate);
     formData.leaveSalary = e.leaveSalary;
     formData.leaveSalaryText = e.leaveSalaryText;
+    formData.leaveTypeDay =
+      e.leaveTypeDay && stores.convertLeaveDaytype(e.leaveTypeDay);
     formData.wifeDayName = e.wifeDayName;
     formData.wifeDayDateBorn =
       e.wifeDayDateBorn && date2Thai(e.wifeDayDateBorn);

src/modules/09_leave/components/3_Report/DetailReport.vue

@@ -0,0 +1,480 @@
+<script setup lang="ts">
+import { ref, computed } from "vue";
+import { useRoute } from "vue-router";
+
+import type {
+  DataDateMonthObject,
+  DataOption,
+} from "@/modules/09_leave/interface/index/Main";
+
+import { useCounterMixin } from "@/stores/mixin";
+const route = useRoute();
+
+const mixin = useCounterMixin();
+const { messageError, showLoader, hideLoader, date2Thai, monthYear2Thai } =
+  mixin;
+
+const typeReport = route.params.type.toString();
+const titleReport = computed(() => {
+  const title =
+    typeReport === "daily"
+      ? "รายงานสรุปบันทึกการลงเวลาปฏิบัติงานเป็นรายวัน"
+      : typeReport === "monthly"
+      ? "รายงานสรุปบันทึกการลงเวลาปฏิบัติงานเป็นรายเดือน"
+      : typeReport === "yearly"
+      ? "รายงานสรุปบันทึกการลงเวลาปฏิบัติงานเป็นรายปี"
+      : typeReport === "leaveday"
+      ? "บัญชีแสดงวันลา"
+      : "";
+  return title;
+});
+
+const date = ref<Date>(new Date());
+const dateMonth = ref<DataDateMonthObject>({
+  month: new Date().getMonth(),
+  year: new Date().getFullYear(),
+});
+const year = ref<number>(new Date().getFullYear());
+const dateStart = ref<Date>(new Date());
+const dateEnd = ref<Date>(new Date());
+const employeeClass = ref<string>("");
+
+function monthYearThai(val: DataDateMonthObject) {
+  if (val == null) return "";
+  else return monthYear2Thai(val.month, val.year);
+}
+
+const employeeClassMain = ref<DataOption[]>([
+  { id: "perm", name: "ลูกจ้างประจำ" },
+  { id: "temp", name: "ลูกจ้างชั่วคราว" },
+]);
+const employeeClassOption = ref<DataOption[]>(employeeClassMain.value);
+
+function filterFnOptions(val: any, update: Function) {
+  update(() => {
+    employeeClassOption.value = employeeClassMain.value.filter(
+      (v: DataOption) => v.name.indexOf(val) > -1
+    );
+  });
+}
+
+const splitterModel = ref(14);
+const numOfPages = ref<number>(0);
+const page = ref<number>(1);
+const pdfSrc = ref<any>();
+const modalFull = ref<boolean>(false);
+/** ไปหน้าต่อไปของรายงาน */
+function nextPage() {
+  if (page.value < numOfPages.value) {
+    page.value++;
+  }
+}
+
+/** กลับหน้าก่อนหน้าของรายงาน */
+function backPage() {
+  if (page.value !== 1) {
+    page.value--;
+  }
+}
+
+/** กลับหน้าหลัก */
+function backHistory() {
+  window.history.back();
+}
+</script>
+<template>
+  <div class="toptitle">
+    <q-btn
+      icon="mdi-arrow-left"
+      unelevated
+      round
+      dense
+      flat
+      color="primary"
+      class="q-mr-sm"
+      @click="backHistory"
+    />
+    {{ titleReport }}
+  </div>
+  <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
+    <div class="q-pa-md q-gutter-y-sm">
+      <q-toolbar style="padding: 0">
+        <div class="q-pr-xs" v-if="typeReport === 'daily'">
+          <datepicker
+            menu-class-name="modalfix"
+            v-model="date"
+            :locale="'th'"
+            autoApply
+            :enableTimePicker="false"
+            week-start="0"
+          >
+            <template #year="{ year }">{{ year + 543 }}</template>
+            <template #year-overlay-value="{ value }">{{
+              parseInt(value + 543)
+            }}</template>
+            <template #trigger>
+              <q-input
+                class="full-width inputgreen cursor-pointer"
+                outlined
+                dense
+                lazy-rules
+                borderless
+                :model-value="date ? date2Thai(date) : null"
+                :label="`${'วันที่'}`"
+              >
+                <template v-slot:prepend>
+                  <q-icon name="event" class="cursor-pointer" color="primary">
+                  </q-icon>
+                </template>
+              </q-input>
+            </template>
+          </datepicker>
+        </div>
+        <div class="q-pr-xs" v-if="typeReport === 'monthly'">
+          <datepicker
+            v-model="dateMonth"
+            :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
+                class="full-width inputgreen cursor-pointer"
+                outlined
+                dense
+                lazy-rules
+                borderless
+                :label="`${'เดือนที่'}`"
+                :model-value="monthYearThai(dateMonth)"
+              >
+                <template v-slot:prepend>
+                  <q-icon
+                    name="event"
+                    class="cursor-pointer"
+                    color="primary"
+                  ></q-icon>
+                </template>
+              </q-input>
+            </template>
+          </datepicker>
+        </div>
+        <div class="q-pr-xs" v-if="typeReport === 'yearly'">
+          <datepicker
+            menu-class-name="modalfix"
+            v-model="year"
+            class="col-2"
+            :locale="'th'"
+            autoApply
+            year-picker
+            :enableTimePicker="false"
+          >
+            <template #year="{ year }">{{ year + 543 }}</template>
+            <template #year-overlay-value="{ value }">{{
+              parseInt(value + 543)
+            }}</template>
+            <template #trigger>
+              <q-input
+                dense
+                lazy-rules
+                outlined
+                :model-value="Number(year) + 543"
+                :label="`${'ปีงบประมาณ'}`"
+              >
+                <template v-slot:prepend>
+                  <q-icon
+                    name="event"
+                    class="cursor-pointer"
+                    style="color: var(--q-primary)"
+                  >
+                  </q-icon>
+                </template>
+              </q-input>
+            </template>
+          </datepicker>
+        </div>
+
+        <div class="q-pl-xs" v-if="typeReport === 'leaveday'">
+          <datepicker
+            menu-class-name="modalfix"
+            v-model="dateStart"
+            :locale="'th'"
+            autoApply
+            :enableTimePicker="false"
+            week-start="0"
+          >
+            <template #year="{ year }">{{ year + 543 }}</template>
+            <template #year-overlay-value="{ value }">{{
+              parseInt(value + 543)
+            }}</template>
+            <template #trigger>
+              <q-input
+                class="full-width inputgreen cursor-pointer"
+                outlined
+                dense
+                lazy-rules
+                borderless
+                :model-value="dateStart ? date2Thai(dateStart) : null"
+                :label="`${'ตั้งเเต่วันที่'}`"
+              >
+                <template v-slot:prepend>
+                  <q-icon name="event" class="cursor-pointer" color="primary">
+                  </q-icon>
+                </template>
+              </q-input>
+            </template>
+          </datepicker>
+        </div>
+        <div class="q-pl-xs" v-if="typeReport === 'leaveday'">
+          <datepicker
+            menu-class-name="modalfix"
+            v-model="dateEnd"
+            :locale="'th'"
+            autoApply
+            :enableTimePicker="false"
+            week-start="0"
+          >
+            <template #year="{ year }">{{ year + 543 }}</template>
+            <template #year-overlay-value="{ value }">{{
+              parseInt(value + 543)
+            }}</template>
+            <template #trigger>
+              <q-input
+                class="full-width inputgreen cursor-pointer"
+                outlined
+                dense
+                lazy-rules
+                borderless
+                :model-value="dateEnd ? date2Thai(dateEnd) : null"
+                :label="`${'ถึงวันที่'}`"
+              >
+                <template v-slot:prepend>
+                  <q-icon name="event" class="cursor-pointer" color="primary">
+                  </q-icon>
+                </template>
+              </q-input>
+            </template>
+          </datepicker>
+        </div>
+
+        <q-space />
+        <div class="q-py-xs">
+          <q-btn unelevated color="primary" @click="modalFull = true">
+            <q-icon left size="2em" name="mdi-eye-outline" />
+            <div>แสดงรายงาน</div>
+          </q-btn>
+        </div>
+      </q-toolbar>
+
+      <q-toolbar
+        v-if="typeReport === 'leaveday'"
+        class="q-pa-sm bg-grey-2"
+        style="border-radius: 5px"
+      >
+        <div class="q-pr-xs">
+          <q-select
+            class="bg-white"
+            outlined
+            dense
+            v-model="employeeClass"
+            :options="employeeClassOption"
+            label="สถานภาพ"
+            emit-value
+            map-options
+            option-label="name"
+            option-value="id"
+            use-input
+            style="width: 230px"
+            @filter="(inputValue: any,
+      doneFn: Function) => filterFnOptions(inputValue, doneFn)"
+            ><template v-slot:no-option>
+              <q-item>
+                <q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
+              </q-item>
+            </template>
+          </q-select>
+        </div></q-toolbar
+      >
+      <q-splitter
+        v-model="splitterModel"
+        horizontal
+        style="
+          height: 70vh;
+          border: 1px solid rgb(210, 210, 210);
+          border-radius: 5px;
+        "
+        before-class="overflow-hidden disable"
+        separator-class="bg-white disabled"
+      >
+        <template v-slot:before>
+          <div class="q-px-sm">
+            <div class="row items-start items-center">
+              <div class="col">
+                <q-btn
+                  padding="xs"
+                  icon="mdi-chevron-left"
+                  color="grey-2"
+                  text-color="grey-5"
+                  size="md"
+                  class="my-auto"
+                  @click="backPage"
+                  :disable="page == 1"
+                />
+              </div>
+              <div class="col-12 col-md-auto">
+                <div class="q-pa-md flex">
+                  หน้าที่ {{ page }} จาก {{ numOfPages }}
+                </div>
+              </div>
+              <div class="col text-right">
+                <q-btn
+                  padding="xs"
+                  icon="mdi-chevron-right"
+                  color="grey-2"
+                  text-color="grey-5"
+                  size="md"
+                  @click="nextPage"
+                  :disable="page === numOfPages"
+                />
+              </div>
+            </div>
+          </div>
+        </template>
+        <template v-slot:after>
+          <div class="q-pa-md">
+            <VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
+          </div>
+        </template>
+        <template v-slot:default>
+          <div class="q-pa-md">
+            <div class="row items-start items-center">
+              <div class="col">
+                <q-btn
+                  padding="xs"
+                  icon="mdi-chevron-left"
+                  color="grey-2"
+                  text-color="grey-5"
+                  size="md"
+                  class="my-auto"
+                  @click="backPage"
+                  :disable="page == 1"
+                />
+              </div>
+
+              <div class="col-12 col-md-auto">
+                <div class="q-pa-md flex">
+                  หน้าที่ {{ page }} จาก {{ numOfPages }}
+                </div>
+              </div>
+              <div class="col text-right">
+                <q-btn
+                  padding="xs"
+                  icon="mdi-chevron-right"
+                  color="grey-2"
+                  text-color="grey-5"
+                  size="md"
+                  @click="nextPage"
+                  :disable="page === numOfPages"
+                />
+              </div>
+            </div>
+          </div>
+        </template>
+      </q-splitter>
+    </div>
+  </q-card>
+
+  <!-- Dialog Full Screen -->
+  <q-dialog
+    v-model="modalFull"
+    persistent
+    :maximized="true"
+    transition-show="slide-up"
+    transition-hide="slide-down"
+  >
+    <q-card class="bg-white">
+      <div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
+        <q-btn
+          icon="close"
+          unelevated
+          round
+          dense
+          style="color: #ff8080; background-color: #ffdede"
+          size="12px"
+          v-close-popup
+        />
+      </div>
+      <div class="q-pa-md">
+        <div class="row items-start items-center">
+          <div class="col">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-left"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              class="my-auto"
+              @click="backPage"
+              :disable="page == 1"
+            />
+          </div>
+          <div class="col-12 col-md-auto">
+            <div class="q-pa-md flex">
+              หน้าที่ {{ page }} จาก {{ numOfPages }}
+            </div>
+          </div>
+          <div class="col text-right">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-right"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              @click="nextPage"
+              :disable="page === numOfPages"
+            />
+          </div>
+        </div>
+        <div class="row items- items-center">
+          <VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
+        </div>
+        <div class="row items- items-end">
+          <div class="col">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-left"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              class="my-auto"
+              @click="backPage"
+              :disable="page == 1"
+            />
+          </div>
+          <div class="col-12 col-md-auto">
+            <div class="q-pa-md flex">
+              หน้าที่ {{ page }} จาก {{ numOfPages }}
+            </div>
+          </div>
+          <div class="col text-right">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-right"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              @click="nextPage"
+              :disable="page === numOfPages"
+            />
+          </div>
+        </div>
+      </div>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style scoped></style>

src/modules/09_leave/interface/index/Main.ts

@@ -6,4 +6,8 @@ interface DataOption2 {
   id: number;
   name: string;
 }
-export type { DataOption, DataOption2 };
+interface DataDateMonthObject {
+  month: number;
+  year: number;
+}
+export type { DataOption, DataOption2, DataDateMonthObject };

src/modules/09_leave/router.ts

@@ -1,6 +1,8 @@
 const workMain = () => import("@/modules/09_leave/views/WorkingMain.vue");
 const leaveMain = () => import("@/modules/09_leave/views/LeaveListMain.vue");
 const reportMain = () => import("@/modules/09_leave/views/ReportMain.vue");
+const reportDetail = () =>
+  import("@/modules/09_leave/components/3_Report/DetailReport.vue");
 const leaveDetail = () =>
   import("@/modules/09_leave/components/2_Leave/DetailLeave.vue");
 const leaveDetailReject = () =>
@@ -102,4 +104,14 @@ export default [
       Role: "coin",
     },
   },
+  {
+    path: "/statistics-report/:type",
+    name: "/statistics-report-detail",
+    component: reportDetail,
+    meta: {
+      Auth: true,
+      Key: [9],
+      Role: "coin",
+    },
+  },
 ];

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

@@ -40,8 +40,9 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
   const checkOutStatus = ref<String>("ปกติ");
 
   // paging
-  const year = ref<number>(2023);
+  const toDay = ref<Date>(new Date());
   const month = ref<number>(11);
+  const year = ref<number>(2023);
   const page = ref<number>(1);
   const total = ref<number>(0);
   const pageSize = ref<number>(10);

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

@@ -1,9 +1,66 @@
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { useRouter } from "vue-router";
+
+const router = useRouter();
+
+function nextPage(type: string,) {
+  router.push(`/statistics-report/${type}`);
+}
+</script>
 <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>
+    <q-card flat bordered class="col-12 q-mt-sm">
+      <div class="q-pa-md">
+        <q-item clickable dense class="hover-green" @click="nextPage('daily')">
+          <q-item-section avatar>
+            <q-icon color="primary" name="mdi-file" size="xs" />
+          </q-item-section>
+          <q-item-section class="text-dark">
+            รายงานสรุปบันทึกการลงเวลาปฏิบัติงานเป็นรายวัน
+          </q-item-section>
+        </q-item>
+
+        <q-item
+          clickable
+          dense
+          class="hover-green"
+          @click="nextPage('monthly')"
+        >
+          <q-item-section avatar>
+            <q-icon color="primary" name="mdi-file" size="xs" />
+          </q-item-section>
+          <q-item-section class="text-dark">
+            รายงานสรุปบันทึกการลงเวลาปฏิบัติงานเป็นรายเดือน
+          </q-item-section>
+        </q-item>
+
+        <q-item clickable dense class="hover-green" @click="nextPage('yearly')">
+          <q-item-section avatar>
+            <q-icon color="primary" name="mdi-file" size="xs" />
+          </q-item-section>
+          <q-item-section class="text-dark">
+            รายงานสรุปบันทึกการลงเวลาปฏิบัติงานเป็นรายปี
+          </q-item-section>
+        </q-item>
+
+        <q-item clickable dense class="hover-green" @click="nextPage('leaveday')">
+          <q-item-section avatar>
+            <q-icon color="primary" name="mdi-file" size="xs" />
+          </q-item-section>
+          <q-item-section class="text-dark"> บัญชีแสดงวันลา </q-item-section>
+        </q-item>
+      </div>
+    </q-card>
   </div>
 </template>
 
-<style scoped></style>
+<style lang="scss" scoped>
+.q-item.hover-green:hover {
+  background-color: #d5f1ee57;
+  border-radius: 2px;
+}
+.q-item.hover-green {
+  padding: 10px;
+}
+</style>

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

@@ -207,6 +207,7 @@ async function onSubmit(data: any) {
       messageError($q, e);
     })
     .finally(async () => {
+      getData();
       hideLoader();
     });
   // router.push(`/discipline/complaints`);

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

@@ -184,10 +184,9 @@ function onSubmit() {
     $q,
     async () => {
       if (mainStore.rowsAdd) {
-        formData.persons = mainStore.rowsAdd;
+        formData.persons = await mainStore.rowsAdd;
-        props.onSubmit(formData);
+      } 
-      } else props.onSubmit(formData);
+      await props.onSubmit(formData);
-      // props.onSubmit(formData);
       isSave.value = false;
     },
     "ยืนยันการบันทึกข้อมูล",
@@ -321,10 +320,10 @@ function getOc() {
  */
 function deletePerson(id: string) {
   // dialogRemove($q, () => {
-  changeFormData();
   const dataRow = mainStore.rowsAdd;
   const updatedRows = dataRow.filter((item: any) => item.personId !== id);
   mainStore.rowsAdd = updatedRows;
+  changeFormData();
   // });
 }
 
@@ -984,11 +983,11 @@ onMounted(() => {
   <!-- Popup ผู้ถูกร้องเรียน -->
   <DialogAddPersonal
     title="ผู้ถูกร้องเรียน"
-    :checkId="mainStore.rowsAdd"
     :modal="modal"
     btn-title="เพิ่มรายชื่อผู้ถูกร้องเรียน"
     :close="toggleModal"
     :save="addPerson"
+    :selected-data="mainStore.rowsAdd"
     @returnData="handleSave"
   />
 </template>

src/modules/11_discipline/components/2_InvestigateFacts/Form.vue

@@ -1302,7 +1302,7 @@ onMounted(async () => {
 
   <DialogAddPersonal
     title="ผู้ถูกร้องเรียน"
-    :checkId="mainStore.rowsAdd"
+    :mainData="mainStore.rowsAdd"
     :modal="modalPerson"
     btn-title="เพิ่มรายชื่อผู้ถูกร้องเรียน"
     :close="toggleModal"

src/modules/11_discipline/components/4_Result/DialogSendToCommand.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, computed, watchEffect, onMounted } from "vue";
+import { ref, computed, watchEffect, onMounted, watch } from "vue";
 import { useQuasar } from "quasar";
 import { useCounterMixin } from "@/stores/mixin";
 import type { QTableProps } from "quasar";
@@ -119,6 +119,7 @@ const columns2 = ref<QTableProps["columns"]>([
 ]);
 
 const props = defineProps({
+  data:Array,
   Modal: Boolean,
   closeModal: Function,
   getData: Function,
@@ -209,8 +210,15 @@ watchEffect(() => {
   }
 });
 
+watch(()=>props.data,()=>{
+  if(props.data){
+    const data = props.data.persons
+    console.log(data)
+  }
+})
 onMounted(async () => {
   await fecthTypeOption();
+  
 });
 </script>
 <template>

src/modules/11_discipline/components/4_Result/EditPage.vue

@@ -28,15 +28,6 @@ const route = useRoute();
 const id = ref<string>(route.params.id as string);
 const type = ref<string>("");
 
-/** ข้อมูล v-model ของฟอร์ม */
-const data = reactive<FormData>({
-  detail: "",
-});
-
-/** จำลองข้อมูลจาก api */
-const fetchData = async () => {
-  data.detail = "";
-};
 
 /**
  * บันทึกข้อมูลที่เเก้ไข
@@ -331,6 +322,7 @@ watch(
     v-model:Modal="modal"
     :closeModal="closeModal"
     :rows2="[]"
+    :data="dataResult"
     v-model:filterKeyword2="filterKeyword"
     :getData="getData"
     v-model:type="type"

src/modules/11_discipline/interface/response/investigate.ts

@@ -12,6 +12,20 @@ interface ListData {
 }
 
 interface ArrayPerson {
+  id:string
+  idcard:string
+  name:string
+  prefix:string
+  firstName:string
+  lastName:string
+  posNo:string
+  position:string
+  positionLevel:string
+  salary:number|null
+  organization:string
+}
+
+interface ArrayPersonAdd {
   personId:string
   idcard:string
   name:string
@@ -24,8 +38,9 @@ interface ArrayPerson {
   salary:number|null
   organization:string
 }
+
 interface ocListType{
   organizationId:string
   organizationName:string
 }
-export type { ListData,ArrayPerson,ocListType };
+export type { ListData,ArrayPerson,ocListType,ArrayPersonAdd };

src/modules/11_discipline/store/main.ts

@@ -2,7 +2,7 @@ import { defineStore } from "pinia";
 import type { QTableProps } from "quasar";
 import { ref } from "vue";
 import type { DataOption } from "@/modules/11_discipline/interface/index/Main";
-import type { ArrayPerson } from "@/modules/11_discipline/interface/response/investigate";
+import type { ArrayPerson, ArrayPersonAdd } from "@/modules/11_discipline/interface/response/investigate";
 
 export const useDisciplineMainStore = defineStore("disciplineMainStore", () => {
   /** option ผู้ถูกสอบสวน*/
@@ -278,6 +278,7 @@ export const useDisciplineMainStore = defineStore("disciplineMainStore", () => {
     rowsAdd.value = data;
   }
 
+
   return {
     complainantoptionsMain,
     convertFault,
@@ -292,7 +293,6 @@ export const useDisciplineMainStore = defineStore("disciplineMainStore", () => {
     visibleColumnsDirector,
     rowsAdd,
     fetchData,
-
     statusResultOptions,
     convertStatusResult,