diff --git a/src/api/KPI/api.kpis.ts b/src/api/KPI/api.kpis.ts
index c8e30b4..21f6403 100644
--- a/src/api/KPI/api.kpis.ts
+++ b/src/api/KPI/api.kpis.ts
@@ -1,5 +1,6 @@
 import env from "../index";
 
+const url = `${env.API_URI}/salary`;
 const kpiPeriod = `${env.API_URI}/kpi/period`;
 const kpiEvaluation = `${env.API_URI}/kpi/user/evaluation`;
 const kpiPlan = `${env.API_URI}/kpi/plan`;
@@ -11,4 +12,7 @@ export default {
   kpiPlan,
   KpiCapacity,
   file: KpiFile,
+
+  fileByFile: (name: string, group: string, id: string, fileName: string) =>
+    `${url}/file/${name}/${group}/${id}/${fileName}`,
 };
diff --git a/src/modules/08_KPI/interface/request/index.ts b/src/modules/08_KPI/interface/request/index.ts
index b869e94..dd8d0e6 100644
--- a/src/modules/08_KPI/interface/request/index.ts
+++ b/src/modules/08_KPI/interface/request/index.ts
@@ -1,22 +1,21 @@
 interface FormProfile {
   fullName: string;
-  prefix: string;
-  firstName: string;
-  lastName: string;
+
   position: string;
   type: string;
   level: string;
-  status: string;
+  status: string | undefined;
+  result: string | undefined;
   score: string;
 
-  avartar:string
+  avartar: string;
 }
 
-interface FormDataAssigned{
-  indicator:string
-  target:string
-  unit:string
-  weigth:string
-  definition:string
+interface FormDataAssigned {
+  indicator: string;
+  target: string;
+  unit: string;
+  weigth: string;
+  definition: string;
 }
-export type { FormProfile ,FormDataAssigned};
+export type { FormProfile, FormDataAssigned };
diff --git a/src/modules/08_KPI/store.ts b/src/modules/08_KPI/store.ts
index 5377131..5b85446 100644
--- a/src/modules/08_KPI/store.ts
+++ b/src/modules/08_KPI/store.ts
@@ -36,11 +36,39 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
     return competency?.name;
   }
 
+  function convertStatus(val: string) {
+    switch (val) {
+      case "PENDING":
+        return "รอดำเนินการ";
+      case "INPROGRESS":
+        return "กําลังดำเนินการ";
+      case "DONE":
+        return "ประเมินเสร็จสิ้น";
+      default:
+        break;
+    }
+  }
+
+  function convertResults(val: string) {
+    switch (val) {
+      case "PENDING":
+        return "รอดำเนินการ";
+      case "PASSED":
+        return "ผ่านการประเมิน";
+      case "NOTPASSED":
+        return "ไม่ผ่านการประเมิน";
+      default:
+        break;
+    }
+  }
+
   return {
     tabMain,
     dataProfile,
     dataEvaluation,
     competencyType,
     convertCompetencyType,
+    convertStatus,
+    convertResults,
   };
 });
diff --git a/src/modules/08_KPI/views/form.vue b/src/modules/08_KPI/views/form.vue
index cc3645c..36b21e2 100644
--- a/src/modules/08_KPI/views/form.vue
+++ b/src/modules/08_KPI/views/form.vue
@@ -19,16 +19,14 @@ const mixin = useCounterMixin();
 const { showLoader, hideLoader, messageError } = mixin;
 
 const formProfile = reactive<FormProfile>({
-  fullName: "นางสาวกัณฐิมา กาฬสินธุ์",
-  prefix: "นางสาว",
-  firstName: "กัณฐิมา",
-  lastName: "กาฬสินธุ์",
-  position: "หัวหน้าสำนักงาน",
-  type: "บริหาร",
-  level: "ชำนาญการพิเศษ",
-  status: "จัดเตรียมข้อมูล",
-  score: "100",
-  avartar: "https://cdn.quasar.dev/img/boy-avatar.png",
+  fullName: "",
+  position: "",
+  type: "",
+  level: "",
+  status: "",
+  result: "",
+  score: "-",
+  avartar: "",
 });
 
 const router = useRouter();
@@ -40,7 +38,9 @@ function fetchEvaluation() {
     .then((res) => {
       const data = res.data.result;
       store.dataEvaluation = data;
-      console.log(data);
+      formProfile.status = store.convertStatus(data.evaluationStatus);
+      formProfile.result = store.convertResults(data.evaluationResults);
+      fetchProfile(data.profileId);
     })
     .catch((e) => {
       messageError($q, e);
@@ -57,9 +57,11 @@ function getProfile() {
     .then((res) => {
       const data = res.data.result;
       store.dataProfile = data;
-      console.log(data);
 
       formProfile.fullName = `${data.prefix}${data.firstName} ${data.lastName}`;
+      formProfile.position = data.position;
+      formProfile.type = data.posTypeName;
+      formProfile.level = data.posLevelName;
     })
     .catch((e) => {
       messageError($q, e);
@@ -69,6 +71,23 @@ function getProfile() {
     });
 }
 
+async function fetchProfile(id: string) {
+  showLoader();
+  await http
+    .get(
+      config.API.fileByFile("ทะเบียนประวัติ", "โปรไฟล์", id, `profile-${id}`)
+    )
+    .then(async (res) => {
+      formProfile.avartar = res.data.downloadUrl;
+    })
+    .catch(() => {
+      // profilePicture.value = avatar;
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
 /** save */
 function onSave() {}
 
@@ -101,11 +120,11 @@ onMounted(() => {
       <div class="col-12">
         <q-card bordered flat class="relative-position">
           <div
-            class="absolute"
+            class="absolute-center-left"
             style="left: 2%; top: 50%; transform: translateY(-50%)"
           >
             <q-avatar size="95px">
-              <q-img :src="formProfile.avartar" />
+              <img :src="formProfile.avartar" />
             </q-avatar>
           </div>
           <div class="row col-12">
@@ -155,7 +174,7 @@ onMounted(() => {
                   </div>
                   <div class="col-2">
                     <div class="column">
-                      <span class="text-grey-6">ประเภท</span>
+                      <span class="text-grey-6">ประเภทตำแหน่ง</span>
                       <span class="text-weight-medium text-dark">{{
                         formProfile.type
                       }}</span>
@@ -163,7 +182,7 @@ onMounted(() => {
                   </div>
                   <div class="col-2">
                     <div class="column">
-                      <span class="text-grey-6">ระดับชั้นงาน</span>
+                      <span class="text-grey-6">ระดับตำแหน่ง</span>
                       <span class="text-weight-medium text-dark">{{
                         formProfile.level
                       }}</span>
@@ -177,6 +196,14 @@ onMounted(() => {
                       }}</span>
                     </div>
                   </div>
+                  <div class="col-2">
+                    <div class="column">
+                      <span class="text-grey-6">ผลการประเมิน</span>
+                      <span class="text-weight-medium text-dark">{{
+                        formProfile.result
+                      }}</span>
+                    </div>
+                  </div>
                   <div class="col-2">
                     <div class="column">
                       <span class="text-grey-6">คะแนนประเมิน</span>
@@ -202,4 +229,10 @@ onMounted(() => {
 .bg-toolbar {
   background-color: #f2fbfa;
 }
+
+.absolute-center-left {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
 </style>
diff --git a/src/modules/08_KPI/views/main.vue b/src/modules/08_KPI/views/main.vue
index 6e003f9..0bfd07f 100644
--- a/src/modules/08_KPI/views/main.vue
+++ b/src/modules/08_KPI/views/main.vue
@@ -11,9 +11,11 @@ import type { QTableProps } from "quasar";
 import DialogHeader from "@/components/DialogHeader.vue";
 
 import { useCounterMixin } from "@/stores/mixin";
+import { useKpiDataStore } from "@/modules/08_KPI/store";
 
 const $q = useQuasar();
 const mixin = useCounterMixin();
+const store = useKpiDataStore();
 const router = useRouter();
 const { showLoader, hideLoader, messageError, date2Thai, dialogConfirm } =
   mixin;
@@ -46,7 +48,7 @@ const columns = ref<QTableProps["columns"]>([
     field: "evaluationStatus",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format: (v) => convertStatus(v),
+    format: (v) => store.convertStatus(v),
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
@@ -58,7 +60,7 @@ const columns = ref<QTableProps["columns"]>([
     field: "evaluationResults",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    format: (v) => convertResults(v),
+    format: (v) => store.convertResults(v),
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
@@ -219,32 +221,6 @@ function updatePagination(newPagination: any) {
   formQuery.pageSize = newPagination.rowsPerPage;
 }
 
-function convertStatus(val: string) {
-  switch (val) {
-    case "PENDING":
-      return "รอดำเนินการ";
-    case "INPROGRESS":
-      return "กําลังดำเนินการ";
-    case "DONE":
-      return "ประเมินเสร็จสิ้น";
-    default:
-      break;
-  }
-}
-
-function convertResults(val: string) {
-  switch (val) {
-    case "PENDING":
-      return "รอดำเนินการ";
-    case "PASSED":
-      return "ผ่านการประเมิน";
-    case "NOTPASSED":
-      return "ไม่ผ่านการประเมิน";
-    default:
-      break;
-  }
-}
-
 watch(
   () => formQuery.pageSize,
   () => {