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