diff --git a/src/manual.json b/src/manual.json
new file mode 100644
index 000000000..58cab391d
--- /dev/null
+++ b/src/manual.json
@@ -0,0 +1,25 @@
+{
+  "/": "http://localhost:3008/",
+  "/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",
+  "/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",
+  "/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 45bfa957b..48287850a 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -9,6 +9,7 @@ import { useCounterMixin } from "@/stores/mixin";
 
 import http from "@/plugins/http";
 import config from "@/app.config";
+import manual from "@/manual.json";
 
 import type {
   ScrollType,
@@ -474,6 +475,16 @@ watch(
     }
   }
 );
+
+const handleButtonClick = () => {
+  const currentPath = route.path;
+  const popupPath = manual[currentPath as keyof typeof manual];
+  if (popupPath) {
+    window.open(popupPath);
+  } else {
+    alert("No mapping found for this route");
+  }
+};
 </script>
 
 <!-- โครงเว็บ -->
@@ -513,6 +524,17 @@ watch(
           <q-icon name="mdi-magnify" size="20px" color="grey-7" />
         </q-btn>
         -->
+        <q-btn
+          round
+          dense
+          flat
+          size="13px"
+          class="q-mx-md bg-grey-3"
+          :color="totalNoti === 0 ? 'grey-6' : 'grey-8'"
+          @click="handleButtonClick()"
+        >
+          <q-icon name="mdi-book" size="18px" color="grey-7" />
+        </q-btn>
         <!-- Notification -->
         <q-btn
           round