wip: frontend - category list

rkshaon · Jun 22, 2024 · dc1602b · dc1602b
1 parent 219ae59
commit dc1602b
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 28 deletions.
diff --git a/frontend/src/components/admin/category/AdminCategoryListComponent.vue b/frontend/src/components/admin/category/AdminCategoryListComponent.vue
@@ -13,20 +13,20 @@
                 </tr>
             </thead>
             <tbody>
-                <tr v-for="(category, index) in categoryList" :key="index">
+                <tr v-for="(cat, index) in categoryList" :key="index">
                     <th scope="row">{{ index + 1 }}</th>
-                    <td>{{ category.title }}</td>
-                    <td>{{ category.description }}</td>
+                    <td>{{ cat.title }}</td>
+                    <td>{{ cat.description }}</td>
                     <td>
                         <div class="alert alert-warning" role="alert">
-                            Active: {{ category.is_active }}
+                            Active: {{ cat.is_active }}
                         </div>
                         <div class="alert alert-danger" role="alert">
-                            Delete: {{ category.is_deleted }}
+                            Delete: {{ cat.is_deleted }}
                         </div>
                     </td>
                     <td>
-                        <img v-if="category.icon" :src="`${API_BASE_URL}${category.icon}`" :alt="category.title"
+                        <img v-if="cat.icon" :src="`${API_BASE_URL}${cat.icon}`" :alt="cat.title"
                             height="50" />
                         <div v-else>Upload Icon</div>
                     </td>
@@ -50,16 +50,21 @@ export default {
     name: "AdminCategoryListComponent",
     components: {
     },
-    computed: {
-        ...mapState('category', ['categories'])
-    },
     setup() { },
     data() {
         return {
             API_BASE_URL: API_BASE_URL,
             categoryList: [],
         }
     },
+    // computed: {
+    //     ...mapState('category', {
+    //         categoryList: 'categories'
+    //     })
+    // },
+    computed: {
+        ...mapState('category', ['categories'])
+    },
     methods: {
         ...mapActions('category', ['fetchCategories']),
     },

diff --git a/frontend/src/services/adminCategoryAPI.js b/frontend/src/services/adminCategoryAPI.js
@@ -43,22 +43,35 @@ apiClient.interceptors.response.use(
   }
 );
 
-export default {
-  getCategoriesForAdmin() {
-    return apiClient.get('/api/v1/categories/');
-  },
-
-  createCategoryForAdmin(categoryData) {
-    return apiClient.post('/api/v1/categories/', categoryData, {
-      headers: {
-        'Content-Type': 'multipart/form-data'
-      }
-    });
-  },
+export const getCategoriesForAdmin = () => {
+  // return axios.get(`${API_URL}/categories`);
+  return apiClient.get("/api/v1/categories/");
+};
 
-  deleteCategoryForAdmin(category_id) {
-    return apiClient.delete(`/api/v1/categories/${category_id}`);
-  },
+export const createCategoryForAdmin = (categoryData) => {
+  return apiClient.post('/api/v1/categories/', categoryData, {
+    headers: {
+      'Content-Type': 'multipart/form-data'
+    }
+  });
+};
+
+export const deleteCategoryForAdmin = (category_id) => {
+  return apiClient.delete(`/api/v1/categories/${category_id}`);
+};
+
+export default {  
+  // createCategoryForAdmin(categoryData) {
+  //   return apiClient.post('/api/v1/categories/', categoryData, {
+  //     headers: {
+  //       'Content-Type': 'multipart/form-data'
+  //     }
+  //   });
+  // },
+
+  // deleteCategoryForAdmin(category_id) {
+  //   return apiClient.delete(`/api/v1/categories/${category_id}`);
+  // },
 
   updateCategoryForAdmin(category_id, categoryData) {
     return apiClient.put(`/api/v1/categories/${category_id}`, categoryData, {

diff --git a/frontend/src/store/modules/category.js b/frontend/src/store/modules/category.js
@@ -22,7 +22,9 @@ const mutations = {
 
 const actions = {
     async fetchCategories({ commit }) {
+        console.log('Hello');
         const response = await getCategoriesForAdmin();
+        console.log(response.data);
         commit("setCategories", response.data);
     },
 
@@ -42,8 +44,9 @@ const getters = {
 };
 
 export default {
-    state,
-    mutations,
-    actions,
-    getters,
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+  getters,
 };