เพื่มลบ

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'">