fixes #17 Add function Delete item or multi items

src/components/ActionsBar/index.jsx

@@ -18,11 +18,12 @@ const ActionsBar = ({ t, buttons = [] }) => {
             >
               {item.icon && (
                 <ComponentSVG
+                  color={item.iconColor}
                   url={item.icon}
                   className={`icon-${item.variant ? item.variant : 'light'} me-1`}
                 />
               )}
-              {item.title}
+              <span style={{ color: item.textColor }}>{item.title}</span>
             </Button>
           </div>
         );

src/containers/CategoriesPage/CategoryStore/CategoryStore.js

@@ -144,4 +144,16 @@ export default class CategoryStore {
 
     return false;
   }
+
+  async deleteCategories(arr) {
+    try {
+      const aesirxPimCategoryApiService = new AesirxPimCategoryApiService();
+      const respondedData = await aesirxPimCategoryApiService.deleteCategories(arr);
+      return respondedData;
+    } catch (error) {
+      // no error throw
+    }
+
+    return false;
+  }
 }

src/containers/CategoriesPage/CategoryViewModel/CategoryListViewModel.js

@@ -121,6 +121,18 @@ class CategoryListViewModel {
     this.successResponse.state = true;
   };
 
+  deleteCategories = async (arr) => {
+    const res = await this.categoryStore.deleteCategories(arr);
+    if (res) {
+      await this.categoryStore.getList(
+        this.callbackOnSuccessHandler,
+        this.callbackOnErrorHandler,
+        this.successResponse.filters
+      );
+    }
+    this.successResponse.state = true;
+  };
+
   handleFilter = (filter) => {
     this.filter = { ...this.filter, ...filter };
   };

src/containers/CategoriesPage/Component/ListCategories.jsx

@@ -207,12 +207,26 @@ const ListCategories = observer((props) => {
     viewModel.setPublished(value.id, isPublished);
   };
 
+  const deleteCategories = () => {
+    viewModel.isLoading();
+    viewModel.deleteCategories(listSelected);
+  };
+
   return (
     <>
       <div className="d-flex justify-content-between align-items-center mb-3">
         <h2 className="fw-bold mb-0">{t('txt_categories')}</h2>
         <ActionsBar
           buttons={[
+            {
+              title: t('txt_delete'),
+              icon: '/assets/images/delete.svg',
+              iconColor: '#cb222c',
+              textColor: '#cb222c',
+              handle: async () => {
+                deleteCategories();
+              },
+            },
             {
               title: t('txt_add_new'),
               icon: '/assets/images/plus.svg',

src/containers/DebtorGroupPage/DebtorGroupViewModel/DebtorGroupListViewModel.js

@@ -105,7 +105,6 @@ class DebtorGroupListViewModel {
   };
 
   callbackOnSuccessHandler = (result) => {
-    console.log('result.pagination', result.pagination);
     if (result?.items) {
       this.items = result.items;
       this.pagination = result.pagination;

src/containers/FieldsPage/Component/ListFields.jsx

@@ -118,13 +118,27 @@ const ListFields = observer((props) => {
       viewModel.getListByFilter('limitstart', (value - 1) * viewModel.pagination.pageLimit);
     }
   };
+
+  const deleteFields = () => {
+    viewModel.isLoading();
+    viewModel.deleteFields(listSelected);
+  };
 
   return (
     <>
       <div className="d-flex justify-content-between align-items-center mb-3">
         <h2 className="fw-bold mb-0">{t('txt_fields')}</h2>
         <ActionsBar
           buttons={[
+            {
+              title: t('txt_delete'),
+              icon: '/assets/images/delete.svg',
+              iconColor: '#cb222c',
+              textColor: '#cb222c',
+              handle: async () => {
+                deleteFields();
+              },
+            },
             {
               title: t('txt_add_new_fields'),
               icon: '/assets/images/plus.svg',

src/containers/FieldsPage/FieldStore/FieldStore.js

@@ -141,4 +141,16 @@ export default class FieldStore {
 
     return false;
   }
+
+  async deleteFields(arr) {
+    try {
+      const aesirxPimFieldApiService = new AesirxPimFieldApiService();
+      const respondedData = await aesirxPimFieldApiService.deleteFields(arr);
+      return respondedData;
+    } catch (error) {
+      // no error throw
+    }
+
+    return false;
+  }
 }

src/containers/FieldsPage/FieldViewModel/FieldListViewModel.js

@@ -136,6 +136,19 @@ class FieldListViewModel {
     this.successResponse.state = true;
   };
 
+  deleteFields = async (arr) => {
+    const res = await this.fieldStore.deleteFields(arr);
+    if (res) {
+      await this.fieldStore.getList(
+        this.filter,
+        this.filterList,
+        this.callbackOnSuccessHandler,
+        this.callbackOnErrorHandler
+      );
+    }
+    this.successResponse.state = true;
+  };
+
   callbackOnErrorHandler = (error) => {
     notify('Update unsuccessfully', 'error');
     this.successResponse.state = false;

src/containers/ProductPricesPage/Component/ListProductPrice.jsx

@@ -14,35 +14,35 @@ const ListProductPrice = observer((props) => {
   const { t } = props;
   let listSelected = [];
 
-  const productPriceViewModel = props.viewModel;
+  const viewModel = props.viewModel;
 
   useEffect(() => {
-    productPriceViewModel.initializeData();
+    viewModel.initializeData();
   }, []);
 
   const selectTabHandler = (value) => {
-    productPriceViewModel.isLoading();
+    viewModel.isLoading();
     if (value != 'default') {
-      productPriceViewModel.getListByFilter('state', {
+      viewModel.getListByFilter('state', {
         value: value,
         type: 'filter',
       });
     } else {
-      productPriceViewModel.getListByFilter('state', '');
+      viewModel.getListByFilter('state', '');
     }
   };
 
   const selectShowItemsHandler = (value) => {
-    productPriceViewModel.isLoading();
-    productPriceViewModel.getListByFilter('list[limit]', value.value);
+    viewModel.isLoading();
+    viewModel.getListByFilter('list[limit]', value.value);
   };
 
   const selectPageHandler = (value) => {
-    if (value != productPriceViewModel.successResponse.pagination.page) {
-      productPriceViewModel.isLoading();
-      productPriceViewModel.getListByFilter(
+    if (value != viewModel.successResponse.pagination.page) {
+      viewModel.isLoading();
+      viewModel.getListByFilter(
         'limitstart',
-        (value - 1) * productPriceViewModel.successResponse.pagination.pageLimit
+        (value - 1) * viewModel.successResponse.pagination.pageLimit
       );
     }
   };
@@ -52,8 +52,13 @@ const ListProductPrice = observer((props) => {
   };
 
   const selectBulkActionsHandler = (value) => {
-    productPriceViewModel.isLoading();
-    productPriceViewModel.updateStatus(listSelected, value.value);
+    viewModel.isLoading();
+    viewModel.updateStatus(listSelected, value.value);
+  };
+
+  const deleteProductPrices = () => {
+    viewModel.isLoading();
+    viewModel.deleteProductPrices(listSelected);
   };
 
   const columnsTable = [
@@ -119,7 +124,7 @@ const ListProductPrice = observer((props) => {
           <div className="pe-2">
             <div className="mb-1">
               {
-                productPriceViewModel?.successResponse?.listPublishStatus.find(
+                viewModel?.successResponse?.listPublishStatus.find(
                   (o) => o.value == value.status
                 ).label
               }
@@ -139,6 +144,15 @@ const ListProductPrice = observer((props) => {
         <h2 className="fw-bold mb-0">{t('txt_left_menu_price_management')}</h2>
         <ActionsBar
           buttons={[
+            {
+              title: t('txt_delete'),
+              icon: '/assets/images/delete.svg',
+              iconColor: '#cb222c',
+              textColor: '#cb222c',
+              handle: async () => {
+                deleteProductPrices();
+              },
+            },
             {
               title: t('txt_add_new_prices'),
               icon: '/assets/images/plus.svg',
@@ -151,7 +165,7 @@ const ListProductPrice = observer((props) => {
         />
       </div>
 
-      {productPriceViewModel?.successResponse?.listPublishStatus.length > 0 && (
+      {viewModel?.successResponse?.listPublishStatus.length > 0 && (
         <>
           <Tabs
             defaultActiveKey={'default'}
@@ -160,15 +174,15 @@ const ListProductPrice = observer((props) => {
             className="mb-3"
           >
             <Tab eventKey={'default'} title={t('txt_all_products')} />
-            {productPriceViewModel?.successResponse?.listPublishStatus.map((o) => (
+            {viewModel?.successResponse?.listPublishStatus.map((o) => (
               <Tab key={o.value} eventKey={o.value} title={o.label} />
             ))}
           </Tabs>
 
           <div className="d-flex align-items-center justify-content-between gap-2 mb-2">
             <div className="d-flex gap-2">
               <SelectComponent
-                options={productPriceViewModel?.successResponse?.listPublishStatus}
+                options={viewModel?.successResponse?.listPublishStatus}
                 className={`fs-sm`}
                 isBorder={true}
                 placeholder={t('txt_bulk_actions')}
@@ -181,8 +195,8 @@ const ListProductPrice = observer((props) => {
               <div className="opacity-50 me-2">Showing</div>
               <SelectComponent
                 defaultValue={{
-                  label: `${productPriceViewModel?.successResponse?.filters['list[limit]']} items`,
-                  value: productPriceViewModel?.successResponse?.filters['list[limit]'],
+                  label: `${viewModel?.successResponse?.filters['list[limit]']} items`,
+                  value: viewModel?.successResponse?.filters['list[limit]'],
                 }}
                 options={[...Array(9)].map((o, index) => ({
                   label: `${(index + 1) * 10} items`,
@@ -199,13 +213,13 @@ const ListProductPrice = observer((props) => {
         </>
       )}
 
-      {productPriceViewModel?.successResponse?.state ? (
+      {viewModel?.successResponse?.state ? (
         <Table
           classNameTable={`bg-white rounded`}
           columns={columnsTable}
-          data={productPriceViewModel?.successResponse?.listProductPrice}
+          data={viewModel?.successResponse?.listProductPrice}
           selection={false}
-          pagination={productPriceViewModel?.successResponse?.pagination}
+          pagination={viewModel?.successResponse?.pagination}
           selectPage={selectPageHandler}
           currentSelect={currentSelectHandler}
         ></Table>

src/containers/ProductPricesPage/ProductPriceEdit/Component/ProductPriceInformation.jsx

@@ -37,8 +37,7 @@ const ProductPriceInformation = observer(
     }
 
     render() {
-      const { t, isShowValidator } = this.props;
-      console.log('isShowValidator', isShowValidator);
+      const { t } = this.props;
       const generateFormSetting = [
         {
           fields: [

src/containers/ProductPricesPage/ProductPriceStore/ProductPriceStore.js

@@ -153,4 +153,16 @@ export default class ProductPriceStore {
       });
     }
   }
+
+  async deleteProductPrices(arr) {
+    try {
+      const aesirxPimProductPriceApiService = new AesirxPimProductPriceApiService();
+      const respondedData = await aesirxPimProductPriceApiService.deleteProductPrices(arr);
+      return respondedData;
+    } catch (error) {
+      // no error throw
+    }
+
+    return false;
+  }
 }

src/containers/ProductPricesPage/ProductPriceViewModel/ProductPriceListViewModel.js

@@ -97,6 +97,18 @@ class ProductPriceListViewModel {
     this.successResponse.state = true;
   };
 
+  deleteProductPrices = async (arr) => {
+    const res = await this.productPricesStore.deleteProductPrices(arr);
+    if (res) {
+      await this.productPricesStore.getList(
+        this.callbackOnSuccessHandler,
+        this.callbackOnErrorHandler,
+        this.successResponse.filters
+      );
+    }
+    this.successResponse.state = true;
+  };
+
   callbackOnSuccessSetFeatured = async (result) => {
     this.successResponse.listProducts = this.successResponse.listProducts.map((o) => {
       if (o.id == result) {

src/containers/ProductsPage/Component/ListProducts.jsx

@@ -70,17 +70,30 @@ const ListProducts = observer((props) => {
   };
 
   const selectCategoryHandler = (value) => {
-    console.log(value.value);
     viewModel.isLoading();
     viewModel.getListByFilter('filter[category]', value.value);
   };
 
+  const deleteProducts = () => {
+    viewModel.isLoading();
+    viewModel.deleteProducts(listSelected);
+  };
+
   return (
     <>
       <div className="d-flex justify-content-between align-items-center mb-3">
         <h2 className="fw-bold mb-0">{t('txt_title_product_management')}</h2>
         <ActionsBar
           buttons={[
+            {
+              title: t('txt_delete'),
+              icon: '/assets/images/delete.svg',
+              iconColor: '#cb222c',
+              textColor: '#cb222c',
+              handle: async () => {
+                deleteProducts();
+              },
+            },
             {
               title: t('txt_add_new'),
               icon: '/assets/images/plus.svg',