trithuc-mvc-react 2.5.0 → 2.5.2

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 = () => { }, disableEdit  }) => {
+const DataTable = ({ multipleActions = [],page, setPage = () => { }, disableEdit, disableDelete  }) => {
   const {
     tableName,
     selectedField,
@@ -86,7 +86,7 @@ const DataTable = ({ multipleActions = [],page, setPage = () => { }, disableEdit
   });
 
   const handleDelete = (id) => {
-    confirm({ description: "Bạn có chắc chắn muốn xóa bản ghi này không?", title: "Xác nhận" })
+    confirm({ description: "Bạn có chắc chắn muốn xóa bản ghi này không?", title: "Xác nhận", cancellationText: "Hủy", confirmationText: "Xóa"})
       .then(() => {
         deleteMutation.mutate({
           id,
@@ -164,7 +164,7 @@ const DataTable = ({ multipleActions = [],page, setPage = () => { }, disableEdit
     setPage(0);
   };
   const handleDeleteMultiple = () => {
-    confirm({ description: `Bạn có chắc chắn muốn xóa ${selectedItems?.length} bản ghi này không?`, title: "Xác nhận" })
+    confirm({ description: `Bạn có chắc chắn muốn xóa ${selectedItems?.length} bản ghi này không?`, title: "Xác nhận", cancellationText: "Hủy", confirmationText: "Đồng ý" })
       .then(() => {
         deleteMultipleMutation.mutate({
           tableName,
@@ -210,6 +210,7 @@ const DataTable = ({ multipleActions = [],page, setPage = () => { }, disableEdit
                   onSelect={handleSelect}
                   onEdit={handlEdit}
                   disableEdit={disableEdit}
+                  disableDelete={disableDelete}
                   onView={handlViewDetail}
                   onChangeStatus={handleChangeStatus}
                   onDelete={handleDelete}

package/components/DataManagement/FilterElement.jsx

@@ -1,10 +1,19 @@
-import { Autocomplete, FormControl, InputAdornment, InputLabel, MenuItem, OutlinedInput, Select, TextField } from "@mui/material";
-import { useCallback, useMemo } from "react";
+import {
+  Autocomplete,
+  FormControl,
+  IconButton,
+  InputAdornment,
+  InputLabel,
+  MenuItem,
+  Select,
+  TextField
+} from "@mui/material";
+import { useCallback } from "react";
 import { SearchOutlined } from "@mui/icons-material";
 import { useController, useFormContext } from "react-hook-form";
 import { debounce } from "lodash";
 import { useDataTable } from "./hooks";
-
+import ClearIcon from "@mui/icons-material/Clear";
 export function FilterElement({
   name,
   type,
@@ -14,10 +23,10 @@ export function FilterElement({
   childrenFields,
   datas,
   loading = false,
-  onChange = () => { },
+  onChange = () => {},
   size = "small",
-  handleChange = () => { },
-  setPage = () => { },
+  handleChange = () => {},
+  setPage = () => {}
 }) {
   const { control, setValue } = useFormContext();
 
@@ -33,7 +42,11 @@ export function FilterElement({
     }, 500),
     [dataSearch]
   );
-
+  const handleClearIconClick = () => {
+    onFieldChange(""); // Clear the field value
+    handleFilterChangeDebounce(name, ""); // Clear the filter value
+    setPage(0);
+  };
   switch (type) {
     case "search":
       return (
@@ -53,6 +66,15 @@ export function FilterElement({
               <InputAdornment position="start">
                 <SearchOutlined />
               </InputAdornment>
+            ),
+            endAdornment: (
+              <InputAdornment position="end">
+                {value && (
+                  <IconButton onClick={handleClearIconClick}>
+                    <ClearIcon />
+                  </IconButton>
+                )}
+              </InputAdornment>
             )
           }}
         />
@@ -71,7 +93,7 @@ export function FilterElement({
           noOptionsText="Không có dữ liệu"
           fullWidth
           options={datas ?? []}
-          onChange={(event, newValue, reason) => {
+          onChange={(event, newValue) => {
             let updateObject = { [name]: newValue?.[keyValue] };
             onFieldChange(newValue?.[keyValue]);
             onChange(newValue);

package/components/DataManagement/TableRowRender.jsx

@@ -23,6 +23,7 @@ export const TableRowRender = ({
   onEdit,
   onView,
   disableEdit,
+  disableDelete
 }) => {
   const { selectedField, columns, statusKey, disableStatus, tableActions, disableCellThaoTac, tableName, sttLuyKe } =
     useDataTable();
@@ -111,7 +112,7 @@ export const TableRowRender = ({
               </IconButton>
             </Tooltip>
           )}
-          {canDelete && (
+          {!disableDelete && (
             <Tooltip title="Xóa">
               <IconButton
                 size={downXl ? "small" : "medium"}

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} disableEdit={disableEditor}/>
+            <DataTable multipleActions={multipleActions} page={page} setPage={setPage} disableEdit={disableEditor} disableDelete = {disableEditor}/>
           </Card>
         </FormProvider>
 

package/components/date/DateRangePicker.jsx

@@ -108,6 +108,7 @@ const DateRangePicker = ({ label = ["Từ ngày", "Đến ngày"] }) => {
                     }));
                   }}
                   edge="end"
+                  style={{ visibility: dateRange.startDate ? 'visible' : 'hidden' }}
                 >
                   <ClearIcon />
                 </IconButton>
@@ -143,6 +144,7 @@ const DateRangePicker = ({ label = ["Từ ngày", "Đến ngày"] }) => {
                     }));
                   }}
                   edge="end"
+                  style={{ visibility: dateRange.endDate ? 'visible' : 'hidden' }}
                 >
                   <ClearIcon />
                 </IconButton>

package/package.json

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