Merge branch 'develop' into devTee

2024-12-24 13:18:29 +07:00 · 2024-12-24 13:18:29 +07:00 · f47cfae539
commit f47cfae539
parent d6d8f8b9e9 ed0cdc7378
6 changed files with 96 additions and 136 deletions
--- a/src/modules/09_leave/components/02_WorkList/DialogDetail.vue
+++ b/src/modules/09_leave/components/02_WorkList/DialogDetail.vue
@ -147,8 +147,9 @@ watch(
    <q-card style="width: 950px; max-width: 80vw">
      <q-toolbar>
        <q-toolbar-title class="text-subtitle1 text-weight-bold">
-          <span style="margin-right: 0"> รายละเอียดการลงเวลาของ</span>
-          <span class="text-primary">{{ formData.fullName }}</span>
+          <span style="margin-right: 0"> รายละเอียดการลงเวลา</span>
+
+          <span class="text-primary q-pl-sm">{{ formData.fullName }}</span>
        </q-toolbar-title>
        <q-btn
          for="closeDialog"
--- a/src/modules/09_leave/components/02_WorkList/DialogEdit.vue
+++ b/src/modules/09_leave/components/02_WorkList/DialogEdit.vue
@ -130,7 +130,7 @@ watch(
            สถานะช่วงเช้า
            <q-select
              ref="morningStatusRef"
-              class="q-pa-sm"
+              class="q-pa-sm inputgreen"
              dense
              outlined
              v-model="morningStatus"
@ -165,7 +165,7 @@ watch(

            <q-select
              ref="afternoonStatusRef"
-              class="q-pa-sm"
+              class="q-pa-sm inputgreen"
              dense
              outlined
              v-model="afternoonStatus"
@ -192,6 +192,7 @@ watch(

        <q-card flat class="col-12 q-mt-sm">
          <q-input
+            class="inputgreen"
            outlined
            dense
            v-model="reason"
--- a/src/modules/09_leave/components/03_ChangeRound/DialogForm.vue
+++ b/src/modules/09_leave/components/03_ChangeRound/DialogForm.vue
@ -232,7 +232,7 @@ watch(
          />
        </q-toolbar>
        <div v-if="props.editCheck === 'edit'">
-          <q-separator color="grey-4" />
+          <q-separator />
          <q-card-section style="max-height: 50vh" class="scroll q-pa-none">
            <div class="q-pa-md">
              <div class="row">
@ -270,10 +270,12 @@ watch(
                    :borderless="true"
                    outlined
                    style="width: 23.5rem"
+                    class="inputgreen"
                  />
                </div>
                <div class="col-6">
                  <datepicker
+                    class="inputgreen"
                    menu-class-name="modalfix"
                    v-model="formData.effectiveDate"
                    :locale="'th'"
@ -326,6 +328,7 @@ watch(

                <div class="col-12">
                  <q-input
+                    class="inputgreen"
                    outlined
                    stack-label
                    ref="resonRef"
@ -340,20 +343,18 @@ watch(
            </div>
          </q-card-section>
        </div>
-        <q-separator color="grey-4" />
-        <div class="q-pa-xs">
-          <div class="row justify-end q-mr-sm q-py-sm">
-            <q-btn
-              v-if="props.editCheck === 'edit'"
-              id="onSubmit"
-              type="submit"
-              unelevated
-              label="บันทึก"
-              class="q-px-md items-center"
-              color="secondary"
-            />
-          </div>
-        </div>
+        <q-separator />
+        <q-card-actions align="right">
+          <q-btn
+            v-if="props.editCheck === 'edit'"
+            id="onSubmit"
+            type="submit"
+            unelevated
+            label="บันทึก"
+            class="q-px-md items-center"
+            color="secondary"
+          />
+        </q-card-actions>
      </form>
      <div v-if="props.editCheck === 'history'">
        <div class="q-pa-md">
--- a/src/modules/09_leave/components/04_SpecialTime/DialogApprove.vue
+++ b/src/modules/09_leave/components/04_SpecialTime/DialogApprove.vue
@ -7,10 +7,8 @@ import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
 import { useSpecialTimeStore } from "@/modules/09_leave/stores/SpecialTimeStore";

-import type {
-  dataRowRound,
-  MyObjectRoundRef,
-} from "@/modules/09_leave/interface/response/specialTime";
+import type { dataRowRound } from "@/modules/09_leave/interface/response/specialTime";
+import type { DataOption } from "@/modules/09_leave/interface/index/Main";

 import DialogHeader from "@/components/DialogHeader.vue";

@ -19,7 +17,7 @@ const $q = useQuasar();
 const SpecialTimeStore = useSpecialTimeStore();
 const mixin = useCounterMixin();
 const { dialogConfirm, showLoader, success, messageError, hideLoader } = mixin;
-const option = ref<any[]>(SpecialTimeStore.optionStatus);
+const option = ref<DataOption[]>(SpecialTimeStore.optionStatus);

 /** props*/
 const props = defineProps({
@ -32,14 +30,9 @@ const props = defineProps({
  checkOutStatus: { type: String, default: "" },
  closeDialog: { type: Function, default: () => {} },
  detailData: Object,
+  fetchData: { type: Function, default: () => {} },
 });

-const checkInRef = ref<Object | null>(null);
-const checkOutRef = ref<Object | null>(null);
-const checkInStatusRef = ref<Object | null>(null);
-const checkOutStatusRef = ref<Object | null>(null);
-const reasonRef = ref<Object | null>(null);
-
 const formData = reactive<dataRowRound>({
  checkIn: "",
  checkOut: "",
@ -50,73 +43,35 @@ const formData = reactive<dataRowRound>({
  checkOutEdit: false,
 });

-const objectRound: MyObjectRoundRef = {
-  checkIn: checkInRef,
-  checkOut: checkOutRef,
-  checkInStatus: checkInStatusRef,
-  checkOutStatus: checkOutStatusRef,
-  note: reasonRef,
-};
-
-/** function validateFom*/
-function validateForm() {
-  const hasError = [];
-  for (const key in objectRound) {
-    if (Object.prototype.hasOwnProperty.call(objectRound, key)) {
-      const property = objectRound[key];
-      if (property.value && typeof property.value.validate === "function") {
-        const isValid = property.value.validate();
-        hasError.push(isValid);
-      }
-    }
-  }
-  if (hasError.every((result) => result === true)) {
-    onSubmit();
-  }
-}
-
 /** function confrim*/
-function onSubmit() {
-  dialogConfirm(
-    $q,
-    async () => {
-      await approveData();
-      props.closeDialog?.();
-    },
-    "ยืนยันการบันทึกข้อมูล",
-    "ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
-  );
-}
-
-/** function บันทึกข้อมูล*/
-async function approveData() {
-  showLoader();
-  const body = {
-    checkInTime: formData.checkIn,
-    checkOutTime: formData.checkOut,
-    checkInStatus: formData.checkInStatus,
-    checkOutStatus: formData.checkOutStatus,
-    reason: formData.note,
-  };
-  await http
-    .put(config.API.specialTimeApprove(props.id), body)
-    .then(() => {
-      success($q, "บันทึกข้อมูลสำเร็จ");
-    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(async () => {
-      SpecialTimeStore.fetchData();
-      hideLoader();
-    });
+async function onSubmit() {
+  dialogConfirm($q, async () => {
+    showLoader();
+    await http
+      .put(config.API.specialTimeApprove(props.id), {
+        checkInTime: formData.checkIn,
+        checkOutTime: formData.checkOut,
+        checkInStatus: formData.checkInStatus,
+        checkOutStatus: formData.checkOutStatus,
+        reason: formData.note,
+      })
+      .then(async () => {
+        await props.fetchData();
+        success($q, "บันทึกข้อมูลสำเร็จ");
+        props.closeDialog?.();
+      })
+      .catch((e) => {
+        messageError($q, e);
+      })
+      .finally(async () => {
+        hideLoader();
+      });
+  });
 }

 /** function closeDialog*/
 function close() {
-  if (props.closeDialog) {
-    props.closeDialog();
-  }
+  props.closeDialog();
 }

 /**
@ -127,7 +82,7 @@ function close() {
 function filterOptionFn(val: string, update: Function) {
  update(() => {
    option.value = SpecialTimeStore.optionStatus.filter(
-      (e: any) => e.name.search(val) !== -1
+      (e: DataOption) => e.name.search(val) !== -1
    );
  });
 }
@ -176,7 +131,7 @@ watch(
 <template>
  <q-dialog v-model="props.modal" persistent>
    <q-card style="width: 350px" class="bg-grey-11">
-      <form @submit.prevent="validateForm">
+      <q-form greedy @submit.prevent @validation-success="onSubmit">
        <DialogHeader
          :tittle="
            props.editCheck === 'PENDING'
@ -269,7 +224,10 @@ watch(
                option-label="name"
                label="สถานะ"
                use-input
+                hide-selected
+                fill-input
                @filter="filterOptionFn"
+                class="inputgreen"
              >
                <template v-slot:no-option>
                  <q-item>
@ -302,19 +260,30 @@ watch(
                hide-bottom-space
                full-width
                v-model="formData.checkOutStatus"
-                :options="SpecialTimeStore.optionStatus"
+                :options="option"
                option-value="id"
                option-label="name"
                label="สถานะ"
                use-input
+                hide-selected
+                fill-input
+                class="inputgreen"
+                @filter="filterOptionFn"
              >
+                <template v-slot:no-option>
+                  <q-item>
+                    <q-item-section class="text-grey">
+                      ไม่มีข้อมูล
+                    </q-item-section>
+                  </q-item>
+                </template>
              </q-select>
            </div>
          </div>

          <q-input
            ref="reasonRef"
-            class="col-12 bg-white q-ma-md"
+            class="col-12 bg-white q-ma-md inputgreen"
            outlined
            stack-label
            :rules="[(val:string) => !!val || 'กรุณาเหตุผล']"
@ -327,20 +296,12 @@ watch(
        <q-separator color="grey-4" />
        <div class="q-pa-xs">
          <div class="row justify-end">
-            <q-btn
-              dense
-              unelevated
-              label="บันทึก"
-              color="public"
-              id="onSubmit"
-              type="submit"
-              class="q-px-md"
-            >
+            <q-btn label="บันทึก" color="public" id="onSubmit" type="submit">
              <q-tooltip>บันทึก</q-tooltip>
            </q-btn>
          </div>
        </div>
-      </form>
+      </q-form>
    </q-card>
  </q-dialog>
 </template>
--- a/src/modules/09_leave/stores/ChangeRoundStore.ts
+++ b/src/modules/09_leave/stores/ChangeRoundStore.ts
@ -127,9 +127,9 @@ export const useChangeRoundDataStore = defineStore(
        showLoader();
        await http
          .post(config.API.leaveSearch(), {
-            citizenId: dataDetail.cardId || "", //เลขประจำตัวประชาชน
-            firstname: dataDetail.firstName || "", //ชื่อจริง
-            lastname: dataDetail.lastName || "", //นามสกุล
+            citizenId: dataDetail.cardId.trim() || "", //เลขประจำตัวประชาชน
+            firstname: dataDetail.firstName.trim() || "", //ชื่อจริง
+            lastname: dataDetail.lastName.trim() || "", //นามสกุล
            page: dataDetail.page, //หน้า
            pageSize: dataDetail.pageSize || 10, //จำนวนแถวต่อหน้า
            keyword: dataDetail.keyword || "", //keyword ค้นหา
--- a/src/modules/09_leave/views/04_SpecialTimeMain.vue
+++ b/src/modules/09_leave/views/04_SpecialTimeMain.vue
@ -69,13 +69,6 @@ const pagination = ref({
 // ค้นหาในตาราง
 const filterKeyword = ref<string>("");
 const filterRef = ref<HTMLInputElement | null>(null);
-const resetFilter = () => {
-  filterKeyword.value = "";
-  fetchData();
-  if (filterRef.value) {
-    filterRef.value.focus();
-  }
-};

 const visibleColumns = ref<String[]>([
  "no",
@ -193,7 +186,6 @@ function closeDialog() {
 async function clickSave(reason: string) {
  dialogConfirm($q, async () => {
    showLoader();
-    modalUnapprove.value = false;
    const body = {
      reason: reason,
    };
@ -202,6 +194,7 @@ async function clickSave(reason: string) {
      .then(async () => {
        await fetchData();
        success($q, "บันทึกข้อมูลสำเร็จ");
+        modalUnapprove.value = false;
      })
      .catch((e) => {
        messageError($q, e);
@ -253,6 +246,8 @@ watch(
 * ฟังชั้นเรียกดูข้อมูล
 */
 async function fetchData() {
+  console.log(pagination.value.page);
+
  showLoader();
  await http
    .get(
@ -264,7 +259,7 @@ async function fetchData() {
        }&keyword=${filterKeyword.value.trim()}`
    )
    .then(async (res) => {
-      let data = res.data.result.data;
+      let data = await res.data.result.data;
      total.value = res.data.result.total;
      totalList.value = Math.ceil(
        res.data.result.total / pagination.value.rowsPerPage
@ -310,7 +305,6 @@ async function fetchData() {
    })
    .finally(() => {
      hideLoader();
-      console.log(month.value);
    });
 }

@ -403,7 +397,7 @@ onMounted(async () => {
      <d-table
        :columns="columns"
        :rows="rows"
-        row-key="tb-list"
+        row-key="id"
        flat
        bordered
        :paging="false"
@ -412,20 +406,6 @@ onMounted(async () => {
        :rows-per-page-options="[10, 25, 50, 100]"
        @update:pagination="updatePagination"
      >
-        <template v-slot:pagination="scope">
-          ทั้งหมด {{ total }} รายการ
-          <q-pagination
-            v-model="pagination.page"
-            active-color="primary"
-            color="dark"
-            :max="Number(totalList)"
-            size="sm"
-            boundary-links
-            direction-links
-            :max-pages="5"
-            @update:model-value="fetchData()"
-          ></q-pagination>
-        </template>
        <template v-slot:header="props">
          <q-tr :props="props">
            <q-th auto-width />
@ -500,14 +480,29 @@ onMounted(async () => {
                v-else-if="col.name === 'description'"
                class="table_ellipsis"
              >
-                {{ props.row.description }}
+                {{ col.value ?? "-" }}
              </div>
              <div v-else>
-                {{ col.value }}
+                {{ col.value ?? "-" }}
              </div>
            </q-td>
          </q-tr>
        </template>
+
+        <template v-slot:pagination="scope">
+          ทั้งหมด {{ total }} รายการ
+          <q-pagination
+            v-model="pagination.page"
+            active-color="primary"
+            color="dark"
+            :max="Number(totalList)"
+            size="sm"
+            boundary-links
+            direction-links
+            :max-pages="5"
+            @update:model-value="fetchData()"
+          ></q-pagination>
+        </template>
      </d-table>
    </div>
  </q-card>
@ -528,6 +523,7 @@ onMounted(async () => {
    :id="id"
    :editCheck="editCheck"
    :detailData="detailData"
+    :fetch-data="fetchData"
  />
 </template>