From 62ac9a75f7bb8973174707e11bd950c35796842e Mon Sep 17 00:00:00 2001
From: Saeid Doroudi <doroudi@outlook.com>
Date: Sat, 18 Nov 2023 21:41:44 +0330
Subject: [PATCH] As admin I want to edit and delete categories Fixes #24

---
 src/components.d.ts                            |  1 -
 src/components/Category/CategoryManagement.vue | 18 ++++++++++++++++--
 src/mocks/handlers/category.handler.ts         | 10 ++++++++++
 src/services/category.service.ts               |  4 ++++
 src/store/category.store.ts                    |  5 +++--
 5 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/src/components.d.ts b/src/components.d.ts
index eb1be37..f658ef1 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -36,7 +36,6 @@ declare module 'vue' {
     NNotificationProvider: typeof import('naive-ui')['NNotificationProvider']
     NPageHeader: typeof import('naive-ui')['NPageHeader']
     NPopselect: typeof import('naive-ui')['NPopselect']
-    NSelect: typeof import('naive-ui')['NSelect']
     NTreeSelect: typeof import('naive-ui')['NTreeSelect']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
diff --git a/src/components/Category/CategoryManagement.vue b/src/components/Category/CategoryManagement.vue
index 4a0b8ff..272a076 100644
--- a/src/components/Category/CategoryManagement.vue
+++ b/src/components/Category/CategoryManagement.vue
@@ -7,11 +7,14 @@ import {
   AddCircle20Regular as PlusIcon,
 } from '@vicons/fluent'
 import { storeToRefs } from 'pinia'
+import { useDialog, useMessage } from 'naive-ui'
 
 const { t } = useI18n()
 const collapsed = ref(false)
 const store = useCategoryStore()
 const { categories, isLoading } = storeToRefs(store)
+const dialog = useDialog()
+const message = useMessage()
 onMounted(getItems)
 const columns: DataTableColumns<RowData> = [
   {
@@ -46,7 +49,7 @@ const columns: DataTableColumns<RowData> = [
             type: 'error',
             ghost: true,
             renderIcon: renderIcon(DeleteIcon),
-            onClick: () => deleteItem(row),
+            onClick: () => handleDeleteItem(row),
           },
           { default: () => 'Delete' },
         ),
@@ -63,9 +66,20 @@ function renderIcon(icon: any) {
 function edit(row: RowData) {
 
 }
-function deleteItem(row: RowData) {
 
+function handleDeleteItem(row: RowData) {
+  dialog.error({
+    title: 'Confirm',
+    content: 'Are you sure?',
+    positiveText: 'Yes, Delete',
+    negativeText: 'Cancel',
+    onPositiveClick: () => {
+      store.deleteCategory(row.id)
+      message.success('Category was deleted!')
+    },
+  })
 }
+
 function rowKey(row: RowData) {
   return row.id
 }
diff --git a/src/mocks/handlers/category.handler.ts b/src/mocks/handlers/category.handler.ts
index f8f1a12..54460eb 100644
--- a/src/mocks/handlers/category.handler.ts
+++ b/src/mocks/handlers/category.handler.ts
@@ -29,6 +29,16 @@ const handlers = [
       ctx.json(category),
     )
   }),
+  rest.delete('/api/Category/:id', (req, res, ctx) => {
+    const id = req.params.id.toString()
+    const itemIndex = categories.findIndex(x => x.id === Number.parseInt(id))
+    categories.splice(itemIndex, 1)
+    return res(
+      ctx.delay(1000),
+      ctx.status(200),
+      ctx.json(true),
+    )
+  }),
 
 ]
 
diff --git a/src/services/category.service.ts b/src/services/category.service.ts
index b31455d..b0aaa2e 100644
--- a/src/services/category.service.ts
+++ b/src/services/category.service.ts
@@ -14,5 +14,9 @@ class CategoryService {
   async createCategory(categoryItem: CategoryCreateModel): Promise<Category> {
     return apiService.post<Category>('', categoryItem)
   }
+
+  async deleteCategory(id: string | number): Promise<boolean> {
+    return apiService.delete<boolean>(id)
+  }
 }
 export default new CategoryService()
diff --git a/src/store/category.store.ts b/src/store/category.store.ts
index 8a8dcc9..f30c88e 100644
--- a/src/store/category.store.ts
+++ b/src/store/category.store.ts
@@ -40,8 +40,9 @@ export const useCategoryStore = defineStore('Category', () => {
     }
   }
 
-  function deleteCategory() {
-
+  async function deleteCategory(id: string | number) {
+    await categoryService.deleteCategory(id)
+    getCategories(options.value)
   }
 
   function editCategory() {