เพื่มลบ

src/modules/01_metadata/components/insignia/InsigniaDetail.vue

@@ -18,7 +18,14 @@ const router = useRouter();
 const $q = useQuasar();
 const store = useInsigniaDataStore();
 const mixin = useCounterMixin();
-const { dialogConfirm, showLoader, hideLoader, messageError, success } = mixin;
+const {
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+  dialogRemove,
+} = mixin;
 
 const id = ref<string>(route.params.id.toString()); // ชั้นเครื่องราชอิสริยาภรณ์
 const title = ref<string>(""); // ชือชั้นเครื่องราชอิสริยาภรณ์
@@ -216,6 +223,29 @@ async function onSubmit() {
   });
 }
 
+/**
+ * ลบข้อมูลเครื่องราชอิสริยาภรณ์
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลเครื่องราชอิสริยาภรณ์ ใหม่
+ * @param id ข้อมูลเครื่องราชอิสริยาภรณ์
+ */
+async function onDeleteData(idrow: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.insigniaNewIdOrg(idrow))
+      .then(async () => {
+        await fetchData(id.value);
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ปืด popup เพิ่ม,แก้ไข ข้อมูล
  * และ กำหนดฟอร์ม เพิ่มข้อมูล,แก้ไขข้อมูลเป็น defult
@@ -347,7 +377,6 @@ onMounted(async () => {
                     flat
                     dense
                     round
-                    class="q-mr-xs"
                     icon="edit"
                     clickable
                     @click.stop="
@@ -364,6 +393,16 @@ onMounted(async () => {
                   >
                     <q-tooltip>แก้ไขข้อมูล</q-tooltip>
                   </q-btn>
+                  <q-btn
+                    color="red"
+                    flat
+                    dense
+                    round
+                    icon="delete"
+                    @click.stop.prevent="onDeleteData(props.row.id)"
+                  >
+                    <q-tooltip>ลบข้อมูล</q-tooltip>
+                  </q-btn>
                 </q-td>
                 <q-td v-for="(col, index) in props.cols" :key="col.id">
                   <div v-if="col.name == 'no'">

src/modules/01_metadata/components/personal/01_Prefix.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Table
@@ -142,6 +143,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบรายการคำนำหน้าชื่อ
+ * แล้ว fetch ข้อมูลรายการ คำนำหน้าชื่อ ใหม่
+ * @param id รายการคำนำหน้าชื่อ
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgPrefixId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการคำนำหน้าชื่อ
@@ -227,7 +251,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -241,6 +264,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           {{ col.value }}

src/modules/01_metadata/components/personal/02_Rank.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Table
@@ -142,6 +143,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบรายการยศ
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการยศ ใหม่
+ * @param id รายการยศ
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgRankId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการยศ
@@ -224,7 +248,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -238,6 +261,17 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div>

src/modules/01_metadata/components/personal/03_Gender.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Table
@@ -142,6 +143,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบรายการเพศ
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการเพศ ใหม่
+ * @param id รายการเพศ
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgGenderId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการเพศ
@@ -224,7 +248,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -238,6 +261,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div>

src/modules/01_metadata/components/personal/04_Relationship.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Table
@@ -142,6 +143,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบรายการสถานภาพ
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการสถานภาพ ใหม่
+ * @param id รายการสถานภาพ
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgRelationshipId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการสถานภาพ
@@ -224,7 +248,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -238,6 +261,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div>

src/modules/01_metadata/components/personal/05_BloodGroup.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Table
@@ -141,6 +142,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบข้อมูลรายการกลุ่มเลือด
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการกลุ่มเลือด ใหม่
+ * @param id ข้อมูลรายการกลุ่มเลือด
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgBloodGroupId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการกลุ่มเลือด
@@ -223,7 +247,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -237,6 +260,17 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div>

src/modules/01_metadata/components/personal/06_Religion.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Table
@@ -142,6 +143,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบข้อมูลรายการศาสนา
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการศาสนา ใหม่
+ * @param id ข้อมูลรายการศาสนา
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgReligionId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการศาสนา
@@ -224,7 +248,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -238,6 +261,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div>

src/modules/01_metadata/components/personal/07_Province.vue

@@ -15,7 +15,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 const $q = useQuasar();
 const router = useRouter();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 /**
  * Teble
@@ -144,6 +145,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบข้อมูลรายการจังหวัด
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการจังหวัด ใหม่
+ * @param id ข้อมูลรายการจังหวัด
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgProvince + `/${id}`)
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ไปยังหน้า รายการเขต/อำเภอ โดย id ของจังหวัด
  * @param id จังหวัด
@@ -235,7 +259,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -249,6 +272,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td
           v-for="col in props.cols"

src/modules/01_metadata/components/personal/08_EducationLevel.vue

@@ -13,7 +13,8 @@ import DialogForm from "@/modules/01_metadata/components/personal/DialogForm.vue
 
 const $q = useQuasar();
 const store = usePersonalDataStore();
-const { messageError, showLoader, hideLoader, success } = useCounterMixin();
+const { messageError, showLoader, hideLoader, success, dialogRemove } =
+  useCounterMixin();
 
 const columns = [
   {
@@ -154,6 +155,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบข้อมูลรายการระดับการศึกษา
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการระดับการศึกษา ใหม่
+ * @param id ข้อมูลรายการระดับการศึกษา
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgEducationLevelId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * hook ทำงานเมื่อ Components ถูกเรียกใช้งาน
  * แล้วเรียก function fetch ข้อมูลรายการระดับการศึกษา
@@ -238,7 +262,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -253,6 +276,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div>

src/modules/01_metadata/components/personal/province/01_District.vue

@@ -22,6 +22,7 @@ const {
   success,
   date2Thai,
   onSearchDataTable,
+  dialogRemove,
 } = useCounterMixin();
 
 /**
@@ -106,9 +107,11 @@ async function fetchData() {
 
       const list = data.map((e: FormDistrict) => ({
         ...e,
-        createdAt: e.createdAt ? date2Thai(new Date(e.createdAt),false,true) : "",
+        createdAt: e.createdAt
+          ? date2Thai(new Date(e.createdAt), false, true)
+          : "",
         lastUpdatedAt: e.lastUpdatedAt
-          ? date2Thai(new Date(e.lastUpdatedAt),false,true)
+          ? date2Thai(new Date(e.lastUpdatedAt), false, true)
           : "",
       }));
       rows.value = list;
@@ -168,6 +171,29 @@ async function editData(id: string) {
     });
 }
 
+/**
+ * ลบข้อมูลรายการระดับการเขต/อำเภอ
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการระดับการเขต/อำเภอ ใหม่
+ * @param id ข้อมูลรายการระดับการเขต/อำเภอ
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgDistrict + `/${id}`)
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ไปยังหน้า รายการเแขวง/ตำบลโดย id ของเขต/อำเภอ
  * @param idSub เขต/อำเภอ
@@ -283,7 +309,6 @@ onMounted(async () => {
                 flat
                 dense
                 round
-                class="q-mr-xs"
                 icon="edit"
                 clickable
                 @click.stop="
@@ -297,6 +322,16 @@ onMounted(async () => {
               >
                 <q-tooltip>แก้ไขข้อมูล</q-tooltip>
               </q-btn>
+              <q-btn
+                color="red"
+                flat
+                dense
+                round
+                icon="delete"
+                @click.stop.prevent="onDeleteData(props.row.id)"
+              >
+                <q-tooltip>ลบข้อมูล</q-tooltip>
+              </q-btn>
             </q-td>
             <q-td
               v-for="col in props.cols"

src/modules/01_metadata/components/personal/province/02_SubDistrict.vue

@@ -22,6 +22,7 @@ const {
   success,
   date2Thai,
   onSearchDataTable,
+  dialogRemove,
 } = useCounterMixin();
 
 /**
@@ -183,6 +184,29 @@ async function editData(idRow: string) {
     });
 }
 
+/**
+ * ลบข้อมูลรายการแขวง/ตำบล
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการแขวง/ตำบล ใหม่
+ * @param id ข้อมูลรายการแขวง/ตำบล
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgSubDistrict + `/${id}`)
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 function serchDataTable() {
   rows.value = onSearchDataTable(
     filterKeyword.value,
@@ -291,7 +315,6 @@ onMounted(async () => {
                 flat
                 dense
                 round
-                class="q-mr-xs"
                 icon="edit"
                 clickable
                 @click.stop="
@@ -306,6 +329,16 @@ onMounted(async () => {
               >
                 <q-tooltip>แก้ไขข้อมูล</q-tooltip>
               </q-btn>
+              <q-btn
+                color="red"
+                flat
+                dense
+                round
+                icon="delete"
+                @click.stop.prevent="onDeleteData(props.row.id)"
+              >
+                <q-tooltip>ลบข้อมูล</q-tooltip>
+              </q-btn>
             </q-td>
             <q-td v-for="col in props.cols" :key="col.id">
               <div>

src/modules/01_metadata/components/position-employee/02_GroupMain.vue

@@ -25,6 +25,7 @@ const {
   hideLoader,
   date2Thai,
   onSearchDataTable,
+  dialogRemove,
 } = useCounterMixin();
 
 //Table
@@ -182,6 +183,29 @@ function onSubmit() {
   });
 }
 
+/**
+ * ลบข้อมูลรายการกลุ่มงาน
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการกลุ่มงาน ใหม่
+ * @param id ข้อมูลรายการกลุ่มงาน
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgEmployeeTypeById(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ฟังก์ชันไปหน้ารายการระดับชั้นงาน
  * @param id กลุ่มงาน
@@ -295,12 +319,21 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             @click.stop="onClickOpenDialogEdit(props.row)"
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           {{ col.value ? col.value : "-" }}

src/modules/01_metadata/components/position-employee/GroupDetail.vue

@@ -31,6 +31,7 @@ const {
   success,
   date2Thai,
   onSearchDataTable,
+  dialogRemove,
 } = useCounterMixin();
 
 // Table
@@ -136,7 +137,6 @@ const formDataLevel = reactive<FormDataLevel>({
 
 /**
  * ฟังก์ชันดึงข้อมูลรายการระดับชั้นงาน API
- *
  * เก็บข้อมูลรรายการระดับชั้นงานไว้ใน rows.value
  */
 async function fetchData() {
@@ -231,6 +231,29 @@ function onSubmit() {
   });
 }
 
+/**
+ * ลบข้อมูลรายการระดับชั้นงาน
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการระดับชั้นงาน ใหม่
+ * @param id ข้อมูลรายการระดับชั้นงาน
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgEmployeelevelById(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ฟังก์ชันแปลงตำแหน่งผู้มีอำนาจ
  * @param val ค่าของผู้มีอำนาจ
@@ -342,12 +365,21 @@ onMounted(() => {
                 flat
                 dense
                 round
-                class="q-mr-xs"
                 icon="edit"
                 @click.stop.pervent="onClickOpenDialog(true, props.row)"
               >
                 <q-tooltip>แก้ไขข้อมูล</q-tooltip>
               </q-btn>
+              <q-btn
+                color="red"
+                flat
+                dense
+                round
+                icon="delete"
+                @click.stop.prevent="onDeleteData(props.row.id)"
+              >
+                <q-tooltip>ลบข้อมูล</q-tooltip>
+              </q-btn>
             </q-td>
             <q-td v-for="(col, index) in props.cols" :key="col.id">
               <div v-if="col.name == 'no'">

src/modules/01_metadata/components/position/02_Type.vue

@@ -22,6 +22,7 @@ const {
   showLoader,
   hideLoader,
   onSearchDataTable,
+  dialogRemove,
 } = useCounterMixin();
 
 // Table
@@ -154,6 +155,29 @@ function onSubmit() {
   }
 }
 
+/**
+ * ลบข้อมูลประเภทตำแหน่ง
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลประเภทตำแหน่ง ใหม่
+ * @param id ข้อมูลประเภทตำแหน่ง
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgPosTypeId(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ปืด popup ฟอร์มประเภทตำแหน่ง
  * และเคลียร์ตัวแปรในฟอร์มประเภทตำแหน่ง
@@ -265,7 +289,6 @@ onMounted(async () => {
             flat
             dense
             round
-            class="q-mr-xs"
             icon="edit"
             clickable
             @click.stop="
@@ -280,6 +303,16 @@ onMounted(async () => {
           >
             <q-tooltip>แก้ไขข้อมูล</q-tooltip>
           </q-btn>
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            icon="delete"
+            @click.stop.prevent="onDeleteData(props.row.id)"
+          >
+            <q-tooltip>ลบข้อมูล</q-tooltip>
+          </q-btn>
         </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           {{ col.value ?? "-" }}

src/modules/01_metadata/components/position/03_Executive.vue

@@ -12,8 +12,15 @@ import type { RowListForm } from "@/modules/01_metadata/interface/request/positi
 import DialogAdd from "@/modules/01_metadata/components/position/DialogFormExecutive.vue";
 
 const $q = useQuasar();
-const { showLoader, hideLoader, messageError, date2Thai, onSearchDataTable } =
+const {
-  useCounterMixin();
+  showLoader,
+  hideLoader,
+  messageError,
+  date2Thai,
+  onSearchDataTable,
+  dialogRemove,
+  success,
+} = useCounterMixin();
 
 // Table
 const rows = ref<RowListForm[]>([]); // รายการข้อมูลตำแหน่งทางการบริหาร
@@ -96,7 +103,6 @@ const modalPosExecutive = ref<boolean>(false); // popup ตำแหน่งท
 
 /**
  * ดึงรายการข้อมูลตำแหน่งทางการบริหาร
- *
  * เก็บข้อมูลรายการตำแหน่งทางการบริหารใน rows.value
  */
 async function getData() {
@@ -123,6 +129,29 @@ function popUpAdd() {
   modalPosExecutive.value = true;
 }
 
+/**
+ * ลบรายการเพศ
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลรายการเพศ ใหม่
+ * @param id รายการเพศ
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.orgPosExecutiveById(id))
+      .then(async () => {
+        await getData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * เปิด popup เพื่อแก่ไขข้อมูลรายการตำแหน่งทางการบริหาร
  * @param data ข้อมูลรายการตำแหน่งทางการบริหารที่ต้องการแก้ไข
@@ -224,7 +253,6 @@ onMounted(async () => {
               flat
               dense
               round
-              class="q-mr-xs"
               icon="edit"
               clickable
               @click.stop="
@@ -235,18 +263,18 @@ onMounted(async () => {
             >
               <q-tooltip>แก้ไขข้อมูล</q-tooltip>
             </q-btn>
-            <!-- <q-btn
+            <q-btn
               color="red"
               flat
               dense
               round
               icon="mdi-delete"
               clickable
-              @click.stop="deletePos(props.row.id)"
+              @click.stop="onDeleteData(props.row.id)"
               v-close-popup
             >
               <q-tooltip>ลบข้อมูล</q-tooltip>
-            </q-btn> -->
+            </q-btn>
           </q-td>
           <q-td v-for="col in props.cols" :key="col.name" :props="props">
             <div v-if="col.name == 'no'">

src/modules/01_metadata/views/05_insignia.vue

@@ -21,7 +21,7 @@ const {
   messageError,
   showLoader,
   hideLoader,
-  onSearchDataTable,
+  dialogRemove,
 } = useCounterMixin();
 
 // Table
@@ -149,6 +149,29 @@ function onSubmit() {
   });
 }
 
+/**
+ * ลบข้อมูลเครื่องราชอิสริยาภรณ์
+ * แล้ว fetch ข้อมูลรายการ ข้อมูลเครื่องราชอิสริยาภรณ์ ใหม่
+ * @param id ข้อมูลเครื่องราชอิสริยาภรณ์
+ */
+async function onDeleteData(id: string) {
+  dialogRemove($q, async () => {
+    showLoader();
+    await http
+      .delete(config.API.insigniaTypeNewIdOrg(id))
+      .then(async () => {
+        await fetchData();
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 /**
  * ปืด popup เพิ่ม,แก้ไข ข้อมูล
  * และ กำหนดลำดับชั้นเครื่องราช เป็นค่าว่าง  สถานะการใช้งาน เป็น false
@@ -259,7 +282,6 @@ onMounted(async () => {
                   flat
                   dense
                   round
-                  class="q-mr-xs"
                   icon="edit"
                   clickable
                   @click.stop="
@@ -274,6 +296,16 @@ onMounted(async () => {
                 >
                   <q-tooltip>แก้ไขข้อมูล</q-tooltip>
                 </q-btn>
+                <q-btn
+                  color="red"
+                  flat
+                  dense
+                  round
+                  icon="delete"
+                  @click.stop.prevent="onDeleteData(props.row.id)"
+                >
+                  <q-tooltip>ลบข้อมูล</q-tooltip>
+                </q-btn>
               </q-td>
               <q-td v-for="col in props.cols" :key="col.id">
                 <div v-if="col.name == 'isActive'">