diff --git a/src/api/02_organizational/api.organization.ts b/src/api/02_organizational/api.organization.ts
index 19a34b306..91bc7790d 100644
--- a/src/api/02_organizational/api.organization.ts
+++ b/src/api/02_organizational/api.organization.ts
@@ -35,6 +35,8 @@ export default {
   orgPosPositionExecutive: () => `${orgPos}/position/executive`,
   orgPosExecutive: `${orgPos}/executive`,
   orgPosType: `${orgPos}/type`,
+  orgPosTypeSearch: `${orgPos}/position/search`,
+
   orgPosTypeId: (id: string) => `${orgPos}/type/${id}`,
   orgPosLevel: `${orgPos}/level`,
   orgPosMaster: `${orgPos}/master`,
@@ -66,7 +68,8 @@ export default {
 
   // ค้นหาคนตามเงื่อนไข
   orgSearchPersonal: () => `${organization}/profile/search-personal`,
-  orgSearchPersonalByType: (type:string) => `${organization}/profile${type}/search-personal`,
+  orgSearchPersonalByType: (type: string) =>
+    `${organization}/profile${type}/search-personal`,
 
   /** บรรจุแต่งตั้ง*/
   orgPosPlacement: `${orgPos}/placement/search`,
@@ -158,5 +161,5 @@ export default {
 
   keycloakLogSSO: `${organization}/keycloak/log/sso`,
 
-  reportOrgByType:(type:string)=>`${reportOrg}/registry-${type}`
+  reportOrgByType: (type: string) => `${reportOrg}/registry-${type}`,
 };
diff --git a/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue b/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue
index 79707be3d..81466990d 100644
--- a/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue
+++ b/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue
@@ -142,12 +142,13 @@ const columnsPosition = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+
   {
-    name: "position",
+    name: "highDegree",
     align: "left",
-    label: "ตำแหน่ง",
+    label: "ประเภทตำแหน่ง",
     sortable: true,
-    field: "position",
+    field: "highDegree",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
@@ -165,16 +166,17 @@ const columnsPosition = ref<QTableProps["columns"]>([
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "highDegree",
+    name: "position",
     align: "left",
-    label: "ประเภทตำแหน่ง",
+    label: "ตำแหน่ง",
     sortable: true,
-    field: "highDegree",
+    field: "position",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+
   {
     name: "type",
     align: "left",
@@ -358,18 +360,32 @@ async function fetchPositionLevel() {
  * @param update Function #quasar
  * @param refData เเยก case
  */
-function filterSelector(val: any, update: Function, refData: string) {
+function filterSelector(val: string, update: Function, refData: string) {
   switch (refData) {
-    case "positionLevel":
+    case "positionLevel1":
       update(() => {
-        positionLevelOptions.value = positionLevelFilters.value.filter(
+        optionPosLevel1.value = filterOptionPosLevel1.value.filter(
           (v: DataOption2) => v.name.indexOf(val) > -1
         );
       });
       break;
-    case "position":
+    case "positionLevel2":
       update(() => {
-        positionPathOptions.value = positionPathFilters.value.filter(
+        optionPosLevel2.value = filterOptionPosLevel2.value.filter(
+          (v: DataOption2) => v.name.indexOf(val) > -1
+        );
+      });
+      break;
+    case "position1":
+      update(() => {
+        optionPosType1.value = filterOptionPosType1.value.filter(
+          (v: DataOption2) => v.name.indexOf(val) > -1
+        );
+      });
+      break;
+    case "position2":
+      update(() => {
+        optionPosType2.value = filterOptionPosType2.value.filter(
           (v: DataOption2) => v.name.indexOf(val) > -1
         );
       });
@@ -495,16 +511,16 @@ async function editData(id: string) {
   showLoader();
   await http
     .put(config.API.periodExamId(id), sendData())
-    .then(async (res) => {
-      success($q, "แก้ไขรอบคัดเลือกสำเร็จ");
+    .then(async () => {
       await uploadImgData();
       await uploadDocData();
+      success($q, "แก้ไขรอบคัดเลือกสำเร็จ");
       await clickBack();
     })
     .catch((e) => {
       messageError($q, e);
     })
-    .finally(async () => {
+    .finally(() => {
       hideLoader();
     });
 }
@@ -656,7 +672,7 @@ function clickAddPosition() {
         position: null,
         type: { id: "normol", name: "ทั่วไป" },
         code: null,
-        highDegree: "0",
+        highDegree: "",
       });
     }
   });
@@ -704,6 +720,86 @@ function clearDateAnnounce() {
   dateAnnounce.value = null;
 }
 
+const mainDataPosLevel = ref<any[]>([]);
+const optionPosLevel1 = ref<any[]>([]);
+const filterOptionPosLevel1 = ref<any[]>([]);
+
+const optionPosLevel2 = ref<any[]>([]);
+const filterOptionPosLevel2 = ref<any[]>([]);
+
+async function fetchPositionType() {
+  http
+    .get(config.API.orgPosType)
+    .then((res) => {
+      mainDataPosLevel.value = res.data.result.filter(
+        (e: any) => e.posTypeRank <= 2
+      );
+
+      const getDataByRank = (rank: number) => {
+        const data =
+          res.data.result.find((e: any) => e.posTypeRank === rank)?.posLevels ||
+          [];
+        return data
+          .filter((e: any) => e.posLevelRank === 1)
+          .map((e: any) => ({
+            id: e.id.toString(),
+            name: e.posLevelName.toString(),
+            level: e.posLevelRank,
+          }));
+      };
+
+      optionPosLevel1.value = getDataByRank(1);
+      filterOptionPosLevel1.value = getDataByRank(1);
+      optionPosLevel2.value = getDataByRank(2);
+      filterOptionPosLevel2.value = getDataByRank(2);
+
+      fetchPosition(1);
+      fetchPosition(2);
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+const optionPosType1 = ref<any[]>([]);
+const filterOptionPosType1 = ref<any[]>([]);
+
+const optionPosType2 = ref<any[]>([]);
+const filterOptionPosType2 = ref<any[]>([]);
+
+function fetchPosition(level: number) {
+  http
+    .post(config.API.orgPosTypeSearch, {
+      posType: mainDataPosLevel.value.find((e: any) => e.posTypeRank === level)
+        .id,
+      posLevel:
+        level === 1 ? optionPosLevel1.value[0].id : optionPosLevel2.value[0].id,
+    })
+    .then((res) => {
+      const option: DataOption2[] = res.data.result.map((r: any) => ({
+        id: r.id.toString(),
+        name: r.positionName.toString(),
+      }));
+
+      if (level === 1) {
+        optionPosType1.value = option;
+        filterOptionPosType1.value = option;
+      } else if (level === 2) {
+        optionPosType2.value = option;
+        filterOptionPosType2.value = option;
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+function onUpdateHighDegree(val: string, index: string) {
+  rowsPosition.value[index].position = null;
+  rowsPosition.value[index].level =
+    val === "0" ? optionPosLevel1.value[0] : optionPosLevel2.value[0];
+}
+
 watch(fee, () => {
   if (fee.value <= 0) {
     pay.value = "";
@@ -720,6 +816,7 @@ onMounted(async () => {
     pay.value = "";
     edit.value = false;
   }
+  await fetchPositionType();
   await fetchPositionPath();
   await fetchPositionLevel();
 });
@@ -1093,82 +1190,7 @@ onMounted(async () => {
                         mask="###"
                       />
                     </q-td>
-                    <q-td key="position" :props="props">
-                      <selector
-                        class=""
-                        outlined
-                        :readonly="checkRoutePermisson"
-                        use-input
-                        v-model="props.row.position"
-                        :options="positionPathOptions"
-                        option-value="id"
-                        option-label="name"
-                        input-debounce="0"
-                        dense
-                        hide-bottom-space
-                        lazy-rules
-                        :rules="[(val:any) => !!val || `${'กรุณาเลือกตำแหน่ง'}`]"
-                        @filter="(inputValue:any,
-                            doneFn:Function) => filterSelector(inputValue, doneFn,'position'
-                        ) "
-                      >
-                        <template v-slot:option="scope">
-                          <q-item v-bind="scope.itemProps">
-                            <q-item-section>
-                              <q-item-label>{{ scope.opt.name }}</q-item-label>
-                            </q-item-section>
-                          </q-item>
-                        </template>
-                        <template v-slot:selected-item="scope">
-                          ตำแหน่ง:
-                          <q-chip
-                            dense
-                            square
-                            class="q-my-none q-ml-xs q-mr-none"
-                          >
-                            {{ scope.opt.name }}
-                          </q-chip>
-                        </template>
-                      </selector>
-                    </q-td>
-                    <q-td key="level" :props="props">
-                      <selector
-                        class=""
-                        outlined
-                        use-input
-                        v-model="props.row.level"
-                        :readonly="checkRoutePermisson"
-                        :options="positionLevelOptions"
-                        option-value="id"
-                        option-label="name"
-                        input-debounce="0"
-                        dense
-                        hide-bottom-space
-                        lazy-rules
-                        :rules="[(val:any) => !!val || `${'กรุณาเลือกระดับ'}`]"
-                        @filter="(inputValue:any,
-                            doneFn:Function) => filterSelector(inputValue, doneFn,'positionLevel'
-                        ) "
-                      >
-                        <template v-slot:option="scope">
-                          <q-item v-bind="scope.itemProps">
-                            <q-item-section>
-                              <q-item-label>{{ scope.opt.name }}</q-item-label>
-                            </q-item-section>
-                          </q-item>
-                        </template>
-                        <template v-slot:selected-item="scope">
-                          ระดับ:
-                          <q-chip
-                            dense
-                            square
-                            class="q-my-none q-ml-xs q-mr-none"
-                          >
-                            {{ scope.opt.name }}
-                          </q-chip>
-                        </template>
-                      </selector>
-                    </q-td>
+
                     <q-td key="highDegree" :props="props">
                       <q-radio
                         v-model="props.row.highDegree"
@@ -1176,6 +1198,12 @@ onMounted(async () => {
                         color="teal"
                         :disable="checkRoutePermisson"
                         val="0"
+                        @update:model-value="
+                          onUpdateHighDegree(
+                            props.row.highDegree,
+                            props.rowIndex
+                          )
+                        "
                       />
                       <q-radio
                         v-model="props.row.highDegree"
@@ -1183,8 +1211,82 @@ onMounted(async () => {
                         color="teal"
                         :disable="checkRoutePermisson"
                         val="1"
+                        @update:model-value="
+                          onUpdateHighDegree(
+                            props.row.highDegree,
+                            props.rowIndex
+                          )
+                        "
                       />
                     </q-td>
+                    <q-td key="level" :props="props">
+                      <selector
+                        :disable="props.row.highDegree === ''"
+                        class=""
+                        outlined
+                        use-input
+                        v-model="props.row.level"
+                        :readonly="checkRoutePermisson"
+                        :options="
+                          props.row.highDegree === '0'
+                            ? optionPosLevel1
+                            : optionPosLevel2
+                        "
+                        option-value="id"
+                        option-label="name"
+                        input-debounce="0"
+                        dense
+                        hide-bottom-space
+                        lazy-rules
+                        :rules="[(val:any) => !!val || `${'กรุณาเลือกระดับ'}`]"
+                        @filter="(inputValue:string,
+                            doneFn:Function) => filterSelector(inputValue, doneFn,  props.row.highDegree === '0' ? 'positionLevel1':'positionLevel2'
+                        ) "
+                      >
+                        <template v-slot:option="scope">
+                          <q-item v-bind="scope.itemProps">
+                            <q-item-section>
+                              <q-item-label>{{ scope.opt.name }}</q-item-label>
+                            </q-item-section>
+                          </q-item>
+                        </template>
+                      </selector>
+                    </q-td>
+
+                    <q-td key="position" :props="props">
+                      <selector
+                        :disable="props.row.highDegree === ''"
+                        class=""
+                        outlined
+                        :readonly="checkRoutePermisson"
+                        use-input
+                        v-model="props.row.position"
+                        :options="
+                          props.row.highDegree === '0'
+                            ? optionPosType1
+                            : optionPosType2
+                        "
+                        option-value="id"
+                        option-label="name"
+                        input-debounce="0"
+                        dense
+                        hide-bottom-space
+                        lazy-rules
+                        :rules="[(val:any) => !!val || `${'กรุณาเลือกตำแหน่ง'}`]"
+                        @filter="(inputValue:string,
+                            doneFn:Function) => filterSelector(inputValue, doneFn, props.row.highDegree === '0' ? 'position1' :'position2'
+                        ) "
+                      >
+                        <template v-slot:option="scope">
+                          <q-item v-bind="scope.itemProps">
+                            <q-item-section>
+                              <q-item-label>{{ scope.opt.name }}</q-item-label>
+                            </q-item-section>
+                          </q-item>
+                        </template>
+                      </selector>
+                    </q-td>
+
                     <q-td key="type" :props="props">
                       <selector
                         class=""