diff --git a/src/api/06_retirement/api.retirement.ts b/src/api/06_retirement/api.retirement.ts
index d3dd56997..22c78de12 100644
--- a/src/api/06_retirement/api.retirement.ts
+++ b/src/api/06_retirement/api.retirement.ts
@@ -1,6 +1,6 @@
-/**
- * api พ้นจากราชการ
- */
 import env from "../index";
+const retirement = `${env.API_RETIREMENT_URI}/retirement`
 
-export default {};
+export default {
+    retirement:(type:string) => `${retirement}/${type}/2023`
+};
diff --git a/src/api/index.ts b/src/api/index.ts
index 292285657..4ca191632 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -25,6 +25,7 @@ const config = ref<any>({
     API_URI_ORG_TREE:
       "https://s3cluster.frappet.com/bma-ehr-fpt/organization/strueture/tree_20230712_172702.json",
     MEET_URI: "meet.frappet.com",
+    API_RETIREMENT_URI: "https://bma-ehr.frappet.synology.me/api/v1",
   },
   test: {
     API_URI: "http://localhost:5010/api/v1",
@@ -65,6 +66,9 @@ const API_URI_PROFILE_SERVICE = ref<string>(
 const API_PLACEMENT_URI = ref<string>(
   config.value[env.value].API_PLACEMENT_URI
 );
+const API_RETIREMENT_URI = ref<string>(
+  config.value[env.value].API_RETIREMENT_URI
+);
 const API_URI_ORG_TREE = ref<string>(config.value[env.value].API_URI_ORG_TREE);
 
 export default {
@@ -79,4 +83,5 @@ export default {
   API_PLACEMENT_URI: API_PLACEMENT_URI.value,
   API_URI_ORG_TREE: API_URI_ORG_TREE.value,
   MEET_URI: MEET_URI.value,
+  API_RETIREMENT_URI:API_RETIREMENT_URI.value,
 };
diff --git a/src/modules/06_retirement/interface/response/Main.ts b/src/modules/06_retirement/interface/response/Main.ts
index e4ea7770c..91abd91ef 100644
--- a/src/modules/06_retirement/interface/response/Main.ts
+++ b/src/modules/06_retirement/interface/response/Main.ts
@@ -1 +1,8 @@
-export type {};
+interface resMain{
+id:string;
+createdAt:Date;
+year:string;
+round:number;
+total:number;
+}
+export type {resMain};
diff --git a/src/modules/06_retirement/views/Main.vue b/src/modules/06_retirement/views/Main.vue
index dbe9044a2..f2411c8da 100644
--- a/src/modules/06_retirement/views/Main.vue
+++ b/src/modules/06_retirement/views/Main.vue
@@ -13,8 +13,8 @@
         indicator-color="primary"
         align="left"
       >
-        <q-tab name="samun" label="ขรก.กทม.สามัญ" />
-        <q-tab name="employee" label="ลูกจ้างประจำ" />
+        <q-tab name="samun" label="ขรก.กทม.สามัญ" @click="get('officer')"/>
+        <q-tab name="employee" label="ลูกจ้างประจำ" @click="get('employee')"/>
       </q-tabs>
     </div>
     <q-separator />
@@ -175,7 +175,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, useAttrs } from "vue";
+import { onMounted, ref, useAttrs } from "vue";
 import type { QTableProps } from "quasar";
 import type {
   FormMainProbation,
@@ -183,7 +183,13 @@ import type {
 } from "@/modules/05_placement/interface/request/Main";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
+import http from "@/plugins/http";
+import config from "@/app.config";
+import { useCounterMixin } from "@/stores/mixin"
+import type { resMain } from '@/modules/06_retirement/interface/response/Main'
 
+const mixin = useCounterMixin()
+const { messageError ,date2Thai,showLoader,hideLoader} = mixin
 const router = useRouter();
 const $q = useQuasar(); //ใช้ noti quasar
 const modal = ref<boolean>(false);
@@ -228,31 +234,35 @@ const columns = ref<QTableProps["columns"]>([
 ]);
 
 // ข้อมูลตาราง (จำลอง)
-const rows = ref<any>([
-  {
-    no: "1",
-    Date: "2022-9-31 ",
-    retireNumber: "5",
-  },
-  {
-    no: "2",
-    Date: "2022-9-15 ",
-    retireNumber: "7",
-  },
-  {
-    no: "3",
-    Date: "2022-8-31 ",
-    retireNumber: "15",
-  },
-  {
-    no: "4",
-    Date: "2022-9-25 ",
-    retireNumber: "20",
-  },
-]);
+const rows = ref<resMain[]>([]);
 const tab = ref<any>("samun");
 const visibleColumns2 = ref<string[]>(["no", "name", "retireNumber"]);
+const get = async(type:string) =>{
 
+  await http
+  .get(config.API.retirement(type))
+  .then((res)=>{
+    let data = res.data.result
+    console.log(data)
+     rows.value = data.map((items:resMain) =>({
+      id:items.id,
+      Date:date2Thai(items.createdAt),
+      year:items.year,
+      retireNumber:items.round,
+      total:items.total
+    }))
+    
+  }).catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader()
+    });
+
+}
+onMounted(()=>{
+  get
+})
 // หัวตาราง2
 const columns2 = ref<QTableProps["columns"]>([
   {
diff --git a/src/views/MainLayout.vue b/src/views/MainLayout.vue
index f75b39507..76ee21a07 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -68,7 +68,7 @@ const options = ref<optionType[]>([
  * ให้แสดง แทปด้านขวา เมื่อเข้าหน้า รายละเอียดทะเบียนประวัติ
  */
 const tabScroll = () => {
-  return route.name == "registryDetail" || route.name == "registryEmployeeAdd";
+  return route.name == "registryDetail";
 };
 
 /**
@@ -157,10 +157,7 @@ const updateScroll = (position: number) => {
  * ให้แสดง แทปด้านขวา เมื่อเข้าหน้า รายละเอียดทะเบียนประวัติ และ rightActive เท่ากับ true
  */
 const activeBtn = () => {
-  return (
-    (route.name == "registryDetail" || route.name == "registryEmployeeAdd") &&
-    rightActive.value
-  );
+  return route.name == "registryDetail" && rightActive.value;
 };
 
 /**
@@ -225,8 +222,7 @@ const myEventHandler = (e: any, setSCroll: boolean) => {
 const activeMenu = (path: string) => {
   if (path == "dashboard" && route.fullPath == "/") return true;
 
-  if (path == "registry" && route.fullPath.includes("registryEmployee"))
-    return false;
+  if (path == "registry" && route.fullPath == "/") return false;
   const bool = route.fullPath.includes(path);
   return bool;
 };