From 16b2e5a16d61ce00900e9ebe9daf1dd4162d4792 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Fri, 14 Mar 2025 11:22:38 +0700 Subject: [PATCH 01/18] add select dropdown on search --- .../master/postoadms/blocks/SearchDialog.tsx | 147 +++++++++--------- 1 file changed, 74 insertions(+), 73 deletions(-) diff --git a/src/pages/master/postoadms/blocks/SearchDialog.tsx b/src/pages/master/postoadms/blocks/SearchDialog.tsx index 1277ccb..2218e3e 100644 --- a/src/pages/master/postoadms/blocks/SearchDialog.tsx +++ b/src/pages/master/postoadms/blocks/SearchDialog.tsx @@ -11,14 +11,16 @@ import { Alert, KeenIcon } from '@/components'; import { Button } from '@/components/ui/button'; import { apiConfig } from '@/config/api.config'; import axios from 'axios'; -import { - Select, - SelectContent, - SelectItem, - SelectTrigger, - SelectValue -} from '@/components/ui/select'; import { useManagePostoAdmsContext } from '../hooks/useManagePostoAdmsContext'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; interface SucosProps { id: number; @@ -29,6 +31,7 @@ const API_URL = apiConfig.service_master_data; const SearchDialog = () => { const parentRef = useRef(null); + const [open, setOpen] = useState(false); const { showSearchDialog, handleSearchDialog, postoAdms } = useManagePostoAdmsContext(); const [alert, setAlert] = useState({ show: false, @@ -60,6 +63,7 @@ const SearchDialog = () => { if (response.data.status) { setSucos(response.data.data); + console.log(sucos); setIsFound(true); console.log('Found postoadms: ', response.data.data); } else { @@ -79,25 +83,22 @@ const SearchDialog = () => { setIsFound(false); setSucos([]); }; - // console.log(municipios); + return ( - handleSearchDialog(open)}> + - - + +
-

- Search Sucos -

-
+

Search Sucos

{ handleSearchDialog(false); - resetForm(); + handleReset(); }} > @@ -105,68 +106,68 @@ const SearchDialog = () => {
-
- {alert.show && ( - - {alert.message} - - )} -
-
-
- + + {alert.show && {alert.message}} - -
+
+ - {isFound && sucos.length > 0 && ( -
-

Sucos:

-
-
- - {sucos.map((suco) => suco.name).join(', ')} - -
-
- )} + + + + + + + + + No PostoAdms found. + + {postoAdms.map((postoAdm) => ( + { + setFormField({ + id: postoAdm.posto_adms_id, + name: postoAdm.posto_adms_name + }); + setOpen(false); + }} + > + {postoAdm.posto_adms_name} + + ))} + + + + + +
-
- - + {isFound && sucos.length > 0 && ( +
+

Sucos:

+
+ + {sucos.map((suco) => suco.name).join(', ')} +
- -
+ )} + +
+ + +
+
From 03e33bc93739cfdaed18bbad7f624ac840165140 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Fri, 14 Mar 2025 13:59:49 +0700 Subject: [PATCH 02/18] add dropdown municipio list on form create and update --- .../master/postoadms/blocks/AddDialog.tsx | 86 ++++++++++++++--- .../master/postoadms/blocks/EditDialog.tsx | 93 ++++++++++++++++--- .../master/postoadms/blocks/ListToolbar.tsx | 2 +- .../hooks/ManagePostoAdmsContext.tsx | 4 +- 4 files changed, 154 insertions(+), 31 deletions(-) diff --git a/src/pages/master/postoadms/blocks/AddDialog.tsx b/src/pages/master/postoadms/blocks/AddDialog.tsx index 6e47f25..6dc83d9 100644 --- a/src/pages/master/postoadms/blocks/AddDialog.tsx +++ b/src/pages/master/postoadms/blocks/AddDialog.tsx @@ -15,6 +15,20 @@ import { } from '@/components/ui/dialog'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; + +interface MunicipioProps { + id: number; + name: string; +} const API_URL = apiConfig.service_master_data; @@ -22,9 +36,10 @@ const AddDialog = () => { const parentRef = useRef(null); const { showAddDialog, handleAddDialog } = useManagePostoAdmsContext(); const { reload } = useDataGrid(); - const { PostData } = useCallApi(); + const { PostData, GetData } = useCallApi(); const parsedUser = getAuth()?.user; - + const [municipios, setMunicipios] = useState([]); + const [open, setOpen] = useState(false); const [alert, setAlert] = useState({ show: false, message: '' @@ -88,6 +103,28 @@ const AddDialog = () => { } }, [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); + } + }, []); + return ( handleAddDialog(open)}> @@ -122,18 +159,41 @@ const AddDialog = () => {
- { - const value = parseInt(e.target.value, 10); - setFormField({ ...formField, municipio_id: isNaN(value) ? 0 : value }); - }} - /> + + + + + + + + + No Municipio found. + + {municipios.map((municipio) => ( + { + setFormField({ + ...formField, + municipio_id: municipio.id + }); + setOpen(false); + }} + > + {municipio.name} + + ))} + + + + +
diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx index 8513d83..c1b85ba 100644 --- a/src/pages/master/postoadms/blocks/EditDialog.tsx +++ b/src/pages/master/postoadms/blocks/EditDialog.tsx @@ -15,15 +15,32 @@ import { } from '@/components/ui/dialog'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; + +interface MunicipioProps { + id: number; + name: string; +} const API_URL = apiConfig.service_master_data; const EditDialog = () => { const parentRef = useRef(null); - const { showEditDialog, handleEditDialog, selectedPostoAdms } = useManagePostoAdmsContext(); + const { showEditDialog, handleEditDialog, selectedPostoAdms, postoAdms } = + useManagePostoAdmsContext(); const { reload } = useDataGrid(); - const { PutData } = useCallApi(); + const { PutData, GetData } = useCallApi(); const parsedUser = getAuth()?.user; + const [open, setOpen] = useState(false); + const [municipios, setMunicipios] = useState([]); const [alert, setAlert] = useState({ show: false, @@ -35,7 +52,6 @@ const EditDialog = () => { updated_by: '', updated_at: '' }; - const [formField, setFormField] = useState(initialState); const created_time = new Date(); const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' '); @@ -72,7 +88,7 @@ const EditDialog = () => { return; } - doUpdatePostoAdm(e); + // doUpdatePostoAdm(e); console.log(formField); setAlert({ show: false, message: '' }); }; @@ -87,6 +103,30 @@ 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); + } + }, []); + + console.log(selectedPostoAdms); + return ( handleEditDialog(open, null)}> @@ -121,18 +161,41 @@ const EditDialog = () => {
- { - const value = parseInt(e.target.value, 10); - setFormField({ ...formField, municipio_id: isNaN(value) ? 0 : value }); - }} - /> + + + + + + + + + No Municipio found. + + {municipios.map((municipio) => ( + { + setFormField({ + ...formField, + municipio_id: municipio.id + }); + setOpen(false); + }} + > + {municipio.name} + + ))} + + + + +
diff --git a/src/pages/master/postoadms/blocks/ListToolbar.tsx b/src/pages/master/postoadms/blocks/ListToolbar.tsx index 0be25e2..19a9a65 100644 --- a/src/pages/master/postoadms/blocks/ListToolbar.tsx +++ b/src/pages/master/postoadms/blocks/ListToolbar.tsx @@ -16,7 +16,7 @@ const ListToolbar = () => { table.getColumn('posto_adms_name')?.setFilterValue(event.target.value) diff --git a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx index 2b19adc..b639521 100644 --- a/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx +++ b/src/pages/master/postoadms/hooks/ManagePostoAdmsContext.tsx @@ -125,13 +125,13 @@ const ManagePostoAdmsContextProvider = ({ children }: { children: React.ReactNod <> From 6878dfd9ee0e37215c4f2bd7638d396b13baddf1 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Fri, 14 Mar 2025 15:10:40 +0700 Subject: [PATCH 03/18] fix fetch municipio --- src/pages/master/postoadms/blocks/AddDialog.tsx | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/pages/master/postoadms/blocks/AddDialog.tsx b/src/pages/master/postoadms/blocks/AddDialog.tsx index 6dc83d9..75f140e 100644 --- a/src/pages/master/postoadms/blocks/AddDialog.tsx +++ b/src/pages/master/postoadms/blocks/AddDialog.tsx @@ -104,8 +104,8 @@ const AddDialog = () => { }, [formattedTime]); useEffect(() => { - try { - const fetchMunicipios = async (sorting: any) => { + 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, @@ -117,12 +117,12 @@ const AddDialog = () => { console.log(response?.data); setMunicipios(response?.data.list); - }; + } catch (error) { + console.error('Error fetching municipios', error); + } + }; - fetchMunicipios([{ id: 'name', desc: false }]); - } catch (error) { - console.error('Error fetching municipios', error); - } + fetchMunicipios([{ id: 'name', desc: false }]); }, []); return ( From 419dad0431e4e1ffe54f14fb06f7f9700a9b0722 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Sun, 16 Mar 2025 12:08:32 +0700 Subject: [PATCH 04/18] add dropdown menu for type, status, transaction id, and agent --- src/config/api.config.ts | 4 +- .../master/provider/blocks/AddDialog.tsx | 176 ++++++++++++--- .../master/provider/blocks/EditDialog.tsx | 200 +++++++++++++++--- .../provider/hooks/ManageProviderContext.tsx | 1 + 4 files changed, 324 insertions(+), 57 deletions(-) diff --git a/src/config/api.config.ts b/src/config/api.config.ts index 25146a3..4780676 100644 --- a/src/config/api.config.ts +++ b/src/config/api.config.ts @@ -2,6 +2,7 @@ interface apiConfigProps { service_dashboard: string; service_customer: string; service_master_data: string; + service_transaction: string; } const API_URL = import.meta.env.VITE_APP_API_URL; @@ -10,7 +11,8 @@ const apiConfig: apiConfigProps = { service_dashboard: `${API_URL}/d`, service_customer: `${API_URL}/c`, // service_master_data: `${API_URL}/m` - service_master_data: `${API_URL}/t` + service_master_data: `${API_URL}/t`, + service_transaction: `${API_URL}/tt` }; export { apiConfig }; diff --git a/src/pages/master/provider/blocks/AddDialog.tsx b/src/pages/master/provider/blocks/AddDialog.tsx index 9b7f533..dbb6c6e 100644 --- a/src/pages/master/provider/blocks/AddDialog.tsx +++ b/src/pages/master/provider/blocks/AddDialog.tsx @@ -15,14 +15,46 @@ import { } from '@/components/ui/dialog'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue +} from '@/components/ui/select'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; + +export interface CustomerProps { + msisdn: string; + email: string; + fullname: string; + username: string; +} + +export interface TransactionProps { + id: string; + name: string; +} + +const API_URL_CUSTOMER = apiConfig.service_customer; +const API_URL_MASTERDATA = apiConfig.service_master_data; +const API_URL_TRANSACTION = apiConfig.service_transaction; -const API_URL = apiConfig.service_master_data; const AddDialog = () => { const { showAddDialog, handleAddDialog } = useManageProviderContext(); const { reload } = useDataGrid(); - const { PostData } = useCallApi(); + const { PostData, GetData } = useCallApi(); const parentRef = useRef(null); const parsedUser = getAuth()?.user; + const [open, setOpen] = useState(false); const [alert, setAlert] = useState({ show: false, message: '' @@ -38,6 +70,8 @@ const AddDialog = () => { created_at: '' }; const [formField, setFormField] = useState(initialState); + const [customers, setCustomers] = useState([]); + const [transactions, setTransactions] = useState([]); const created_time = new Date(); const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' '); @@ -49,7 +83,7 @@ const AddDialog = () => { const doCreateProvider = useCallback(async (e: React.FormEvent) => { e.preventDefault(); - const response = await PostData(`${API_URL}/provider/create`, formField); + const response = await PostData(`${API_URL_MASTERDATA}/provider/create`, formField); if (response?.status) { resetForm(); @@ -77,7 +111,7 @@ const AddDialog = () => { return; } - doCreateProvider(e); + // doCreateProvider(e); console.log(formField); setAlert({ show: false, message: '' }); }; @@ -92,6 +126,46 @@ const AddDialog = () => { } }, [formattedTime]); + useEffect(() => { + const getCustomerList = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL_CUSTOMER}/customer/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + console.log('CUSTOMER: ', response?.data); + setCustomers(response?.data.list); + } catch (error) { + console.error('Error fetching customer', error); + } + }; + + const getTransactionTypeList = async (sorting: any) => { + try { + const response = await GetData(`${API_URL_TRANSACTION}/transactiontype/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + console.log('TRANSACTION TYPE: ', response?.data); + setTransactions(response?.data.list); + } catch (error) { + console.error('Error fetching transaction type', error); + } + }; + + getCustomerList([{ id: 'msisdn', desc: false }]); + getTransactionTypeList([{ id: 'name', desc: false }]); + }, []); + return ( handleAddDialog(open)}> @@ -142,12 +216,18 @@ const AddDialog = () => { - setFormField({ ...formField, type: e.target.value })} - /> + onValueChange={(value) => setFormField({ ...formField, type: value })} + > + + + + + H2H + Agent + + @@ -156,12 +236,18 @@ const AddDialog = () => { - setFormField({ ...formField, status: e.target.value })} - /> + onValueChange={(value) => setFormField({ ...formField, status: value })} + > + + + + + Active + Inactive + + @@ -170,28 +256,64 @@ const AddDialog = () => { - - setFormField({ ...formField, transactionTypeId: e.target.value }) + onValueChange={(value) => + setFormField({ ...formField, transactionTypeId: value }) } - /> + > + + + + + {transactions.map((transaction) => ( + + {transaction.name} + + ))} + +
- setFormField({ ...formField, agentId: e.target.value })} - /> + + + + + + + + + No Agent found. + + {customers.map((customer) => ( + { + setFormField({ + ...formField, + agentId: customer.msisdn + }); + setOpen(false); + }} + > + {customer.fullname} + + ))} + + + + +
diff --git a/src/pages/master/provider/blocks/EditDialog.tsx b/src/pages/master/provider/blocks/EditDialog.tsx index 51b4796..99838ab 100644 --- a/src/pages/master/provider/blocks/EditDialog.tsx +++ b/src/pages/master/provider/blocks/EditDialog.tsx @@ -15,15 +15,37 @@ import { } from '@/components/ui/dialog'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue +} from '@/components/ui/select'; +import { CustomerProps, TransactionProps } from './AddDialog'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; + +const API_URL_CUSTOMER = apiConfig.service_customer; +const API_URL_MASTERDATA = apiConfig.service_master_data; +const API_URL_TRANSACTION = apiConfig.service_transaction; -const API_URL = apiConfig.service_master_data; const EditDialog = () => { - const { showEditDialog, handleEditDialog, selectedProvider } = useManageProviderContext(); + const { showEditDialog, handleEditDialog, selectedProvider, provider } = + useManageProviderContext(); 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', ' '); + const [open, setOpen] = useState(false); const [alert, setAlert] = useState({ show: false, message: '' @@ -39,6 +61,8 @@ const EditDialog = () => { updated_at: '' }; const [formField, setFormField] = useState(initialState); + const [transactions, setTransactions] = useState([]); + const [customers, setCustomers] = useState([]); const resetForm = () => { setFormField(initialState); @@ -49,7 +73,10 @@ const EditDialog = () => { async (e: React.FormEvent) => { e.preventDefault(); - const response = await PutData(`${API_URL}/provider/update/${selectedProvider}`, formField); + const response = await PutData( + `${API_URL_MASTERDATA}/provider/update/${selectedProvider}`, + formField + ); if (response?.status) { resetForm(); @@ -64,6 +91,25 @@ const EditDialog = () => { [selectedProvider, formField] ); + const doFetchData = useCallback(async () => { + if (selectedProvider) { + const data = provider.find((item) => item.id === selectedProvider); + if (data) { + setFormField((prev) => ({ + ...prev, + name: data.name, + description: data.description, + type: data.type, + status: data.status, + transactionTypeId: data.transactionTypeId, + agentId: data.agentId + })); + } + } else { + resetForm(); + } + }, []); + const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); @@ -79,11 +125,17 @@ const EditDialog = () => { return; } - doUpdateProvider(e); + // doUpdateProvider(e); console.log(formField); setAlert({ show: false, message: '' }); }; + useEffect(() => { + if (selectedProvider) { + doFetchData(); + } + }, [selectedProvider]); + useEffect(() => { if (showEditDialog) { setFormField({ @@ -94,6 +146,46 @@ const EditDialog = () => { } }, [formattedTime]); + useEffect(() => { + const getCustomerList = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL_CUSTOMER}/customer/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + console.log('CUSTOMER: ', response?.data); + setCustomers(response?.data.list); + } catch (error) { + console.error('Error fetching customer', error); + } + }; + + const getTransactionTypeList = async (sorting: any) => { + try { + const response = await GetData(`${API_URL_TRANSACTION}/transactiontype/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + console.log('TRANSACTION TYPE: ', response?.data); + setTransactions(response?.data.list); + } catch (error) { + console.error('Error fetching transaction type', error); + } + }; + + getCustomerList([{ id: 'msisdn', desc: false }]); + getTransactionTypeList([{ id: 'name', desc: false }]); + }, []); + return ( handleEditDialog(open, null)}> @@ -120,7 +212,9 @@ const EditDialog = () => { className="input" type="text" value={formField.name} - onChange={(e) => setFormField({ ...formField, name: e.target.value })} + onChange={({ target }) => + setFormField((prev) => ({ ...prev, name: target.value })) + } /> @@ -144,12 +238,18 @@ const EditDialog = () => { - setFormField({ ...formField, type: e.target.value })} - /> + onValueChange={(value) => setFormField({ ...formField, type: value })} + > + + + + + H2H + Agent + + @@ -158,12 +258,18 @@ const EditDialog = () => { - setFormField({ ...formField, status: e.target.value })} - /> + onValueChange={(value) => setFormField({ ...formField, status: value })} + > + + + + + Active + Inactive + + @@ -172,28 +278,64 @@ const EditDialog = () => { - - setFormField({ ...formField, transactionTypeId: e.target.value }) + onValueChange={(value) => + setFormField({ ...formField, transactionTypeId: value }) } - /> + > + + + + + {transactions.map((transaction) => ( + + {transaction.name} + + ))} + +
- setFormField({ ...formField, agentId: e.target.value })} - /> + + + + + + + + + No Agent found. + + {customers.map((customer) => ( + { + setFormField({ + ...formField, + agentId: customer.msisdn + }); + setOpen(false); + }} + > + {customer.fullname} + + ))} + + + + +
diff --git a/src/pages/master/provider/hooks/ManageProviderContext.tsx b/src/pages/master/provider/hooks/ManageProviderContext.tsx index 10482a6..71d94cb 100644 --- a/src/pages/master/provider/hooks/ManageProviderContext.tsx +++ b/src/pages/master/provider/hooks/ManageProviderContext.tsx @@ -7,6 +7,7 @@ import { Toaster } from 'sonner'; import ListToolbar from '../blocks/ListToolbar'; interface ProviderProps { + id: string; name: string; description: string; type: string; From fad6803140feeb73055fc2eb072f2520b530ae2a Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Sun, 16 Mar 2025 12:57:53 +0700 Subject: [PATCH 05/18] add handleFilter --- .../master/municipios/blocks/AddDialog.tsx | 6 ----- .../master/municipios/blocks/ListToolbar.tsx | 23 +++++++++++++++---- 2 files changed, 18 insertions(+), 11 deletions(-) diff --git a/src/pages/master/municipios/blocks/AddDialog.tsx b/src/pages/master/municipios/blocks/AddDialog.tsx index 234bd0c..fa19c21 100644 --- a/src/pages/master/municipios/blocks/AddDialog.tsx +++ b/src/pages/master/municipios/blocks/AddDialog.tsx @@ -77,12 +77,6 @@ const AddDialog = () => { return; } - // setFormField({ - // name: formField.name, - // created_by: parsedUser.email, - // created_at: formattedTime - // }); - doCreateMunicipio(e); console.log(parsedUser.email); console.log(formField); diff --git a/src/pages/master/municipios/blocks/ListToolbar.tsx b/src/pages/master/municipios/blocks/ListToolbar.tsx index 0129c85..abbdce2 100644 --- a/src/pages/master/municipios/blocks/ListToolbar.tsx +++ b/src/pages/master/municipios/blocks/ListToolbar.tsx @@ -1,10 +1,23 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { useManageMunicipiosContext } from '../hooks/useManageMunicipiosContext'; import { Button } from '@/components/ui/button'; +import { useCallback, useState } from 'react'; +import { toast } from 'sonner'; const ListToolbar = () => { const { table, reload } = useDataGrid(); const { handleAddDialog, handleSearchDialog } = useManageMunicipiosContext(); + const [searchName, setSearchName] = useState(''); + const [isLoading, setIsLoading] = useState(false); + + const handleFilterData = useCallback(() => { + try { + table.getColumn('name')?.setFilterValue(searchName); + } catch (error) { + toast.error('Error applying filter'); + console.error('Error applying filter:', error); + } + }, [searchName, table]); return (
@@ -16,8 +29,8 @@ const ListToolbar = () => { table.getColumn('name')?.setFilterValue(event.target.value)} + value={searchName} + onChange={(event) => setSearchName(event.target.value)} /> @@ -25,19 +38,19 @@ const ListToolbar = () => { variant="outline" className="h-7.5 disabled:bg-gray-400" // disabled={isLoading} - // onClick={handleFilterData} + onClick={handleFilterData} > {/* {loadingButton === 'filter' ? : } */} - + */}
-
+
+
diff --git a/src/pages/master/postoadms/blocks/ListToolbar.tsx b/src/pages/master/postoadms/blocks/ListToolbar.tsx index 19a9a65..56a758d 100644 --- a/src/pages/master/postoadms/blocks/ListToolbar.tsx +++ b/src/pages/master/postoadms/blocks/ListToolbar.tsx @@ -34,13 +34,13 @@ const ListToolbar = () => { - + */}
+ + + + + + No Sucos found. + + {sucos.map((suco) => ( + { + setFormField({ + ...formField, + sucos_id: suco.sucos_id + }); + setOpen(false); + }} + > + {suco.sucos_name} + + ))} + + + + +
diff --git a/src/pages/master/aldeias/blocks/EditDialog.tsx b/src/pages/master/aldeias/blocks/EditDialog.tsx index d34e30c..179208c 100644 --- a/src/pages/master/aldeias/blocks/EditDialog.tsx +++ b/src/pages/master/aldeias/blocks/EditDialog.tsx @@ -15,21 +15,37 @@ import { } from '@/components/ui/dialog'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; + +interface SucosProps { + sucos_id: number; + sucos_name: string; +} const API_URL = apiConfig.service_master_data; const EditDialog = () => { - const { showEditDialog, handleEditDialog, selectedAldeias } = useManageAldeiasContext(); + const { showEditDialog, handleEditDialog, selectedAldeias, aldeias } = useManageAldeiasContext(); const { reload } = useDataGrid(); - const { PutData } = useCallApi(); + const { PutData, GetData } = useCallApi(); const parsedUser = getAuth()?.user; + const [sucos, setSucos] = useState([]); + const [open, setOpen] = useState(false); const [alert, setAlert] = useState({ show: false, message: '' }); const initialState = { name: '', - sucos: 0, + sucos_id: 0, updated_by: '', updated_at: '' }; @@ -64,12 +80,12 @@ const EditDialog = () => { const handleUpdate = (e: React.FormEvent) => { e.preventDefault(); - if (formField.name === '' || formField.sucos === 0) { + if (formField.name === '' || formField.sucos_id === 0) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; } - // doUpdateAldeias(e); + doUpdateAldeias(e); console.log(formField); setAlert({ show: false, message: '' }); }; @@ -84,6 +100,28 @@ 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 }]); + }, []); + return ( handleEditDialog(open, null)}> @@ -120,16 +158,39 @@ const EditDialog = () => { - { - const value = parseInt(e.target.value, 10); - setFormField({ ...formField, sucos: isNaN(value) ? 0 : value }); - }} - /> + + + + + + + + + No Sucos found. + + {sucos.map((suco) => ( + { + setFormField({ + ...formField, + sucos_id: suco.sucos_id + }); + setOpen(false); + }} + > + {suco.sucos_name} + + ))} + + + + + diff --git a/src/pages/master/aldeias/blocks/ListToolbar.tsx b/src/pages/master/aldeias/blocks/ListToolbar.tsx index 7cc5369..70ababf 100644 --- a/src/pages/master/aldeias/blocks/ListToolbar.tsx +++ b/src/pages/master/aldeias/blocks/ListToolbar.tsx @@ -31,13 +31,13 @@ const ListToolbar = () => { - + */}
- + */}
@@ -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;