From 7bc71cf93f0bec7a83cdbf3b2cb0a1b512d49a7a Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Mon, 18 Nov 2024 13:15:01 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=20code=20?=
 =?UTF-8?q?=E0=B9=80=E0=B8=84=E0=B8=A3=E0=B8=B7=E0=B9=88=E0=B8=AD=E0=B8=87?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=B2=E0=B8=8A=20=3D=3D>=20=E0=B8=88=E0=B8=B1?=
 =?UTF-8?q?=E0=B8=94=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=84=E0=B8=B3=E0=B8=82?=
 =?UTF-8?q?=E0=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../07_insignia/components/2_Manage/Tab1.vue  | 130 +++++++++---------
 .../07_insignia/interface/index/Main.ts       |  40 ++++++
 .../07_insignia/interface/response/Main.ts    |  65 +++++++++
 src/modules/07_insignia/store.ts              |  82 ++++++-----
 .../07_insignia/views/02_ManageMain.vue       |   3 +-
 5 files changed, 222 insertions(+), 98 deletions(-)

diff --git a/src/modules/07_insignia/components/2_Manage/Tab1.vue b/src/modules/07_insignia/components/2_Manage/Tab1.vue
index 890263059..91ea55927 100644
--- a/src/modules/07_insignia/components/2_Manage/Tab1.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab1.vue
@@ -3,7 +3,6 @@ import { onMounted, ref, computed, reactive, watch } from "vue";
 import { useQuasar, QForm } from "quasar";
 
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
-import { useroleUserDataStore } from "@/stores/roleUser";
 import { useCounterMixin } from "@/stores/mixin";
 import { checkPermission } from "@/utils/permissions";
 import http from "@/plugins/http";
@@ -11,8 +10,17 @@ import config from "@/app.config";
 
 /** import Type*/
 import type { QTableProps } from "quasar";
-import type { OptionData } from "@/modules/07_insignia/interface/index/Main";
+import type {
+  OptionData,
+  Pagination,
+  DataProfileOtherSystem,
+  DataManageList,
+} from "@/modules/07_insignia/interface/index/Main";
 import type { CheckboxData } from "@/modules/07_insignia/interface/request/Main";
+import type {
+  ResponseProfile,
+  ResponseInsigniaType,
+} from "@/modules/07_insignia/interface/response/Main";
 
 /** import components*/
 import DialogPopupReason from "@/components/Dialogs/PopupReason.vue";
@@ -25,7 +33,6 @@ import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 const myForm = ref<QForm>();
 const $q = useQuasar();
 const DataStore = useInsigniaDataStore();
-const roleDataStore = useroleUserDataStore();
 const mixin = useCounterMixin();
 const {
   dialogConfirm,
@@ -249,8 +256,8 @@ const columns2 = ref<QTableProps["columns"]>([
   },
 ]);
 
-const rows2 = ref<any[]>([]); //รายชื่อข้าราชการตามหน่วยงานที่จะเพิ่ม
-const person = ref<any>([]);
+const rows2 = ref<DataProfileOtherSystem[]>([]); //รายชื่อข้าราชการตามหน่วยงานที่จะเพิ่ม
+const person = ref<DataManageList>();
 
 /** เช็คสถานนะแสดงปุ่มเพิ่ม*/
 const checkStatus = computed(() => {
@@ -277,11 +284,9 @@ function changtypeOc() {
 
 /** function เพิ่มรายชื่อ*/
 async function clickmodalAdd() {
-  await clearForm();
-  let ocId = DataStore.typeOc ? DataStore.typeOc : DataStore.agency;
-  // showLoader();
+  clearForm();
   await fecthInsignia();
-  await fecthlistperson(ocId);
+  await fecthlistperson();
 }
 
 function onCloseModalAdd() {
@@ -296,7 +301,7 @@ const formFilter = reactive({
   searchField: "citizenId",
   searchKeyword: "",
 });
-const filterOption = ref<any[]>([
+const filterOption = ref<OptionData[]>([
   {
     id: "citizenId",
     name: "เลขประจำตัวประชาชน",
@@ -311,14 +316,14 @@ const filterOption = ref<any[]>([
  * function เรียกรายชื่อข้าราชการตามหน่วยงานที่จะเพิ่ม
  * @param id  หน่วยงาน
  */
-async function fecthlistperson(id: string = "") {
+async function fecthlistperson() {
   showLoader();
   http
     .get(config.API.registryNewOtherSystem(""), { params: formFilter })
     .then((res) => {
       maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
       total.value = res.data.result.total;
-      let data = res.data.result.data.map((e: any) => ({
+      let data = res.data.result.data.map((e: ResponseProfile) => ({
         id: e.id,
         rootId: e.rootId,
         citizenId: e.citizenId,
@@ -340,19 +345,11 @@ async function fecthlistperson(id: string = "") {
 }
 
 /** update ค่า เเถวข้อมูล */
-function updatePageSize(newPagination: any) {
+function updatePageSize(newPagination: Pagination) {
   formFilter.page = 1;
   formFilter.pageSize = newPagination.rowsPerPage;
 }
 
-/** เช็คเเถวข้อมูลว่ามีการเปลี่ยนแปลงไหม */
-watch(
-  () => formFilter.pageSize,
-  () => {
-    fecthlistperson();
-  }
-);
-
 /** function ยืนยันการเพิ่มรายชื่อ*/
 async function clickAdd() {
   dataPerson.id
@@ -408,7 +405,7 @@ async function addlistperson(id: string) {
  * function openPopup แก้ไขเครื่องราชฯ
  * @param props รายละเอียด
  */
-async function clickmodalEdit(props: any) {
+async function clickmodalEdit(props: DataManageList) {
   insignia.value = props.insigniaSend;
   person.value = props;
   modalEdit.value = true;
@@ -433,7 +430,7 @@ async function downloadFile(response: any, filename: string) {
 /** function เรียก file รายชื่อข้าราชการสามัญฯ*/
 async function downloadFileexcel() {
   const findInsigniaId = DataStore.dataInsigniaType.find(
-    (e: any) => e.name == DataStore.typeinsignia
+    (e: ResponseInsigniaType) => e.name == DataStore.typeinsignia
   );
   showLoader();
   await http
@@ -442,7 +439,12 @@ async function downloadFileexcel() {
       {
         profileType:
           DataStore.employeeClass == "all" ? null : DataStore.employeeClass,
-        InsigniaId: DataStore.typeinsignia == "all" ? null : findInsigniaId.id,
+        InsigniaId:
+          DataStore.typeinsignia == "all"
+            ? null
+            : findInsigniaId
+            ? findInsigniaId.id
+            : "",
       },
       { responseType: "blob" }
     )
@@ -460,47 +462,39 @@ async function downloadFileexcel() {
     });
 }
 
-/*** function ยืนยันการแก้ไขเครื่องราช*/
+/** function ยืนยันการแก้ไขเครื่องราช แก้ไขเครื่องราช API*/
 async function clickSave() {
   dialogConfirm(
     $q,
     async () => {
-      await listEdit(person.value.id);
+      showLoader();
+      let data = {
+        insigniaId: insignia.value,
+      };
+      await http
+        .put(config.API.insigniaEdit(person.value ? person.value.id : ""), data)
+        .then(async () => {
+          await props?.fecthInsigniaByOc?.(
+            props.roundId,
+            organization.value,
+            "officer",
+            props.tab
+          );
+          success($q, "แก้ไขเครื่องราชฯ ที่ยื่นขอสำเร็จ");
+          modalEdit.value = false;
+        })
+        .catch((err) => {
+          messageError($q, err);
+        })
+        .finally(() => {
+          hideLoader();
+        });
     },
     "ยืนยันการแก้ไขเครื่องราชฯ ที่ยื่นขอ",
     "ต้องการยืนยันการแก้ไขเครื่องราชฯ ที่ยื่นขอนี้หรือไม่ ?"
   );
 }
 
-/**
- *  function แก้ไขเครื่องราช API
- * @param profileId
- */
-async function listEdit(profileId: string) {
-  showLoader();
-  let data: any = {
-    insigniaId: insignia.value,
-  };
-  await http
-    .put(config.API.insigniaEdit(profileId), data)
-    .then(async () => {
-      await props?.fecthInsigniaByOc?.(
-        props.roundId,
-        organization.value,
-        "officer",
-        props.tab
-      );
-      success($q, "แก้ไขเครื่องราชฯ ที่ยื่นขอสำเร็จ");
-      modalEdit.value = false;
-    })
-    .catch((err) => {
-      messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-}
-
 /**
  * function  openPopup ไม่ยืนขอ
  * @param id profileId
@@ -650,7 +644,7 @@ async function fecthInsignia() {
   await http
     .get(config.API.insigniaOrg)
     .then((res) => {
-      const listtype = res.data.result.map((e: any) => ({
+      const listtype = res.data.result.map((e: ResponseInsigniaType) => ({
         id: e.id,
         name: e.name + `(${e.shortName})`,
       }));
@@ -787,6 +781,22 @@ function clearInsigniaFilters(name: string) {
   }
 }
 
+watch(
+  () => DataStore.typeOc,
+  async () => {
+    filterOrganizationOP.value = await DataStore.optionsTypeOc;
+    organization.value = await DataStore.typeOc;
+  }
+);
+
+/** เช็คเเถวข้อมูลว่ามีการเปลี่ยนแปลงไหม */
+watch(
+  () => formFilter.pageSize,
+  () => {
+    fecthlistperson();
+  }
+);
+
 /** Hook*/
 onMounted(async () => {
   filterOrganizationOP.value = await DataStore.optionsTypeOc;
@@ -804,14 +814,6 @@ onMounted(async () => {
     }
   }
 });
-
-watch(
-  () => DataStore.typeOc,
-  async () => {
-    filterOrganizationOP.value = await DataStore.optionsTypeOc;
-    organization.value = await DataStore.typeOc;
-  }
-);
 </script>
 
 <template>
diff --git a/src/modules/07_insignia/interface/index/Main.ts b/src/modules/07_insignia/interface/index/Main.ts
index 71caa1913..6919f4015 100644
--- a/src/modules/07_insignia/interface/index/Main.ts
+++ b/src/modules/07_insignia/interface/index/Main.ts
@@ -132,6 +132,43 @@ interface DataRecord {
   orgReturnInsignia: string;
 }
 
+interface DataProfileOtherSystem {
+  citizenId: string;
+  fullname: string;
+  id: string;
+  level: string;
+  organizationOrganization: string;
+  position: string;
+  rootId: string;
+}
+interface Pagination {
+  rowsPerPage: number;
+}
+
+interface DataManageList {
+  citizenId: string;
+  dateSend: null | string | Date;
+  employeeType: string | null;
+  id: string;
+  insigniaCheck: string;
+  insigniaLevel: string;
+  insigniaSend: string;
+  insigniaType: string;
+  isApprove: boolean;
+  level: string;
+  markDiscipline: boolean;
+  markLeave: boolean;
+  markRate: boolean;
+  name: string;
+  position: string;
+  profileId: string;
+  reason: string;
+  requestNote: string;
+  salary: string;
+  salary2: string;
+  statusMark: boolean;
+}
+
 export type {
   OptionData,
   OptionDataYear,
@@ -148,4 +185,7 @@ export type {
   DataAllocate,
   DataRecord,
   DataInsignia,
+  DataProfileOtherSystem,
+  Pagination,
+  DataManageList,
 };
diff --git a/src/modules/07_insignia/interface/response/Main.ts b/src/modules/07_insignia/interface/response/Main.ts
index c0426e42b..4c1f597ca 100644
--- a/src/modules/07_insignia/interface/response/Main.ts
+++ b/src/modules/07_insignia/interface/response/Main.ts
@@ -91,6 +91,68 @@ interface ResponseRecordLists {
   volumeNo: string;
 }
 
+interface ResponseProfile {
+  avatar: string;
+  avatarName: string;
+  citizenId: string;
+  firstName: string;
+  id: string;
+  lastName: string;
+  org: string;
+  orgRevisionId: string;
+  orgRootShortName: string;
+  posExecutive: string;
+  posLevel: string;
+  posLevelId: string;
+  posNo: string;
+  posType: string;
+  posTypeId: string;
+  position: string;
+  prefix: string;
+  rank: string;
+  root: string;
+  rootId: string;
+}
+
+interface ResponseManageList {
+  citizenId: string;
+  docs: string;
+  fullName: string;
+  id: string;
+  isApprove: boolean;
+  lastInsignia: string;
+  level: string;
+  markDiscipline: boolean;
+  markLeave: boolean;
+  markRate: boolean;
+  posNo: string;
+  position: string;
+  profileId: string;
+  profileType: string;
+  rank: string;
+  reason: string;
+  requestDate: Date | string;
+  requestInsignia: string;
+  requestInsigniaShortName: string;
+  requestNote: string;
+  salary: string;
+  status: string;
+}
+
+interface ResponseDataInsignia {
+  document: string;
+  isLock: boolean;
+  name: string;
+  organizationName: string;
+  periodId: string;
+  requestId: string;
+  requestNote: string;
+  requestStatus: string;
+  round: number;
+  year: number;
+  items: ResponseManageList[];
+}
+
 export type {
   ResponseObject,
   ResponsePeriod,
@@ -99,4 +161,7 @@ export type {
   ResponseAllocate,
   ResponseInsigniaType,
   ResponseRecordLists,
+  ResponseProfile,
+  ResponseManageList,
+  ResponseDataInsignia,
 };
diff --git a/src/modules/07_insignia/store.ts b/src/modules/07_insignia/store.ts
index 544a7be9e..ecc1eb8aa 100644
--- a/src/modules/07_insignia/store.ts
+++ b/src/modules/07_insignia/store.ts
@@ -2,7 +2,17 @@ import { defineStore } from "pinia";
 import { ref } from "vue";
 
 /**import Type */
-import type { OptionReport } from "@/modules/07_insignia/interface/index/Main";
+import type {
+  OptionReport,
+  OptionData,
+  DataManageList,
+  OptionRound,
+} from "@/modules/07_insignia/interface/index/Main";
+import type {
+  ResponseManageList,
+  ResponseInsigniaType,
+  ResponseDataInsignia,
+} from "@/modules/07_insignia/interface/response/Main";
 
 /**import Stores */
 import { useCounterMixin } from "@/stores/mixin";
@@ -12,20 +22,22 @@ const { date2Thai } = mixin;
 
 export const useInsigniaDataStore = defineStore("insignia", () => {
   const roundId = ref<string>("");
-  const optionRound = ref<any>([]);
+  const optionRound = ref<OptionRound[]>([]);
   const isLock = ref<boolean>(false);
   const roleUser = ref<string>("");
   const requestId = ref<string>("");
   const requestStatus = ref<string>("");
-  const optionsTypeOc = ref<any>([]);
+  const optionsTypeOc = ref<OptionData[]>([]);
   const typeOc = ref<string>("");
   const agency = ref<string>("");
-  const rows = ref<any[]>([]);
-  const listinsignia = ref<any>([]);
+  const rows = ref<DataManageList[]>([]);
+  const listinsignia = ref<DataManageList[]>([]);
   const typeinsignia = ref<string>("all");
-  const typeinsigniaOptions = ref<any>([{ id: "all", name: "ทั้งหมด" }]);
+  const typeinsigniaOptions = ref<OptionData[]>([
+    { id: "all", name: "ทั้งหมด" },
+  ]);
   const employeeClass = ref<string>("all");
-  const employeeClassOps = ref<any>([
+  const employeeClassOps = ref<OptionData[]>([
     { name: "ทั้งหมด", id: "all" },
     { name: "ข้าราชการ กทม.สามัญ", id: "officer" },
     { name: "ลูกจ้างประจำ", id: "perm" },
@@ -45,15 +57,15 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
     { id: "44", title: "บัญชีแสดงจำนวนชั้นตราเครื่องราชฯ" },
   ]);
   const mainTab = ref<string | undefined>("pending");
-  const dataInsigniaType = ref<any>([]);
+  const dataInsigniaType = ref<ResponseInsigniaType[]>([]);
 
   /**
    * Funtioin เรียกข้อมูลรายชื่อข้าราชการสามัญ
    * @param data ข้อมูลรายชื่อข้าราชการสามัญ
    */
-  async function fetchData(data: any) {
+  async function fetchData(data: ResponseManageList[]) {
     if (data !== null) {
-      let datalist = await data.map((e: any) => ({
+      let datalist = data.map((e: ResponseManageList) => ({
         id: e.id,
         citizenId: e.citizenId,
         profileId: e.profileId,
@@ -65,7 +77,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
         insigniaType: e.lastInsignia
           ? `${e.lastInsignia} (${
               dataInsigniaType.value.find(
-                (item: any) => item.name === e.lastInsignia
+                (item: ResponseInsigniaType) => item.name === e.lastInsignia
               )?.shortName || ""
             })`
           : "-",
@@ -73,15 +85,19 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
         insigniaSend: e.requestInsignia
           ? `${e.requestInsignia} (${
               dataInsigniaType.value.find(
-                (item: any) => item.name === e.requestInsignia
+                (item: ResponseInsigniaType) => item.name === e.requestInsignia
               )?.shortName || ""
             })`
           : "",
-        insigniaLevel: e.level,
-        dateSend: date2Thai(e.requestDate),
-        requestNote: e.requestNote,
-        employeeType: profileType(e.profileType),
-        reason: e.reason,
+        insigniaLevel: e.level ? e.level : "",
+        dateSend: e.requestDate
+          ? typeof e.requestDate === "string"
+            ? e.requestDate
+            : e.requestDate.toISOString()
+          : null,
+        requestNote: e.requestNote ? e.requestNote : "",
+        employeeType: profileType(e.profileType) || null,
+        reason: e.reason ? e.reason : "",
         markDiscipline: e.markDiscipline,
         markLeave: e.markLeave,
         markRate: e.markRate,
@@ -97,7 +113,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
       for (let j = 0; j < item.length; j++) {
         const data = item[j];
         const filteredData = dataInsigniaType.value.find(
-          (item: any) => item.name === data.insigniaType
+          (item: ResponseInsigniaType) => item.name === data.insigniaType
         );
         if (filteredData) {
           data.insigniaType = `${data.insigniaType} (${filteredData.shortName})`;
@@ -106,8 +122,8 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
         }
       }
 
-      rows.value = await datalist;
-      listinsignia.value = await item;
+      rows.value = datalist;
+      listinsignia.value = item;
       searchDataTable(typeinsignia.value, employeeClass.value);
       filtertypeInsignia();
     } else rows.value = [];
@@ -117,7 +133,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
    * function เรียกข้อมูลรอบการเสนอขอ
    * @param data ข้อมูลราบการเสนอขอ
    */
-  async function fetchDataInsignia(data: any) {
+  async function fetchDataInsignia(data: ResponseDataInsignia) {
     isLock.value = data.isLock; // สถานะล็อกข้อมูล
     requestId.value = data.requestId;
     requestStatus.value = data.requestStatus; // สถานะของรอบการเสนอขอ
@@ -127,15 +143,15 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
    * funntoin หา option หน่วยงสานทั้งหมด
    * @param op
    */
-  async function fetchOption(op: any) {
+  async function fetchOption(op: OptionData[]) {
     const aId = agency.value ?? "00000000-0000-0000-0000-000000000000";
-    const hasID = op.find((e: any) => e.id === agency.value);
+    const hasID = op.find((e: OptionData) => e.id === agency.value);
 
     if (aId !== "00000000-0000-0000-0000-000000000000" && hasID) {
       typeOc.value = agency.value;
       optionsTypeOc.value = op;
     } else {
-      (optionsTypeOc.value = op), (typeOc.value = op[0].id);
+      (optionsTypeOc.value = op), (typeOc.value = op[0].id.toString());
     }
   }
 
@@ -147,17 +163,19 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
     if (listinsignia.value.length !== 0) {
       // หาประเภทเครื่องราชที่ขอที่ชื่อซ้ำกัน
       const double_name = [
-        ...new Set(listinsignia.value.map((item: any) => item.insigniaCheck)),
+        ...new Set(
+          listinsignia.value.map((item: DataManageList) => item.insigniaCheck)
+        ),
       ];
       typeinsigniaOptions.value = [{ id: "all", name: "ทั้งหมด" }];
       for (let i = 1; i <= double_name.length; i++) {
         const type = double_name[i - 1];
         const filterShortName = dataInsigniaType.value.find(
-          (item: any) => item.name === type
+          (item: ResponseInsigniaType) => item.name === type
         );
         const listtype = {
-          id: type,
-          name: `${type} (${filterShortName.shortName})`,
+          id: type ? type.toString() : "",
+          name: `${type} (${filterShortName ? filterShortName.shortName : ""})`,
         };
         typeinsigniaOptions.value.push(listtype);
       }
@@ -174,17 +192,17 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
     employeeClass.value = employeeClasstype;
     if (type !== "all" && employeeClasstype !== "all") {
       rows.value = listinsignia.value.filter(
-        (e: any) =>
+        (e: DataManageList) =>
           e.insigniaCheck === type &&
           e.employeeType === profileType(employeeClasstype)
       );
     } else if (type !== "all" && employeeClasstype === "all") {
       rows.value = listinsignia.value.filter(
-        (e: any) => e.insigniaCheck === type
+        (e: DataManageList) => e.insigniaCheck === type
       );
     } else if (type === "all" && employeeClasstype !== "all") {
       rows.value = listinsignia.value.filter(
-        (e: any) => e.employeeType === profileType(employeeClasstype)
+        (e: DataManageList) => e.employeeType === profileType(employeeClasstype)
       );
     } else if (type === "all" && employeeClasstype === "all") {
       rows.value = listinsignia.value;
@@ -195,7 +213,7 @@ export const useInsigniaDataStore = defineStore("insignia", () => {
    * function เรียกประเภทเครื่องราช
    * @param data ประเภทเครื่องราชทั้งหมด
    */
-  function fetchInsigniaType(data: any) {
+  function fetchInsigniaType(data: ResponseInsigniaType[]) {
     dataInsigniaType.value = data;
   }
 
diff --git a/src/modules/07_insignia/views/02_ManageMain.vue b/src/modules/07_insignia/views/02_ManageMain.vue
index a43feacaf..40262a22e 100644
--- a/src/modules/07_insignia/views/02_ManageMain.vue
+++ b/src/modules/07_insignia/views/02_ManageMain.vue
@@ -29,7 +29,6 @@ import DialogPopupReason from "@/components/Dialogs/PopupReason.vue"; //หม
 /**use  */
 const $q = useQuasar(); //ใช้ noti quasar
 const route = useRoute();
-const roleDataStore = useroleUserDataStore();
 const DataStore = useInsigniaDataStore();
 const mixin = useCounterMixin();
 const { messageError, dialogConfirm, showLoader, hideLoader, success } = mixin;
@@ -77,7 +76,7 @@ async function fecthlistRound() {
 
       //มีรอบการเสนอขอพระราชทานเครื่องแสดง UI
       if (optionRound.value.length !== 0) {
-        // DataStore.optionRound = optionRound.value;
+        DataStore.optionRound = optionRound.value;
         // const lastValue = optionRound.value[0];
         // await fetchListOrg(lastValue.period_revision);
         // await fecthAgency(lastValue.period_revision);