diff --git a/src/modules/06_retirement/components/resign/ResignByid.vue b/src/modules/06_retirement/components/resign/ResignByid.vue
index ac2e84749..23582e987 100644
--- a/src/modules/06_retirement/components/resign/ResignByid.vue
+++ b/src/modules/06_retirement/components/resign/ResignByid.vue
@@ -237,7 +237,7 @@ const conditionPopup = () => {
   }
 };
 
-//pop up ยืนยันการอนุมัติ
+//pop up ยืนยันการอนุญาต
 const confirmpopUp = async () => {
   dialogConfirm(
     $q,
@@ -248,7 +248,7 @@ const confirmpopUp = async () => {
       await http
         .put(config.API.resignConfirm(roleUser.value, id.value), body)
         .then(() => {
-          success($q, "การอนุมัติสำเร็จ");
+          success($q, "การอนุญาตสำเร็จ");
           closeModal();
         })
         .catch((e) => {
@@ -258,8 +258,8 @@ const confirmpopUp = async () => {
           fetchData(id.value);
         });
     },
-    "ยืนยันการอนุมัติ",
-    "ต้องการยืนยันการอนุมัติการลานี้หรือไม่ ?"
+    "ยืนยันการอนุญาต",
+    "ต้องการยืนยันการอนุญาตการลานี้หรือไม่ ?"
   );
 };
 
@@ -379,9 +379,9 @@ const getClass = (val: boolean) => {
 const statusOrder = (val: boolean) => {
   switch (val) {
     case true:
-      return "ยับยั้งการลาออก";
+      return "ยับยั้ง";
     case false:
-      return "อนุมัติการลาออก";
+      return "อนุญาต";
   }
 };
 
@@ -580,7 +580,7 @@ function removeFile(fileName: string) {
           dense
           icon-right="check"
           class="q-px-sm"
-          label="อนุมัติ"
+          label="อนุญาต"
           @click="popUp('pass')"
         />
         <q-btn
@@ -1282,7 +1282,7 @@ function removeFile(fileName: string) {
     <q-card style="width: 800px">
       <q-form ref="myFormConfirm">
         <DialogHeader
-          :title="`${actionPass ? 'การอนุมัติการลาออก' : 'การยับยั้งการลาออก'}`"
+          :title="`${actionPass ? 'อนุญาตการลาออก' : 'ยับยั้งการลาออก'}`"
           :close="closeModal"
         />
         <q-separator />
diff --git a/src/modules/09_leave/components/1_Work/Tab1.vue b/src/modules/09_leave/components/1_Work/Tab1.vue
index 0629258b9..2272dcc5a 100644
--- a/src/modules/09_leave/components/1_Work/Tab1.vue
+++ b/src/modules/09_leave/components/1_Work/Tab1.vue
@@ -22,7 +22,7 @@ import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
 const mixin = useCounterMixin();
 const workStore = useWorklistDataStore();
 const { date2Thai, dateToISO, showLoader, hideLoader, messageError } = mixin;
-
+const total = ref<number>(0);
 const $q = useQuasar(); //ใช้ noti quasar
 
 /** ตัวแปร querySting*/
@@ -137,6 +137,7 @@ async function fetchListTimeRecord() {
         `?startDate=${querySting.startDate}&endDate=${querySting.startDate}&status=${querySting.status}&page=${querySting.page}&pageSize=${querySting.pageSize}&keyword=${querySting.keyword}`
     )
     .then((res) => {
+      total.value = res.data.result.total;
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
       const datalist: TableRowsTime[] = res.data.result.data.map(
         (e: DataResTime) => ({
@@ -200,6 +201,7 @@ onMounted(async () => {
 <template>
   <ToolBar :filetStatus="filetStatus" @update:pagination="updatePaging" />
   <TableList
+    :total="total"
     :rows="rows.length > 0 ? rows : []"
     :page="page"
     :rowsPerPage="rowsPerPage"
diff --git a/src/modules/09_leave/components/1_Work/Tab2.vue b/src/modules/09_leave/components/1_Work/Tab2.vue
index f5596dfdd..f8d356799 100644
--- a/src/modules/09_leave/components/1_Work/Tab2.vue
+++ b/src/modules/09_leave/components/1_Work/Tab2.vue
@@ -19,6 +19,7 @@ import TableList from "@/modules/09_leave/components/1_Work/TableList.vue";
 import { useCounterMixin } from "@/stores/mixin";
 import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
 /** useStore */
+const total = ref<number>(0);
 const mixin = useCounterMixin();
 const workStore = useWorklistDataStore();
 const { date2Thai, dateToISO, showLoader, hideLoader, messageError } = mixin;
@@ -110,6 +111,7 @@ async function fetchListLogRecord() {
         }&pageSize=${rowsPerPage.value}&keyword=${keyword.value}`
     )
     .then((res) => {
+      total.value = res.data.result.total;
       maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
       let datalist: TableRows[] = res.data.result.data.map((e: DataResLog) => ({
         id: e.id,
@@ -160,6 +162,7 @@ onMounted(async () => {
   <ToolBarDate :keyword="keyword" @update:pagination="updatePagingProp" />
 
   <TableList
+    :total="total"
     :rows="rows.length > 0 ? rows : []"
     :page="page"
     :rowsPerPage="rowsPerPage"
diff --git a/src/modules/09_leave/components/1_Work/TableList.vue b/src/modules/09_leave/components/1_Work/TableList.vue
index cb742467b..6bf3cad48 100644
--- a/src/modules/09_leave/components/1_Work/TableList.vue
+++ b/src/modules/09_leave/components/1_Work/TableList.vue
@@ -35,6 +35,10 @@ const props = defineProps({
     type: Number,
     require: true,
   },
+  total: {
+    type: Number,
+    require: true,
+  },
   tab: {
     type: String,
     require: true,
@@ -188,6 +192,7 @@ onMounted(() => {
       </q-tr>
     </template>
     <template v-slot:pagination="scope">
+      ทั้งหมด {{ total }} รายการ
       <q-pagination
         v-model="currentPage"
         active-color="primary"
diff --git a/src/modules/14_KPI/components/results/tableResults.vue b/src/modules/14_KPI/components/results/tableResults.vue
index a1f2cf34d..26856dc89 100644
--- a/src/modules/14_KPI/components/results/tableResults.vue
+++ b/src/modules/14_KPI/components/results/tableResults.vue
@@ -1,12 +1,271 @@
 <script setup lang="ts">
+import { ref, watch } from "vue";
+import { useQuasar } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
+import type { ResResults } from "@/modules/14_KPI/interface/response/Main";
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+import { useKpiDataStore } from "@/modules/14_KPI/store";
+
+/**
+ * use
+ */
+const $q = useQuasar();
+const {
+  showLoader,
+  success,
+  messageError,
+  dialogConfirm,
+  hideLoader,
+  date2Thai,
+} = useCounterMixin();
+const { convertResults, convertStatus } = useKpiDataStore();
+
 /**
  * props
  */
 const tab = defineModel<string>("tab", { required: true });
+const rows = defineModel<ResResults[]>("row", { required: true });
+const page = defineModel<number>("page", { required: true });
+const pageSize = defineModel<number>("pageSize", { required: true });
+const maxPage = defineModel<number>("maxPage", { required: true });
+const total = defineModel<number>("total", { required: true });
+const keyword = defineModel<string>("keyword", { required: true });
+const porps = defineProps({
+  fetchData: { type: Function, required: true },
+});
+
+/**
+ * Table
+ */
+const columns = ref<QTableProps["columns"]>([
+  {
+    name: "no",
+    align: "left",
+    label: "ลำดับ",
+    sortable: false,
+    field: "no",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "fullName",
+    align: "left",
+    label: "ผู้รับการประเมิน",
+    sortable: true,
+    field: "fullName",
+    format: (val, row) => {
+      return `${row.prefix ?? ""}${row.firstname ?? ""} ${row.lastname ?? ""}`;
+    },
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "createdAt",
+    align: "left",
+    label: "วันที่สร้างแบบประเมิน",
+    sortable: true,
+    field: "createdAt",
+    headerStyle: "font-size: 14px",
+    format(val, row) {
+      return date2Thai(val);
+    },
+    style: "font-size: 14px",
+  },
+  {
+    name: "evaluationStatus",
+    align: "left",
+    label: "สถานะการประเมิน",
+    sortable: true,
+    field: "evaluationStatus",
+    format(val, row) {
+      return val === "KP7" ? "ประการผลแล้ว" : convertStatus(val);
+    },
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "evaluationResults",
+    align: "left",
+    label: "ผลการประเมิน",
+    sortable: true,
+    field: "evaluationResults",
+    format(val, row) {
+      return convertResults(val);
+    },
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+]);
+const visibleColumns = ref<string[]>([
+  "no",
+  "fullName",
+  "createdAt",
+  "evaluationStatus",
+  "evaluationResults",
+]);
+const pagination = ref({
+  page: page.value,
+  rowsPerPage: pageSize.value,
+});
+const selected = ref<ResResults[]>([]);
+
+/**
+ * function บันทึกการประกาศผล
+ */
+function onAnnounce() {
+  const ids = selected.value.map((item) => item.id);
+  dialogConfirm(
+    $q,
+    () => {
+      showLoader();
+      http
+        .post(config.API.evaluationUserDone, {
+          id: ids,
+        })
+        .then(() => {
+          setTimeout(async () => {
+            await porps.fetchData();
+            await success($q, "ประกาศผลสำเร็จ");
+            selected.value = [];
+          }, 1000);
+        })
+        .catch((err) => {
+          messageError($q, err);
+          hideLoader();
+        });
+    },
+    "ยืนยันการประกาศผล",
+    "ต้องการยืนยันการประกาศผลใช่หรือไม่?"
+  );
+}
+
+/**
+ * ค้นหาข้อมูล
+ */
+function onSearchData() {
+  page.value = 1;
+  porps.fetchData();
+}
+
+/**
+ * ทำงานเมื่อมีการเปลี่ยนแถวต่อหน้า
+ */
+watch(pagination, () => {
+  page.value = 1;
+  pageSize.value = pagination.value.rowsPerPage;
+});
 </script>
 
 <template>
-  {{ tab }}
+  <q-card-section>
+    <div class="items-center col-12 row q-gutter-x-sm q-mb-sm">
+      <q-space />
+
+      <q-input
+        borderless
+        dense
+        outlined
+        v-model="keyword"
+        placeholder="ค้นหา"
+        @keydown.enter="onSearchData"
+      >
+        <template v-slot:append>
+          <q-icon v-if="keyword === ''" name="search" />
+          <q-icon
+            v-else
+            name="clear"
+            class="cursor-pointer"
+            @click="(keyword = ''), onSearchData()"
+          />
+        </template>
+      </q-input>
+      <q-select
+        v-model="visibleColumns"
+        multiple
+        outlined
+        dense
+        options-dense
+        :display-value="$q.lang.table.columns"
+        emit-value
+        map-options
+        :options="columns"
+        option-value="name"
+        options-cover
+      />
+    </div>
+    <d-table
+      :columns="columns"
+      :rows="rows"
+      row-key="id"
+      :selection="tab === 'COMPLETE' ? 'multiple' : null"
+      v-model:selected="selected"
+      :rows-per-page-options="[10, 25, 50, 100]"
+      v-model:pagination="pagination"
+      :paging="true"
+    >
+      <template v-slot:header-selection="scope" v-if="tab === 'COMPLETE'">
+        <q-checkbox keep-color color="primary" dense v-model="scope.selected" />
+      </template>
+      <template v-slot:body="props">
+        <q-tr :props="props" class="cursor-pointer">
+          <q-td v-if="tab === 'COMPLETE'">
+            <q-checkbox
+              keep-color
+              color="primary"
+              dense
+              v-model="props.selected"
+            />
+          </q-td>
+          <q-td v-for="col in props.cols" :key="col.name" :props="props">
+            <div v-if="col.name == 'no'">
+              {{ (page - 1) * pageSize + props.rowIndex + 1 }}
+            </div>
+            <div v-else>
+              {{ col.value ?? "-" }}
+            </div>
+          </q-td>
+        </q-tr>
+      </template>
+      <template v-slot:pagination="scope">
+        ทั้งหมด {{ total }} รายการ
+        <q-pagination
+          v-model="page"
+          active-color="primary"
+          color="dark"
+          :max="Number(maxPage)"
+          size="sm"
+          boundary-links
+          direction-links
+          :max-pages="5"
+          @update:model-value="porps.fetchData()"
+        ></q-pagination>
+      </template>
+    </d-table>
+  </q-card-section>
+  <q-separator v-if="tab === 'COMPLETE'" />
+
+  <q-card-actions
+    align="right"
+    class="bg-white text-teal"
+    v-if="tab === 'COMPLETE'"
+  >
+    <q-btn
+      label="ประกาศผล"
+      color="public"
+      @click="onAnnounce"
+      :disable="selected.length === 0"
+    />
+  </q-card-actions>
 </template>
 
 <style scoped></style>
diff --git a/src/modules/14_KPI/interface/response/Main.ts b/src/modules/14_KPI/interface/response/Main.ts
index 2d8cea4d2..cc702b947 100644
--- a/src/modules/14_KPI/interface/response/Main.ts
+++ b/src/modules/14_KPI/interface/response/Main.ts
@@ -39,5 +39,19 @@ interface ResEvaluator {
   topic: string;
   type: string;
 }
+interface ResResults {
+  commanderHighId: string | null;
+  commanderId: string | null;
+  createdAt: string;
+  evaluationResults: string;
+  evaluationStatus: string;
+  evaluatorId: string;
+  firstname: string;
+  id: string;
+  kpiPeriodId: string;
+  lastname: string;
+  prefix: string;
+  profileId: string;
+}
 
-export type { ResRound, ResDataCapacity, ResEvaluator };
+export type { ResRound, ResDataCapacity, ResEvaluator, ResResults };
diff --git a/src/modules/14_KPI/store.ts b/src/modules/14_KPI/store.ts
index a581c53e9..4bbdf4d8f 100644
--- a/src/modules/14_KPI/store.ts
+++ b/src/modules/14_KPI/store.ts
@@ -128,7 +128,11 @@ export const useKpiDataStore = defineStore("KPIDataAdmin", () => {
     },
     {
       id: "COMPLETE",
-      name: "เสร็จสิ้น",
+      name: "รอประกาศผลการประเมิน",
+    },
+    {
+      id: "KP7",
+      name: "ประกาศและลงทะเบียนประวัติแล้ว",
     },
   ]);
 
@@ -339,6 +343,10 @@ export const useKpiDataStore = defineStore("KPIDataAdmin", () => {
         tabOpen.value = 4;
         tabMain.value = "4";
         break;
+      case "KP7":
+        tabOpen.value = 4;
+        tabMain.value = "4";
+        break;
       default:
         tabOpen.value = 1;
         tabMain.value = "1";
diff --git a/src/modules/14_KPI/views/detailView.vue b/src/modules/14_KPI/views/detailView.vue
index d300bbe90..c8418a60d 100644
--- a/src/modules/14_KPI/views/detailView.vue
+++ b/src/modules/14_KPI/views/detailView.vue
@@ -112,9 +112,9 @@ async function fetchEvaluation() {
     .catch((e) => {
       messageError($q, e);
     })
-  .finally(() => {
-    hideLoader();
-  });
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 async function fetchProfile(id: string) {
@@ -279,7 +279,7 @@ function filterOption(val: any, update: Function, refData: string) {
 // }
 async function getProfile() {
   await http
-    .get(config.API.profilePosition+`/${store.dataEvaluation.profileId}`)
+    .get(config.API.profilePosition + `/${store.dataEvaluation.profileId}`)
     .then(async (res) => {
       const data = await res.data.result;
       store.dataProfile = await data;
@@ -305,7 +305,7 @@ function sendToEvaluatore() {
       if (id.value) {
         showLoader();
         http
-          .put(config.API.kpiEvaluationUser+`/status/${id.value}`, {
+          .put(config.API.kpiEvaluationUser + `/status/${id.value}`, {
             status: "NEW_EVALUATOR",
           })
           .then((res) => {
@@ -804,7 +804,7 @@ onMounted(async () => {
                 store.tabOpen < 4 ||
                 (store.tabOpen == 4 &&
                   store.rolePerson === 'USER' &&
-                  store.dataEvaluation.evaluationStatus != 'COMPLETE')
+                  store.dataEvaluation.evaluationStatus != 'KP7')
               "
             />
             <q-tab name="5" label="ไฟล์เอกสาร" />
@@ -1095,4 +1095,4 @@ onMounted(async () => {
   top: 50%;
   transform: translateY(-50%);
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/modules/14_KPI/views/resultsMain.vue b/src/modules/14_KPI/views/resultsMain.vue
index e10b62667..c6be1b040 100644
--- a/src/modules/14_KPI/views/resultsMain.vue
+++ b/src/modules/14_KPI/views/resultsMain.vue
@@ -8,6 +8,7 @@ import config from "@/app.config";
  * import type
  */
 import type { ItemsTab } from "@/modules/14_KPI/interface/index/Main";
+import type { ResResults } from "@/modules/14_KPI/interface/response/Main";
 
 /**
  * import components
@@ -23,8 +24,7 @@ import { useCounterMixin } from "@/stores/mixin";
  *  use
  */
 const $q = useQuasar();
-const { dialogRemove, messageError, showLoader, hideLoader, success } =
-  useCounterMixin();
+const { messageError, showLoader, hideLoader } = useCounterMixin();
 
 /**
  * ตัวแปร
@@ -34,19 +34,31 @@ const tabItems = ref<ItemsTab[]>([
   { name: "COMPLETE", label: " รอประกาศผล" },
   { name: "KP7", label: "ประกาศผลแล้ว" },
 ]);
-
+const dataList = ref<ResResults[]>([]); // ข่อมูลรายการ
 const page = ref<number>(1);
 const pageSize = ref<number>(10);
+const maxPage = ref<number>(1);
+const total = ref<number>(1);
+const keyword = ref<string>("");
 
-function fetcDatahList() {
+/**
+ * function fetch รายการประกาศผล
+ */
+function fetcDataList() {
   showLoader();
   http
     .post(config.API.evaluationUser, {
       status: tab.value,
       page: page.value,
       pageSize: pageSize.value,
+      keyword: keyword.value,
+    })
+    .then((res) => {
+      const data = res.data.result;
+      dataList.value = data.data;
+      total.value = data.total;
+      maxPage.value = Math.ceil(total.value / pageSize.value);
     })
-    .then((res) => {})
     .catch((err) => {
       messageError($q, err);
     })
@@ -55,14 +67,27 @@ function fetcDatahList() {
     });
 }
 
+/**
+ * ทำงานเมื่อมีการเปลี่ยน Tab
+ */
 watch(tab, () => {
   page.value = 1;
-  pageSize.value = 10;
-  fetcDatahList();
+  keyword.value = "";
+  fetcDataList();
 });
 
+/**
+ * ทำงานเมื่อมีการเปลี่ยนแถวต่อหน้า
+ */
+watch(pageSize, () => {
+  fetcDataList();
+});
+
+/**
+ * HooK
+ */
 onMounted(() => {
-  fetcDatahList();
+  fetcDataList();
 });
 </script>
 
@@ -85,12 +110,30 @@ onMounted(() => {
     </q-tabs>
     <q-separator />
     <q-tab-panels v-model="tab" animated class="shadow-2 rounded-borders">
-      <q-tab-panel name="COMPLETE">
-        <TableResults :tab="tab" />
+      <q-tab-panel name="COMPLETE" style="padding: 0px">
+        <TableResults
+          :tab="tab"
+          :row="dataList"
+          v-model:page="page"
+          v-model:pageSize="pageSize"
+          v-model:maxPage="maxPage"
+          v-model:total="total"
+          v-model:keyword="keyword"
+          :fetchData="fetcDataList"
+        />
       </q-tab-panel>
 
-      <q-tab-panel name="KP7">
-        <TableResults :tab="tab" />
+      <q-tab-panel name="KP7" style="padding: 0px">
+        <TableResults
+          :tab="tab"
+          :row="dataList"
+          v-model:page="page"
+          v-model:pageSize="pageSize"
+          v-model:maxPage="maxPage"
+          v-model:total="total"
+          v-model:keyword="keyword"
+          :fetchData="fetcDataList"
+        />
       </q-tab-panel>
     </q-tab-panels>
   </q-card>
diff --git a/src/modules/15_development/components/ProjectDetail.vue b/src/modules/15_development/components/ProjectDetail.vue
index 49605bbbc..97d253ce1 100644
--- a/src/modules/15_development/components/ProjectDetail.vue
+++ b/src/modules/15_development/components/ProjectDetail.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, reactive, ref } from "vue";
+import { onMounted, reactive, ref, computed } from "vue";
 import { useQuasar } from "quasar";
 import { useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
@@ -17,9 +17,14 @@ import config from "@/app.config";
 
 const other1 = ref<boolean>(false);
 const other2 = ref<boolean>(false);
-const otherInput1 = ref<string>("");
-const otherInput2 = ref<string>("");
-
+const reasonPlanned = ref<string>("");
+const reasonActual = ref<string>("");
+const checkOtherBox = computed<boolean>(() => {
+  return formData.developmentProjectTechniquePlanneds.includes("อื่นๆ");
+});
+const checkOtherBox2 = computed<boolean>(() => {
+  return formData.developmentProjectTechniqueActuals.includes("อื่นๆ");
+});
 const $q = useQuasar();
 const store = useDevelopmentDataStore();
 const route = useRoute();
@@ -43,6 +48,8 @@ const projectTechniquesOp = ref<DataOptionTechnique[]>([
   { value: "การสัมมนาเชิงปฏิบัติการ", label: "การสัมมนาเชิงปฏิบัติการ" },
   { value: "การบรรยายพิเศษ", label: "การบรรยายพิเศษ" },
   { value: "การฝึกศึกษา", label: "การฝึกศึกษา" },
+  { value: "การบรรยาย", label: "การบรรยาย" },
+  { value: "อื่นๆ", label: "อื่นๆ" },
 ]);
 
 const formData = reactive<FormProjectDetail>({
@@ -130,6 +137,8 @@ function fetchData() {
 
       expanded.value = arrayExpanded.filter((e) => e !== null).slice(0, -1);
       expanded2.value = arrayExpanded2.filter((e) => e !== null).slice(0, -1);
+      reasonPlanned.value = data.reasonPlanned;
+      reasonActual.value = data.reasonActual;
     })
     .catch((err) => {
       messageError($q, err);
@@ -186,6 +195,8 @@ async function onSubmit() {
         strategyChildPlannedNode: formData.strategyChildPlannedNode,
         strategyChildActualId: formData.strategyChildActualId,
         strategyChildActualNode: formData.strategyChildActualNode,
+        reasonPlanned: reasonPlanned.value,
+        reasonActual: reasonActual.value,
       })
       .then(() => {
         success($q, "บันทึกข้อมูลสำเร็จ");
@@ -214,11 +225,11 @@ function updateSelected(data: DataStrategic, type: string) {
 }
 
 function checkOther(type: number, val: boolean) {
-  if(val == false){
-    if(type == 1){
-      otherInput1.value = ''
-    }else if(type == 2){
-      otherInput2.value = ''
+  if (val == false) {
+    if (type == 1) {
+      reasonPlanned.value = "";
+    } else if (type == 2) {
+      reasonActual.value = "";
     }
   }
 }
@@ -465,25 +476,17 @@ onMounted(() => {
                   type="checkbox"
                 />
               </div>
-              <div class="col-12 q-mb-lg">
+              <div class="col-12">
                 <div class="row">
-                  <div class="col-4 relative-position">
-                    <div class="other_custom">
-                      <q-checkbox
-                        v-model="other1"
-                        label="อื่นๆ"
-                        size="sm"
-                        color="primary"
-                        keep-color
-                        :disable="store.projectStatus === 'FINISH'"
-                        @update:model-value="checkOther(1, other1)"
-                      />
-                    </div>
-                  </div>
-
-                  <div class="col-8 relative-position">
-                    <div class="other_custom_input" v-if="other1 == true">
-                      <q-input v-model="otherInput1" dense outlined label="กรุณากรอก อื่นๆ"></q-input>
+                  <div class="offset-4 col-8 relative-position">
+                    <div class="other_custom_input" v-if="checkOtherBox">
+                      <q-input
+                        v-model="reasonPlanned"
+                        dense
+                        outlined
+                        class="inputgreen"
+                        label="กรุณาระบุ"
+                      ></q-input>
                     </div>
                   </div>
                 </div>
@@ -573,24 +576,17 @@ onMounted(() => {
                   type="checkbox"
                 />
               </div>
-              <div class="col-12 q-mb-lg">
+              <div class="col-12">
                 <div class="row">
-                  <div class="col-4 relative-position">
-                    <div class="other_custom">
-                      <q-checkbox
-                        v-model="other2"
-                        label="อื่นๆ"
-                        size="sm"
-                        color="primary"
-                        keep-color
-                        @update:model-value="checkOther(2, other2)"
-                      />
-                    </div>
-                  </div>
-
-                  <div class="col-8 relative-position">
-                    <div class="other_custom_input" v-if="other2 == true">
-                      <q-input v-model="otherInput2" dense outlined label="กรุณากรอก อื่นๆ"></q-input>
+                  <div class="offset-4 col-8 relative-position">
+                    <div class="other_custom_input" v-if="checkOtherBox2">
+                      <q-input
+                        v-model="reasonActual"
+                        dense
+                        outlined
+                        label="กรุณาระบุ"
+                        class="inputgreen"
+                      ></q-input>
                     </div>
                   </div>
                 </div>
@@ -641,7 +637,7 @@ onMounted(() => {
 }
 .other_custom_input {
   position: absolute;
-  top: -25px;
+  top: -45px;
   width: 100%;
 }
 </style>
diff --git a/src/modules/15_development/interface/index/Main.ts b/src/modules/15_development/interface/index/Main.ts
index 5cbce7425..b939579c2 100644
--- a/src/modules/15_development/interface/index/Main.ts
+++ b/src/modules/15_development/interface/index/Main.ts
@@ -74,13 +74,13 @@ interface FormProjectDetail {
   projectDayBackPlanned: string | null;
   projectDayHoldPlanned: string | null;
   projectNigthHoldPlanned: string | null;
-  developmentProjectTechniquePlanneds: [];
+  developmentProjectTechniquePlanneds: String[];
   isBackActual: boolean;
   isHoldActual: boolean;
   projectDayBackActual: string | null;
   projectDayHoldActual: string | null;
   projectNigthHoldActual: string | null;
-  developmentProjectTechniqueActuals: [];
+  developmentProjectTechniqueActuals: String[];
   projectModalActual?: string | null;
   projectModalPlanned?: string | null;
   strategyChildPlannedId?: string | null; //id ยุทธศาสตร์เป้าหมายตามแผน