trithuc-mvc-react 2.4.8 → 2.5.0

package/components/DataManagement/DataTable.jsx

@@ -13,7 +13,7 @@ import { TableRowRender } from "./TableRowRender";
 import TableToolbar from "./TableToolbar";
 import { useDataTable } from "./hooks";
 import { usePermission } from "../../hooks";
-const DataTable = ({ multipleActions = [],page, setPage = () => { }  }) => {
+const DataTable = ({ multipleActions = [],page, setPage = () => { }, disableEdit  }) => {
   const {
     tableName,
     selectedField,
@@ -209,6 +209,7 @@ const DataTable = ({ multipleActions = [],page, setPage = () => { }  }) => {
                   selected={isSelected(row[selectedField])}
                   onSelect={handleSelect}
                   onEdit={handlEdit}
+                  disableEdit={disableEdit}
                   onView={handlViewDetail}
                   onChangeStatus={handleChangeStatus}
                   onDelete={handleDelete}

package/components/DataManagement/FilterGod.jsx

@@ -35,7 +35,7 @@ export const FilterGod = ({ filters, elementSize = "small",setPage=()=>{} }) =>
           <Grid container spacing={1}>
             {filters.map(({ field, size, ...rest }) => {
               if (rest.type === "date-range") {
-                let label = ["từ ngày", "tới ngày"];
+                let label = ["Từ ngày", "Đến ngày"];
 
                 if (Array.isArray(field.label)) {
                   label = field.label;

package/components/DataManagement/TableRowRender.jsx

@@ -21,12 +21,13 @@ export const TableRowRender = ({
   onChangeStatus,
   onDelete,
   onEdit,
-  onView
+  onView,
+  disableEdit,
 }) => {
   const { selectedField, columns, statusKey, disableStatus, tableActions, disableCellThaoTac, tableName, sttLuyKe } =
     useDataTable();
   const { canEdit, canDelete, canView, canAction } = usePermission(tableName);
-
+    
   const { tableActionsOnTable, tableActionsOnMoreMenu } = useMemo(() => {
     const tableActionsAfterFilter = [...tableActions]
       .filter((x) => x)
@@ -96,7 +97,7 @@ export const TableRowRender = ({
 
       {!disableCellThaoTac && (
         <TableCell align="center">
-          {canEdit && (
+          {!disableEdit && (
             <Tooltip title="Chỉnh sửa">
               <IconButton size={downXl ? "small" : "medium"} onClick={() => onEdit(row)}>
                 <EditOutlined fontSize="inherit" color="primary" />

package/components/DataManagement/index.jsx

@@ -210,7 +210,7 @@ function DataManagement({
             {tabPanel}
             <FilterGod filters={filters} elementSize={elementSize} setPage={setPage} />
             {backParentNavigator}
-            <DataTable multipleActions={multipleActions} page={page} setPage={setPage}/>
+            <DataTable multipleActions={multipleActions} page={page} setPage={setPage} disableEdit={disableEditor}/>
           </Card>
         </FormProvider>
 

package/components/date/DateRangePicker.jsx

@@ -1,6 +1,8 @@
 import { DateField } from "@mui/x-date-pickers";
 import { DEFAULT_DATE_FORMAT } from "../../constants";
-import { ClickAwayListener, Popover, Popper, Stack, Typography } from "@mui/material";
+import { ClickAwayListener, Popover, Popper, Stack, Typography, IconButton } from "@mui/material";
+import ClearIcon from "@mui/icons-material/Clear";
+import InputAdornment from "@mui/material/InputAdornment";
 import StaticDateRangePicker from "./StaticDateRangePicker";
 import moment from "moment";
 import { memo, useEffect, useRef, useState } from "react";
@@ -77,25 +79,6 @@ const DateRangePicker = ({ label = ["Từ ngày", "Đến ngày"] }) => {
   useEffect(() => {
     setAnchorEl(containerRef.current);
   }, []);
-  // useEffect(() => {
-  //   console.log("CHANGEEEE");
-  // }, [isFocusStart, isFocusEnd]);
-  // useEffect(() => {
-  //   if (dateFns.isBefore(dateRange.startDate, dateRange.endDate) || dateFns.isSameDay(dateRange.startDate, dateRange.endDate)) {
-  //     onChange([dateRange.startDate, dateRange.endDate]);
-  //   }
-  // }, [dateRange]);
-
-  // useEffect(() => {
-  //   if (!value) return;
-  //   if (dateFns.isSameDay(dateRange.startDate, value[0]) && dateFns.isSameDay(dateRange.endDate, value[1])) {
-  //     return;
-  //   }
-  //   setDateRange({
-  //     startDate: value?.[0],
-  //     endDate: value?.[1]
-  //   });
-  // }, [value]);
 
   return (
     <>
@@ -114,6 +97,23 @@ const DateRangePicker = ({ label = ["Từ ngày", "Đến ngày"] }) => {
           }}
           value={dateRange.startDate && moment(dateRange.startDate)}
           maxDate={dateRange.endDate ?? moment(dateRange.endDate)}
+          InputProps={{
+            endAdornment: (
+              <InputAdornment position="end">
+                <IconButton
+                  onClick={() => {
+                    setDateRange((d) => ({
+                      ...d,
+                      startDate: null
+                    }));
+                  }}
+                  edge="end"
+                >
+                  <ClearIcon />
+                </IconButton>
+              </InputAdornment>
+            )
+          }}
         />
         <Typography variant="body1" sx={{ height: "24px", alignSelf: "center" }}>
           –
@@ -132,6 +132,23 @@ const DateRangePicker = ({ label = ["Từ ngày", "Đến ngày"] }) => {
           }}
           value={dateRange.endDate && moment(dateRange.endDate)}
           minDate={dateRange.startDate ?? moment(dateRange.startDate)}
+          InputProps={{
+            endAdornment: (
+              <InputAdornment position="end">
+                <IconButton
+                  onClick={() => {
+                    setDateRange((d) => ({
+                      ...d,
+                      endDate: null
+                    }));
+                  }}
+                  edge="end"
+                >
+                  <ClearIcon />
+                </IconButton>
+              </InputAdornment>
+            )
+          }}
         />
       </Stack>
       <ClickAwayListener onClickAway={handleClickAway}>
@@ -145,29 +162,6 @@ const DateRangePicker = ({ label = ["Từ ngày", "Đến ngày"] }) => {
           anchorEl={anchorEl}
           onClose={handleClose}
           onClick={handleClickPopper}
-
-          // modifiers={[
-          //   {
-          //     name: "flip",
-          //     enabled: true,
-          //     options: {
-          //       altBoundary: true,
-          //       rootBoundary: "viewport",
-          //       padding: 8
-          //     }
-          //   },
-          //   {
-          //     name: "preventOverflow",
-          //     enabled: true,
-          //     options: {
-          //       altAxis: true,
-          //       altBoundary: true,
-          //       tether: true,
-          //       rootBoundary: "document",
-          //       padding: 8
-          //     }
-          //   }
-          // ]}
         >
           <StaticDateRangePicker
             value={dateRange}

package/package.json

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