แก้ไขโครงสร้าง

src/modules/02_organizationalNew/components/DialogNewStructure.vue

@@ -90,26 +90,33 @@ function validateForm() {
 
 /** ฟังชั่น บันทึก */
 function onSubmit() {
-  dialogConfirm($q, () => {
-    showLoader();
-    http
-      .post(config.API.createOrganization, formData)
-      .then((res) => {
-        status.value = true;
-        store.typeOrganizational = "draft";
-        store.draftId = res.data.result.id;
-        success($q, "บันทึกข้อมูลสำเร็จ");
-        // props.fetchActive?.();
-      })
-      .catch((err) => {
-        messageError($q, err);
-      })
-      .finally(async () => {
-        modal.value = await false;
-        await close();
-        await hideLoader();
-      });
-  });
+  dialogConfirm(
+    $q,
+    () => {
+      showLoader();
+      http
+        .post(config.API.createOrganization, formData)
+        .then((res) => {
+          status.value = true;
+          store.typeOrganizational = "draft";
+          store.draftId = res.data.result.id;
+          success($q, "บันทึกข้อมูลสำเร็จ");
+          // props.fetchActive?.();
+        })
+        .catch((err) => {
+          messageError($q, err);
+        })
+        .finally(async () => {
+          modal.value = await false;
+          await close();
+          await hideLoader();
+        });
+    },
+    "ยืนยันการเพิ่มโครงสร้าง",
+    store.draftId
+      ? "คุณมีแบบร่างอยู่หากคุณกดยืนยันระบบจะทำการลบแบบร่างเดิมและสร้างแบบร่างใหม่ ต้องการยืนยันการเพิ่มโครงสร้างนี้ใช่หรือไม่?"
+      : "ต้องการยืนยันการเพิ่มโครงสร้างนี้ใช่หรือไม่?"
+  );
 }
 
 function close() {

src/modules/02_organizationalNew/components/listView.vue

@@ -196,6 +196,28 @@ watch(
           </div>
 
           <div v-else class="col-12 row items-center">
+            <!-- summary -->
+            <div
+              v-if="nodeId"
+              class="row col-12 justify-between list-summary q-gutter-xs bg-grey-1"
+            >
+              <div class="row col q-pa-sm item">
+                <div class="ellipsis">ตำแหน่งทั้งหมด</div>
+                <q-space />
+                <q-badge color="secondary" :label="store.sumPosition.total" />
+              </div>
+              <div class="row col q-pa-sm item bg-grey-1">
+                <div class="ellipsis">ตำแหน่งที่มีคนครอง</div>
+                <q-space />
+                <q-badge color="primary" :label="store.sumPosition.use" />
+              </div>
+              <div class="row col q-pa-sm item bg-grey-1">
+                <div class="ellipsis">ตำแหน่งว่าง</div>
+                <q-space />
+                <q-badge color="red" :label="store.sumPosition.vacant" />
+              </div>
+            </div>
+
             <TableView
               v-if="nodeId !== ''"
               v-model:nodeTree="nodeTree"
@@ -220,4 +242,10 @@ watch(
   </div>
 </template>
 
-<style scoped></style>
+<style scoped>
+.list-summary .item {
+  border: 1px solid rgb(231, 231, 231);
+  border-radius: 4px;
+  background-color: white;
+}
+</style>

src/modules/02_organizationalNew/components/mainTree.vue

@@ -100,14 +100,22 @@ const orgLevel = ref<number>(0);
 const type = ref<number>(0);
 const orgId = ref<string>("");
 
-const updateSelected = (id: string, level: number) => {
-  store.treeId = id;
-  store.level = level;
-  if (id === nodeId.value) {
+const updateSelected = (data: any) => {
+  store.treeId = data.orgTreeId;
+  store.level = data.orgLevel;
+  if (data.orgTreeId === nodeId.value) {
     nodeId.value = "";
   } else {
-    nodeId.value = id ? id : "";
-    id && props.fetchDataTable?.(id, level, true);
+    nodeId.value = data.orgTreeId ? data.orgTreeId : "";
+    data.orgTreeId &&
+      props.fetchDataTable?.(data.orgTreeId, data.orgLevel, true);
+    store.getSumPosition({
+      totalPosition: data.totalPosition,
+      totalPositionCurrentUse: data.totalPositionCurrentUse,
+      totalPositionCurrentVacant: data.totalPositionCurrentVacant,
+      totalPositionNextUse: data.totalPositionNextUse,
+      totalPositionNextVacant: data.totalPositionNextVacant,
+    });
   }
 };
 
@@ -353,7 +361,7 @@ onMounted(async () => {});
 
             <div
               class="row items-center q-px-xs q-pt-xs q-gutter-sm"
-              @click="updateSelected(prop.node.orgTreeId, prop.node.orgLevel)"
+              @click="updateSelected(prop.node)"
             >
               <!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
               <div>