trithuc-mvc-react 3.0.1 → 3.0.3

package/components/DataManagement/DataTable.jsx

@@ -14,6 +14,14 @@ import { usePermission } from "../../hooks";
 import { TableRowRender } from "./TableRowRender";
 import TableToolbar from "./TableToolbar";
 import { useDataTable } from "./hooks";
+const defaultQueryOptions = {
+  keepPreviousData: true, // Giữ dữ liệu cũ trong khi tải dữ liệu mới
+  staleTime: 1000 * 60 * 1, // Thời gian dữ liệu có thể sử dụng lại trước khi gọi lại API
+  cacheTime: 1000 * 60 * 30, // Thời gian dữ liệu được lưu trong cache trước khi bị xóa
+  refetchOnWindowFocus: true, // Tự động lấy lại dữ liệu khi người dùng quay lại tab
+  refetchInterval: 1000 * 30, // Mỗi 30 giây
+  keepPreviousData: true
+};
 const DataTable = ({ multipleActions = [], page, setPage = () => {}, disableEdit, disableDelete }) => {
   const {
     tableName,
@@ -44,6 +52,7 @@ const DataTable = ({ multipleActions = [], page, setPage = () => {}, disableEdit
         pageSize: rowsPerPage,
         data: dataSearch
       }),
+    defaultQueryOptions,
     // keepPreviousData: true,
     onSuccess: ({ PermissionModel, status }) => {
       if (dataSearch?.TrangThaiXuLy !== undefined) {
@@ -52,6 +61,11 @@ const DataTable = ({ multipleActions = [], page, setPage = () => {}, disableEdit
       if (status) {
         setPermission(PermissionModel);
         // console.log("LOAD LAI PermissionModel");
+        // Cuộn lên đầu trang khi tải dữ liệu thành công
+        window.scrollTo({
+          top: 0, // Vị trí pixel muốn cuộn tới
+          behavior: "smooth" // Tùy chọn cuộn mượt
+        });
       }
     }
   });

package/components/DataManagement/DataTableSM.jsx

@@ -13,6 +13,14 @@ import { usePermission } from "../../hooks";
 import { TableRowRenderSM } from "./TableRowRenderSM";
 import TableToolbar from "./TableToolbar";
 import { useDataTable } from "./hooks";
+const defaultQueryOptions = {
+  keepPreviousData: true, // Giữ dữ liệu cũ trong khi tải dữ liệu mới
+  staleTime: 1000 * 60 * 1, // Thời gian dữ liệu có thể sử dụng lại trước khi gọi lại API
+  cacheTime: 1000 * 60 * 30, // Thời gian dữ liệu được lưu trong cache trước khi bị xóa
+  refetchOnWindowFocus: true, // Tự động lấy lại dữ liệu khi người dùng quay lại tab
+  refetchInterval: 1000 * 30, // Mỗi 30 giây
+  keepPreviousData: true
+};
 const DataTableSM = ({ multipleActions = [], page, setPage = () => {}, disableEdit, disableDelete }) => {
   const {
     tableName,
@@ -43,6 +51,7 @@ const DataTableSM = ({ multipleActions = [], page, setPage = () => {}, disableEd
         pageSize: rowsPerPage,
         data: dataSearch
       }),
+    defaultQueryOptions,
     // keepPreviousData: true,
     onSuccess: ({ PermissionModel, status }) => {
       if (dataSearch?.TrangThaiXuLy !== undefined) {
@@ -51,6 +60,11 @@ const DataTableSM = ({ multipleActions = [], page, setPage = () => {}, disableEd
       if (status) {
         setPermission(PermissionModel);
         // console.log("LOAD LAI PermissionModel");
+        // Cuộn lên đầu trang khi tải dữ liệu thành công
+        window.scrollTo({
+          top: 0, // Vị trí pixel muốn cuộn tới
+          behavior: "smooth" // Tùy chọn cuộn mượt
+        });
       }
     }
   });

package/components/DataManagement/TableRowRender.jsx

@@ -68,23 +68,35 @@ export const TableRowRender = ({
         ({
           field,
           type = "text",
-          valueGetter = (row) => {
-            return row[field];
-          },
+          valueGetter = (row) => row[field], // Giá trị mặc định
           renderCell,
           valueFormat = (e) => e
         }) => {
-          let align = type == "image" || type == "number" || type == "date" || type == "datetime" ? "right" : "left";
-          if (type == "textCenter") align = "center";
+          // Xác định `align`
+          const alignMap = {
+            image: "right",
+            number: "right",
+            date: "right",
+            datetime: "right",
+            textCenter: "center",
+            textLeft: "left",
+            textRight: "right"
+          };
+          const align = alignMap[type] || "left"; // Mặc định là "left"
+
           return (
-            <TableCell key={`${row[selectedField]}-${field}`} align={align}>
+            <TableCell
+              key={`${row[selectedField] || "unknown"}-${field}`} // Thêm fallback cho `key`
+              align={align}
+            >
               {renderCell ? renderCell(row) : valueFormat(valueGetter(row))}
             </TableCell>
           );
         }
       )}
+
       {!disableStatus && canEdit && (
-        <TableCell>
+        <TableCell align="center">
           <Switch
             checked={row[statusKey]}
             onChange={() => {

package/components/table/TablePagination.jsx

@@ -13,7 +13,7 @@ function TablePaginationCustom({ count, rowsPerPage, page, onPageChange, onRowsP
     <Box sx={{ overflowX: "auto", width: "100%" }}>
       <TablePagination
         {...rest}
-        rowsPerPageOptions={[5, 10, 25, 100]}
+        rowsPerPageOptions={[5, 10, 20, 25, 50, 100]}
         component="div"
         count={count}
         rowsPerPage={rowsPerPage}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "trithuc-mvc-react",
-  "version": "3.0.1",
+  "version": "3.0.3",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"