fix error datatable

georgepiter · Apr 12, 2023 · b318ecf · b318ecf
1 parent 9ea0e7e
commit b318ecf
Show file tree

Hide file tree

Showing 7 changed files with 93 additions and 76 deletions.
diff --git a/.env b/.env
@@ -1,6 +1,6 @@
 APP_NAME=FINANCES
 BASE_URL=
-BASE_URL_API=https://8e17-2804-2448-8080-4600-4cf0-7116-2a88-17eb.sa.ngrok.io
+BASE_URL_API=https://6c84-2804-2448-809e-e800-9c4a-d13c-4740-5e7d.ngrok-free.app
 NODE_ENV=development
 
 BASE_URL_AUTH=/api/v1

diff --git a/src/components/tables/HistoryAllByRegisterTable.tsx b/src/components/tables/HistoryAllByRegisterTable.tsx
@@ -22,6 +22,8 @@ import {
  Tooltip,
  Legend,
  ResponsiveContainer,
+ BarChart,
+ Bar,
 } from "recharts";
 import { FiTrash2 } from "react-icons/fi";
 
@@ -190,27 +192,28 @@ export default function HistoryAllByRegisterTable({ registerId }: Props) {
  ) : (
  <div style={{ width: "100%", height: 300 }}>
  <ResponsiveContainer>
- <LineChart
+ <BarChart
+ width={500}
+ height={300}
  data={history}
  margin={{
  top: 5,
  right: 30,
- left: 20,
+ left: 50,
  bottom: 5,
  }}
  >
- <CartesianGrid strokeDasharray="3 3" />
- <XAxis dataKey="period" tickFormatter={dateFormat} />
+ <XAxis dataKey="period" />
  <YAxis tickFormatter={moneyFormat} />
- <Tooltip />
+
  <Legend />
- <Line
- type="monotone"
+ <Bar
+ name="Crédito"
  dataKey="balanceCredit"
- name="Saldo"
- stroke={theme.colors.primary["500"]}
+ fill="#9F7AEA"
  />
- </LineChart>
+ <Bar name="Saldo" dataKey="totalCredit" fill="#76E4F7" />
+ </BarChart>
  </ResponsiveContainer>
  </div>
  )}

diff --git a/src/components/template/NavbarTop.tsx b/src/components/template/NavbarTop.tsx
@@ -65,16 +65,16 @@ export default function NavbarTop() {
  route: "admin/user",
  role: "ROLE_ADMIN",
  },
- {
- title: "Categorias",
- route: "admin/category",
- role: "ROLE_ADMIN",
- },
  {
  title: "Históricos",
  route: "history",
  role: "ROLE_MANAGER",
  },
+ {
+ title: "Categorias",
+ route: "category",
+ role: "ROLE_MANAGER",
+ },
  ];
 
  function handleSignOut() {

diff --git a/src/models/category.ts b/src/models/category.ts
@@ -1,4 +1,5 @@
 export interface CategoryModel {
  description: string;
  categoryId?: number;
+ registerId: number;
 }
diff --git a/src/pages/admin/category/index.tsx → src/pages/category/index.tsx b/src/pages/admin/category/index.tsx → src/pages/category/index.tsx
@@ -1,4 +1,3 @@
-
 import {
  Container,
  Heading,
@@ -27,7 +26,7 @@ import {
  AlertDialogBody,
  AlertDialogFooter,
  useColorMode,
- IconButton as IconButtonBase
+ IconButton as IconButtonBase,
 } from "@chakra-ui/react";
 
 import { HamburgerIcon } from "@chakra-ui/icons";
@@ -44,14 +43,24 @@ import Box from "@/components/Box";
 import Spinner from "@/components/Spinner";
 import Layout from "@/components/template/Layout";
 import { CategoryDTO } from "@/dto/http/CategoryDTO";
-import { createCategory, deleteCategory, getCategoryById, listAllCategory, updateCategory } from "@/services/category";
+import {
+ createCategory,
+ deleteCategory,
+ getCategoryById,
+ listAllCategory,
+ updateCategory,
+} from "@/services/category";
+
 import { Input } from "@/components/Input";
 import Button from "@/components/Button";
 import { CategoryModel } from "@/models/category";
 import IconButton from "@/components/IconButton";
 import Divider from "@/components/Divider";
 import DataTableBase from "@/components/DataTableBase";
 
+import { useRegister } from "@/hooks/useRegister";
+
+
 const insertFormSchema = z.object({
  description: z.string({
  required_error: "Digite a Descrição",
@@ -66,6 +75,8 @@ export default function Category() {
 
  const { colorMode } = useColorMode();
 
+ const { registerBase } = useRegister();
+
  const [categories, setCategories] = useState<CategoryDTO[]>([]);
  const [isLoading, setIsLoading] = useState(false);
 
@@ -104,43 +115,43 @@ export default function Category() {
  onOpenFormModal();
  }
 
-  const columns = [
-  {
-  name: "Id",
-  selector: (row: any) => row.categoryId,
-  },
-  {
-  name: "Descrição",
-  selector: (row: any) => row.description,
-  },
-  {
-  name: "Ações",
-  selector: (row: any) => (
-  <Menu>
-  <MenuButton
-  rounded={20}
-  bg={colorMode == "dark" ? "gray.500" : "gray.50"}
-  as={IconButtonBase}
-  icon={<HamburgerIcon />}
-  />
-  <MenuList minWidth="150px">
-  <MenuItem onClick={() => handleEditCategory(row.categoryId)}>
-  <HStack flex={1} justifyContent="space-between">
-  <Text>Editar</Text>
-  <FiEdit2 />
-  </HStack>
-  </MenuItem>
-  <MenuItem onClick={() => handleConfirmCategory(row.categoryId)}>
-  <HStack flex={1} justifyContent="space-between">
-  <Text>Excluir</Text>
-  <FiTrash2 />
-  </HStack>
-  </MenuItem>
-  </MenuList>
-  </Menu>
-  ),
-  },
-  ];
+ const columns = [
+ {
+ name: "Id",
+ selector: (row: any) => row.categoryId,
+ },
+ {
+ name: "Descrição",
+ selector: (row: any) => row.description,
+ },
+ {
+ name: "Ações",
+ selector: (row: any) => (
+ <Menu>
+ <MenuButton
+ rounded={20}
+ bg={colorMode == "dark" ? "gray.500" : "gray.50"}
+ as={IconButtonBase}
+ icon={<HamburgerIcon />}
+ />
+ <MenuList minWidth="150px">
+ <MenuItem onClick={() => handleEditCategory(row.categoryId)}>
+ <HStack flex={1} justifyContent="space-between">
+ <Text>Editar</Text>
+ <FiEdit2 />
+ </HStack>
+ </MenuItem>
+ <MenuItem onClick={() => handleConfirmCategory(row.categoryId)}>
+ <HStack flex={1} justifyContent="space-between">
+ <Text>Excluir</Text>
+ <FiTrash2 />
+ </HStack>
+ </MenuItem>
+ </MenuList>
+ </Menu>
+ ),
+ },
+ ];
 
  async function handleEditCategory(id: number) {
  setIsEdit(true);
@@ -169,7 +180,7 @@ export default function Category() {
 
  async function handleDeleteCategory() {
  try {
- const res = await deleteCategory(categoryId);
+ const res = await deleteCategory(categoryId, registerBase.registerId);
 
  if (res.status === 200) {
  toast({
@@ -193,7 +204,7 @@ export default function Category() {
  async function loadCategories() {
  setIsLoading(true);
  try {
- const res = await listAllCategory();
+ const res = await listAllCategory(registerBase.registerId);
  if (res.data) {
  setCategories(res.data as CategoryDTO[]);
  }
@@ -214,17 +225,18 @@ export default function Category() {
  if (isEdit) {
  const category: CategoryModel = {
  description: data.description,
- categoryId: categoryId
+ categoryId: categoryId,
+ registerId: registerBase.registerId
  };
  res = await updateCategory(category);
-
  } else {
  const category: CategoryModel = {
  description: data.description,
+ registerId: registerBase.registerId,
  };
  res = await createCategory(category);
  }
- 
+
  if (res.status === 200) {
  toast({
  title: res.data.message,
@@ -242,7 +254,6 @@ export default function Category() {
  isClosable: true,
  });
  }
-
  } catch (error: any) {
  toast({
  title: error.message,
@@ -252,17 +263,17 @@ export default function Category() {
  }
  }
 
-  useEffect(() => {
-  reset(category);
+ useEffect(() => {
+ reset(category);
 
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [category]);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [category]);
 
-  useEffect(() => {
-  loadCategories();
+ useEffect(() => {
+ loadCategories();
 
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, []);
 
  return (
  <Layout>
@@ -368,4 +379,4 @@ export default function Category() {
  </Container>
  </Layout>
  );
-}
+}
diff --git a/src/pages/debt/index.tsx b/src/pages/debt/index.tsx
@@ -449,7 +449,7 @@ export default function Debt() {
 
  async function loadCategories() {
  try {
- const res = await listAllCategory();
+ const res = await listAllCategory(registerBase.registerId);
  if (res.status === 200) {
 
  const select = renameSelect(res.data);

diff --git a/src/services/category.ts b/src/services/category.ts
@@ -1,17 +1,19 @@
 import { api } from "@/data/api";
 import { CategoryModel } from "@/models/category";
 
-export const listAllCategory = async () => {
- return await api.get(`${process.env.BASE_URL_AUTH}/category/all/`);
+export const listAllCategory = async (registerId: number) => {
+ return await api.get(
+ `${process.env.BASE_URL_AUTH}/category/all/${registerId}`
+ );
 };
 
 export const createCategory = async (data: CategoryModel) => {
  return await api.post(`${process.env.BASE_URL_AUTH}/category/`, data);
 };
 
-export const deleteCategory = async (idCategory: number) => {
+export const deleteCategory = async (idCategory: number, registerId: number) => {
  return await api.delete(
- `${process.env.BASE_URL_AUTH}/category/${idCategory}`
+ `${process.env.BASE_URL_AUTH}/category/${idCategory}/${registerId}`
  );
 };