เลือกหน่วยงานที่รับบรรจุ

src/modules/05_placement/components/PersonalList/CardPosition.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, computed } from "vue";
+import { ref, onMounted, watch } from "vue";
 /** importType*/
 import type { QTableProps } from "quasar";
 
@@ -8,30 +8,38 @@ import type { DataPositionNo } from "@/modules/05_placement/interface/index/Sele
 
 import { useCounterMixin } from "@/stores/mixin";
 
-const { date2Thai } = useCounterMixin();
+const { date2Thai, showLoader, hideLoader } = useCounterMixin();
 
 const selected = defineModel("selectedPos", { required: true });
 const positionId = defineModel<string>("positionId", { required: true });
+const seletcId = defineModel<string>("seletcId", { required: true });
 const date = defineModel<Date>("datePos", { required: true });
-const props = defineProps({
-  position: {
-    type: Array(),
-    require: true,
-  },
-});
+const positionData = defineModel<any>("position", { required: true });
+// const props = defineProps({
+//   position: {
+//     type: Array(),
+//     require: true,
+//   },
+// });
 
 // const positionId = ref<string>("");
 const filters = ref<string>("");
 const rowsPosition = ref<Positions[]>([]);
 
-function onClickSelectPos(id: string) {
+async function onClickSelectPos(id: string) {
   positionId.value = id;
   selected.value = [];
-  const position: DataPositionNo = props.position?.find(
+
+  const position: DataPositionNo = positionData.value.find(
     (e: DataPositionNo) => e.id === id
   );
   if (position) {
-    rowsPosition.value = position.positions;
+    rowsPosition.value = await position.positions;
+    if (seletcId.value) {
+      selected.value = rowsPosition.value.filter(
+        (e) => e.id === seletcId.value
+      );
+    }
   }
 }
 
@@ -186,6 +194,18 @@ const visibleColumns = ref<string[]>([
   "posLevelName",
   "positionIsSelected",
 ]);
+
+onMounted(async () => {
+  if (positionId.value) {
+    showLoader();
+    setTimeout(async () => {
+      await onClickSelectPos(positionId.value);
+      await setTimeout(() => {
+        hideLoader();
+      }, 500);
+    }, 500);
+  }
+});
 </script>
 <template>
   <div class="column q-col-gutter-sm" style="height: 70vh">
@@ -230,7 +250,7 @@ const visibleColumns = ref<string[]>([
           <d-table
             ref="table"
             :columns="columns"
-            :rows="props.position"
+            :rows="positionData"
             :filter="filters"
             row-key="id"
             flat
@@ -285,7 +305,7 @@ const visibleColumns = ref<string[]>([
     </div>
 
     <!-- เลือกตำแหน่ง -->
-    <div class="col-5" v-if="positionId !== ''">
+    <div class="col-5">
       <q-card bordered style="height: 100%; border: 1px solid #d6dee1">
         <div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
           เลือกตำแหน่ง
@@ -300,7 +320,7 @@ const visibleColumns = ref<string[]>([
           transition-next="jump-up"
         >
           <q-tab-panel
-            v-for="(item, index) in props.position"
+            v-for="(item, index) in positionData"
             :key="index"
             :name="item.id"
           >
@@ -410,17 +430,6 @@ const visibleColumns = ref<string[]>([
                     </q-td>
                   </q-tr>
                 </template>
-                <!-- <template v-slot:pagination="scope">
-              <q-pagination
-                v-model="reqMaster.page"
-                active-color="primary"
-                color="dark"
-                :max="totalPage"
-                size="sm"
-                boundary-links
-                direction-links
-              ></q-pagination>
-            </template> -->
               </d-table>
             </div>
           </q-tab-panel>

src/modules/05_placement/components/PersonalList/DialogSelectOrg.vue

@@ -25,6 +25,7 @@ import { useSelectOrgStore } from "@/modules/05_placement/stores/storeSelect";
 const $q = useQuasar();
 const store = useSelectOrgStore();
 const {
+  success,
   showLoader,
   hideLoader,
   messageError,
@@ -41,6 +42,11 @@ const props = defineProps({
     type: Object,
     require: true,
   },
+  fetchTable: {
+    type: Function,
+    require: true,
+  },
+  fetchStatCard: { type: Function, require: true },
 });
 
 /** Tree*/
@@ -53,6 +59,7 @@ const expanded = ref<string[]>([]);
 
 const positionNo = ref<DataPositionNo[]>();
 const positionId = ref<string>("");
+const seletcId = ref<string>("");
 const selectedPos = ref<any[]>([]);
 const datePos = ref<Date>(new Date());
 
@@ -107,9 +114,18 @@ async function fetchDataTree(id: string) {
  * @param data ข่อมูล Tree
  */
 function updateSelected(data: TreeMain) {
+  console.log(props?.dataRow?.nodeId === data.orgTreeId);
+  if (props?.dataRow?.nodeId === data.orgTreeId) {
+    positionId.value = props?.dataRow?.posmasterId;
+    seletcId.value = props?.dataRow?.positionId;
+  } else {
+    positionId.value = "";
+    seletcId.value = "";
+    selectedPos.value = [];
+  }
+
   nodeId.value = data.orgTreeId ? data.orgTreeId : "";
   nodeLevel.value = data.orgLevel;
-  selectedPos.value = [];
   datePos.value = new Date();
   fetchDataTable(data.orgTreeId, data.orgLevel);
 }
@@ -146,19 +162,59 @@ async function fetchDataTable(id: string, level: number = 0) {
     .finally(() => {});
 }
 
+async function fetchPosFind(level: number, id: string) {
+  showLoader();
+  const body = {
+    node: level,
+    nodeId: id,
+  };
+  await http
+    .post(config.API.orgPosFind, body)
+    .then((res) => {
+      const data = res.data.result;
+      console.log(data);
+
+      expanded.value = data;
+      nodeId.value = id;
+      positionId.value = props?.dataRow?.posmasterId;
+      seletcId.value = props?.dataRow?.positionId;
+
+      fetchDataTable(nodeId.value, level);
+    })
+    .catch((e) => {
+      messageError($q, e);
+      hideLoader();
+    });
+}
+
 function onClickSubmit() {
   if (selectedPos.value.length === 0) {
     dialogMessageNotify($q, "กรุณาเลือกตำแหน่ง");
   } else {
-    dialogConfirm($q, () => {
+    dialogConfirm($q, async () => {
+      showLoader();
       const body = {
+        PersonalId: props?.dataRow?.personalId,
         node: nodeLevel.value,
         nodeId: nodeId.value,
         posmasterId: positionId.value,
         positionId: selectedPos.value[0].id,
         reportingDate: datePos.value,
       };
-      console.log(body);
+      await http
+        .post(config.API.placementPass(), body)
+        .then(() => {
+          success($q, "บันทึกข้อมูลสำเร็จ");
+          props.fetchStatCard?.();
+          props.fetchTable?.();
+          closePopup();
+        })
+        .catch((err) => {
+          messageError($q, err);
+        })
+        .finally(() => {
+          hideLoader();
+        });
     });
   }
 }
@@ -174,15 +230,13 @@ watch(
     if (modal.value) {
       showLoader();
       await fetchOrganizationActive();
-      // console.log(props.dataRow);
+      console.log(props.dataRow);
 
-      expanded.value = [];
-      // expanded.value = [
-      //   "c6164a42-539d-401a-b289-653282c08e37",
-      //   "277e5221-9c47-43ca-a7a5-0ba6e30039c4",
-      // ];
-      // nodeId.value = "c6164a42-539d-401a-b289-653282c08e37";
-      // fetchDataTable(nodeId.value);
+      if (props?.dataRow?.node !== null && props?.dataRow?.nodeId !== null) {
+        await fetchPosFind(props?.dataRow?.node, props?.dataRow?.nodeId);
+      } else {
+        expanded.value = [];
+      }
     } else {
       clearData();
     }
@@ -288,10 +342,11 @@ function filterItemsTaps(data: TreeMain[]) {
                 :name="item"
               >
                 <CardPosition
-                  :position="positionNo"
+                  v-model:position="positionNo"
                   v-model:selectedPos="selectedPos"
                   v-model:datePos="datePos"
                   v-model:positionId="positionId"
+                  v-model:seletcId="seletcId"
                 />
               </q-tab-panel>
             </q-tab-panels>

src/modules/05_placement/components/PersonalList/Table.vue

@@ -302,6 +302,10 @@ async function getTable() {
             deferment: data.deferment,
             draft: convertDraft(data.draft),
             positionCandidate: data.positionCandidate,
+            node: data.node,
+            nodeId: data.nodeId,
+            posmasterId: data.posmasterId,
+            positionId: data.positionId,
           };
           rowsAll.value.push(rowData);
         });
@@ -492,6 +496,8 @@ function openAppointModal(pid: string, data: DataList) {
   // personal.value = dataRes.value.filter(
   //   (e: any) => e.personalId == personalId.value
   // );
+  // console.log(personal.value);
+
   dataRow.value = data;
   modalDialogSelectOrg.value = !modalDialogSelectOrg.value;
 }
@@ -1222,7 +1228,12 @@ onMounted(async () => {
     </q-card>
   </q-dialog>
 
-  <DialogSelectOrg v-model:modal="modalDialogSelectOrg" :dataRow="dataRow" />
+  <DialogSelectOrg
+    v-model:modal="modalDialogSelectOrg"
+    :dataRow="dataRow"
+    :fetchTable="getTable"
+    :fetchStatCard="statCard"
+  />
 </template>
 
 <style lang="scss" scoped>

src/modules/05_placement/stores/storeSelect.ts

@@ -4,6 +4,10 @@ import { ref } from "vue";
 import type { PositionMaim } from "@/modules/05_placement/interface/response/SelectOrg";
 import type { DataPositionNo } from "@/modules/05_placement/interface/index/SelectOrg";
 export const useSelectOrgStore = defineStore("selectorg", () => {
+  // const node = ref<number>(0);
+  // const nodeId = ref<string>("");
+  // const posmasterId = ref<string>();
+
   function fetchPosNo(data: PositionMaim[]) {
     const listPosNo: DataPositionNo[] = data.map((e: PositionMaim) => ({
       id: e.id,
@@ -23,6 +27,7 @@ export const useSelectOrgStore = defineStore("selectorg", () => {
 
     return listPosNo;
   }
+
   return {
     fetchPosNo,
   };