diff --git a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue
index b8cb841..55bfe23 100644
--- a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue
+++ b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProblem.vue
@@ -13,6 +13,9 @@ import type {
 import { useRoute } from "vue-router";
 import { useQuasar } from "quasar";
 
+import { useKpiDataStore } from "@/modules/08_KPI/store";
+
+const store = useKpiDataStore();
 const $q = useQuasar();
 const route = useRoute();
 const id = ref<string>(route.params.id as string);
@@ -30,6 +33,7 @@ const modal = defineModel<boolean>("modal", { required: true });
 const type = defineModel<string>("type", { required: true });
 const idList = defineModel<string>("idList", { required: true });
 const modalAdd = ref<boolean>(false);
+const sendId = ref<string>("");
 
 const splitterModel = ref<number>(40);
 const listTarget = ref<any>([]);
@@ -60,6 +64,9 @@ const formDataView = reactive<FormCommentByRole>({
 
 let count = ref<number>(0);
 function clickList(index: string, data: any) {
+  // if (data.status == "DRAFT") {
+
+  // }
   listCheck.value = index as string;
 
   formDataView.id = data.id;
@@ -86,22 +93,40 @@ function clickList(index: string, data: any) {
   }, 100);
 }
 
+function onEdit(index: string, data: any) {
+  modalAdd.value = true;
+  sendId.value = data.id;
+  formDataAdd.topic = data.topic;
+  formDataAdd.reason = data.reason;
+}
+
 function onSubmitAdd() {
   dialogConfirm($q, () => {
     showLoader();
     http
       .put(
-        config.API.kpiCommentP("problem", type.value+sendType.value, "user", idList.value),
+        config.API.kpiCommentP(
+          "problem",
+          type.value + sendType.value,
+          "user",
+          sendId.value ? sendId.value : idList.value
+        ),
         {
           reason: formDataAdd.reason,
           topic: formDataAdd.topic,
         }
       )
-      .then((res) => {
-        console.log(res.data);
+      .then(async (res) => {
         success($q, "บันทึกข้อมูลสำเร็จ");
-        getList();
-        closeAdd();
+        if (sendId.value) {
+          const id = res.data.result;
+          await closeAdd();
+          const data = listTarget.value.find((item: any) => item.id == id);
+          clickList(id, data);
+        } else {
+          sendId.value = res.data.result;
+          getList();
+        }
       })
       .catch((e) => {
         messageError($q, e);
@@ -130,6 +155,8 @@ function closeAdd() {
   modalAdd.value = false;
   formDataAdd.topic = "";
   formDataAdd.reason = "";
+  sendId.value = "";
+  getList();
 }
 
 function getList() {
@@ -189,6 +216,28 @@ function onSubmitComment(role: string) {
   });
 }
 
+function statusText(val: string) {
+  switch (val) {
+    case "DRAFT":
+      return "แบบร่าง";
+    case "EVALUATOR":
+      return "ผู้ประเมิน";
+    case "COMMANDER":
+      return "ผู้บังคับบัญชาเหนือขึ้นไป";
+    case "COMMANDERHIGH":
+      return "ผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง";
+    case "DONE":
+      return "เสร็จสิ้น";
+
+    default:
+      return "";
+  }
+}
+
+function onNoti() {
+  listCheck.value = "";
+  count.value = 0;
+}
 watch(
   () => modal.value,
   () => {
@@ -214,6 +263,7 @@ watch(
             <template v-slot:before>
               <div class="q-pa-sm">
                 <q-btn
+                  v-if="store.rolePerson"
                   icon="add"
                   color="teal"
                   flat
@@ -245,12 +295,23 @@ watch(
                           v-ripple
                           :active="listCheck === item.id"
                           active-class="my-menu-link"
-                          @click="clickList(item.id, item)"
+                          @click="
+                            item.status == 'DRAFT'
+                              ? onNoti()
+                              : clickList(item.id, item)
+                          "
                         >
                           <q-item-section class="q-pa-none">
                             <div class="row items-center">
-                              <div class="col-12">
+                              <div class="col-12 row justify-between">
                                 <span>{{ item.topic }}</span>
+                                <q-badge
+                                  v-if="item.status == 'DRAFT'"
+                                  outline
+                                  color="grey"
+                                  label="แบบร่าง"
+                                  @click="onEdit(item.id, item)"
+                                />
                               </div>
                             </div>
                           </q-item-section>
@@ -278,19 +339,17 @@ watch(
                     size="lg"
                     color="primary"
                   />
-                  <p class="text-grey-9 q-pt-sm">
-                    กรุณาเลือกหัวข้อรายงานปัญหา
-                  </p>
+                  <p class="text-grey-9 q-pt-sm">กรุณาเลือกหัวข้อรายงานปัญหา</p>
                 </q-banner>
               </div>
               <div v-else>
                 <div class="row q-pa-md q-col-gutter-sm">
                   <div class="row col-12 text-weight-medium">
-                    <div class="col-4 text-grey-6">หัวข้อรายงานปัญหา</div>
+                    <div class="col-4 text-grey-6">หัวข้อความก้าวหน้า</div>
                     <div class="col-8">{{ formDataView.topic }}</div>
                   </div>
                   <div class="row col-12 text-weight-medium">
-                    <div class="col-4 text-grey-6">รายละเอียดรายงานปัญหา</div>
+                    <div class="col-4 text-grey-6">รายละเอียดความก้าวหน้า</div>
                     <div class="col-8">{{ formDataView.reason }}</div>
                   </div>
                   <div class="col-12">
@@ -299,11 +358,12 @@ watch(
 
                   <!-- ความคิดเห็นของผู้ประเมิน -->
                   <q-form
+                    v-if="store.dataEvaluation.evaluatorId"
                     ref="reasonEvaluatorRef"
                     greedy
                     @submit.prevent
                     @validation-success="onSubmitComment('evaluator')"
-                    class="full-width"
+                    class="full-width q-mt-sm"
                   >
                     <div class="row col-12 q-col-gutter-sm">
                       <div class="col-12">
@@ -315,7 +375,10 @@ watch(
                         <q-input
                           outlined
                           dense
-                          :readonly="formDataView.reasonEvaluator !== null"
+                          :readonly="
+                            formDataView.reasonEvaluator !== null ||
+                            store.rolePerson !== 'EVALUATOR'
+                          "
                           label="ความคิดเห็นของผู้ประเมิน"
                           v-model="reasonEvaluator"
                           type="textarea"
@@ -327,17 +390,18 @@ watch(
                       </div>
 
                       <div
-                        v-if="formDataView.reasonEvaluator == null"
+                        v-if="
+                          formDataView.reasonEvaluator == null &&
+                          store.rolePerson == 'EVALUATOR'
+                        "
                         class="col-12"
                         align="right"
                       >
                         <q-btn
-                          label="บันทึกและส่งให้ผู้บังคับ"
+                          label="บันทึกความคิดเห็น"
                           color="secondary"
                           type="submit"
-                          ><q-tooltip
-                            >บันทึกและส่งให้ผู้บังคับ</q-tooltip
-                          ></q-btn
+                          ><q-tooltip>บันทึกความคิดเห็น</q-tooltip></q-btn
                         >
                       </div>
                     </div>
@@ -345,7 +409,8 @@ watch(
 
                   <!-- ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป -->
                   <q-form
-                    class="full-width"
+                    v-if="store.dataEvaluation.commanderId"
+                    class="full-width q-mt-sm"
                     ref="reasonCommanderRef"
                     greedy
                     @submit.prevent
@@ -354,8 +419,7 @@ watch(
                     <div class="row col-12 q-col-gutter-sm">
                       <div class="col-12">
                         <span class="text-weight-medium text-grey-6"
-                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป
-                          (ถ้ามีผู้บังคับบัญชาเหนือขึ้นไป)</span
+                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป</span
                         >
                       </div>
                       <div class="col-12">
@@ -367,26 +431,36 @@ watch(
                           type="textarea"
                           class="inputgreen"
                           lazy-rules
-                          :readonly="formDataView.reasonCommander !== null"
+                          :readonly="
+                            formDataView.reasonCommander !== null ||
+                            store.rolePerson !== 'COMMANDER'
+                          "
                           hide-bottom-space
                           :rules="[(val:string) => !!val || `${'กรุณากรอกความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป'}`,]"
                         ></q-input>
                       </div>
 
                       <div
-                        v-if="formDataView.reasonCommander == null"
+                        v-if="
+                          formDataView.reasonCommander == null &&
+                          store.rolePerson == 'COMMANDER'
+                        "
                         class="col-12"
                         align="right"
                       >
-                        <q-btn label="บันทึก" color="secondary" type="submit"
-                          ><q-tooltip>บันทึก</q-tooltip></q-btn
+                        <q-btn
+                          label="บันทึกความคิดเห็น"
+                          color="secondary"
+                          type="submit"
+                          ><q-tooltip>บันทึกความคิดเห็น</q-tooltip></q-btn
                         >
                       </div>
                     </div>
                   </q-form>
 
                   <q-form
-                    class="full-width"
+                    v-if="store.dataEvaluation.commanderHighId"
+                    class="full-width q-mt-sm"
                     ref="reasonCommanderHighRef"
                     greedy
                     @submit.prevent
@@ -395,8 +469,7 @@ watch(
                     <div class="row col-12 q-col-gutter-sm">
                       <div class="col-12">
                         <span class="text-weight-medium text-grey-6"
-                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง
-                          (ถ้ามีผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง)</span
+                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง</span
                         >
                       </div>
                       <div class="col-12">
@@ -408,19 +481,28 @@ watch(
                           type="textarea"
                           class="inputgreen"
                           lazy-rules
-                          :readonly="formDataView.reasonCommanderHigh !== null"
+                          :readonly="
+                            formDataView.reasonCommanderHigh !== null ||
+                            store.rolePerson !== 'COMMANDERHIGH'
+                          "
                           hide-bottom-space
                           :rules="[(val:string) => !!val || `${'กรุณากรอกความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง'}`,]"
                         ></q-input>
                       </div>
 
                       <div
-                        v-if="formDataView.reasonCommanderHigh == null"
+                        v-if="
+                          formDataView.reasonCommanderHigh == null &&
+                          store.rolePerson == 'COMMANDERHIGH'
+                        "
                         class="col-12"
                         align="right"
                       >
-                        <q-btn label="บันทึก" color="secondary" type="submit"
-                          ><q-tooltip>บันทึก</q-tooltip></q-btn
+                        <q-btn
+                          label="บันทึกความคิดเห็น"
+                          color="secondary"
+                          type="submit"
+                          ><q-tooltip>บันทึกความคิดเห็น</q-tooltip></q-btn
                         >
                       </div>
                     </div>
@@ -437,7 +519,10 @@ watch(
   <q-dialog v-model="modalAdd" persistent>
     <q-card style="min-width: 30vw">
       <q-form greedy @submit.prevent @validation-success="onSubmitAdd">
-        <DialogHeader tittle="เพิ่มหัวข้อรายงานปัญหา" :close="closeAdd" />
+        <DialogHeader
+          :tittle="`${sendId ? 'แก้ไข' : 'เพิ่ม'}หัวข้อรายงานปัญหา`"
+          :close="closeAdd"
+        />
         <q-separator />
 
         <q-card-section>
@@ -470,7 +555,6 @@ watch(
           </div>
         </q-card-section>
         <q-separator />
-
         <q-card-actions align="right" class="bg-white text-teal">
           <q-btn
             label="บันทึกแบบร่าง"
@@ -484,6 +568,7 @@ watch(
             ><q-tooltip>บันทึกแบบร่าง</q-tooltip></q-btn
           >
           <q-btn
+            v-if="sendId !== ''"
             label="ส่งไปยังผู้ประเมิน"
             color="secondary"
             type="submit"
diff --git a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue
index 877b471..54b9870 100644
--- a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue
+++ b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue
@@ -12,7 +12,9 @@ import type {
 } from "@/modules/08_KPI/interface/request/index";
 import { useRoute } from "vue-router";
 import { useQuasar } from "quasar";
+import { useKpiDataStore } from "@/modules/08_KPI/store";
 
+const store = useKpiDataStore();
 const $q = useQuasar();
 const route = useRoute();
 const id = ref<string>(route.params.id as string);
@@ -98,7 +100,6 @@ function onSubmitAdd() {
         }
       )
       .then((res) => {
-        console.log(res.data);
         success($q, "บันทึกข้อมูลสำเร็จ");
         getList();
         closeAdd();
@@ -298,11 +299,12 @@ watch(
 
                   <!-- ความคิดเห็นของผู้ประเมิน -->
                   <q-form
+                    v-if="store.dataEvaluation.evaluatorId"
                     ref="reasonEvaluatorRef"
                     greedy
                     @submit.prevent
                     @validation-success="onSubmitComment('evaluator')"
-                    class="full-width"
+                    class="full-width q-mt-sm"
                   >
                     <div class="row col-12 q-col-gutter-sm">
                       <div class="col-12">
@@ -314,7 +316,10 @@ watch(
                         <q-input
                           outlined
                           dense
-                          :readonly="formDataView.reasonEvaluator !== null"
+                          :readonly="
+                            formDataView.reasonEvaluator !== null ||
+                            store.rolePerson !== 'EVALUATOR'
+                          "
                           label="ความคิดเห็นของผู้ประเมิน"
                           v-model="reasonEvaluator"
                           type="textarea"
@@ -326,17 +331,18 @@ watch(
                       </div>
 
                       <div
-                        v-if="formDataView.reasonEvaluator == null"
+                        v-if="
+                          formDataView.reasonEvaluator == null &&
+                          store.rolePerson == 'EVALUATOR'
+                        "
                         class="col-12"
                         align="right"
                       >
                         <q-btn
-                          label="บันทึกและส่งให้ผู้บังคับ"
+                          label="บันทึกความคิดเห็น"
                           color="secondary"
                           type="submit"
-                          ><q-tooltip
-                            >บันทึกและส่งให้ผู้บังคับ</q-tooltip
-                          ></q-btn
+                          ><q-tooltip>บันทึกความคิดเห็น</q-tooltip></q-btn
                         >
                       </div>
                     </div>
@@ -344,7 +350,8 @@ watch(
 
                   <!-- ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป -->
                   <q-form
-                    class="full-width"
+                    v-if="store.dataEvaluation.commanderId"
+                    class="full-width q-mt-sm"
                     ref="reasonCommanderRef"
                     greedy
                     @submit.prevent
@@ -353,8 +360,7 @@ watch(
                     <div class="row col-12 q-col-gutter-sm">
                       <div class="col-12">
                         <span class="text-weight-medium text-grey-6"
-                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป
-                          (ถ้ามีผู้บังคับบัญชาเหนือขึ้นไป)</span
+                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป</span
                         >
                       </div>
                       <div class="col-12">
@@ -366,26 +372,36 @@ watch(
                           type="textarea"
                           class="inputgreen"
                           lazy-rules
-                          :readonly="formDataView.reasonCommander !== null"
+                          :readonly="
+                            formDataView.reasonCommander !== null ||
+                            store.rolePerson !== 'COMMANDER'
+                          "
                           hide-bottom-space
                           :rules="[(val:string) => !!val || `${'กรุณากรอกความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไป'}`,]"
                         ></q-input>
                       </div>
 
                       <div
-                        v-if="formDataView.reasonCommander == null"
+                        v-if="
+                          formDataView.reasonCommander == null &&
+                          store.rolePerson == 'COMMANDER'
+                        "
                         class="col-12"
                         align="right"
                       >
-                        <q-btn label="บันทึก" color="secondary" type="submit"
-                          ><q-tooltip>บันทึก</q-tooltip></q-btn
+                        <q-btn
+                          label="บันทึกความคิดเห็น"
+                          color="secondary"
+                          type="submit"
+                          ><q-tooltip>บันทึกความคิดเห็น</q-tooltip></q-btn
                         >
                       </div>
                     </div>
                   </q-form>
 
                   <q-form
-                    class="full-width"
+                    v-if="store.dataEvaluation.commanderHighId"
+                    class="full-width q-mt-sm"
                     ref="reasonCommanderHighRef"
                     greedy
                     @submit.prevent
@@ -394,8 +410,7 @@ watch(
                     <div class="row col-12 q-col-gutter-sm">
                       <div class="col-12">
                         <span class="text-weight-medium text-grey-6"
-                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง
-                          (ถ้ามีผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง)</span
+                          >ความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง</span
                         >
                       </div>
                       <div class="col-12">
@@ -407,19 +422,28 @@ watch(
                           type="textarea"
                           class="inputgreen"
                           lazy-rules
-                          :readonly="formDataView.reasonCommanderHigh !== null"
+                          :readonly="
+                            formDataView.reasonCommanderHigh !== null ||
+                            store.rolePerson !== 'COMMANDERHIGH'
+                          "
                           hide-bottom-space
                           :rules="[(val:string) => !!val || `${'กรุณากรอกความคิดเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกขั้นหนึ่ง'}`,]"
                         ></q-input>
                       </div>
 
                       <div
-                        v-if="formDataView.reasonCommanderHigh == null"
+                        v-if="
+                          formDataView.reasonCommanderHigh == null &&
+                          store.rolePerson == 'COMMANDERHIGH'
+                        "
                         class="col-12"
                         align="right"
                       >
-                        <q-btn label="บันทึก" color="secondary" type="submit"
-                          ><q-tooltip>บันทึก</q-tooltip></q-btn
+                        <q-btn
+                          label="บันทึกความคิดเห็น"
+                          color="secondary"
+                          type="submit"
+                          ><q-tooltip>บันทึกความคิดเห็น</q-tooltip></q-btn
                         >
                       </div>
                     </div>
diff --git a/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue b/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue
index 05c62ce..11bc888 100644
--- a/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue
+++ b/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue
@@ -297,6 +297,7 @@ onMounted(() => {
                   store.rolePerson === 'USER'
                 "
               />
+              <q-th auto-width/>
             </q-tr>
           </template>
           <template v-slot:body="props">
@@ -358,7 +359,7 @@ onMounted(() => {
                   {{ col.value }}
                 </div>
               </q-td>
-              <q-td>
+              <q-td auto-width>
                 <div v-if="store.dataEvaluation.evaluationStatus == 'APPROVE'">
                   <q-btn
                     flat
@@ -436,6 +437,8 @@ onMounted(() => {
     v-model:dataListCriteria="dataListCriteria"
     :get-data="getData"
   />
+
+  
 </template>
 
 <style scoped>