โครงสร้าง => refactor code

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

@@ -1,11 +1,14 @@
 <script setup lang="ts">
 import { ref, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
-import type { QTableProps } from "quasar";
-import DialogHeader from "@/components/DialogHeader.vue";
-import DialogAddPosition from "@/modules/02_organizationalNew/components/DialogAddPosition.vue";
 
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+/**
+ * importType
+ */
+import type { QTableProps } from "quasar";
 import type {
   FormDataPosition,
   FormPositionRef,
@@ -17,14 +20,40 @@ import type {
 } from "@/modules/02_organizationalNew/interface/index/Main";
 import type {
   OptionType,
-  OptionLevel,
   OptionExecutive,
-  DataPosition,
 } from "@/modules/02_organizationalNew/interface/response/organizational";
 import type { FilterMaster } from "@/modules/02_organizationalNew/interface/request/organizational";
-import http from "@/plugins/http";
-import config from "@/app.config";
 
+/**
+ * importComponents
+ */
+import DialogHeader from "@/components/DialogHeader.vue";
+import DialogAddPosition from "@/modules/02_organizationalNew/components/DialogAddPosition.vue";
+
+/**
+ * importStore
+ */
+import { useCounterMixin } from "@/stores/mixin";
+
+/**
+ * use
+ */
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const {
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  dialogRemove,
+  dialogMessageNotify,
+} = mixin;
+
+/**
+ * props
+ */
+const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const props = defineProps({
   modal: Boolean,
   close: Function,
@@ -39,24 +68,10 @@ const props = defineProps({
 
 const isEdit = ref<boolean>(false);
 const modalAdd = ref<boolean>(false);
-const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
 const isDisValidate = ref<boolean>(false);
 const isPosition = ref<boolean>(false);
-const succession = ref<boolean>(false); // id ของตำแหน่งที่จะสืบทอด
 const dataCopy = ref<any>();
-const $q = useQuasar();
-const mixin = useCounterMixin();
-const {
-  dialogConfirm,
-  showLoader,
-  hideLoader,
-  messageError,
-  success,
-  dialogRemove,
-  dialogMessageNotify,
-} = mixin;
-const selected = ref<any>([]);
 const search = ref<string>("");
 const type = ref<string>("positionName");
 const optionFilter = ref<DataOption[]>([
@@ -68,12 +83,10 @@ const optionFilter = ref<DataOption[]>([
   { id: "positionExecutiveField", name: "ด้านทางการบริหาร" },
   { id: "positionArea", name: "ด้าน/สาขา" },
 ]);
-
 const typeOpsMain = ref<DataOption[]>([]);
 const executiveOpsMain = ref<DataOption[]>([]);
 const executiveOps = ref<DataOption[]>([]);
 const typeOps = ref<DataOption[]>([]);
-
 const listMenu = ref<ListMenu[]>([
   {
     label: "คัดลอก",
@@ -135,16 +148,6 @@ const objectPositionRef: FormPositionRef = {
   positionNo: positionNoRef,
 };
 
-const objectPositionSelectRef: FormPositionSelectRef = {
-  positionName: positionNameRef,
-  positionField: positionFieldRef,
-  positionType: positionTypeRef,
-  positionLevel: positionLevelRef,
-  positionExecutive: positionExecutiveRef,
-  positionExecutiveField: positionExecutiveFieldRef,
-  positionArea: positionAreaRef,
-};
-
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -274,26 +277,6 @@ async function fetchType() {
     });
 }
 
-/** function เรียกรายการระดับตำแหน่ง */
-// async function fetchLevel() {
-//   showLoader();
-//   await http
-//     .get(config.API.orgPosLevel)
-//     .then((res) => {
-//       levelOpsMain.value = res.data.result.map((e: OptionLevel) => ({
-//         id: e.id,
-//         name: e.posLevelName,
-//       }));
-//       levelOps.value = levelOpsMain.value;
-//     })
-//     .catch((err) => {
-//       messageError($q, err);
-//     })
-//     .finally(() => {
-//       hideLoader();
-//     });
-// }
-
 /** function เรียกรายการตำแหน่งทางการบริหาร */
 async function fetchExecutive() {
   showLoader();
@@ -335,24 +318,6 @@ function validateForm() {
   }
 }
 
-/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
-// function validateFormPositionEdit() {
-//   isDisValidate.value = false;
-//   const hasError = [];
-//   for (const key in objectPositionSelectRef) {
-//     if (Object.prototype.hasOwnProperty.call(objectPositionSelectRef, key)) {
-//       const property = objectPositionSelectRef[key];
-//       if (property.value && typeof property.value.validate === "function") {
-//         const isValid = property.value.validate();
-//         hasError.push(isValid);
-//       }
-//     }
-//   }
-//   if (hasError.every((result) => result === true)) {
-//     onSubmitSelectEdit();
-//   }
-// }
-
 /** ฟังชั่น บันทึก */
 function onSubmit() {
   dialogConfirm($q, async () => {
@@ -387,15 +352,15 @@ function onSubmit() {
     props.actionType === "ADD" || props.actionType === "COPY"
       ? await http
           .post(config.API.orgPosMaster, body)
-          .then(() => {
-            success($q, "เพิ่มข้อมูลสำเร็จ");
-            props.fetchDataTable?.(
+          .then(async () => {
+            await props.fetchDataTable?.(
               reqMaster.value.id,
               reqMaster.value.type,
               false
             );
-            props.getSummary?.();
-            close();
+            await props.getSummary?.();
+            await close();
+            await success($q, "เพิ่มข้อมูลสำเร็จ");
           })
           .catch((err) => {
             messageError($q, err);
@@ -406,14 +371,14 @@ function onSubmit() {
       : props.rowId &&
         (await http
           .put(config.API.orgPosMasterById(props.rowId), body)
-          .then(() => {
-            success($q, "แก้ไขข้อมูลสำเร็จ");
-            props.fetchDataTable?.(
+          .then(async () => {
+            await props.fetchDataTable?.(
               reqMaster.value.id,
               reqMaster.value.type,
               false
             );
-            close();
+            await close();
+            await success($q, "แก้ไขข้อมูลสำเร็จ");
           })
           .catch((err) => {
             messageError($q, err);
@@ -423,42 +388,6 @@ function onSubmit() {
           }));
   });
 }
-/** ฟังชั่น บันทึก */
-// function onSubmitSelectEdit() {
-//   dialogConfirm(
-//     $q,
-//     async () => {
-//       showLoader();
-//       const body = {
-//         posDictName: formPositionSelect.positionName,
-//         posDictField: formPositionSelect.positionField, //สายงาน
-//         posTypeId: formPositionSelect.positionType, //*ประเภทตำแหน่ง
-//         posLevelId: formPositionSelect.positionLevel, //*ระดับตำแหน่ง
-//         posExecutiveId:
-//           formPositionSelect.positionExecutive !== ""
-//             ? formPositionSelect.positionExecutive
-//             : null, //ตำแหน่งทางการบริหาร
-//         posDictExecutiveField: formPositionSelect.positionExecutiveField, //ด้านทางการบริหาร
-//         posDictArea: formPositionSelect.positionArea, //ด้าน/สาขา
-//       };
-//       await http
-//         .post(config.API.orgPosPosition, body)
-//         .then(() => {
-//           success($q, "เพิ่มข้อมูลสำเร็จ");
-
-//           clearFormPositionSelect();
-//         })
-//         .catch((err) => {
-//           messageError($q, err);
-//         })
-//         .finally(() => {
-//           hideLoader();
-//         });
-//     },
-//     "ยืนยันการเพิ่มตำแหน่ง",
-//     "ต้องการยืนยันการเพิ่มตำแหน่งนี้ใช่หรือไม่?"
-//   );
-// }
 
 /** input ค้นหา */
 const searchRef = ref<any>(null);
@@ -483,16 +412,6 @@ async function searchInput() {
   }
 }
 
-// function updateSelectType(val: string) {
-//   const listLevel = dataLevel.value.find((e: any) => e.id === val);
-//   levelOpsMain.value = listLevel.posLevels.map((e: OptionLevel) => ({
-//     id: e.id,
-//     name: e.posLevelName,
-//   }));
-//   levelOps.value = levelOpsMain.value;
-//   formPositionSelect.positionLevel = "";
-// }
-
 /**
  * คัดลอกข้อมูล
  * @param data ข้อมูลตำแหน่ง
@@ -779,7 +698,6 @@ async function emitSearch(keyword: string, typeSelect: string) {
                               {{ col.value }}
                             </div>
                           </q-td>
-
                         </q-tr>
                       </template>
                     </d-table>
@@ -983,7 +901,6 @@ async function emitSearch(keyword: string, typeSelect: string) {
                               {{ col.value }}
                             </div>
                           </q-td>
-
                         </q-tr>
                       </template>
                     </d-table>