changes

app/components/imports/DeleteProductVariant.vue

@@ -0,0 +1,50 @@
+<script setup>
+import Modal from "@/components/Modal.vue";
+
+const props = defineProps({
+  variant: Object,
+});
+
+const emit = defineEmits(["dynamicCompEvent"]);
+const { $deleteapi } = useNuxtApp();
+const showConfirmModal = ref(null);
+
+function displayModal() {
+  showConfirmModal.value = {
+    component: "dialog/Confirm",
+    title: "Xoá phiên bản",
+    width: "500px",
+    height: "auto",
+    vbind: {
+      content: `Bạn xác nhận xoá phiên bản <code>${props.variant.code}</code>?`,
+      onModalevent: deleteVariant,
+    },
+  };
+}
+
+async function deleteVariant() {
+  const res = await $deleteapi("Product_Variant", props.variant.id);
+  if (res !== "error") {
+    // emit to parent, which is DataTable
+    emit("dynamicCompEvent", { type: "refresh" });
+  }
+}
+</script>
+
+<template>
+  <a
+    class="has-text-danger"
+    @click="displayModal"
+  >
+    <span class="icon">
+      <Icon
+        name="material-symbols:delete-outline-rounded"
+        :size="18"
+      />
+    </span>
+    <Modal
+      v-bind="showConfirmModal"
+      @close="showConfirmModal = null"
+    />
+  </a>
+</template>