Merge pull request #92 from lklong709/PIM-19

fixes #19 - Bulk action - Missing message notification when user use bulk action but not choose item
aesirxio · Jan 12, 2023 · c984d66 · c984d66
2 parents ef6f269 + 9ab1a9a
commit c984d66
Show file tree

Hide file tree

Showing 9 changed files with 55 additions and 46 deletions.
diff --git a/src/components/Table/index.jsx b/src/components/Table/index.jsx
@@ -98,12 +98,12 @@ const Table = ({
         hooks.visibleColumns.push((columns) => [
           {
             id: 'selection',
-            className: 'border-bottom-1 text-uppercase ps-2',
+            className: 'border-bottom-1 text-uppercase py-2 align-middle',
             width: 10,
             Header: ({ getToggleAllPageRowsSelectedProps }) => (
-              <>
+              <div className="ms-2">
                 <IndeterminateCheckbox {...getToggleAllPageRowsSelectedProps()} />
-              </>
+              </div>
             ),
             Cell: ({ row }) => (
               <div className="wrapper_checkbox ms-2">
@@ -292,7 +292,7 @@ const Table = ({
                               key={index}
                               rowSpan={cell.rowSpan}
                               {...cell.getCellProps({ style: { width: cell.column.width } })}
-                              className="py-2 fs-14"
+                              className="py-2 fs-14 align-middle border-bottom-0"
                             >
                               {cell.render('Cell')}
                             </td>

diff --git a/src/containers/CategoriesPage/Component/ListCategories.jsx b/src/containers/CategoriesPage/Component/ListCategories.jsx
@@ -20,7 +20,7 @@ const ListCategories = observer((props) => {
       Header: 'Category name',
       accessor: 'category',
       width: 150,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <>
@@ -62,7 +62,7 @@ const ListCategories = observer((props) => {
     {
       Header: 'Parent Cate',
       accessor: 'parentName',
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <>{value == 'ROOT' ? 'Top level' : value}</>;
       },
@@ -96,7 +96,7 @@ const ListCategories = observer((props) => {
       },
       width: 50,
       accessor: 'published',
-      className: 'py-2 border-bottom-1 text-center',
+      className: 'py-2 border-bottom-1 text-center align-middle',
       Cell: ({ value }) => (
         <div className="text-center pe-5">
           {value.state == 1 ? (
@@ -142,7 +142,7 @@ const ListCategories = observer((props) => {
     {
       Header: 'Last modified',
       accessor: 'lastModified',
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <div className="pe-2">
@@ -286,7 +286,7 @@ const ListCategories = observer((props) => {
 
       {viewModel?.successResponse?.state ? (
         <Table
-          classNameTable={`bg-white rounded`}
+          classNameTable={`bg-white rounded table-striped table`}
           columns={columnsTable}
           data={viewModel?.successResponse?.listCategories}
           selection={false}

diff --git a/src/containers/DashboardsPage/Component/ListFeaturedProducts.jsx b/src/containers/DashboardsPage/Component/ListFeaturedProducts.jsx
@@ -19,12 +19,14 @@ const ListFeaturedProducts = observer((props) => {
         <div className={`bg-white rounded-3 shadow-sm`}>
           <div className="px-2 pt-3 fw-bold text-uppercase">featured products</div>
           <Table
+            classNameTable={`table-striped table`}
             columns={[
               {
                 Header: 'Id',
                 accessor: 'id',
                 width: 60,
-                className: 'ps-2 py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+                className:
+                  'ps-2 py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
                 Cell: ({ value }) => {
                   return <div className="ps-2 opacity-80">{value}</div>;
                 },
@@ -33,7 +35,7 @@ const ListFeaturedProducts = observer((props) => {
                 Header: 'Product name',
                 accessor: 'productInfo',
                 width: 200,
-                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
                 Cell: ({ value }) => {
                   return (
                     <div className="d-flex align-items-center">
@@ -67,7 +69,7 @@ const ListFeaturedProducts = observer((props) => {
               {
                 Header: 'Categories',
                 accessor: 'categories',
-                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
                 Cell: ({ value }) => {
                   return <>{value}</>;
                 },
@@ -76,7 +78,7 @@ const ListFeaturedProducts = observer((props) => {
                 Header: 'Type',
                 accessor: 'type',
                 width: 100,
-                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
                 Cell: ({ value }) => {
                   if (value) {
                     return (
@@ -108,7 +110,7 @@ const ListFeaturedProducts = observer((props) => {
                 Header: 'Author',
                 accessor: 'author',
                 width: 100,
-                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
                 Cell: ({ value }) => {
                   return <>{value}</>;
                 },
@@ -117,7 +119,8 @@ const ListFeaturedProducts = observer((props) => {
                 Header: 'Last modified',
                 accessor: 'lastModified',
                 width: 100,
-                className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi pe-2',
+                className:
+                  'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi pe-2 align-middle',
                 Cell: ({ value }) => {
                   return (
                     <div className="pe-2">

diff --git a/src/containers/DebtorGroupPage/Component/ListDebtorGroup.jsx b/src/containers/DebtorGroupPage/Component/ListDebtorGroup.jsx
@@ -24,7 +24,7 @@ const ListDebtorGroup = observer((props) => {
       Header: 'Id',
       accessor: 'id',
       width: 60,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <div className="opacity-80">{value}</div>;
       },
@@ -33,7 +33,7 @@ const ListDebtorGroup = observer((props) => {
       Header: 'Debtor group name',
       accessor: 'title',
       width: 250,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value, row }) => {
         return (
           <>
@@ -56,7 +56,7 @@ const ListDebtorGroup = observer((props) => {
       Header: 'Debtor group code',
       accessor: 'code',
       width: 250,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <>{value}</>;
       },
@@ -65,7 +65,7 @@ const ListDebtorGroup = observer((props) => {
       Header: 'Owner Company',
       accessor: 'organisationName',
       width: 250,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <>{value}</>;
       },
@@ -74,7 +74,7 @@ const ListDebtorGroup = observer((props) => {
       Header: 'Last modified',
       accessor: 'lastModified',
       width: 250,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <div className="pe-2">
@@ -192,7 +192,7 @@ const ListDebtorGroup = observer((props) => {
 
       {viewModel?.successResponse?.state ? (
         <Table
-          classNameTable={`bg-white rounded`}
+          classNameTable={`bg-white rounded table-striped table`}
           columns={columnsTable}
           data={viewModel?.transform(viewModel?.items)}
           selection={false}

diff --git a/src/containers/FieldsGroupPage/Component/ListFieldsGroup.jsx b/src/containers/FieldsGroupPage/Component/ListFieldsGroup.jsx
@@ -24,7 +24,7 @@ const ListFieldsGroup = observer((props) => {
       Header: 'Field group name',
       accessor: 'fieldGroups',
       width: 200,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <div className="d-flex align-items-center">
@@ -49,7 +49,7 @@ const ListFieldsGroup = observer((props) => {
       Header: 'Author',
       accessor: 'createdUserName',
       width: 100,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <>{value}</>;
       },
@@ -58,7 +58,7 @@ const ListFieldsGroup = observer((props) => {
       Header: 'Last modified',
       accessor: 'lastModified',
       width: 100,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <div className="pe-2">
@@ -171,7 +171,7 @@ const ListFieldsGroup = observer((props) => {
 
       {viewModel?.successResponse?.state ? (
         <Table
-          classNameTable={`bg-white rounded`}
+          classNameTable={`bg-white rounded table-striped table`}
           columns={columnsTable}
           data={viewModel?.transform(viewModel?.items)}
           selection={false}

diff --git a/src/containers/FieldsPage/Component/ListFields.jsx b/src/containers/FieldsPage/Component/ListFields.jsx
@@ -24,7 +24,7 @@ const ListFields = observer((props) => {
       Header: 'Field name',
       accessor: 'field',
       width: 200,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <div className="d-flex align-items-center">
@@ -49,7 +49,7 @@ const ListFields = observer((props) => {
       Header: 'Field group',
       accessor: 'groupName',
       width: 100,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <>{value}</>;
       },
@@ -58,7 +58,7 @@ const ListFields = observer((props) => {
       Header: 'types',
       accessor: 'type',
       width: 100,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <div className="text-capitalize">{value}</div>;
       },
@@ -199,7 +199,7 @@ const ListFields = observer((props) => {
 
       {viewModel?.successResponse?.state ? (
         <Table
-          classNameTable={`bg-white rounded`}
+          classNameTable={`bg-white rounded table-striped table`}
           columns={columnsTable}
           data={viewModel?.transform(viewModel?.items)}
           selection={false}

diff --git a/src/containers/ProductPricesPage/Component/ListProductPrice.jsx b/src/containers/ProductPricesPage/Component/ListProductPrice.jsx
@@ -66,7 +66,7 @@ const ListProductPrice = observer((props) => {
       Header: 'Id',
       accessor: 'id',
       width: 60,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <div className="opacity-80">{value}</div>;
       },
@@ -75,7 +75,7 @@ const ListProductPrice = observer((props) => {
       Header: 'Product name',
       accessor: 'title',
       width: 150,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value, row }) => {
         return (
           <>
@@ -98,7 +98,7 @@ const ListProductPrice = observer((props) => {
       Header: 'Debtor Group',
       accessor: 'debtorGroup',
       width: 200,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return <>{value.map((o) => o.title).join(', ')}</>;
       },
@@ -107,7 +107,7 @@ const ListProductPrice = observer((props) => {
       Header: 'Price',
       accessor: 'price',
       width: 200,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <>{parseInt(value).toLocaleString('it-IT', { style: 'currency', currency: 'VND' })}</>
@@ -118,7 +118,7 @@ const ListProductPrice = observer((props) => {
       Header: 'Last modified',
       accessor: 'lastModified',
       width: 150,
-      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi',
+      className: 'py-2 opacity-50 border-bottom-1 text-uppercase fw-semi align-middle',
       Cell: ({ value }) => {
         return (
           <div className="pe-2">
@@ -214,7 +214,7 @@ const ListProductPrice = observer((props) => {
 
       {viewModel?.successResponse?.state ? (
         <Table
-          classNameTable={`bg-white rounded`}
+          classNameTable={`bg-white rounded table-striped table`}
           columns={columnsTable}
           data={viewModel?.successResponse?.listProductPrice}
           selection={false}