trithuc-mvc-react 2.5.2 → 2.6.0

package/api/index.js

@@ -1,10 +1,12 @@
 import axios from "axios";
 
 let baseUrl = "";
+let apiUrl = "";
 
-export function configure({ customBaseUrl }) {
+export function configure({ customBaseUrl,customApiUrl }) {
   if (customBaseUrl) {
     baseUrl = customBaseUrl;
+    apiUrl = customApiUrl;
   } else {
     console.warn("baseUrl chưa được định cấu hình. Sử dụng giá trị mặc định.");
   }
@@ -15,50 +17,123 @@ export function getBaseUrl() {
 }
 
 const api = axios.create({
-  baseURL: getBaseUrl()??'/',
+  baseURL: getBaseUrl() ?? "/",
   transitional: {
     silentJSONParsing: false
   },
   responseType: "json"
 });
+
+// Hàm để cài đặt token mới
+export function setAuthToken(token) {
+  api.defaults.headers.common["Authorization"] = `Bearer ${token}`;
+}
+
+// Cài đặt token từ localStorage khi khởi tạo
+const token = localStorage.getItem("token");
+if (token) {
+  setAuthToken(token);
+}
 export default api;
 
 export const getDatasFromTable = async ({ tableName, page, pageSize, data }) => {
-  const res = await api.get(`${getBaseUrl()}/Admin/${tableName}/LoadData`, {
-    params: {
-      json: JSON.stringify(data),
-      page,
-      pageSize
+  try {
+    let res;
+    // Trường hợp dùng tableName với MVC4
+    if (!apiUrl) {
+      res = await api.get(`${getBaseUrl()}/Admin/${tableName}/LoadData`, {
+        params: {
+          json: JSON.stringify(data),
+          page,
+          pageSize
+        }
+      });
+    } else {
+      // Trường hợp dùng api .NET Core
+      res = await api.get(`${getBaseUrl()}/${apiUrl}/${tableName}`, {
+        params: {
+          PageNumber: page,
+          PageSize: pageSize,
+          ...data
+        }
+      });
     }
-  });
-  return res.data;
+
+    return res.data;
+  } catch (error) {
+    console.error("Error fetching data:", error);
+    throw error;
+  }
 };
 
 export const getDataFromTable = async ({ tableName, id }) => {
-  const res = await api.get(`${getBaseUrl()}/Admin/${tableName}/GetDetail`, {
-    params: {
-      id
-    }
-  });
-  return res.data;
+  try {
+    const url = apiUrl ? `${getBaseUrl()}/${apiUrl}/${tableName}` : `${getBaseUrl()}/Admin/${tableName}/GetDetail`;
+
+    const res = await api.get(url, {
+      params: {
+        id
+      }
+    });
+    return res.data;
+  } catch (error) {
+    console.error("Error fetching data:", error);
+    throw error;
+  }
 };
+
 export const deleteDataFromTable = async ({ tableName, id }) => {
-  const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/Delete`, {
-    id
-  });
-  return res.data;
+  if (!apiUrl) {
+    // Khi không có apiUrl, thực hiện DELETE đến URL cụ thể với tableName
+    const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/Delete`, {
+      id
+    });
+    return res.data;
+  } else {
+    // Khi có apiUrl, chuyển id thành mảng string và thực hiện DELETE
+    const ids = Array.isArray(id) ? id : [id]; // Chuyển id thành mảng nếu chưa phải là mảng
+    const res = await api.delete(`${getBaseUrl()}/${apiUrl}/${tableName}`, {
+      data: ids, // Truyền ids như là dữ liệu của body
+      headers: {
+        'Content-Type': 'application/json-patch+json' // Đảm bảo Content-Type là đúng
+      }
+    });
+    return res.data;
+  }
 };
 export const deleteMultipleDataFromTable = async ({ tableName, ids }) => {
-  const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/DeleteMulti`, {
-    ids
-  });
-  return res.data;
+  if (!apiUrl) {
+    const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/DeleteMulti`, {
+      ids
+    });
+    return res.data;
+  } else {
+    const res = await api.delete(`${getBaseUrl()}/${apiUrl}/${tableName}`, {
+      data: ids, // Truyền ids như là dữ liệu của body
+      headers: {
+        'Content-Type': 'application/json' // Đảm bảo Content-Type là đúng
+      }
+    });
+    return res.data;
+  }
 };
 export const saveDataToTable = async ({ tableName, data }) => {
-  const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/SaveData`, {
-    json: JSON.stringify({ ...data })
-  });
-  return res.data;
+  if (!apiUrl) {
+    const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/SaveData`, {
+      json: JSON.stringify({ ...data })
+    });
+    return res.data;
+  } else {
+    if (!data.id) {
+      // Khi không có ID, thực hiện POST đến apiUrl
+      const res = await api.post(`${getBaseUrl()}/${apiUrl}/${tableName}`, data);
+      return res.data;
+    } else {
+      // Khi có ID, thực hiện PUT đến apiUrl với ID trong URL
+      const res = await api.put(`${getBaseUrl()}/${apiUrl}/${tableName}/${data.id}`, data);
+      return res.data;
+    }
+  }
 };
 export const changeStatusDataToTable = async ({ tableName, id }) => {
   const res = await api.post(`${getBaseUrl()}/Admin/${tableName}/ChangeStatus`, {
@@ -67,10 +142,10 @@ export const changeStatusDataToTable = async ({ tableName, id }) => {
   return res.data;
 };
 
-export const exportExcel = async ({ tableName,data }) => {
-  const res = await api.get(`${getBaseUrl()}/Admin/${tableName}/ExportData`,{
+export const exportExcel = async ({ tableName, data }) => {
+  const res = await api.get(`${getBaseUrl()}/Admin/${tableName}/ExportData`, {
     params: {
-      json: JSON.stringify(data),
+      json: JSON.stringify(data)
     }
   });
   return res.data;
@@ -83,4 +158,4 @@ export const uploadFile = async (formData) => {
     }
   });
   return res.data;
-};
+};

package/components/DataManagement/TableRowRender.jsx

@@ -98,7 +98,7 @@ export const TableRowRender = ({
 
       {!disableCellThaoTac && (
         <TableCell align="center">
-          {!disableEdit && (
+          {!disableEdit && canEdit && (
             <Tooltip title="Chỉnh sửa">
               <IconButton size={downXl ? "small" : "medium"} onClick={() => onEdit(row)}>
                 <EditOutlined fontSize="inherit" color="primary" />
@@ -112,7 +112,7 @@ export const TableRowRender = ({
               </IconButton>
             </Tooltip>
           )}
-          {!disableDelete && (
+          {!disableDelete && canDelete && (
             <Tooltip title="Xóa">
               <IconButton
                 size={downXl ? "small" : "medium"}

package/components/DataManagement/index.jsx

@@ -19,6 +19,7 @@ DataManagement.propTypes = {
   columns: PropTypes.array,
   title: PropTypes.string,
   titleButtons: PropTypes.array,
+  apiUrl: PropTypes.string,
   tableName: PropTypes.string,
   selectedField: PropTypes.string,
   filters: PropTypes.arrayOf(
@@ -55,6 +56,7 @@ function DataManagement({
   columns = [],
   title,
   titleButtons = [],
+  apiUrl,
   tableName,
   selectedField = "Id",
   filters: tableFilters = [],
@@ -67,7 +69,8 @@ function DataManagement({
 
   tableActions = [],
   multipleActions = [],
-
+  disableDelete = false,
+  disableEdit = false,
   disableEditor = false,
   onAddClick = () => {},
   onEditClick = () => {},
@@ -84,7 +87,7 @@ function DataManagement({
   const [selectedEditItem, setSelectedEditItem] = useState(null);
   const [openViewDialog, setOpenViewDialog] = useState(false);
 
-  const { canCreate } = usePermission(tableName);
+  const { canCreate } = usePermission(apiUrl?apiUrl:tableName);
   const { defaults, filters } = useMemo(() => {
     const filters = tableFilters.filter(({ type }) => type !== "default");
     const defaultFilters = tableFilters.filter(({ type }) => type === "default");
@@ -114,6 +117,7 @@ function DataManagement({
     const hasTabpanel = !!tabPanel;
     return {
       sttLuyKe,
+      apiUrl,
       tableName,
       selectedField,
       titleButtons,
@@ -137,6 +141,7 @@ function DataManagement({
     };
   }, [
     sttLuyKe,
+    apiUrl,
     tableName,
     selectedField,
     titleButtons,
@@ -210,7 +215,7 @@ function DataManagement({
             {tabPanel}
             <FilterGod filters={filters} elementSize={elementSize} setPage={setPage} />
             {backParentNavigator}
-            <DataTable multipleActions={multipleActions} page={page} setPage={setPage} disableEdit={disableEditor} disableDelete = {disableEditor}/>
+            <DataTable multipleActions={multipleActions} page={page} setPage={setPage} disableEdit={disableEdit} disableDelete = {disableDelete}/>
           </Card>
         </FormProvider>
 

package/hooks/usePermission.js

@@ -1,17 +1,17 @@
 import { useContext, useMemo } from "react";
 import { PermissionContext } from "../contexts";
 
-const usePermission = (tableName) => {
-  if (!tableName) {
-    throw new Error("tableName is required");
-  }
+const usePermission = (apiUrl,tableName) => {
+  // if (!tableName && !apiUrl) {
+  //   throw new Error("api is required");
+  // }
   const context = useContext(PermissionContext);
   if (!context) {
     throw new Error("usePermission must be used within a PermissionProvider");
   }
   const { permissionMap, setPermission } = context;
 
-  const permission = permissionMap[tableName];
+  const permission = permissionMap[apiUrl?apiUrl:tableName];
 
   const { canEdit, canDelete, canDeleteMulti, canSave, canCreate, canAction, canView, canImport } = useMemo(() => {
     const canEdit = !permission || permission.Edit;
@@ -27,7 +27,7 @@ const usePermission = (tableName) => {
   }, [permission]);
 
   const set = (permission) => {
-    setPermission({ ...permissionMap, [tableName]: permission });
+    setPermission({ ...permissionMap, [apiUrl?apiUrl:tableName]: permission });
   };
 
   return { permission, set, canEdit, canDelete, canDeleteMulti, canSave, canCreate, canAction, canView, canImport };

package/package.json

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