feat: rewrite component use effect
This commit is contained in:
@@ -1,46 +1,19 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
Form,
|
||||
Input,
|
||||
message,
|
||||
Modal,
|
||||
Select,
|
||||
Space,
|
||||
Table,
|
||||
Tag,
|
||||
} from "antd";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import { ExclamationCircleOutlined } from "@ant-design/icons";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { capitalize } from "lodash";
|
||||
import { useStore } from "../utils/useStore";
|
||||
import { LINKS } from "../routes/app";
|
||||
import React, {useState} from "react";
|
||||
import {Button, Form, Input, message, Modal, Select, Space, Table,} from "antd";
|
||||
import {observer} from "mobx-react-lite";
|
||||
import {useHistory} from "react-router-dom";
|
||||
import {useStore} from "../utils/useStore";
|
||||
import {LINKS} from "../routes/app";
|
||||
|
||||
export const CategoryComponent = observer((props) => {
|
||||
const store = useStore();
|
||||
const [form] = Form.useForm();
|
||||
const { Option } = Select;
|
||||
const {Option} = Select;
|
||||
const history = useHistory();
|
||||
const [idData, setIdData] = useState("");
|
||||
const [confirmLoading, setConfirmLoading] = useState(false);
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const init = async () => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
//store.product.pageCategories=StrToLower(props.category)
|
||||
await store.product.getDataSubCategories();
|
||||
setIsLoading(false);
|
||||
} catch (e) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
init();
|
||||
}, []);
|
||||
|
||||
const handleEditButton = (data) => {
|
||||
console.log(data, "isi data");
|
||||
form.setFieldsValue({
|
||||
@@ -154,18 +127,18 @@ export const CategoryComponent = observer((props) => {
|
||||
dataSource={store.category.data}
|
||||
bordered
|
||||
pagination={{
|
||||
pageSize: store.product.pageSize,
|
||||
total: store.product.total_data,
|
||||
current: store.product.page + 1,
|
||||
pageSize: store.category.pageSize,
|
||||
total: store.category.total_data,
|
||||
current: store.category.page + 1,
|
||||
showSizeChanger: true,
|
||||
simple: false,
|
||||
}}
|
||||
onChange={async (page) => {
|
||||
let pageNumber = page.current;
|
||||
store.product.pageSize = page.pageSize;
|
||||
store.product.page = pageNumber - 1;
|
||||
store.category.pageSize = page.pageSize;
|
||||
store.category.page = pageNumber - 1;
|
||||
// store.membership.isLoading = true;
|
||||
await store.product.getData();
|
||||
await store.category.getData();
|
||||
// store.membership.isLoading = false;
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -149,7 +149,6 @@ export const ProductComponent = observer((props) => {
|
||||
|
||||
const handleRemoveFilter = async () => {
|
||||
store.product.filterSupplier = null;
|
||||
store.product.filterCategory = null;
|
||||
store.product.filterSubCategory = null;
|
||||
setFilterSupplier(null);
|
||||
setFilterCategories(null);
|
||||
@@ -167,7 +166,6 @@ export const ProductComponent = observer((props) => {
|
||||
|
||||
const handleSubmitFilter = async () => {
|
||||
store.product.filterSupplier = filterSupplier;
|
||||
store.product.filterCategory = filterCategories;
|
||||
store.product.filterSubCategory = filterSubCategories;
|
||||
await store.product.getData();
|
||||
store.product.visibleModalFilterProduct = false;
|
||||
|
||||
@@ -1,49 +1,21 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
Form,
|
||||
Input,
|
||||
message,
|
||||
Modal,
|
||||
Select,
|
||||
Space,
|
||||
Table,
|
||||
Tag,
|
||||
} from "antd";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import { ExclamationCircleOutlined } from "@ant-design/icons";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { capitalize } from "lodash";
|
||||
import { useStore } from "../utils/useStore";
|
||||
import { LINKS } from "../routes/app";
|
||||
import React, {useState} from "react";
|
||||
import {Button, Form, Input, message, Modal, Select, Space, Table,} from "antd";
|
||||
import {observer} from "mobx-react-lite";
|
||||
import {useHistory} from "react-router-dom";
|
||||
import {useStore} from "../utils/useStore";
|
||||
|
||||
export const SubcategoryComponent = observer((props) => {
|
||||
const store = useStore();
|
||||
const [form] = Form.useForm();
|
||||
const { Option } = Select;
|
||||
const {Option} = Select;
|
||||
const history = useHistory();
|
||||
const [idData, setIdData] = useState("");
|
||||
const [confirmLoading, setConfirmLoading] = useState(false);
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const init = async () => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
//store.product.pageCategories=StrToLower(props.category)
|
||||
getData();
|
||||
setIsLoading(false);
|
||||
} catch (e) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
init();
|
||||
}, []);
|
||||
|
||||
const getData = async () => {
|
||||
await store.subcategory.getData();
|
||||
await store.category.getData();
|
||||
await store.subcategory.getData();
|
||||
};
|
||||
|
||||
const handleEditButton = (data) => {
|
||||
@@ -120,7 +92,7 @@ export const SubcategoryComponent = observer((props) => {
|
||||
form.resetFields();
|
||||
}
|
||||
};
|
||||
//console.log()
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Table
|
||||
@@ -129,16 +101,16 @@ export const SubcategoryComponent = observer((props) => {
|
||||
dataSource={store.subcategory.data}
|
||||
bordered
|
||||
pagination={{
|
||||
pageSize: store.product.pageSize,
|
||||
total: store.product.total_data,
|
||||
current: store.product.page + 1,
|
||||
pageSize: store.subcategory.pageSize,
|
||||
total: store.subcategory.total_data,
|
||||
current: store.subcategory.page + 1,
|
||||
showSizeChanger: true,
|
||||
simple: false,
|
||||
}}
|
||||
onChange={(page) => {
|
||||
let pageNumber = page.current;
|
||||
store.product.pageSize = page.pageSize;
|
||||
store.product.page = pageNumber - 1;
|
||||
store.subcategory.pageSize = page.pageSize;
|
||||
store.subcategory.page = pageNumber - 1;
|
||||
// store.membership.isLoading = true;
|
||||
getData();
|
||||
// store.membership.isLoading = false;
|
||||
|
||||
Reference in New Issue
Block a user