Merge branch 'develop' into devTee

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

@@ -108,7 +108,7 @@ function validateForm() {
 /** ฟังชั่น บันทึก */
 function onSubmit() {
   dialogConfirm($q, async () => {
-    // showLoader();
+    showLoader();
     const type = store.checkLevel(level.value);
     const nameId =
       level.value === 0
@@ -142,14 +142,14 @@ function onSubmit() {
       await http
         .post(config.API.createOrgLevel(type.toLocaleLowerCase()), body)
         .then(() => {
+          props.fetchDataTree(store.draftId);
           success($q, "บันทึกข้อมูลสำเร็จ");
+          closeClear();
         })
         .catch((err) => {
           messageError($q, err);
         })
         .finally(() => {
-          props.fetchDataTree(store.draftId);
-          closeClear();
           hideLoader();
         });
     } else {
@@ -170,15 +170,14 @@ function onSubmit() {
               body,
               props.dataNode?.orgRootCode
             );
+            closeClear();
             success($q, "บันทึกข้อมูลสำเร็จ");
           })
           .catch((err) => {
-            console.log(err);
             messageError($q, err);
           })
           .finally(async () => {
             // await props.fetchDataTree?.();
-            closeClear();
             hideLoader();
           }));
     }
@@ -289,6 +288,9 @@ const tittleName = computed(() => {
                   for="#ocNo"
                   :label="level == 0 ? 'รหัสหน่วยงาน' : 'รหัสส่วนราชการ'"
                   hide-bottom-space
+                  maxlength="2"
+                  type="number"
+                  class="inputNumber"
                   :rules="[
                     (val) =>
                       !!val ||
@@ -373,3 +375,15 @@ const tittleName = computed(() => {
     </q-dialog>
   </template>
 </template>
+
+<style scoped>
+.inputNumber >>> input[type="number"] {
+  -moz-appearance: textfield;
+}
+.inputNumber >>> input::-webkit-outer-spin-button,
+.inputNumber >>> input::-webkit-inner-spin-button {
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+}
+</style>

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

@@ -7,13 +7,6 @@ import type { QTableProps } from "quasar";
 
 import DialogHeader from "@/components/DialogHeader.vue";
 
-import type {
-  FormDataNewStructure,
-  FormNewStructureRef,
-  DataOption,
-  HistoryType,
-} from "@/modules/02_organizationalNew/interface/index/Main";
-
 import { useCounterMixin } from "@/stores/mixin";
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
 
@@ -22,6 +15,16 @@ const store = useOrganizational();
 const { dialogConfirm, showLoader, success, hideLoader, messageError } =
   useCounterMixin();
 
+const type = defineModel<number>("type", { required: true });
+
+const props = defineProps({
+  fetchDataTree: {
+    type: Function,
+    require: true,
+    default: () => "",
+  },
+});
+
 const modal = defineModel<boolean>("sortAgency", { required: true });
 const modalSort = defineModel<Array<any>>("data", { required: true });
 const rows = ref<any>([]);
@@ -46,6 +49,7 @@ function onDropRow(from: any, to: any) {
 
 function save() {
   dialogConfirm($q, () => {
+    showLoader();
     const data = rows.value;
     const dataId = data.map((item: any) => item.orgTreeId);
     http
@@ -56,12 +60,15 @@ function save() {
       })
       .then((res) => {
         modal.value = false;
+        props.fetchDataTree(store.draftId);
         success($q, "บันทึกข้อมูลสำเร็จ");
       })
       .catch((e) => {
         messageError($q, e);
       })
-      .finally(() => {});
+      .finally(() => {
+        hideLoader();
+      });
   });
 }
 watch(
@@ -90,7 +97,7 @@ watch(
       <q-card style="min-width: 50vw">
         <!-- <form @submit.prevent="validateForm"> -->
         <DialogHeader
-          :tittle="`จัดลำดับการแสดงผล`"
+          :tittle="`จัดลำดับ${type == 0 ? 'หน่วยงาน' : 'ส่วนราชการ'}`"
           :close="() => (modal = false)"
         />
         <q-separator />

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

@@ -37,14 +37,8 @@ async function fetchDetailTree(id: string, type: string) {
     .then((res) => {
       const data = res.data.result;
       const range = data[`org${type}Rank`];
-      formData.orgName = data[`org${type}orgRootName`] ? data[`org${type}orgRootName`] : '-';
+      formData.orgName = data.orgRootName ? data.orgRootName : "-";
-        // range == "DEPARTMENT"
+      formData.agencyName = data.orgName ? data.orgName : "-";
-        //   ? data[`org${type}Name`] + ` (${data[`org${type}ShortName`]})`
-        //   : "-";
-      formData.agencyName = data[`org${type}orgName`] ? data[`org${type}orgName`] : '-';
-        // range != "DEPARTMENT"
-        //   ? data[`org${type}Name`] + ` (${data[`org${type}ShortName`]})`
-        //   : "-";
       formData.orgType = range != "DEPARTMENT" ? "ส่วนราชการ" : "หน่วยงาน";
       formData.orgLevel = store.convertType(range);
       formData.status =

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

@@ -65,9 +65,9 @@ const listAdd = ref<ListMenu[]>([
   },
   {
     label: "จัดลำดับ",
-    icon: "filter_list",
+    icon: "mdi-sort",
     type: "SORT",
-    color: "green-7",
+    color: "blue-6",
   },
   // {
   //   label: "แก้ไขสถานะ",
@@ -166,17 +166,18 @@ async function deleteUpdate(rootId: string, treeId: string) {
       if (breakLoop.value) break;
     }
   } else {
-    console.log("rootId===>", rootId);
-    console.log("treeId===>", treeId);
     nodes.value = nodes.value.filter((x: any) => x.orgTreeId != treeId);
   }
 }
 
 function deleteNode(treeNode: any, rootId: string, treeId: string): boolean {
   if (treeNode.orgTreeId === rootId) {
+    const childrenNew = treeNode.children.filter(
+      (x: any) => x.orgTreeId != treeId
+    );
     let newData = {
       ...treeNode,
-      children: [],
+      children: childrenNew,
     };
     Object.assign(treeNode, newData);
 
@@ -239,7 +240,8 @@ async function onClickDel(type: number, id: string, rootId: string) {
   });
 }
 
-async function onClickSort(id: string) {
+async function onClickSort(id: string, level: number) {
+  type.value = level;
   modalSortAgency.value = true;
   if (id) {
     breakLoop.value = false;
@@ -293,9 +295,9 @@ onMounted(async () => {});
 </script>
 
 <template>
-  <div class="col-12 q-py-md q-px-lg">
+  <div class="col-12 q-py-md q-px-sm">
-    <div class="q-gutter-md">
+    <div class="q-gutter-sm">
-      <div class="row q-col-gutter-sm">
+      <div class="row q-col-gutter-sm q-pl-sm">
         <div class="col-2" v-if="store.typeOrganizational === 'draft'">
           <q-btn
             dense
@@ -312,7 +314,13 @@ onMounted(async () => {});
         <div
           :class="store.typeOrganizational === 'draft' ? 'col-10' : 'col-12'"
         >
-          <q-input dense outlined v-model="filter" label="ค้นหา">
+          <q-input
+            dense
+            outlined
+            v-model="filter"
+            label="ค้นหา"
+            class="bg-white"
+          >
             <template v-slot:append>
               <q-icon
                 v-if="filter !== ''"
@@ -324,14 +332,7 @@ onMounted(async () => {});
           </q-input>
         </div>
       </div>
-      <div
+      <div class="bg-white tree-container">
-        class="bg-white"
-        style="
-          height: 60vh;
-          border: 1px solid rgb(210, 210, 210);
-          border-radius: 10px;
-        "
-      >
         <q-tree
           class="q-pa-md q-gutter-sm"
           dense
@@ -403,7 +404,7 @@ onMounted(async () => {});
                             prop.node.orgRootId
                           )
                         : item.type === 'SORT'
-                        ? onClickSort(prop.node.orgRootId)
+                        ? onClickSort(prop.node.orgRootId, prop.node.orgLevel)
                         : item.type === 'HISTORY'
                         ? onClickHistory(
                             prop.node.orgLevel,
@@ -420,14 +421,16 @@ onMounted(async () => {});
                         v-if="
                           item.type === 'EDIT' ||
                           item.type === 'DEL' ||
-                          item.type === 'HISTORY'
+                          item.type === 'HISTORY' ||
+                          item.type === 'SORT'
                         "
-                        >{{ item.label }}หน่วยงาน</q-item-section
                       >
-                      <q-item-section v-else-if="item.type === 'ADD'"
+                        {{ item.label }}หน่วยงาน
-                        >{{ item.label }}ส่วนราชการ</q-item-section
+                      </q-item-section>
-                      >
+                      <q-item-section v-else-if="item.type === 'ADD'">
-                      <q-item-section v-else>{{ item.label }}</q-item-section>
+                        {{ item.label }}ส่วนราชการ
+                      </q-item-section>
+                      <q-item-section v-else> {{ item.label }} </q-item-section>
                     </div>
 
                     <div v-else>
@@ -436,7 +439,8 @@ onMounted(async () => {});
                           item.type === 'ADD' ||
                           item.type === 'EDIT' ||
                           item.type === 'DEL' ||
-                          item.type === 'HISTORY'
+                          item.type === 'HISTORY' ||
+                          item.type === 'SORT'
                         "
                         >{{ item.label }}ส่วนราชการ</q-item-section
                       >
@@ -466,19 +470,7 @@ onMounted(async () => {});
                     clickable
                     v-close-popup
                     @click="
-                      item.type === 'EDIT'
+                      onClickDetail(prop.node.orgTreeId, prop.node.orgLevel)
-                        ? onClickEdit(prop.node)
-                        : item.type === 'ADD'
-                        ? onClickAgency(prop.node.orgLevel + 1, prop.node)
-                        : item.type === 'DETAIL'
-                        ? onClickDetail(prop.node.orgTreeId, prop.node.orgLevel)
-                        : item.type === 'DEL'
-                        ? onClickDel(
-                            prop.node.orgLevel,
-                            prop.node.orgTreeId,
-                            prop.node.orgRootId
-                          )
-                        : null
                     "
                   >
                     <q-item-section avatar>
@@ -490,31 +482,7 @@ onMounted(async () => {});
               </q-menu>
             </q-btn>
           </template>
-
-          <!-- <template v-slot:default-body="prop">
-            <div v-if="prop.node.orgCode">
-              <span class="text-grey-13"
-                >{{ prop.node.orgCode }} {{ prop.node.orgTreeShortName }}</span
-              >
-            </div>
-          </template> -->
         </q-tree>
-
-        <!-- <div class="q-pa-md q-gutter-sm">
-          <q-tree :nodes="nodes" node-key="orgRootName" default-expand-all>
-            <template v-slot:default-header="prop">
-              <div class="row">
-                <div class="text-weight-bold text-primary">
-                  {{ prop.node.orgRootName }}
-                </div>
-              </div>
-            </template>
-
-            <template v-slot:default-body="prop">
-           
-            </template>
-          </q-tree>
-        </div> -->
       </div>
     </div>
   </div>
@@ -540,6 +508,8 @@ onMounted(async () => {});
   <DialogSortAgency
     v-model:sort-agency="modalSortAgency"
     v-model:data="dataSort"
+    :fetchDataTree="props.fetchDataTree"
+    v-model:type="type"
   />
   <DialogHistory
     v-model:history="modalHistory"
@@ -548,4 +518,11 @@ onMounted(async () => {});
   />
 </template>
 
-<style scoped></style>
+<style scoped>
+.tree-container {
+  overflow: auto;
+  height: 60vh;
+  border: 1px solid rgb(210, 210, 210);
+  border-radius: 10px;
+}
+</style>