From 1445fc8ecf8937db3c9785d0d838f363d50d26f5 Mon Sep 17 00:00:00 2001 From: Raja Oktafrianto Date: Tue, 18 Mar 2025 11:27:23 +0700 Subject: [PATCH] update --- src/pages/master/aldeias/blocks/AddDialog.tsx | 38 +++--- .../master/aldeias/blocks/EditDialog.tsx | 68 ++++++++--- .../aldeias/hooks/ManageAldeiasContext.tsx | 6 +- .../master/municipios/blocks/AddDialog.tsx | 3 +- .../master/municipios/blocks/EditDialog.tsx | 45 +++++-- .../master/municipios/blocks/ListToolbar.tsx | 4 +- .../hooks/ManageMunicipiosContext.tsx | 71 ++--------- .../master/postoadms/blocks/AddDialog.tsx | 40 +++---- .../master/postoadms/blocks/EditDialog.tsx | 69 +++++++---- .../master/postoadms/blocks/ListToolbar.tsx | 4 +- .../master/postoadms/blocks/SearchDialog.tsx | 12 +- .../hooks/ManagePostoAdmsContext.tsx | 22 ++-- .../master/products/blocks/AddDialog.tsx | 10 +- .../master/products/blocks/EditDialog.tsx | 41 ++++++- .../master/profession/blocks/AddDialog.tsx | 2 +- .../master/profession/blocks/EditDialog.tsx | 2 +- .../master/provider/blocks/AddDialog.tsx | 12 +- .../master/provider/blocks/EditDialog.tsx | 12 +- src/pages/master/sucos/blocks/AddDialog.tsx | 2 +- src/pages/master/sucos/blocks/EditDialog.tsx | 2 +- src/pages/members/kyc/Kyc.tsx | 3 + .../members/manage-members/ManageMembers.tsx | 3 + .../menu/manage-menu/blocks/AddDIalog.tsx | 81 +++++++------ .../menu/manage-menu/blocks/DeleteDialog.tsx | 10 +- .../menu/manage-menu/blocks/EditDialog.tsx | 111 ++++++++++-------- .../manage-menu/hooks/ManageMenusContext.tsx | 63 ++++++---- .../hooks/ManagePositionContext.tsx | 13 +- .../manage-user/hooks/ManageUserContext.tsx | 13 +- 28 files changed, 446 insertions(+), 316 deletions(-) diff --git a/src/pages/master/aldeias/blocks/AddDialog.tsx b/src/pages/master/aldeias/blocks/AddDialog.tsx index 26c53f3..af089ef 100644 --- a/src/pages/master/aldeias/blocks/AddDialog.tsx +++ b/src/pages/master/aldeias/blocks/AddDialog.tsx @@ -78,6 +78,24 @@ const AddDialog = () => { [formField] ); + const doFetchSucos = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL}/sucos/list`, { + limit: 1000, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + // console.log('SUCOS', response?.data); + setSucos(response?.data.list); + } catch (error) { + console.error('Error fetching municipios', error); + } + }; + const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); @@ -102,25 +120,7 @@ const AddDialog = () => { }, [formattedTime]); useEffect(() => { - const fetchSucos = async (sorting: any) => { - try { - sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; - const response = await GetData(`${API_URL}/sucos/list`, { - limit: 100, - page: 1, - with_deleted: false, - order_field: sorting[0].id, - order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' - }); - - // console.log('SUCOS', response?.data); - setSucos(response?.data.list); - } catch (error) { - console.error('Error fetching municipios', error); - } - }; - - fetchSucos([{ id: 'name', desc: false }]); + doFetchSucos([{ id: 'name', desc: false }]); }, []); useEffect(() => { diff --git a/src/pages/master/aldeias/blocks/EditDialog.tsx b/src/pages/master/aldeias/blocks/EditDialog.tsx index 179208c..d69981e 100644 --- a/src/pages/master/aldeias/blocks/EditDialog.tsx +++ b/src/pages/master/aldeias/blocks/EditDialog.tsx @@ -77,6 +77,42 @@ const EditDialog = () => { [selectedAldeias, formField] ); + const doFetchSucos = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL}/sucos/list`, { + limit: 1000, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + // console.log('SUCOS', response?.data); + setSucos(response?.data.list); + } catch (error) { + console.error('Error fetching municipios', error); + } + }; + + const doFetchData = useCallback(async (id: string) => { + const response = await GetData(`${API_URL}/aldeias/getdata/${id}`, { id }); + + if (response?.status) { + setFormField((prev) => ({ + ...prev, + name: response.data.name, + sucos_id: response.data.sucos.id + })); + } else { + setFormField((prev) => ({ + ...prev, + name: '', + sucos_id: 0 + })); + } + }, []); + const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); @@ -90,6 +126,18 @@ const EditDialog = () => { setAlert({ show: false, message: '' }); }; + useEffect(() => { + if (selectedAldeias) { + doFetchData(selectedAldeias); + } + }, [selectedAldeias]); + + useEffect(() => { + if (showEditDialog === false) { + resetForm(); + } + }, [showEditDialog]); + useEffect(() => { if (showEditDialog) { setFormField({ @@ -101,25 +149,7 @@ const EditDialog = () => { }, [formattedTime]); useEffect(() => { - const fetchSucos = async (sorting: any) => { - try { - sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; - const response = await GetData(`${API_URL}/sucos/list`, { - limit: 100, - page: 1, - with_deleted: false, - order_field: sorting[0].id, - order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' - }); - - // console.log('SUCOS', response?.data); - setSucos(response?.data.list); - } catch (error) { - console.error('Error fetching municipios', error); - } - }; - - fetchSucos([{ id: 'name', desc: false }]); + doFetchSucos([{ id: 'name', desc: false }]); }, []); return ( diff --git a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx index 80359b0..a4cf161 100644 --- a/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx +++ b/src/pages/master/aldeias/hooks/ManageAldeiasContext.tsx @@ -142,15 +142,17 @@ const ManageAldeiasContextProvider = ({ children }: { children: React.ReactNode const getAldeiasLists = async (page: number, limit: number, sorting: any, filter: any) => { try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() }; const response = await GetData(`${API_URL}/aldeias/list`, { limit, page: page + 1, - with_deleted: true, + with_deleted: false, order_field: sorting[0].id, order_direction: sorting[0].desc == false ? 'ASC' : 'DESC', filter: JSON.stringify(filter) }); - // console.log(response?.data); + console.log(response?.data); setAldeias(response?.data.list); return { data: response?.data.list, totalCount: response?.data.total_count }; } catch (error) { diff --git a/src/pages/master/municipios/blocks/AddDialog.tsx b/src/pages/master/municipios/blocks/AddDialog.tsx index 03fca26..d2dfda4 100644 --- a/src/pages/master/municipios/blocks/AddDialog.tsx +++ b/src/pages/master/municipios/blocks/AddDialog.tsx @@ -42,6 +42,7 @@ const AddDialog = () => { const resetForm = () => { setFormField(initialState); + setAlert({ show: false, message: '' }); }; const doCreateMunicipio = useCallback( @@ -72,7 +73,7 @@ const AddDialog = () => { const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '') { + if (formField.name.trim() === '') { setAlert({ show: true, message: 'Please fill name field.' }); return; } diff --git a/src/pages/master/municipios/blocks/EditDialog.tsx b/src/pages/master/municipios/blocks/EditDialog.tsx index 0579d28..50406bc 100644 --- a/src/pages/master/municipios/blocks/EditDialog.tsx +++ b/src/pages/master/municipios/blocks/EditDialog.tsx @@ -25,7 +25,7 @@ const EditDialog = () => { const { showEditDialog, handleEditDialog, selectedMunicipios, municipios } = useManageMunicipiosContext(); const { reload } = useDataGrid(); - const { PutData } = useCallApi(); + const { PutData, GetData } = useCallApi(); const parsedUser = getAuth()?.user; const [alert, setAlert] = useState({ show: false, @@ -44,6 +44,7 @@ const EditDialog = () => { const resetForm = () => { setFormField(initialState); + setAlert({ show: false, message: '' }); }; const doUpdateMunicipios = useCallback( @@ -74,28 +75,46 @@ const EditDialog = () => { [selectedMunicipios, formField] ); + const doFetchData = useCallback(async (id: string) => { + const response = await GetData(`${API_URL}/municipios/getdata/${id}`, { id }); + + if (response?.status) { + setFormField((prev) => ({ + ...prev, + name: response.data.name + })); + } else { + setFormField((prev) => ({ + ...prev, + name: '' + })); + } + }, []); + const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '') { + if (formField.name.trim() === '') { setAlert({ show: true, message: 'Please fill name field.' }); return; } - // setFormField({ - // name: formField.name, - // created_by: parsedUser.email, - // created_at: formattedTime - // }); - doUpdateMunicipios(e); console.log(formField); setAlert({ show: false, message: '' }); }; - // const doFetchMunicipios = useCallback(async (id: string) => { - // const response = await axios.get(`${API_URL}/municipios/${id}`); - // }, []); + useEffect(() => { + if (selectedMunicipios) { + doFetchData(selectedMunicipios); + } + }, [selectedMunicipios]); + + useEffect(() => { + if (showEditDialog === false) { + resetForm(); + } + }, [showEditDialog]); useEffect(() => { if (selectedMunicipios) { @@ -127,7 +146,9 @@ const EditDialog = () => {
- + { setSearchName(event.target.value)} + value={(table.getColumn('name')?.getFilterValue() as string) ?? ''} + onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)} /> diff --git a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx index 606ef0d..63697d4 100644 --- a/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx +++ b/src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx @@ -113,8 +113,9 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) = } }, { - accessorFn: (row) => row.name, - id: 'name', + // accessorFn: (row) => row.name, + // id: 'name', + accessorKey: 'name', header: ({ column }) => , enableSorting: true, enableHiding: false, @@ -159,73 +160,27 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) = try { sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() }; - const response = await axios.get(`${API_URL}/municipios/list`, { - params: { - limit: limit, - page: page + 1, - with_deleted: false, - order_field: sorting[0].id, - order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' - } + const response = await GetData(`${API_URL}/municipios/list`, { + limit, + page: page + 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC', + filter: JSON.stringify(filter) }); - // console.log(response.data); + // console.log(response?.data); // const sortedList = response.data.data.list.sort((a: MunicipiosProps, b: MunicipiosProps) => { // if (a.name < b.name) return -1; // if (a.name > b.name) return 1; // return 0; // }); - setMunicipios(response.data.data.list); - return { data: response?.data.data.list, totalCount: response?.data.data.total_count }; + setMunicipios(response?.data.list); + return { data: response?.data.list, totalCount: response?.data.total_count }; } catch (error) { console.error('Error fetching municipios', error); } }; - const getPostoadmsByMunicipio = async (name: string) => { - try { - const response = await axios.get(`${API_URL}/municipios/postoadms/${name}`); - const data = response.data; - console.log(data); - } catch (error) { - console.error(`Error fetching municipios by ${name}`, error); - } - }; - - const createMunicipios = async (data: Partial) => { - try { - await axios.post(`${API_URL}/municipios/create`, data); - // getMunicipiosLists(10, 1, false, 'name', 'ASC'); - } catch (error) { - console.error('Error creating municipios', error); - } - }; - - const updateMunicipios = async (id: number, data: Partial) => { - try { - await axios.put(`${API_URL}/update/${id}`, data); - // getMunicipiosLists(10, 1, false, 'name', 'ASC'); - } catch (error) { - console.error('Error updating municipios', error); - } - }; - - const deleteMunicipios = async (id: number, hardDelete?: boolean) => { - try { - await axios.delete(`${API_URL}/delete/${id}/${hardDelete}`); - // getMunicipiosLists(10, 1, false, 'name', 'ASC'); - } catch (error) { - console.error('Error deleting municipios', error); - } - }; - - const restoreMunicipios = async (id: number) => { - try { - await axios.put(`${API_URL}/restore/${id}`); - // getMunicipiosLists(10, 1, false, 'name', 'ASC'); - } catch (error) { - console.error('Error restoring municipios', error); - } - }; return ( { [formField] ); + const doFetchMunicipios = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL}/municipios/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + // console.log(response?.data); + setMunicipios(response?.data.list); + } catch (error) { + console.error('Error fetching municipios', error); + } + }; + const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '' || formField.municipio_id === 0) { + if (formField.name.trim() === '' || formField.municipio_id === 0) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; } @@ -110,25 +128,7 @@ const AddDialog = () => { }, [showAddDialog]); useEffect(() => { - const fetchMunicipios = async (sorting: any) => { - try { - sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; - const response = await GetData(`${API_URL}/municipios/list`, { - limit: 100, - page: 1, - with_deleted: false, - order_field: sorting[0].id, - order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' - }); - - // console.log(response?.data); - setMunicipios(response?.data.list); - } catch (error) { - console.error('Error fetching municipios', error); - } - }; - - fetchMunicipios([{ id: 'name', desc: false }]); + doFetchMunicipios([{ id: 'name', desc: false }]); }, []); return ( diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx index c42423b..d170d1a 100644 --- a/src/pages/master/postoadms/blocks/EditDialog.tsx +++ b/src/pages/master/postoadms/blocks/EditDialog.tsx @@ -80,10 +80,45 @@ const EditDialog = () => { [selectedPostoAdms, formField] ); + const doFetchMunicipios = useCallback(async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL}/municipios/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + // console.log('MUNICIPIOS: ', response?.data); + setMunicipios(response?.data.list); + } catch (error) { + console.error('Error fetching municipios', error); + } + }, []); + + const doFetchData = useCallback(async (id: string) => { + const response = await GetData(`${API_URL}/postoadms/getdata/${id}`, { id }); + + if (response?.status) { + setFormField((prev) => ({ + ...prev, + name: response.data.name, + municipio_id: response.data.municipios.id + })); + } else { + setFormField((prev) => ({ + ...prev, + name: '' + })); + } + }, []); + const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '' || formField.municipio_id === 0) { + if (formField.name.trim() === '' || formField.municipio_id === 0) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; } @@ -93,6 +128,18 @@ const EditDialog = () => { setAlert({ show: false, message: '' }); }; + useEffect(() => { + if (showEditDialog === false) { + resetForm(); + } + }, [showEditDialog]); + + useEffect(() => { + if (selectedPostoAdms) { + doFetchData(selectedPostoAdms); + } + }, [selectedPostoAdms]); + useEffect(() => { if (selectedPostoAdms) { setFormField({ @@ -104,25 +151,7 @@ const EditDialog = () => { }, [formattedTime]); useEffect(() => { - try { - const fetchMunicipios = async (sorting: any) => { - sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; - const response = await GetData(`${API_URL}/municipios/list`, { - limit: 100, - page: 1, - with_deleted: false, - order_field: sorting[0].id, - order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' - }); - - // console.log(response?.data); - setMunicipios(response?.data.list); - }; - - fetchMunicipios([{ id: 'name', desc: false }]); - } catch (error) { - console.error('Error fetching municipios', error); - } + doFetchMunicipios([{ id: 'name', desc: false }]); }, []); // console.log(selectedPostoAdms); diff --git a/src/pages/master/postoadms/blocks/ListToolbar.tsx b/src/pages/master/postoadms/blocks/ListToolbar.tsx index 56a758d..c476994 100644 --- a/src/pages/master/postoadms/blocks/ListToolbar.tsx +++ b/src/pages/master/postoadms/blocks/ListToolbar.tsx @@ -17,9 +17,9 @@ const ListToolbar = () => { - table.getColumn('posto_adms_name')?.setFilterValue(event.target.value) + table.getColumn('PostoAdms_name')?.setFilterValue(event.target.value) } /> diff --git a/src/pages/master/postoadms/blocks/SearchDialog.tsx b/src/pages/master/postoadms/blocks/SearchDialog.tsx index 2218e3e..6b83e74 100644 --- a/src/pages/master/postoadms/blocks/SearchDialog.tsx +++ b/src/pages/master/postoadms/blocks/SearchDialog.tsx @@ -83,7 +83,7 @@ const SearchDialog = () => { setIsFound(false); setSucos([]); }; - + return ( @@ -128,17 +128,17 @@ const SearchDialog = () => { {postoAdms.map((postoAdm) => ( { setFormField({ - id: postoAdm.posto_adms_id, - name: postoAdm.posto_adms_name + id: postoAdm.PostoAdms_id, + name: postoAdm.PostoAdms_name }); setOpen(false); }} > - {postoAdm.posto_adms_name} + {postoAdm.PostoAdms_name} ))} diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx index 55b87c3..4c3ca65 100644 --- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx +++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx @@ -9,8 +9,8 @@ import ListToolbar from '../blocks/ListToolbar'; import { useCallApi } from '@/hooks'; interface PostoAdmsProps { - posto_adms_id: number; - posto_adms_name: string; + PostoAdms_id: number; + PostoAdms_name: string; municipios_name: string; } @@ -84,8 +84,9 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod const columns = useMemo[]>( () => [ { - accessorFn: (row) => row.posto_adms_id, - id: 'id', + // accessorFn: (row) => row.PostoAdms_id, + // id: 'PostoAdms_id', + accessorKey: 'PostoAdms_id', header: ({ column }) => , enableSorting: true, enableHiding: false, @@ -96,7 +97,7 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod { // accessorFn: (row) => row.posto_adms_name, // id: 'posto_adms_name', - accessorKey: 'posto_adms_name', + accessorKey: 'PostoAdms_name', header: ({ column }) => ( ), @@ -127,13 +128,13 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod <> @@ -151,16 +152,17 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod const getPostoAdmsLists = async (page: number, limit: number, sorting: any, filter: any) => { try { - sorting: sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() }; const response = await GetData(`${API_URL}/postoadms/list`, { limit, page: page + 1, with_deleted: false, order_field: sorting[0].id, - order_direction: sorting[0].desc ? 'DESC' : 'ASC' + order_direction: sorting[0].desc ? 'DESC' : 'ASC', + filter: JSON.stringify(filter) }); - // console.log(response.data); + console.log(response?.data); // const sortedList = response.data.data.list.sort((a: PostoAdmsProps, b: PostoAdmsProps) => { // if (a.name < b.name) return -1; // if (a.name > b.name) return 1; diff --git a/src/pages/master/products/blocks/AddDialog.tsx b/src/pages/master/products/blocks/AddDialog.tsx index dc6ec88..3cdcf3c 100644 --- a/src/pages/master/products/blocks/AddDialog.tsx +++ b/src/pages/master/products/blocks/AddDialog.tsx @@ -71,15 +71,15 @@ const AddDialog = () => { e.preventDefault(); if ( - formField.name === '' || - formField.description === '' || + formField.name.trim() === '' || + formField.description.trim() === '' || formField.price_point === 0 || formField.price_cash === 0 || formField.cashback_point === 0 || formField.cashback_cash === 0 || - formField.status === '' || - formField.created_by === '' || - formField.created_at === '' + formField.status.trim() === '' || + formField.created_by.trim() === '' || + formField.created_at.trim() === '' ) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; diff --git a/src/pages/master/products/blocks/EditDialog.tsx b/src/pages/master/products/blocks/EditDialog.tsx index 5f5e45c..06eb7b6 100644 --- a/src/pages/master/products/blocks/EditDialog.tsx +++ b/src/pages/master/products/blocks/EditDialog.tsx @@ -20,7 +20,7 @@ const API_URL = apiConfig.service_master_data; const EditDialog = () => { const { showEditDialog, handleEditDialog, selectedProducts } = useManageProductsContext(); const { reload } = useDataGrid(); - const { PutData } = useCallApi(); + const { PutData, GetData } = useCallApi(); const parsedUser = getAuth()?.user; const created_time = new Date(); const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' '); @@ -66,19 +66,38 @@ const EditDialog = () => { [selectedProducts, formField] ); + const doFetchData = useCallback(async (id: string) => { + const response = await GetData(`${API_URL}/product/getdata/${selectedProducts}`, { id }); + + if (response?.status) { + setFormField((prev) => ({ + ...prev, + name: response.data.name, + description: response.data.description, + price_point: response.data.price_point, + price_cash: response.data.price_cash, + cashback_point: response.data.cashback_point, + cashback_cash: response.data.cashback_cash, + status: response.data.status + })); + } else { + setFormField(initialState); + } + }, []); + const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); if ( - formField.name === '' || - formField.description === '' || + formField.name.trim() === '' || + formField.description.trim() === '' || formField.price_point === 0 || formField.price_cash === 0 || formField.cashback_point === 0 || formField.cashback_cash === 0 || formField.status === '' || - formField.updated_by === '' || - formField.updated_at === '' + formField.updated_by.trim() === '' || + formField.updated_at.trim() === '' ) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; @@ -89,6 +108,18 @@ const EditDialog = () => { setAlert({ show: false, message: '' }); }; + useEffect(() => { + if (showEditDialog === false) { + resetForm(); + } + }, [showEditDialog]); + + useEffect(() => { + if (selectedProducts) { + doFetchData(selectedProducts); + } + }, [selectedProducts]); + useEffect(() => { if (showEditDialog) { setFormField({ diff --git a/src/pages/master/profession/blocks/AddDialog.tsx b/src/pages/master/profession/blocks/AddDialog.tsx index 247ff73..f87c9f9 100644 --- a/src/pages/master/profession/blocks/AddDialog.tsx +++ b/src/pages/master/profession/blocks/AddDialog.tsx @@ -61,7 +61,7 @@ const AddDialog = () => { const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '') { + if (formField.name.trim() === '') { setAlert({ show: true, message: 'Please fill name field.' }); return; } diff --git a/src/pages/master/profession/blocks/EditDialog.tsx b/src/pages/master/profession/blocks/EditDialog.tsx index ad592da..7dfc06c 100644 --- a/src/pages/master/profession/blocks/EditDialog.tsx +++ b/src/pages/master/profession/blocks/EditDialog.tsx @@ -65,7 +65,7 @@ const EditDialog = () => { const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '') { + if (formField.name.trim() === '') { setAlert({ show: true, message: 'Please fill name field.' }); return; } diff --git a/src/pages/master/provider/blocks/AddDialog.tsx b/src/pages/master/provider/blocks/AddDialog.tsx index 854ebf9..636ba54 100644 --- a/src/pages/master/provider/blocks/AddDialog.tsx +++ b/src/pages/master/provider/blocks/AddDialog.tsx @@ -100,12 +100,12 @@ const AddDialog = () => { e.preventDefault(); if ( - formField.name === '' || - formField.description === '' || - formField.type === '' || - formField.status === '' || - formField.transactionTypeId === '' || - formField.agentId === '' + formField.name.trim() === '' || + formField.description.trim() === '' || + formField.type.trim() === '' || + formField.status.trim() === '' || + formField.transactionTypeId.trim() === '' || + formField.agentId.trim() === '' ) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; diff --git a/src/pages/master/provider/blocks/EditDialog.tsx b/src/pages/master/provider/blocks/EditDialog.tsx index 3cd2b6c..5fa37c2 100644 --- a/src/pages/master/provider/blocks/EditDialog.tsx +++ b/src/pages/master/provider/blocks/EditDialog.tsx @@ -114,12 +114,12 @@ const EditDialog = () => { e.preventDefault(); if ( - formField.name === '' || - formField.description === '' || - formField.type === '' || - formField.status === '' || - formField.transactionTypeId === '' || - formField.agentId === '' + formField.name.trim() === '' || + formField.description.trim() === '' || + formField.type.trim() === '' || + formField.status.trim() === '' || + formField.transactionTypeId.trim() === '' || + formField.agentId.trim() === '' ) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; diff --git a/src/pages/master/sucos/blocks/AddDialog.tsx b/src/pages/master/sucos/blocks/AddDialog.tsx index 1eae604..dd5ab57 100644 --- a/src/pages/master/sucos/blocks/AddDialog.tsx +++ b/src/pages/master/sucos/blocks/AddDialog.tsx @@ -80,7 +80,7 @@ const AddDialog = () => { const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '' || formField.posto_adm_id === 0) { + if (formField.name.trim() === '' || formField.posto_adm_id === 0) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; } diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx index 6d70b64..64c8b94 100644 --- a/src/pages/master/sucos/blocks/EditDialog.tsx +++ b/src/pages/master/sucos/blocks/EditDialog.tsx @@ -68,7 +68,7 @@ const EditDialog = () => { const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '' || formField.posto_adm_id === 0) { + if (formField.name.trim() === '' || formField.posto_adm_id === 0) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; } diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx index 151eb71..e346889 100644 --- a/src/pages/members/kyc/Kyc.tsx +++ b/src/pages/members/kyc/Kyc.tsx @@ -8,6 +8,7 @@ import { useAuthContext } from '@/auth'; import { apiConfig } from '@/config/api.config'; import ConfirmDialog from '@/components/confirm'; import axios from 'axios'; +import { toast } from 'sonner'; const BASE_URL = apiConfig.service_customer; import CustomerDialog from '../manage-members/CustomerDetailModal'; @@ -128,10 +129,12 @@ const Kyc = () => { await fetchGroups(); setDialogOpen(false) setIsDialogOpen(false) + toast.success('Success Update Kyc Member'); } catch (error: any) { alert(error.message) setDialogOpen(false) setIsDialogOpen(false) + toast.error(error.message) } } diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx index a0d1959..2258819 100644 --- a/src/pages/members/manage-members/ManageMembers.tsx +++ b/src/pages/members/manage-members/ManageMembers.tsx @@ -7,6 +7,7 @@ import CustomerDialog from './CustomerDetailModal'; import ConfirmDialog from '@/components/confirm'; import { useAuthContext } from '@/auth'; import { ScreenLoader } from '@/components'; +import { toast } from 'sonner'; const BASE_URL = apiConfig.service_customer; const ManageMembers = () => { @@ -99,10 +100,12 @@ const ManageMembers = () => { await fetchGroups(); setDialogOpen(false) setIsDialogOpen(false) + toast.success('Success Update Member'); } catch (error: any) { alert(error.message) setDialogOpen(false) setIsDialogOpen(false) + toast.error(error.message) } } diff --git a/src/pages/menu/manage-menu/blocks/AddDIalog.tsx b/src/pages/menu/manage-menu/blocks/AddDIalog.tsx index 72e4209..d79fe8a 100644 --- a/src/pages/menu/manage-menu/blocks/AddDIalog.tsx +++ b/src/pages/menu/manage-menu/blocks/AddDIalog.tsx @@ -12,13 +12,14 @@ import { DialogHeader, DialogTitle } from '@/components/ui/dialog'; +import { FormControl,NativeSelect } from "@mui/material"; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; const API_URL = apiConfig.service_dashboard; const AddDialog = () => { const parentRef = useRef(null); - const { showAddDialog, handleAddDialog } = useManageMenusContext(); + const { showAddDialog, handleAddDialog, parents } = useManageMenusContext(); const { reload } = useDataGrid(); const { PostData } = useCallApi(); const [alert, setAlert] = useState({ @@ -36,26 +37,7 @@ const AddDialog = () => { }; const [formField, setFormField] = useState(initialState); - const doCreateMenu = useCallback( - async (e: React.FormEvent) => { - e.preventDefault(); - - const response = await PostData(`${API_URL}/menus/create`, formField); - - if (response?.status) { - handleAddDialog(false); - resetForm(); - toast.success('Success Create Menu'); - reload(); - } else { - toast.error('Failed Create Menu'); - setAlert({ show: true, message: 'Failed Create Menu' }); - } - }, - [formField] - ); - - const handleSubmit = (e: React.FormEvent) => { + const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); if ( @@ -69,7 +51,17 @@ const AddDialog = () => { return; } - doCreateMenu(e); + const response = await PostData(`${API_URL}/menus/create`, formField); + + if (response?.status) { + handleAddDialog(false); + resetForm(); + toast.success('Success Create Menu'); + reload(); + } else { + toast.error('Failed Create Menu'); + setAlert({ show: true, message: 'Failed Create Menu' }); + } console.log(formField); setAlert({ show: false, message: '' }); }; @@ -140,13 +132,24 @@ const AddDialog = () => {
- - setFormField({ ...formField, id_parent: e.target.value })} - /> + + + setFormField({ ...formField, id_parent: e.target.value })} + inputProps={{ + name: 'id_parent', + id: 'uncontrolled-native', + }} + > + { + parents ? parents.map((el: any) => ( + + )) : '' + } + +
@@ -185,12 +188,20 @@ const AddDialog = () => { - setFormField({ ...formField, status: e.target.value })} - /> + + setFormField({ ...formField, status: e.target.value })} + inputProps={{ + name: 'status', + id: 'uncontrolled-native', + }} + > + + + +
diff --git a/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx b/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx index f0baf0e..4f4818c 100644 --- a/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx +++ b/src/pages/menu/manage-menu/blocks/DeleteDialog.tsx @@ -10,7 +10,7 @@ import { Button } from '@/components/ui/button'; const API_URL = apiConfig.service_dashboard; const DeleteDialog = () => { - const { showDeleteDialog, handleDeleteDialog, selectedMenu } = useManageMenusContext(); + const { showDeleteDialog, handleDeleteDialog, selectedMenu }: any = useManageMenusContext(); const { reload } = useDataGrid(); const { DeleteData } = useCallApi(); const [enforce, setEnforce] = useState(false); @@ -19,9 +19,9 @@ const DeleteDialog = () => { message: '' }); - const doDeleteMenu = useCallback(async () => { - const response = await DeleteData(`${API_URL}/menus/delete/${selectedMenu}/${enforce}`, { - id: selectedMenu + const doDeleteMenu = async () => { + const response = await DeleteData(`${API_URL}/menus/delete/${selectedMenu.id}/${enforce}`, { + id: selectedMenu.id }); if (response?.status) { @@ -33,7 +33,7 @@ const DeleteDialog = () => { toast.error('Failed Delete Menu'); setAlert((prev) => ({ ...prev, show: true, message: response?.message })); } - }, [selectedMenu, enforce]); + }; return ( handleDeleteDialog(open, null)}> diff --git a/src/pages/menu/manage-menu/blocks/EditDialog.tsx b/src/pages/menu/manage-menu/blocks/EditDialog.tsx index 7dff544..78a5ea2 100644 --- a/src/pages/menu/manage-menu/blocks/EditDialog.tsx +++ b/src/pages/menu/manage-menu/blocks/EditDialog.tsx @@ -2,7 +2,7 @@ import { Alert, useDataGrid } from '@/components'; import { useManageMenusContext } from '../hooks/useManageMenusContext'; import { useCallApi } from '@/hooks'; import { apiConfig } from '@/config/api.config'; -import React, { useCallback, useState } from 'react'; +import React, { useCallback, useState, useEffect } from 'react'; import { toast } from 'sonner'; import { Dialog, @@ -12,12 +12,13 @@ import { DialogHeader, DialogTitle } from '@/components/ui/dialog'; +import { FormControl,NativeSelect } from "@mui/material"; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; - const API_URL = apiConfig.service_dashboard; + const EditDialog = () => { - const { showEditDialog, handleEditDialog, selectedMenu } = useManageMenusContext(); + const { showEditDialog, handleEditDialog, selectedMenu, setSelectedMenu, parents }: any = useManageMenusContext(); const { reload } = useDataGrid(); const { PutData } = useCallApi(); const [alert, setAlert] = useState({ @@ -25,6 +26,7 @@ const EditDialog = () => { message: '' }); const initialState = { + id: '', module: '', name: '', link: '', @@ -33,13 +35,25 @@ const EditDialog = () => { icon: '', status: '' }; - const [formField, setFormField] = useState(initialState); - const doUpdateMenu = useCallback(async (e: React.FormEvent) => { + const handleUpdate = async (e: React.FormEvent) => { e.preventDefault(); + + if ( + selectedMenu.module === '' || + selectedMenu.name === '' || + selectedMenu.link === '' || + selectedMenu.order_number === 0 || + selectedMenu.status === '' + ) { + setAlert({ show: true, message: 'Please fill in all required fields.' }); + return; + } - const response = await PutData(`${API_URL}/menus/update/${selectedMenu}`, formField); - + const updateMenu = selectedMenu; + if (updateMenu.id_parent === null) updateMenu.id_parent = ""; + delete updateMenu.parentName + const response = await PutData(`${API_URL}/menus/update/${selectedMenu.id}`, selectedMenu); if (response?.status) { handleEditDialog(false, null); resetForm(); @@ -49,29 +63,11 @@ const EditDialog = () => { toast.error('Failed Update Menu'); setAlert({ show: true, message: 'Failed Update Menu' }); } - }, []); - - const handleUpdate = (e: React.FormEvent) => { - e.preventDefault(); - - if ( - formField.module === '' || - formField.name === '' || - formField.link === '' || - formField.order_number === 0 || - formField.status === '' - ) { - setAlert({ show: true, message: 'Please fill in all required fields.' }); - return; - } - - doUpdateMenu(e); - console.log(formField); setAlert({ show: false, message: '' }); }; const resetForm = () => { - setFormField(initialState); + setSelectedMenu(initialState) setAlert({ show: false, message: '' }); }; @@ -100,8 +96,8 @@ const EditDialog = () => { setFormField({ ...formField, module: e.target.value })} + value={selectedMenu.module} + onChange={(e) => setSelectedMenu({ ...selectedMenu, module: e.target.value })} />
@@ -114,8 +110,8 @@ const EditDialog = () => { setFormField({ ...formField, name: e.target.value })} + value={selectedMenu.name} + onChange={(e) => setSelectedMenu({ ...selectedMenu, name: e.target.value })} /> @@ -128,8 +124,8 @@ const EditDialog = () => { setFormField({ ...formField, link: e.target.value })} + value={selectedMenu.link} + onChange={(e) => setSelectedMenu({ ...selectedMenu, link: e.target.value })} /> @@ -137,12 +133,23 @@ const EditDialog = () => {
- setFormField({ ...formField, id_parent: e.target.value })} - /> + + setSelectedMenu({ ...selectedMenu, id_parent: e.target.value })} + inputProps={{ + name: 'id_parent', + id: 'uncontrolled-native', + }} + > + { + parents ? parents.map((el: any) => ( + + )) : '' + } + +
@@ -155,10 +162,10 @@ const EditDialog = () => { className="input" type="number" min={0} - value={formField.order_number === 0 ? '' : formField.order_number} + value={selectedMenu.order_number === 0 ? '' : selectedMenu.order_number} onChange={(e) => { const value = parseInt(e.target.value, 10); - setFormField({ ...formField, order_number: isNaN(value) ? 0 : value }); + setSelectedMenu({ ...selectedMenu, order_number: isNaN(value) ? 0 : value }); }} /> @@ -170,8 +177,8 @@ const EditDialog = () => { setFormField({ ...formField, name: e.target.value })} + value={selectedMenu.icon} + onChange={(e) => setSelectedMenu({ ...selectedMenu, icon: e.target.value })} /> @@ -181,12 +188,20 @@ const EditDialog = () => { - setFormField({ ...formField, status: e.target.value })} - /> + + setSelectedMenu({ ...selectedMenu, status: e.target.value })} + inputProps={{ + name: 'status', + id: 'uncontrolled-native', + }} + > + + + + diff --git a/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx b/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx index 69f43b1..96a82f0 100644 --- a/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx +++ b/src/pages/menu/manage-menu/hooks/ManageMenusContext.tsx @@ -27,15 +27,26 @@ interface MenuProps { status: string; } +const initialState = { + id: '', + module: '', + name: '', + link: '', + id_parent: '', + order_number: 0, + icon: '', + status: '' +}; + interface ContextProps { menus: MenuProps[]; showEditDialog: boolean; - handleEditDialog: (show: boolean, selected_postoAdms: string | null) => void; + handleEditDialog: (show: boolean, selected_postoAdms: object | null) => void; showAddDialog: boolean; handleAddDialog: (show: boolean) => void; showDeleteDialog: boolean; - handleDeleteDialog: (show: boolean, selected_postoAdms: string | null) => void; - selectedMenu: string | null; + handleDeleteDialog: (show: boolean, selected_postoAdms: object | null) => void; + selectedMenu: object | null; getMenusLists: ( limit: number, page: number, @@ -43,6 +54,8 @@ interface ContextProps { order_field: any, order_direction: any ) => Promise<{ data: MenuProps[]; totalCount: number } | undefined>; + setSelectedMenu: (data: object) => void; + parents: any; } const initialProps: ContextProps = { @@ -50,11 +63,13 @@ const initialProps: ContextProps = { showAddDialog: false, handleAddDialog: (show: boolean) => {}, showEditDialog: false, - handleEditDialog: (show: boolean, selected_menu: string | null) => {}, + handleEditDialog: (show: boolean, selected_menu: object | null) => {}, showDeleteDialog: false, - handleDeleteDialog: (show: boolean, selected_menu: string | null) => {}, - selectedMenu: null, - getMenusLists: async () => ({ data: [], totalCount: 0 }) + handleDeleteDialog: (show: boolean, selected_menu: object | null) => {}, + selectedMenu: initialState, + getMenusLists: async () => ({ data: [], totalCount: 0 }), + setSelectedMenu: (data: object) => {}, + parents: [] }; const ManageMenusContext = createContext(initialProps); @@ -65,21 +80,22 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode }) const [showAddDialog, setShowAddDialog] = useState(false); const [showEditDialog, setShowEditDialog] = useState(false); const [showDeleteDialog, setShowDeleteDialog] = useState(false); - const [selectedMenu, setSelectedMenu] = useState(null); + const [selectedMenu, setSelectedMenu] = useState(initialState); + const [parents, setParents] = useState([]); const { GetData } = useCallApi(); const handleAddDialog = useCallback((show: boolean) => { setShowAddDialog(show); }, []); - const handleEditDialog = useCallback((show: boolean, selected_menu: string | null) => { + const handleEditDialog = useCallback((show: boolean, selected_menu: object | null) => { + if (show) setSelectedMenu(selected_menu); setShowEditDialog(show); - setSelectedMenu(selected_menu); }, []); - const handleDeleteDialog = useCallback((show: boolean, selected_menu: string | null) => { + const handleDeleteDialog = useCallback((show: boolean, selected_menu: object | null) => { + if (show) setSelectedMenu(selected_menu); setShowDeleteDialog(show); - setSelectedMenu(selected_menu); }, []); const columns = useMemo[]>( @@ -135,13 +151,13 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode }) <> @@ -158,25 +174,27 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode }) ); const flattenChildren = (parent: any, parentIdx: number, depth = 0, parentName = '') => { + if (parent.link === '/') { + if (!parents.find((el: any) => el.id === parent.id)) setParents((el: any) => [...el, { id: parent.id, name: parent.name }]) // GET PARENTS + } if (!parent.children || parent.children.length === 0) { return []; // Jika tidak ada children, kembalikan array kosong } return parent.children.flatMap((child: any, childIdx: number) => { - // Jika child masih punya children, lakukan rekursi lebih dalam if (child.children && child.children.length > 0) { return flattenChildren(child, parentIdx * 100 + childIdx, depth + 1, child.name); } - // Jika ini adalah child terakhir (leaf node), masukkan ke array hasil return { - id: parentIdx * 100 + childIdx + 1, + id: child.id, module: parent.module, parentName: parentName || parent.name, name: child.name, link: child.link, - id_parent: parent.id_parent, - status: parent.status + id_parent: child.id_parent, + status: parent.status, + order_number: parent.order_number }; }); }; @@ -194,10 +212,8 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode }) order_direction: sorting[0].desc ? 'DESC' : 'ASC' }); - console.log(response?.data); if (!response?.data.list) return { data: [], totalCount: 0 }; - // Gunakan rekursi untuk mencari children paling dalam const transformedData = response.data.list.flatMap((row: any, parentIdx: number) => flattenChildren(row, parentIdx) ); @@ -205,7 +221,6 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode }) const total_count = transformedData.length; setMenus(transformedData); - console.log(menus); return { data: transformedData, totalCount: total_count }; } catch (error) { console.error('Error fetching Menus', error); @@ -224,7 +239,9 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode }) showDeleteDialog, handleDeleteDialog, selectedMenu, - getMenusLists + getMenusLists, + setSelectedMenu, + parents }} > diff --git a/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx b/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx index ee3f565..2bc9d80 100644 --- a/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx +++ b/src/pages/settings/user/manage-position/hooks/ManagePositionContext.tsx @@ -85,11 +85,16 @@ const ManagePositionContextProvider = ({ children }: { children: React.ReactNode enableSorting: false, enableHiding: false, cell: ({ row }) => { + const isActive = row.original.status === 'Y'; + return ( - {}} - /> + + {isActive ? 'Active' : 'Inactive'} + ); }, meta: { diff --git a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx index 284ce93..efae604 100644 --- a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx +++ b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx @@ -127,11 +127,16 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode }) enableSorting: false, enableHiding: false, cell: ({ row }) => { + const isActive = row.original.status === 'Y'; + return ( - {}} - /> + + {isActive ? 'Active' : 'Inactive'} + ); }, meta: {