From 0a5fc706b1710d898711b15b1218f9e4a0382270 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Mon, 24 Jun 2024 10:11:04 +0700
Subject: [PATCH 1/7] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84?=
 =?UTF-8?q?=E0=B8=82=20=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1=20man?=
 =?UTF-8?q?ual=20=E0=B9=83=E0=B8=99=20config?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app.config.ts        | 30 ++++++++++++++++++++
 src/manual.json          | 61 ----------------------------------------
 src/views/MainLayout.vue |  4 +--
 3 files changed, 32 insertions(+), 63 deletions(-)
 delete mode 100644 src/manual.json

diff --git a/src/app.config.ts b/src/app.config.ts
index be0aacba9..c124dedc8 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -137,10 +137,40 @@ const API = {
   ...file,
 };
 
+const path = "http://localhost:3008";
+
+const manualConfig = {
+  "/": `${path}/`,
+  "/KPI-indicator-plan": `${path}/manual/chapter-3-admin-evaluate`,
+  "/organization-new": `${path}/manual/chapter-4-admin-organization`,
+  "/registry-new": `${path}/manual/chapter-7-admin-registry`,
+  "/registry-employee": `${path}/manual/chapter-8-admin-registry-employee`,
+  "/order": `${path}/manual/chapter-9-admin-order`,
+  "/placement": `${path}/manual/chapter-11-admin-appointment`,
+  "/transfer": `${path}/manual/chapter-11-admin-appointment`,
+  "/receive": `${path}/manual/chapter-11-admin-appointment`,
+  "/help-government": `${path}/manual/chapter-11-admin-appointment`,
+  "/repatriate": `${path}/manual/chapter-11-admin-appointment`,
+  "/appoint-promote": `${path}/manual/chapter-11-admin-appointment`,
+  "/appoint-employee": `${path}/manual/chapter-11-admin-appointment`,
+  "/other": `${path}/manual/chapter-11-admin-appointment`,
+  "/salary": `${path}/manual/chapter-18-admin-salary`,
+  "/salary-employee": `${path}/manual/chapter-18-admin-salary`,
+  "/salary/round": `${path}/manual/chapter-18-admin-salary`,
+  "/salary/lists": `${path}/manual/chapter-18-admin-salary`,
+  "/salary-employee/lists": `${path}/manual/chapter-18-admin-salary`,
+  "/salary/command": `${path}/manual/chapter-18-admin-salary`,
+  "/development": `${path}/manual/chapter-20-admin-development`,
+  "/development/history": `${path}/manual/chapter-20-admin-development`,
+  "/development/employee-history": `${path}/manual/chapter-20-admin-development`,
+  "/development/scholarship": `${path}/manual/chapter-20-admin-development`,
+};
+
 export default {
   API: API,
   compettitivePanel,
   qualifyDisableExamPanel,
   qualifyExamPanel,
   s3ClusterUrl,
+  manualConfig,
 };
diff --git a/src/manual.json b/src/manual.json
deleted file mode 100644
index 5a00a2c5c..000000000
--- a/src/manual.json
+++ /dev/null
@@ -1,61 +0,0 @@
-{
-  "/": "http://localhost:3008/",
-  "/KPI-indicator-plan": "http://localhost:3008/manual/chapter-3-admin-evaluate",
-  "/KPI-indicator-role": "http://localhost:3008/manual/chapter-3-admin-evaluate",
-  "/assignment": "http://localhost:3008/manual/chapter-3-admin-evaluate",
-  "/KPI-competency": "http://localhost:3008/manual/chapter-3-admin-evaluate",
-  "/strategic": "http://localhost:3008/manual/chapter-3-admin-evaluate",
-  "/organization-new": "http://localhost:3008/manual/chapter-4-admin-organization",
-  "/registry-new": "http://localhost:3008/manual/chapter-7-admin-registry",
-  "/registry-employee": "http://localhost:3008/manual/chapter-8-admin-registry-employee",
-  "/order": "http://localhost:3008/manual/chapter-9-admin-order",
-  "/compete/period": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/compete/period/stat": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/qualify/period": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/disable/period": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/qualify/manage": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/qualify/period/stat": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/qualify/disable/stat": "http://localhost:3008/manual/chapter-10-admin-recruit",
-  "/placement": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/transfer": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/receive": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/help-government": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/repatriate": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/appoint-promote": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/appoint-employee": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/other": "http://localhost:3008/manual/chapter-11-admin-appointment",
-  "/probation": "http://localhost:3008/manual/chapter-12-admin-probation",
-  "/retirement": "http://localhost:3008/manual/chapter-13-admin-retirement",
-  "/retirement/resign": "http://localhost:3008/manual/chapter-13-admin-retirement",
-  "/exit-Interview": "http://localhost:3008/manual/chapter-13-admin-retirement",
-  "/deceased": "http://localhost:3008/manual/chapter-13-admin-retirement",
-  "/dismiss-order": "http://localhost:3008/manual/chapter-13-admin-retirement",
-  "/insignia/round-proposals": "http://localhost:3008/manual/chapter-14-admin-insignia",
-  "/insignia/manage/list-manage": "http://localhost:3008/manual/chapter-14-admin-insignia",
-  "/insignia/record": "http://localhost:3008/manual/chapter-14-admin-insignia",
-  "/insignia/allocate": "http://localhost:3008/manual/chapter-14-admin-insignia",
-  "/insignia/borrow": "http://localhost:3008/manual/chapter-14-admin-insignia",
-  "/insignia/report": "http://localhost:3008/manual/chapter-14-admin-insignia",
-  "/discipline/complaints": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline/investigatefacts": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline/disciplinary": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline-result": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline-suspend": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline-appealcomplain": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline-order": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline/director": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/discipline/channel": "http://localhost:3008/manual/chapter-16-admin-discipline",
-  "/evaluate": "http://localhost:3008/manual/chapter-17-admin-KPI",
-  "/evaluate/director": "http://localhost:3008/manual/chapter-17-admin-KPI",
-  "/evaluate/meeting": "http://localhost:3008/manual/chapter-17-admin-KPI",
-  "/salary":"http://localhost:3008/manual/chapter-18-admin-salary",
-  "/salary-employee":"http://localhost:3008/manual/chapter-18-admin-salary",
-  "/salary/round":"http://localhost:3008/manual/chapter-18-admin-salary",
-  "/salary/lists":"http://localhost:3008/manual/chapter-18-admin-salary",
-  "/salary-employee/lists":"http://localhost:3008/manual/chapter-18-admin-salary",
-  "/salary/command":"http://localhost:3008/manual/chapter-18-admin-salary",
-  "/development":"http://localhost:3008/manual/chapter-20-admin-development",
-  "/development/history":"http://localhost:3008/manual/chapter-20-admin-development",
-  "/development/employee-history":"http://localhost:3008/manual/chapter-20-admin-development",
-  "/development/scholarship":"http://localhost:3008/manual/chapter-20-admin-development"
-}
\ No newline at end of file
diff --git a/src/views/MainLayout.vue b/src/views/MainLayout.vue
index 48287850a..bcd79c094 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -9,7 +9,6 @@ import { useCounterMixin } from "@/stores/mixin";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
-import manual from "@/manual.json";
 
 import type {
   ScrollType,
@@ -478,7 +477,8 @@ watch(
 
 const handleButtonClick = () => {
   const currentPath = route.path;
-  const popupPath = manual[currentPath as keyof typeof manual];
+  const popupPath =
+    config.manualConfig[currentPath as keyof typeof config.manualConfig];
   if (popupPath) {
     window.open(popupPath);
   } else {

From 23afca088195e5b1447e93cd9e3acebc65299271 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Mon, 24 Jun 2024 10:16:40 +0700
Subject: [PATCH 2/7] Update app.config.ts

---
 src/app.config.ts | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/src/app.config.ts b/src/app.config.ts
index c124dedc8..784c7001b 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -138,14 +138,26 @@ const API = {
 };
 
 const path = "http://localhost:3008";
+const name = "";
 
 const manualConfig = {
   "/": `${path}/`,
   "/KPI-indicator-plan": `${path}/manual/chapter-3-admin-evaluate`,
+  "/KPI-indicator-role": `${path}/manual/chapter-3-admin-evaluate`,
+  "/assignment": `${path}/manual/chapter-3-admin-evaluate`,
+  "/KPI-competency": `${path}/manual/chapter-3-admin-evaluate`,
+  "/strategic": `${path}/manual/chapter-3-admin-evaluate`,
   "/organization-new": `${path}/manual/chapter-4-admin-organization`,
   "/registry-new": `${path}/manual/chapter-7-admin-registry`,
   "/registry-employee": `${path}/manual/chapter-8-admin-registry-employee`,
   "/order": `${path}/manual/chapter-9-admin-order`,
+  "/compete/period": `${path}/manual/chapter-10-admin-recruit`,
+  "/compete/period/stat": `${path}/manual/chapter-10-admin-recruit`,
+  "/qualify/period": `${path}/manual/chapter-10-admin-recruit`,
+  "/disable/period": `${path}/manual/chapter-10-admin-recruit`,
+  "/qualify/manage": `${path}/manual/chapter-10-admin-recruit`,
+  "/qualify/period/stat": `${path}/manual/chapter-10-admin-recruit`,
+  "/qualify/disable/stat": `${path}/manual/chapter-10-admin-recruit`,
   "/placement": `${path}/manual/chapter-11-admin-appointment`,
   "/transfer": `${path}/manual/chapter-11-admin-appointment`,
   "/receive": `${path}/manual/chapter-11-admin-appointment`,
@@ -154,6 +166,30 @@ const manualConfig = {
   "/appoint-promote": `${path}/manual/chapter-11-admin-appointment`,
   "/appoint-employee": `${path}/manual/chapter-11-admin-appointment`,
   "/other": `${path}/manual/chapter-11-admin-appointment`,
+  "/probation": `${path}/manual/chapter-12-admin-probation`,
+  "/retirement": `${path}/manual/chapter-13-admin-retirement`,
+  "/retirement/resign": `${path}/manual/chapter-13-admin-retirement`,
+  "/exit-Interview": `${path}/manual/chapter-13-admin-retirement`,
+  "/deceased": `${path}/manual/chapter-13-admin-retirement`,
+  "/dismiss-order": `${path}/manual/chapter-13-admin-retirement`,
+  "/insignia/round-proposals": `${path}/manual/chapter-14-admin-insignia`,
+  "/insignia/manage/list-manage": `${path}/manual/chapter-14-admin-insignia`,
+  "/insignia/record": `${path}/manual/chapter-14-admin-insignia`,
+  "/insignia/allocate": `${path}/manual/chapter-14-admin-insignia`,
+  "/insignia/borrow": `${path}/manual/chapter-14-admin-insignia`,
+  "/insignia/report": `${path}/manual/chapter-14-admin-insignia`,
+  "/discipline/complaints": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline/investigatefacts": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline/disciplinary": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline-result": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline-suspend": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline-appealcomplain": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline-order": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline/director": `${path}/manual/chapter-16-admin-discipline`,
+  "/discipline/channel": `${path}/manual/chapter-16-admin-discipline`,
+  "/evaluate": `${path}/manual/chapter-17-admin-KPI`,
+  "/evaluate/director": `${path}/manual/chapter-17-admin-KPI`,
+  "/evaluate/meeting": `${path}/manual/chapter-17-admin-KPI`,
   "/salary": `${path}/manual/chapter-18-admin-salary`,
   "/salary-employee": `${path}/manual/chapter-18-admin-salary`,
   "/salary/round": `${path}/manual/chapter-18-admin-salary`,

From dd9c078419809f54f500560d25433eaaecf1fa74 Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Mon, 24 Jun 2024 13:42:44 +0700
Subject: [PATCH 3/7] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=20=E0=B9=80?=
 =?UTF-8?q?=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1=E0=B8=A3=E0=B8=B2=E0=B8=A2?=
 =?UTF-8?q?=E0=B8=8A=E0=B8=B7=E0=B9=88=E0=B8=AD=E0=B8=81=E0=B8=A3=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=A1=E0=B8=81=E0=B8=B2=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Director/Form.vue              | 61 +++++++++++++++++--
 1 file changed, 55 insertions(+), 6 deletions(-)

diff --git a/src/modules/12_evaluatePersonal/components/Director/Form.vue b/src/modules/12_evaluatePersonal/components/Director/Form.vue
index 9a7b64e7e..89565c6f4 100644
--- a/src/modules/12_evaluatePersonal/components/Director/Form.vue
+++ b/src/modules/12_evaluatePersonal/components/Director/Form.vue
@@ -14,6 +14,14 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import PopupPersonal from "@/components/Dialogs/PopupPersonalNew.vue";
 
+const total = ref<number>(0);
+const totalList = ref<number>(1);
+const pagination = ref({
+  sortBy: "createdAt",
+  descending: true,
+  page: 1,
+  rowsPerPage: 10,
+});
 const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
 const $q = useQuasar();
@@ -47,10 +55,10 @@ const emit = defineEmits(["formDataReturn"]);
 //
 const idCard = ref<string>("");
 const idCardRef = ref<any>(null);
-const type = ref<string>("idcard");
+const type = ref<string>("citizenId");
 const search = ref<string>("");
 const typeOps = ref<typeOp[]>([
-  { id: "idcard", name: "เลขประจำตัวประชาชน" },
+  { id: "citizenId", name: "เลขประจำตัวประชาชน" },
   { id: "firstname", name: "ชื่อ" },
   { id: "lastname", name: "นามสกุล" },
 ]);
@@ -203,12 +211,21 @@ async function searchInput() {
       keyword: search.value,
     };
     await http
-      .post(config.API.orgSearchPersonal(), body)
+      .post(
+        config.API.orgSearchPersonal() +
+          `?page=${pagination.value.page}&pageSize=${pagination.value.rowsPerPage}`,
+        body
+      )
       .then((res) => {
-        const data = res.data.result;
+        const data = res.data.result.data;
+        totalList.value = Math.ceil(
+          res.data.result.total / pagination.value.rowsPerPage
+        );
+        total.value = res.data.result.total;
+
         const list = data.map((e: ResponsePreson) => ({
           personId: e.id,
-          idcard: e.idcard,
+          idcard: e.citizenId,
           prefix: e.prefix,
           firstName: e.firstName,
           lastName: e.lastName,
@@ -252,6 +269,17 @@ function onclickViewinfo(id: string) {
 function updatemodalPersonal(modal: boolean) {
   modalPersonal.value = modal;
 }
+function updatePagination(newPagination: any) {
+  pagination.value.page = 1;
+  pagination.value.rowsPerPage = newPagination.rowsPerPage;
+}
+
+watch(
+  () => pagination.value.rowsPerPage,
+  async () => {
+    await searchInput();
+  }
+);
 </script>
 <template>
   <form @submit.prevent.stop="onValidate">
@@ -312,7 +340,24 @@ function updatemodalPersonal(modal: boolean) {
                 dense
                 class="custom-header-table"
                 :visible-columns="visibleColumnsRespondent"
+                :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="searchInput"
+                  ></q-pagination>
+                </template>
+
                 <template v-slot:header="props">
                   <q-tr :props="props">
                     <q-th
@@ -334,7 +379,11 @@ function updatemodalPersonal(modal: boolean) {
                       @click="returnDetail(props.row)"
                     >
                       <div v-if="col.name == 'no'">
-                        {{ props.rowIndex + 1 }}
+                        {{
+                          (pagination.page - 1) * pagination.rowsPerPage +
+                          props.rowIndex +
+                          1
+                        }}
                       </div>
                       <div v-else-if="col.name == 'info'">
                         <!-- <router-link

From f37259c3b17a957a5cb8a8eddb383efb9e6c02df Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Mon, 24 Jun 2024 14:51:05 +0700
Subject: [PATCH 4/7] no message

---
 .../components/1_Complaint/EditPage.vue       |  6 ++-
 .../components/1_Complaint/TableComplaint.vue |  2 +-
 .../2_InvestigateFacts/EditPage.vue           |  4 +-
 .../store/InvestigateFactStore.ts             |  2 +-
 src/modules/11_discipline/store/main.ts       | 46 +++++++++++++++++++
 5 files changed, 55 insertions(+), 5 deletions(-)

diff --git a/src/modules/11_discipline/components/1_Complaint/EditPage.vue b/src/modules/11_discipline/components/1_Complaint/EditPage.vue
index aeec93883..826cb7d7f 100644
--- a/src/modules/11_discipline/components/1_Complaint/EditPage.vue
+++ b/src/modules/11_discipline/components/1_Complaint/EditPage.vue
@@ -185,6 +185,8 @@ async function getData() {
       data.result = dataList.result;
       data.disciplineComplaintDocs = dataList.disciplineComplaintDocs;
       data.activeId = dataList.activeId;
+
+      mainStore.fetchDataRowsSend(dataList.persons)
     })
     .catch((e) => {
       messageError($q, e);
@@ -217,7 +219,7 @@ async function onSubmit(data: any) {
 
 /** ยืนยัน มีมูลส่งไปสืบสวน */
 function sentInvestigate() {
-  if (mainStore.rowsAdd.length > 0) {
+  if (mainStore.rowsSend.length > 0) {
     modalPopup.value = true;
   } else {
     dialogConfirm(
@@ -378,7 +380,7 @@ onMounted(() => {
       :modal="modalPopup"
       :close="closePopup"
       @return-person="sendPersonToNext"
-      :rows="mainStore.rowsAdd"
+      :rows="mainStore.rowsSend"
       :columns="columns"
       :visibleColumns="visibleColumns"
     />
diff --git a/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue b/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
index 7043da5b9..e24915c13 100644
--- a/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
+++ b/src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
@@ -50,7 +50,7 @@ const visibleColumns = ref<string[]>([
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
-    align: "left",
+    align: "center",
     label: "ลำดับ",
     sortable: false,
     field: "no",
diff --git a/src/modules/11_discipline/components/2_InvestigateFacts/EditPage.vue b/src/modules/11_discipline/components/2_InvestigateFacts/EditPage.vue
index 4fed4f6cb..35df26809 100644
--- a/src/modules/11_discipline/components/2_InvestigateFacts/EditPage.vue
+++ b/src/modules/11_discipline/components/2_InvestigateFacts/EditPage.vue
@@ -171,6 +171,8 @@ function getData() {
       data.isAncestorDNA = dataList.isAncestorDNA;
       data.investigationExtendHistory =
         dataList.investigationExtendHistory ?? [];
+
+      mainStore.fetchDataRowsSend(dataList.persons);
     })
     .catch((e) => {
       messageError($q, e);
@@ -398,7 +400,7 @@ watch(
       :modal="modalPopup"
       :close="closePopup"
       title="ส่งไปสอบสวน"
-      :rows="mainStore.rowsAdd.filter((item: ArrayPersonAdd)=> item.isSend == 'NEW')"
+      :rows="mainStore.rowsSend.filter((item: ArrayPersonAdd)=> item.isSend == 'NEW')"
       :columns="mainStore.columnsDirector"
       :visibleColumns="mainStore.visibleColumnsDirector"
       @return-person="emitPerson"
diff --git a/src/modules/11_discipline/store/InvestigateFactStore.ts b/src/modules/11_discipline/store/InvestigateFactStore.ts
index 4b95e57a8..998a1ae64 100644
--- a/src/modules/11_discipline/store/InvestigateFactStore.ts
+++ b/src/modules/11_discipline/store/InvestigateFactStore.ts
@@ -26,7 +26,7 @@ export const useInvestigateFactStore = defineStore(
   "DisciplineInvestigateFact",
   () => {
     const tabMenu = ref<string>("investigatefacts");
-    const rows = ref<InvestigatefactsDataRowType[]>();
+    const rows = ref<InvestigatefactsDataRowType[]>([]);
     const respondentTypeOps = ref<DataOption[]>(
       mainStore.complainantoptionsMain
     );
diff --git a/src/modules/11_discipline/store/main.ts b/src/modules/11_discipline/store/main.ts
index d3c87c96b..9151f5c5d 100644
--- a/src/modules/11_discipline/store/main.ts
+++ b/src/modules/11_discipline/store/main.ts
@@ -30,6 +30,7 @@ export const useDisciplineMainStore = defineStore("disciplineMainStore", () => {
     { id: "ไม่ร้ายแรง", name: "ไม่ร้ายแรง" },
   ]);
   const rowsAdd = ref<ArrayPersonAdd[]>([]);
+  const rowsSend = ref<ArrayPersonAdd[]>([]);
   const rowsCheck = ref<ArrayPersonAdd[]>([]);
   /** หัวตารางผู้ถูกร้องเรียน */
   const columnsRespondent = ref<QTableProps["columns"]>([
@@ -330,6 +331,49 @@ export const useDisciplineMainStore = defineStore("disciplineMainStore", () => {
     rowsAdd.value = dataList;
   }
 
+    /**
+   * จัดเก็บข้อมูลไว้ เพื่อใช้ใน POPUP
+   * @param data ข้อมูลรายการบุคคล
+   */
+    function fetchDataRowsSend(data: ArrayPersonAdd[]) {
+      const dataList: any = data.map((item: any) => ({
+        id: item.id,
+        idcard: item.idcard,
+        name: item.name,
+        prefix: item.prefix,
+        firstName: item.firstName,
+        lastName: item.lastName,
+        position: item.position,
+        positionLevel: item.positionLevel,
+        salary: item.salary === null ? "" : item.salary,
+        personId: item.personId,
+        posNo: item.posNo === null ? "-" : item.posNo,
+        organization: item.organization,
+        root: item.root,
+        rootId: item.rootId,
+        rootShortName: item.rootShortName,
+        child1: item.child1,
+        child1Id: item.child1Id,
+        child1ShortName: item.child1ShortName,
+        child2: item.child2,
+        child2Id: item.child2Id,
+        child2ShortName: item.child2ShortName,
+        child3: item.child3,
+        child3Id: item.child3Id,
+        child3ShortName: item.child3ShortName,
+        child4: item.child4,
+        child4Id: item.child4Id,
+        child4ShortName: item.child4ShortName,
+        posMasterNo: item.posMasterNo,
+        posTypeId: item.posTypeId,
+        posTypeName: item.posTypeName,
+        posLevelId: item.posLevelId,
+        posLevelName: item.posLevelName,
+        isSend: item.isSend,
+      }));
+      rowsSend.value = dataList;
+    }
+
   return {
     complainantoptionsMain,
     convertFault,
@@ -348,5 +392,7 @@ export const useDisciplineMainStore = defineStore("disciplineMainStore", () => {
     convertStatusResult,
     rowsCheck,
     causeTextOptions,
+    rowsSend,
+    fetchDataRowsSend
   };
 });

From 9599310b8419a7acb20c2c3a2e024c69bb2319d6 Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Mon, 24 Jun 2024 15:04:19 +0700
Subject: [PATCH 5/7] =?UTF-8?q?=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=8A?=
 =?UTF-8?q?=E0=B8=B7=E0=B9=88=E0=B8=AD=E0=B8=9C=E0=B8=B9=E0=B9=89=E0=B8=96?=
 =?UTF-8?q?=E0=B8=B9=E0=B8=81=E0=B8=9E=E0=B8=B1=E0=B8=81=E0=B8=A3=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=8A=E0=B8=81=E0=B8=B2=E0=B8=A3=20=E0=B8=8A=E0=B8=B7?=
 =?UTF-8?q?=E0=B9=88=E0=B8=AD=20null?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/3_InvestigateDisciplinary/EditPage.vue      | 4 +++-
 .../components/3_InvestigateDisciplinary/Form.vue          | 7 +++++--
 .../11_discipline/components/7_ListSuspend/ListsPage.vue   | 3 +++
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/modules/11_discipline/components/3_InvestigateDisciplinary/EditPage.vue b/src/modules/11_discipline/components/3_InvestigateDisciplinary/EditPage.vue
index b439fb913..c2a8bb262 100644
--- a/src/modules/11_discipline/components/3_InvestigateDisciplinary/EditPage.vue
+++ b/src/modules/11_discipline/components/3_InvestigateDisciplinary/EditPage.vue
@@ -30,7 +30,7 @@ import { useInvestigateDisStore } from "@/modules/11_discipline/store/Investigat
 import { useDisciplineMainStore } from "@/modules/11_discipline/store/main";
 
 const mainStore = useDisciplineMainStore();
-
+const isSaveInfo = ref<boolean>(false)
 const $q = useQuasar();
 const mixin = useCounterMixin();
 const store = useInvestigateDisStore();
@@ -404,6 +404,7 @@ onMounted(async () => {
           label="ส่งไปสรุปผลการพิจารณา"
           color="public"
           @click="sentIssueGate"
+          :disable="isSaveInfo"
         />
         <q-btn
           v-if="status === 'NEW'"
@@ -462,6 +463,7 @@ onMounted(async () => {
             :data="data"
             @submit:disciplinary="onSubmitDisciplinary"
             :fetchData="fetchDetailDisciplinary"
+            v-model:isSaveInfo="isSaveInfo"
           />
         </q-tab-panel>
       </q-tab-panels>
diff --git a/src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue b/src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue
index 60c7a072b..ca488991f 100644
--- a/src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue
+++ b/src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue
@@ -40,7 +40,7 @@ import type { OptionData } from "@/modules/07_insignia/interface/index/Main";
 
 const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
-
+const isSaveInfo = defineModel<boolean>('isSaveInfo')
 const calendarModal = ref<boolean>(false);
 const calendarModalclose = () => (calendarModal.value = !calendarModal.value);
 const modalPopup = ref<boolean>(false);
@@ -211,6 +211,7 @@ function onSubmit() {
 
     emit("submit:disciplinary", formData);
     isSave.value = false;
+    isSaveInfo.value = false
     extendStatus.value = false;
   });
 }
@@ -232,7 +233,7 @@ async function fetchDatadetail() {
     if (countNum.value === 1) {
       isReadonly.value = props.data.status != "NEW" ?? true;
       isSave.value = false;
-
+      isSaveInfo.value = false
       formData.respondentType = props.data.respondentType;
       formData.organizationId = props.data.organizationId;
       formData.organization = props.data.organization;
@@ -524,6 +525,7 @@ async function selectComplainant(val: string) {
 /** ฟังก์ชั่นเช็คการแก้ไขฟอร์มแล้วไม่ได้กดบันทึก */
 function changeFormData() {
   isSave.value = true;
+  isSaveInfo.value = true
   if (formData.disciplinaryFaultLevel !== "อื่นๆ") {
     formData.disciplinaryFaultLevelOther = "";
   }
@@ -537,6 +539,7 @@ function changeFormData() {
 /** เช็ควันที่สิ้นสุดต้องมากกว่า หรือเท่ากับวันเริ่ม */
 function changeFormDataDate() {
   isSave.value = true;
+  isSaveInfo.value = true
   const startDate = new Date(formData.disciplinaryDateStart as Date);
   const endDate = new Date(formData.disciplinaryDateEnd as Date);
 
diff --git a/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue b/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
index bb110ade5..618b85608 100644
--- a/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
+++ b/src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue
@@ -345,6 +345,9 @@ onMounted(() => {
                       1
                     }}
                   </div>
+                  <div v-else-if="col.name === 'name'" class="table_ellipsis">
+                    {{ props.row.prefix ? props.row.prefix : "" }}{{ props.row.firstName ? props.row.firstName : "" }} {{ props.row.lastName ? props.row.lastName : "" }}
+                  </div>
                   <div v-else-if="col.name === 'title'" class="table_ellipsis">
                     {{ props.row.title ? props.row.title : "-" }}
                   </div>

From 16ab4806a52e737115166387b5bbbb7140ce5c7d Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Mon, 24 Jun 2024 15:21:20 +0700
Subject: [PATCH 6/7] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=20=E0=B8=8A?=
 =?UTF-8?q?=E0=B8=B7=E0=B9=88=E0=B8=AD=20=E0=B8=AD=E0=B8=B2=E0=B8=88=20nul?=
 =?UTF-8?q?l?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ListRetirement/AddList.vue       |  7 +++++--
 .../components/ListRetirement/TableList.vue     | 17 ++++++++++++-----
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/modules/06_retirement/components/ListRetirement/AddList.vue b/src/modules/06_retirement/components/ListRetirement/AddList.vue
index cac1f34d0..458848879 100644
--- a/src/modules/06_retirement/components/ListRetirement/AddList.vue
+++ b/src/modules/06_retirement/components/ListRetirement/AddList.vue
@@ -132,6 +132,9 @@ const fecthProfile = async () => {
       );
       rows.value = res.data.result.data.map((e: any) => ({
         id: e.id,
+        prefix:e.prefix,
+        firstName:e.firstName,
+        lastName:e.lastName,
         fullname: e.prefix + e.firstName + " " + e.lastName,
         position: e.position,
         level:
@@ -265,10 +268,10 @@ const paginationLabel = (start: number, end: number, total: number) => {
             <q-tr :props="props" class="cursor-pointer">
               <q-td>{{ props.rowIndex + 1 }}</q-td>
               <q-td key="fullname" :props="props">
-                {{ props.row.fullname }}
+                {{ props.row.prefix ? props.row.prefix:'' }}{{ props.row.firstName ? props.row.firstName:'' }} {{ props.row.lastName ? props.row.lastName:'' }}
               </q-td>
               <q-td key="position" :props="props">
-                {{ props.row.position }}
+                {{ props.row.position ? props.row.position:'-' }}
               </q-td>
               <q-td key="level" :props="props">{{ props.row.level }}</q-td>
               <q-td
diff --git a/src/modules/06_retirement/components/ListRetirement/TableList.vue b/src/modules/06_retirement/components/ListRetirement/TableList.vue
index d7dc3d014..22da727f7 100644
--- a/src/modules/06_retirement/components/ListRetirement/TableList.vue
+++ b/src/modules/06_retirement/components/ListRetirement/TableList.vue
@@ -53,7 +53,7 @@ const dataProfile = ref<Object>([]);
 
 /** คอลัมน์ที่แสดง */
 const columns = ref<any["columns"]>([]);
-const rows = ref<any>([]);
+const rows = ref<any[]>([]);
 const visibleColumns = ref<string[]>([
   "order",
   "name",
@@ -101,6 +101,9 @@ const fecthlistprofile = async (id: string) => {
         id: e.id,
         profileId: e.profileId,
         order: e.order,
+        prefix: e.prefix,
+        firstName: e.firstName,
+        lastName: e.lastName,
         name: e.prefix + e.firstName + " " + e.lastName,
         organization: e.root,
         position: e.position,
@@ -629,7 +632,11 @@ function updatemodalPersonal(modal: boolean) {
               @click.stop="onclickViewinfo(props.row.profileId)"
             >
               <q-td key="order" :props="props">{{ props.row.order }} </q-td>
-              <q-td key="name" :props="props">{{ props.row.name }}</q-td>
+              <q-td key="name" :props="props"
+                >{{ props.row.prefix ? props.row.prefix : ""
+                }}{{ props.row.firstName ? props.row.firstName : "" }}
+                {{ props.row.lastName ? props.row.lastName : "" }}</q-td
+              >
               <!-- <q-td
                 class="table_ellipsis"
                 key="organizationOrganization"
@@ -637,7 +644,7 @@ function updatemodalPersonal(modal: boolean) {
                 >{{ props.row.organizationOrganization }}</q-td
               > -->
               <q-td key="position" :props="props">{{
-                props.row.position
+                props.row.position ? props.row.position:'-'
               }}</q-td>
               <q-td key="positionType" :props="props"
                 >{{ props.row.positionType ? props.row.positionType : "-" }}
@@ -649,7 +656,7 @@ function updatemodalPersonal(modal: boolean) {
               </q-td>
 
               <q-td key="positionNumber" :props="props">{{
-                props.row.positionNumber
+                props.row.positionNumber ? props.row.positionNumber:'-'
               }}</q-td>
               <!-- <q-td key="organizationAgency" :props="props">{{
                 props.row.organizationAgency
@@ -658,7 +665,7 @@ function updatemodalPersonal(modal: boolean) {
                 props.row.organizationGovernmentAgency
               }}</q-td> -->
               <q-td class="table_ellipsis" key="organization" :props="props">{{
-                props.row.organization
+                props.row.organization ? props.row.organization:'-'
               }}</q-td>
               <!-- <q-td class="table_ellipsis" key="bureau" :props="props">{{
                 props.row.bureau

From f893e834baabd23ae309a968c6bc0e6c17a92bc4 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Mon, 24 Jun 2024 15:52:06 +0700
Subject: [PATCH 7/7] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84?=
 =?UTF-8?q?=E0=B8=82=20manual=20=E0=B9=80=E0=B9=80=E0=B8=A5=E0=B8=B0?=
 =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=20layout?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app.config.ts        | 152 +++++++++++++++++++++++----------------
 src/views/MainLayout.vue |  18 +++--
 2 files changed, 103 insertions(+), 67 deletions(-)

diff --git a/src/app.config.ts b/src/app.config.ts
index 784c7001b..4ab46b8e9 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -138,68 +138,99 @@ const API = {
 };
 
 const path = "http://localhost:3008";
-const name = "";
+
+const generatePopupPath = (routeName: any) => {
+  if (routeName.includes("metadata")) {
+    return `${path}/manual/chapter-2-admin-metadata`;
+  }
+  if (routeName.includes("KPI")) {
+    return `${path}/manual/chapter-3-admin-evaluate`;
+  }
+  if (routeName.includes("compete")) {
+    return `${path}/manual/chapter-10-admin-recruit`;
+  }
+  if (routeName.includes("registryNew")) {
+    return `${path}/manual/chapter-7-admin-registry`;
+  }
+  if (routeName.includes("registry")) {
+    return `${path}/manual/chapter-7-admin-registry`;
+  }
+  if (routeName.includes("registry-employee")) {
+    return `${path}/manual/chapter-8-admin-registry-employee`;
+  }
+  if (routeName.includes("qualify")) {
+    return `${path}/manual/chapter-10-admin-recruit`;
+  }
+  if (routeName.includes("insignia")) {
+    return `${path}/manual/chapter-14-admin-insignia`;
+  }
+  if (routeName.includes("resign")) {
+    return `${path}/manual/chapter-13-admin-retirement`;
+  }
+  if (routeName.includes("retirement")) {
+    return `${path}/manual/chapter-13-admin-retirement`;
+  }
+  if (routeName.includes("deceased")) {
+    return `${path}/manual/chapter-13-admin-retirement`;
+  }
+  if (routeName.includes("exit-Interview")) {
+    return `${path}/manual/chapter-13-admin-retirement`;
+  }
+  if (routeName.includes("expulsion")) {
+    return `${path}/manual/chapter-13-admin-retirement`;
+  }
+  if (routeName.includes("discharged")) {
+    return `${path}/manual/chapter-13-admin-retirement`;
+  }
+  if (routeName.includes("discipline")) {
+    return `${path}/manual/chapter-16-admin-discipline`;
+  }
+  if (routeName.includes("appeal")) {
+    return `${path}/manual/chapter-16-admin-discipline`;
+  }
+  if (routeName.includes("evaluate")) {
+    return `${path}/manual/chapter-17-admin-KPI`;
+  }
+  if (routeName.includes("salary")) {
+    return `${path}/manual/chapter-18-admin-salary`;
+  }
+  if (routeName.includes("development")) {
+    return `${path}/manual/chapter-20-admin-development`;
+  } else {
+    return manualConfig[routeName as keyof typeof manualConfig];
+  }
+};
 
 const manualConfig = {
-  "/": `${path}/`,
-  "/KPI-indicator-plan": `${path}/manual/chapter-3-admin-evaluate`,
-  "/KPI-indicator-role": `${path}/manual/chapter-3-admin-evaluate`,
-  "/assignment": `${path}/manual/chapter-3-admin-evaluate`,
-  "/KPI-competency": `${path}/manual/chapter-3-admin-evaluate`,
-  "/strategic": `${path}/manual/chapter-3-admin-evaluate`,
-  "/organization-new": `${path}/manual/chapter-4-admin-organization`,
-  "/registry-new": `${path}/manual/chapter-7-admin-registry`,
-  "/registry-employee": `${path}/manual/chapter-8-admin-registry-employee`,
-  "/order": `${path}/manual/chapter-9-admin-order`,
-  "/compete/period": `${path}/manual/chapter-10-admin-recruit`,
-  "/compete/period/stat": `${path}/manual/chapter-10-admin-recruit`,
-  "/qualify/period": `${path}/manual/chapter-10-admin-recruit`,
-  "/disable/period": `${path}/manual/chapter-10-admin-recruit`,
-  "/qualify/manage": `${path}/manual/chapter-10-admin-recruit`,
-  "/qualify/period/stat": `${path}/manual/chapter-10-admin-recruit`,
-  "/qualify/disable/stat": `${path}/manual/chapter-10-admin-recruit`,
-  "/placement": `${path}/manual/chapter-11-admin-appointment`,
-  "/transfer": `${path}/manual/chapter-11-admin-appointment`,
-  "/receive": `${path}/manual/chapter-11-admin-appointment`,
-  "/help-government": `${path}/manual/chapter-11-admin-appointment`,
-  "/repatriate": `${path}/manual/chapter-11-admin-appointment`,
-  "/appoint-promote": `${path}/manual/chapter-11-admin-appointment`,
-  "/appoint-employee": `${path}/manual/chapter-11-admin-appointment`,
-  "/other": `${path}/manual/chapter-11-admin-appointment`,
-  "/probation": `${path}/manual/chapter-12-admin-probation`,
-  "/retirement": `${path}/manual/chapter-13-admin-retirement`,
-  "/retirement/resign": `${path}/manual/chapter-13-admin-retirement`,
-  "/exit-Interview": `${path}/manual/chapter-13-admin-retirement`,
-  "/deceased": `${path}/manual/chapter-13-admin-retirement`,
-  "/dismiss-order": `${path}/manual/chapter-13-admin-retirement`,
-  "/insignia/round-proposals": `${path}/manual/chapter-14-admin-insignia`,
-  "/insignia/manage/list-manage": `${path}/manual/chapter-14-admin-insignia`,
-  "/insignia/record": `${path}/manual/chapter-14-admin-insignia`,
-  "/insignia/allocate": `${path}/manual/chapter-14-admin-insignia`,
-  "/insignia/borrow": `${path}/manual/chapter-14-admin-insignia`,
-  "/insignia/report": `${path}/manual/chapter-14-admin-insignia`,
-  "/discipline/complaints": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline/investigatefacts": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline/disciplinary": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline-result": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline-suspend": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline-appealcomplain": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline-order": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline/director": `${path}/manual/chapter-16-admin-discipline`,
-  "/discipline/channel": `${path}/manual/chapter-16-admin-discipline`,
-  "/evaluate": `${path}/manual/chapter-17-admin-KPI`,
-  "/evaluate/director": `${path}/manual/chapter-17-admin-KPI`,
-  "/evaluate/meeting": `${path}/manual/chapter-17-admin-KPI`,
-  "/salary": `${path}/manual/chapter-18-admin-salary`,
-  "/salary-employee": `${path}/manual/chapter-18-admin-salary`,
-  "/salary/round": `${path}/manual/chapter-18-admin-salary`,
-  "/salary/lists": `${path}/manual/chapter-18-admin-salary`,
-  "/salary-employee/lists": `${path}/manual/chapter-18-admin-salary`,
-  "/salary/command": `${path}/manual/chapter-18-admin-salary`,
-  "/development": `${path}/manual/chapter-20-admin-development`,
-  "/development/history": `${path}/manual/chapter-20-admin-development`,
-  "/development/employee-history": `${path}/manual/chapter-20-admin-development`,
-  "/development/scholarship": `${path}/manual/chapter-20-admin-development`,
+  dashboard: `${path}/`,
+  strategic: `${path}/manual/chapter-3-admin-evaluate`,
+  organizationNew: `${path}/manual/chapter-4-admin-organization`,
+  organization: `${path}/manual/chapter-7-admin-registry`,
+  order: `${path}/manual/chapter-9-admin-order`,
+  OrderDetail: `${path}/manual/chapter-9-admin-order`,
+  OrderAdd: `${path}/manual/chapter-9-admin-order`,
+  disableperiod: `${path}/manual/chapter-10-admin-recruit`,
+  manage: `${path}/manual/chapter-10-admin-recruit`,
+  editorweb: `${path}/manual/chapter-10-admin-recruit`,
+  manageDetaill: `${path}/manual/chapter-10-admin-recruit`,
+  ExamForm: `${path}/manual/chapter-10-admin-recruit`,
+  Payment: `${path}/manual/chapter-10-admin-recruit`,
+  placement: `${path}/manual/chapter-11-admin-appointment`,
+  transfer: `${path}/manual/chapter-11-admin-appointment`,
+  receive: `${path}/manual/chapter-11-admin-appointment`,
+  "help-government": `${path}/manual/chapter-11-admin-appointment`,
+  repatriate: `${path}/manual/chapter-11-admin-appointment`,
+  "appoint-promote": `${path}/manual/chapter-11-admin-appointment`,
+  "appoint-employee": `${path}/manual/chapter-11-admin-appointment`,
+  other: `${path}/manual/chapter-11-admin-appointment`,
+  probation: `${path}/manual/chapter-12-admin-probation`,
+  retirement: `${path}/manual/chapter-13-admin-retirement`,
+  resign: `${path}/manual/chapter-13-admin-retirement`,
+  ExitInterviewEditQuestion: `${path}/manual/chapter-13-admin-retirement`,
+  "dismiss-order": `${path}/manual/chapter-13-admin-retirement`,
+  "report-report": `${path}/manual/chapter-14-admin-insignia`,
+  "report-report-01": `${path}/manual/chapter-14-admin-insignia`,
+  appealComplain: `${path}/manual/chapter-16-admin-discipline`,
 };
 
 export default {
@@ -209,4 +240,5 @@ export default {
   qualifyExamPanel,
   s3ClusterUrl,
   manualConfig,
+  generatePopupPath,
 };
diff --git a/src/views/MainLayout.vue b/src/views/MainLayout.vue
index bcd79c094..99d6962fd 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -476,13 +476,15 @@ watch(
 );
 
 const handleButtonClick = () => {
-  const currentPath = route.path;
-  const popupPath =
-    config.manualConfig[currentPath as keyof typeof config.manualConfig];
+  const currentPath = route.name;
+  // const popupPath =
+  //   config.manualConfig[currentPath as keyof typeof config.manualConfig];
+  const popupPath = config.generatePopupPath(currentPath);
   if (popupPath) {
+    // console.log(currentPath);
     window.open(popupPath);
   } else {
-    alert("No mapping found for this route");
+    console.log("no manual in this page ", currentPath);
   }
 };
 </script>
@@ -529,11 +531,13 @@ const handleButtonClick = () => {
           dense
           flat
           size="13px"
-          class="q-mx-md bg-grey-3"
+          class="bg-grey-3"
           :color="totalNoti === 0 ? 'grey-6' : 'grey-8'"
           @click="handleButtonClick()"
+          style="margin-right: 10px"
         >
-          <q-icon name="mdi-book" size="18px" color="grey-7" />
+          <q-icon name="mdi-book-open-variant" size="18px" color="grey-7" />
+          <q-tooltip>คู่มือ</q-tooltip>
         </q-btn>
         <!-- Notification -->
         <q-btn
@@ -541,7 +545,7 @@ const handleButtonClick = () => {
           dense
           flat
           size="13px"
-          class="q-mx-md bg-grey-3"
+          class="bg-grey-3"
           :color="totalNoti === 0 ? 'grey-6' : 'grey-8'"
         >
           <q-icon name="mdi-bell" size="18px" color="grey-7" />