pop up จัดลำดับการแสดงผล

src/api/02_organizational/api.organization.ts

@@ -12,4 +12,5 @@ export default {
 
   orgSetDateTime:(id:string) => `${organization}/set/publish/${id}`,
   organizationHistoryNew: `${organization}/history`,
+  organizationShortName: `${organization}/sort`,
 };

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

@@ -24,7 +24,6 @@ const { dialogConfirm, showLoader, success, hideLoader, messageError } =
 
 const modal = defineModel<boolean>("sortAgency", { required: true });
 const modalSort = defineModel<Array<any>>("data", { required: true });
-const modalType = defineModel<number>("type", { required: true });
 const rows = ref<any>([]);
 const columns = ref<QTableProps["columns"]>([
   {
@@ -49,39 +48,38 @@ function save() {
   dialogConfirm($q, () => {
     const data = rows.value;
     const dataId = data.map((item: any) => item.orgTreeId);
-    console.log(dataId);
+    http
+      .put(config.API.organizationShortName, {
+        id: data[0].orgLevel === 0 ? data[0].orgRevisionId : data[0].orgRootId,
+        type: data[0].orgLevel,
+        sortId: dataId,
+      })
+      .then((res) => {
+        modal.value = false;
+        success($q, "บันทึกข้อมูลสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+      })
+      .finally(() => {});
   });
 }
 watch(
   () => modal.value,
   () => {
     if (modal.value == true) {
+      rows.value = [];
       const dataStandant = modalSort.value;
-      if (modalType.value === 0) {
+      const mappedData = dataStandant.map((item: any) => ({
-        const mappedData = dataStandant.map((item: any) => ({
+        name: `${item.orgTreeName} (${item.orgTreeShortName})`,
-          orgLevel: item.orgLevel,
+        orgRootId: item.orgRootId,
-          name: `${item.orgTreeName} (${item.orgTreeShortName})`,
+        orgTreeId: item.orgTreeId,
-          orgRevisionId: item.orgRevisionId,
+        orgLevel: item.orgLevel,
-          orgTreeId: item.orgTreeId,
+        orgTreeName: item.orgTreeName,
-          orgTreeName: item.orgTreeName,
+        orgTreeShortName: item.orgTreeShortName,
-          orgTreeShortName: item.orgTreeShortName,
+        orgRevisionId: item.orgRevisionId,
-        }));
+      }));
-        rows.value = mappedData;
+      rows.value = mappedData;
-        console.log("row", rows.value);
-      } else if (modalType.value === 1) {
-        const mappedData = dataStandant.map((item: any) => ({
-          name: `${item.orgTreeName} (${item.orgTreeShortName})`,
-          orgRootId: item.orgRootId,
-          orgTreeId: item.orgTreeId,
-          orgLevel: item.orgLevel,
-          orgTreeName: item.orgTreeName,
-          orgTreeShortName: item.orgTreeShortName,
-          orgRevisionId: item.orgRevisionId,
-        }));
-        rows.value = mappedData;
-
-        console.log("row", dataStandant);
-      }
     }
   }
 );

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

@@ -212,16 +212,25 @@ async function onClickDel(type: number, id: string) {
         messageError($q, err);
       })
       .finally(async () => {
-         props.fetchDataTree?.();
+        props.fetchDataTree?.();
-         hideLoader();
+        hideLoader();
       });
   });
 }
 
-function onClickSort(type: number, id: string) {
+async function onClickSort(id: string) {
   modalSortAgency.value = true;
-  level.value = type;
+  if (id) {
-  if (type === 0) {
+    breakLoop.value = false;
+
+    const orgId = id;
+
+    for (let index = 0; index < nodes.value.length; index++) {
+      const data = nodes.value[index];
+      searchAndReplace(data, orgId);
+      if (breakLoop.value) break;
+    }
+  } else {
     const dataList = nodes.value;
     const dataMap = dataList.map((item: any) => ({
       orgTreeId: item.orgTreeId,
@@ -232,38 +241,17 @@ function onClickSort(type: number, id: string) {
     }));
 
     dataSort.value = dataMap;
-  } else if (type === 1) {
+  }
-    const dataList = nodes.value;
-    const dataMap = dataList.map((item: any) => ({
-      orgTreeId: item.orgTreeId,
-      orgRevisionId: item.orgRevisionId,
-      children: item.children,
-    }));
-    const dataChild = dataMap
-      .filter((item: any) => item.orgTreeId === id)
-      .reduce((acc: any, item: any) => {
-        return acc.concat(
-          item.children.map((child: any) => ({
-            orgRootId: child.orgRootId,
-            orgTreeId: child.orgTreeId,
-            orgLevel: child.orgLevel,
-            orgTreeName: child.orgTreeName,
-            orgTreeShortName: child.orgTreeShortName,
-            orgRevisionId: child.orgRevisionId,
-          }))
-        );
-      }, []);
-    dataSort.value = dataChild;
-  } else if (type === 2) {
-    
-    const dataList = nodes.value;
-    const dataMap = dataList.map((item: any) => ({
-      orgTreeId: item.orgTreeId,
-      children: item.children,
-    }))
-
-    console.log(dataMap)
 
+  function searchAndReplace(data: any, id: string) {
+    if (data.orgTreeId === id) {
+      dataSort.value = data.children;
+      breakLoop.value = true;
+    } else if (data.children) {
+      for (const child of data.children) {
+        searchAndReplace(child, id);
+      }
+    }
   }
 }
 watch(
@@ -381,7 +369,7 @@ onMounted(async () => {});
                         : item.type === 'DEL'
                         ? onClickDel(prop.node.orgLevel, prop.node.orgTreeId)
                         : item.type === 'SORT'
-                        ? onClickSort(prop.node.orgLevel, prop.node.orgRootId)
+                        ? onClickSort(prop.node.orgRootId)
                         : null
                     "
                   >
@@ -509,7 +497,6 @@ onMounted(async () => {});
   <DialogSortAgency
     v-model:sort-agency="modalSortAgency"
     v-model:data="dataSort"
-    v-model:type="level"
   />
 </template>