Merge branch 'master' of https://git.shiblysolution.id/TPAY/dashboard
This commit is contained in:
Raja Oktafrianto
@ -152,7 +152,7 @@ export const DataGridProvider = <TData extends object>(props: TDataGridProps<TDa
|
||||
onRowSelectionChange: handleRowSelectionChange,
|
||||
onSortingChange: (newSorting) => !loading && setSorting(newSorting),
|
||||
onColumnFiltersChange: (newFilters) => {
|
||||
console.log('New Filters:', newFilters); // Debugging
|
||||
// console.log('New Filters:', newFilters); // Debugging
|
||||
!loading && setColumnFilters(newFilters);
|
||||
},
|
||||
onColumnVisibilityChange: setColumnVisibility,
|
||||
|
||||
@ -22,6 +22,7 @@ import { useState, useEffect } from 'react';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import Divider from '@mui/material/Divider';
|
||||
import ConfirmDialog from '@/components/confirm';
|
||||
import { toast } from 'sonner';
|
||||
// import { DialogHeader } from '@/components/ui/dialog';
|
||||
// import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
|
||||
const BASE_URL = apiConfig.service_customer;
|
||||
@ -125,24 +126,29 @@ const ManageGroups = () => {
|
||||
await axios.post(`${BASE_URL}/groups/create`, {
|
||||
name: formData.groupName,
|
||||
status: formData.status,
|
||||
description: formData.description,
|
||||
created_at: new Date()
|
||||
});
|
||||
toast.success(`Success create group`)
|
||||
} else if (dialogType === 'update') {
|
||||
await axios.put(`${BASE_URL}/groups/update/${formData.id}`, {
|
||||
name: formData.groupName,
|
||||
status: formData.status,
|
||||
description: formData.description,
|
||||
updated_at: new Date()
|
||||
});
|
||||
toast.success(`Success update group`)
|
||||
} else if (dialogType === 'delete') {
|
||||
await axios.delete(`${BASE_URL}/groups/delete/${formData.id}/true`);
|
||||
toast.success(`Success delete group`)
|
||||
}
|
||||
await fetchGroups();
|
||||
closeDialog();
|
||||
setDialogOpen(false);
|
||||
} catch (error) {
|
||||
} catch (error: any) {
|
||||
console.log(error);
|
||||
closeDialog();
|
||||
toast.error(error.message)
|
||||
} finally {
|
||||
await fetchGroups();
|
||||
setDialogOpen(false);
|
||||
closeDialog();
|
||||
}
|
||||
};
|
||||
|
||||
@ -179,7 +185,7 @@ const ManageGroups = () => {
|
||||
columns={columns}
|
||||
createData={createGroup}
|
||||
onUpdate={handleUpdate}
|
||||
onDelete={handleDelete}
|
||||
onDelete={null}
|
||||
/>
|
||||
<Dialog open={isDialogOpen} onClose={closeDialog}>
|
||||
<DialogContent className="w-full">
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface SucosProps {
|
||||
sucos_id: number;
|
||||
@ -34,7 +35,7 @@ const API_URL = apiConfig.service_master_data;
|
||||
|
||||
const AddDialog = () => {
|
||||
const parentRef = useRef<any | null>(null);
|
||||
const { showAddDialog, handleAddDialog } = useManageAldeiasContext();
|
||||
const { showAddDialog, handleAddDialog, selectedAldeias } = useManageAldeiasContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const parsedUser = getAuth()?.user;
|
||||
@ -70,6 +71,13 @@ const AddDialog = () => {
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Aldeias');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Aldeias',
|
||||
description: `Create Aldeia => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Error Create Aldeias');
|
||||
setAlert({ show: true, message: 'Failed to create Aldeias. Please try again.' });
|
||||
|
||||
@ -6,6 +6,7 @@ import { useCallback, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogFooter, DialogHeader } from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -33,6 +34,14 @@ const DeleteDialog = () => {
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Aldeias');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Aldeias',
|
||||
description: `Delete Aldeia => ${selectedAldeias}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Aldeias');
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface SucosProps {
|
||||
sucos_id: number;
|
||||
@ -69,6 +70,13 @@ const EditDialog = () => {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Aldeias');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Aldeias',
|
||||
description: `Edit Aldeia => ${selectedAldeias}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Error Update Aldeias');
|
||||
setAlert({ show: true, message: 'Error Update Aldeias' });
|
||||
|
||||
@ -33,6 +33,7 @@ import {
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { useManageConversionContext } from '../hooks/useManageConversionContext';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
interface CurrencyProps {
|
||||
ID: string;
|
||||
name: string;
|
||||
@ -80,6 +81,13 @@ const AddDialog = () => {
|
||||
resetForm();
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Conversion');
|
||||
const createActivity = {
|
||||
module: 'Manage Conversion',
|
||||
description: `Create Conversion => ${formField.id_currency_origin} => ${formField.id_currency_destination}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Error Create Conversion');
|
||||
@ -246,28 +254,27 @@ const AddDialog = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label className="form-label">
|
||||
Status
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
|
||||
<div className="grow">
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) =>
|
||||
setFormField((prev) => ({ ...prev, status: value }))
|
||||
}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Y">Active</SelectItem>
|
||||
<SelectItem value="N">Inactive</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<label className="form-label">
|
||||
Status
|
||||
<span className="text-red-500">*</span>
|
||||
</label>
|
||||
|
||||
<div className="grow">
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) =>
|
||||
setFormField((prev) => ({ ...prev, status: value }))
|
||||
}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Y">Active</SelectItem>
|
||||
<SelectItem value="N">Inactive</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end gap-5">
|
||||
<Button type="button" variant="outline" onClick={resetForm}>
|
||||
|
||||
@ -13,6 +13,7 @@ import {
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { DialogDescription } from '@radix-ui/react-dialog';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_wallet;
|
||||
|
||||
@ -30,23 +31,29 @@ const DeleteDialog = () => {
|
||||
toast.error('No Conversion selected');
|
||||
return;
|
||||
}
|
||||
console.log(selectedConversion);
|
||||
const response = await DeleteData(
|
||||
`${API_URL}/dashboard/conversion/${selectedConversion}`,
|
||||
{ id: selectedConversion }
|
||||
);
|
||||
// console.log(selectedConversion);
|
||||
const response = await DeleteData(`${API_URL}/dashboard/conversion/${selectedConversion}`, {
|
||||
id: selectedConversion
|
||||
});
|
||||
|
||||
if (response?.status) {
|
||||
setAlert({ show: false, message: '' });
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Conversion');
|
||||
const createActivity = {
|
||||
module: 'Manage Conversion',
|
||||
description: `Delete Conversion => ${selectedConversion}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Conversion');
|
||||
}
|
||||
}, [selectedConversion, DeleteData, handleDeleteDialog, reload]);
|
||||
console.log(selectedConversion);
|
||||
// console.log(selectedConversion);
|
||||
return (
|
||||
<Dialog open={showDeleteDialog} onOpenChange={(open) => handleDeleteDialog(open, null)}>
|
||||
<DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden">
|
||||
|
||||
@ -33,6 +33,7 @@ import {
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { useManageConversionContext } from '../hooks/useManageConversionContext';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
interface CurrencyProps {
|
||||
ID: string;
|
||||
name: string;
|
||||
@ -82,6 +83,13 @@ const EditDialog = () => {
|
||||
resetForm();
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Conversion');
|
||||
const createActivity = {
|
||||
module: 'Manage Conversion',
|
||||
description: `Update Conversion => ${selectedConversion}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Error Create Conversion');
|
||||
|
||||
@ -159,7 +159,7 @@ const ManageConversionContextProvider = ({ children }: { children: React.ReactNo
|
||||
) => {
|
||||
sorting = sorting.length == 0 ? [{ id: 'name', desc: true }] : sorting;
|
||||
filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
|
||||
console.log(sorting);
|
||||
// console.log(sorting);
|
||||
const response = await GetData(`${API_URL}/dashboard/conversion/`, {
|
||||
limit: limit,
|
||||
page: page + 1,
|
||||
@ -168,7 +168,7 @@ const ManageConversionContextProvider = ({ children }: { children: React.ReactNo
|
||||
order_direction: sorting[0].desc ? 'ASC' : 'DESC',
|
||||
filter: JSON.stringify(filter)
|
||||
});
|
||||
console.log(response?.data);
|
||||
// console.log(response?.data);
|
||||
return { data: response?.data.list, totalCount: response?.data.total_count };
|
||||
};
|
||||
|
||||
|
||||
@ -34,6 +34,7 @@ import {
|
||||
} from '@/components/ui/select';
|
||||
import { useManageCurrencyContext } from '../hooks/useManageCurrencyContext';
|
||||
import { prefix } from 'stylis';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
interface CurrencyProps {
|
||||
ID: string;
|
||||
name: string;
|
||||
@ -80,6 +81,13 @@ const AddDialog = () => {
|
||||
resetForm();
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Currency');
|
||||
const createActivity = {
|
||||
module: 'Manage Currency',
|
||||
description: `Create Currency=> ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Error Create Currency');
|
||||
|
||||
@ -13,6 +13,7 @@ import {
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { DialogDescription } from '@radix-ui/react-dialog';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_wallet;
|
||||
|
||||
@ -39,6 +40,13 @@ const DeleteDialog = () => {
|
||||
setAlert({ show: false, message: '' });
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Currency');
|
||||
const createActivity = {
|
||||
module: 'Manage Currency',
|
||||
description: `Delete Currency=> ${selectedCurrency}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
|
||||
@ -33,6 +33,7 @@ import {
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { useManageCurrencyContext } from '../hooks/useManageCurrencyContext';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
interface CurrencyProps {
|
||||
ID: string;
|
||||
name: string;
|
||||
@ -81,6 +82,13 @@ const EditDialog = () => {
|
||||
resetForm();
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Currency');
|
||||
const createActivity = {
|
||||
module: 'Manage Currency',
|
||||
description: `Update Currency=> ${selectedCurrency}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Error Create Currency');
|
||||
|
||||
@ -55,13 +55,13 @@ const AddDialog = () => {
|
||||
resetForm();
|
||||
reload();
|
||||
toast.success('Municipio created successfully!');
|
||||
// const createActivity = {
|
||||
// module: 'Manage Municipio',
|
||||
// description: `Create Municipio => ${selectedMunicipios}`,
|
||||
// action: 'C'
|
||||
// };
|
||||
const createActivity = {
|
||||
module: 'Manage Municipios',
|
||||
description: `Create Municipio => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
// doSaveLogActivity(createActivity);
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed to create municipio.');
|
||||
setAlert({ show: true, message: 'Failed to create municipio. Please try again.' });
|
||||
|
||||
@ -4,9 +4,16 @@ import { useCallback, useState } from 'react';
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { DialogDescription } from '@radix-ui/react-dialog';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -25,16 +32,23 @@ const DeleteDialog = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
const response = await DeleteData(
|
||||
`${API_URL}/municipios/delete/${selectedMunicipios}/false`,
|
||||
{ id: selectedMunicipios }
|
||||
);
|
||||
const response = await DeleteData(`${API_URL}/municipios/delete/${selectedMunicipios}/false`, {
|
||||
id: selectedMunicipios
|
||||
});
|
||||
|
||||
if (response?.status) {
|
||||
setAlert({ show: false, message: '' });
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Municipio');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Municipios',
|
||||
description: `Delete Municipio => ${selectedMunicipios}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Municipio');
|
||||
@ -43,7 +57,6 @@ const DeleteDialog = () => {
|
||||
|
||||
return (
|
||||
<Dialog open={showDeleteDialog} onOpenChange={(open) => handleDeleteDialog(open, null)}>
|
||||
|
||||
<DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden">
|
||||
<DialogHeader className="p-0 border-0 block">
|
||||
<DialogTitle></DialogTitle>
|
||||
|
||||
@ -60,13 +60,13 @@ const EditDialog = () => {
|
||||
resetForm();
|
||||
toast.success('Success update municipio');
|
||||
reload();
|
||||
// const createActivity = {
|
||||
// module: 'Manage Municipio',
|
||||
// description: `Edit Municipio => ${selectedMunicipios}`,
|
||||
// action: 'U'
|
||||
// };
|
||||
const createActivity = {
|
||||
module: 'Manage Municipios',
|
||||
description: `Edit Municipio => ${selectedMunicipios}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
// doSaveLogActivity(createActivity);
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed update user');
|
||||
setAlert({ show: true, message: 'Failed to update municipio. Please try again.' });
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface MunicipioProps {
|
||||
id: number;
|
||||
@ -34,7 +35,7 @@ const API_URL = apiConfig.service_master_data;
|
||||
|
||||
const AddDialog = () => {
|
||||
const parentRef = useRef<any | null>(null);
|
||||
const { showAddDialog, handleAddDialog } = useManagePostoAdmsContext();
|
||||
const { showAddDialog, handleAddDialog, selectedPostoAdms } = useManagePostoAdmsContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const parsedUser = getAuth()?.user;
|
||||
@ -72,6 +73,13 @@ const AddDialog = () => {
|
||||
resetForm();
|
||||
reload();
|
||||
toast.success('Posto Adm created successfully!');
|
||||
const createActivity = {
|
||||
module: 'Manage Posto Administrativo',
|
||||
description: `Create PostoAdms => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed to create Posto Adm. Please try again.');
|
||||
setAlert({ show: true, message: 'Failed to create Posto Adm. Please try again.' });
|
||||
|
||||
@ -4,8 +4,16 @@ import { useCallApi } from '@/hooks';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -24,16 +32,22 @@ const DeleteDialog = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
const response = await DeleteData(
|
||||
`${API_URL}/postoadms/delete/${selectedPostoAdms}/false`,
|
||||
{ id: selectedPostoAdms }
|
||||
);
|
||||
const response = await DeleteData(`${API_URL}/postoadms/delete/${selectedPostoAdms}/false`, {
|
||||
id: selectedPostoAdms
|
||||
});
|
||||
|
||||
if (response?.status) {
|
||||
setAlert({ show: false, message: '' });
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Posto Adm');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Posto Administrativo',
|
||||
description: `Delete PostoAdms => ${selectedPostoAdms}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Posto Adm');
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface MunicipioProps {
|
||||
id: number;
|
||||
@ -72,6 +73,14 @@ const EditDialog = () => {
|
||||
resetForm();
|
||||
toast.success('Success Update Posto Adm');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Posto Administrativo',
|
||||
description: `Edit PostoAdms => ${selectedPostoAdms}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Error Update Posto Adm');
|
||||
setAlert({ show: true, message: 'Failed to update posto adm. Please try again.' });
|
||||
|
||||
@ -22,6 +22,7 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface ProviderProps {
|
||||
provider_id: number;
|
||||
@ -32,7 +33,7 @@ const API_URL = apiConfig.service_master_data;
|
||||
const AddDialog = () => {
|
||||
const parentRef = useRef<any | null>(null);
|
||||
const parsedUser = getAuth()?.user;
|
||||
const { showAddDialog, handleAddDialog } = useManageProductsContext();
|
||||
const { showAddDialog, handleAddDialog, selectedProducts } = useManageProductsContext();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const { reload } = useDataGrid();
|
||||
const [alert, setAlert] = useState({
|
||||
@ -75,6 +76,14 @@ const AddDialog = () => {
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Product');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Products',
|
||||
description: `Create Product => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Create Product');
|
||||
setAlert({ show: true, message: response?.message });
|
||||
@ -173,9 +182,7 @@ const AddDialog = () => {
|
||||
className="input"
|
||||
type="text"
|
||||
value={formField.name}
|
||||
onChange={(e) =>
|
||||
setFormField({ ...formField, name: e.target.value })
|
||||
}
|
||||
onChange={(e) => setFormField({ ...formField, name: e.target.value })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -189,9 +196,7 @@ const AddDialog = () => {
|
||||
className="input"
|
||||
type="text"
|
||||
value={formField.type}
|
||||
onChange={(e) =>
|
||||
setFormField({ ...formField, type: e.target.value })
|
||||
}
|
||||
onChange={(e) => setFormField({ ...formField, type: e.target.value })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -205,9 +210,7 @@ const AddDialog = () => {
|
||||
className="input"
|
||||
type="text"
|
||||
value={formField.code}
|
||||
onChange={(e) =>
|
||||
setFormField({ ...formField, code: e.target.value })
|
||||
}
|
||||
onChange={(e) => setFormField({ ...formField, code: e.target.value })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -221,9 +224,7 @@ const AddDialog = () => {
|
||||
className="input"
|
||||
type="text"
|
||||
value={formField.description}
|
||||
onChange={(e) =>
|
||||
setFormField({ ...formField, description: e.target.value })
|
||||
}
|
||||
onChange={(e) => setFormField({ ...formField, description: e.target.value })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -323,9 +324,7 @@ const AddDialog = () => {
|
||||
</label>
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) =>
|
||||
setFormField({ ...formField, status: value })
|
||||
}
|
||||
onValueChange={(value) => setFormField({ ...formField, status: value })}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select Status" />
|
||||
|
||||
@ -4,8 +4,16 @@ import { Alert, useDataGrid } from '@/components';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -30,6 +38,13 @@ const DeleteDialog = () => {
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Product');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Product',
|
||||
description: `Delete Product',', => ${selectedProducts}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Product');
|
||||
|
||||
@ -22,6 +22,7 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface ProviderProps {
|
||||
provider_id: string;
|
||||
@ -74,6 +75,14 @@ const EditDialog = () => {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Product updated successfully.');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Products',
|
||||
description: `Edit Product => ${selectedProducts}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed to update Product. Please try again.');
|
||||
setAlert({ show: true, message: 'Failed to update Product. Please try again.' });
|
||||
|
||||
@ -73,7 +73,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
|
||||
const columns = useMemo<ColumnDef<any>[]>(
|
||||
() => [
|
||||
{
|
||||
accessorFn: (row) => row.products_name,
|
||||
accessorFn: (row) => row.name,
|
||||
id: 'name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Name" column={column} />,
|
||||
enableSorting: true,
|
||||
@ -86,7 +86,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.products_description,
|
||||
accessorFn: (row) => row.description,
|
||||
id: 'description',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Description" column={column} />,
|
||||
enableSorting: true,
|
||||
@ -96,7 +96,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.products_price_point,
|
||||
accessorFn: (row) => row.price_point,
|
||||
id: 'price_point',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Price Point" column={column} />,
|
||||
enableSorting: true,
|
||||
@ -106,7 +106,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.products_price_cash,
|
||||
accessorFn: (row) => row.price_cash,
|
||||
id: 'price_cash',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Price Cash" column={column} />,
|
||||
enableSorting: true,
|
||||
@ -189,7 +189,7 @@ const ManageProductsContextProvider = ({ children }: { children: React.ReactNode
|
||||
pagination={{ size: 10 }}
|
||||
toolbar={<ListToolbar />}
|
||||
layout={{ card: true }}
|
||||
sorting={[{ id: 'id', desc: false }]}
|
||||
sorting={[{ id: 'Product.id', desc: false }]}
|
||||
serverSide={true}
|
||||
onFetchData={({ pageIndex, pageSize, sorting, columnFilters }) =>
|
||||
getProductsLists(pageIndex, pageSize, sorting, columnFilters)
|
||||
|
||||
@ -15,13 +15,14 @@ import {
|
||||
} from '@/components/ui/dialog';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
const AddDialog = () => {
|
||||
const parentRef = useRef<any | null>(null);
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData } = useCallApi();
|
||||
const { showAddDialog, handleAddDialog } = useManageProfessionContext();
|
||||
const { showAddDialog, handleAddDialog, selectedProfession } = useManageProfessionContext();
|
||||
const parsedUser = getAuth()?.user;
|
||||
const [alert, setAlert] = useState({
|
||||
show: false,
|
||||
@ -53,6 +54,14 @@ const AddDialog = () => {
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Profession');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Profession',
|
||||
description: `Create Profession => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Create Profession');
|
||||
setAlert({ show: true, message: response?.message });
|
||||
|
||||
@ -4,8 +4,16 @@ import { Alert, useDataGrid } from '@/components';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -29,6 +37,13 @@ const DeleteDialog = () => {
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Profession');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Profession',
|
||||
description: `Delete Profession', => ${selectedProfession}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Profession');
|
||||
|
||||
@ -15,6 +15,7 @@ import {
|
||||
} from '@/components/ui/dialog';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
const EditDialog = () => {
|
||||
@ -54,6 +55,14 @@ const EditDialog = () => {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Profession');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Profession',
|
||||
description: `Edit Profession => ${selectedProfession}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Update Profession');
|
||||
setAlert({ show: true, message: 'Failed Update Profession' });
|
||||
|
||||
@ -31,6 +31,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
export interface CustomerProps {
|
||||
id: string;
|
||||
@ -50,7 +51,7 @@ const API_URL_MASTERDATA = apiConfig.service_master_data;
|
||||
const API_URL_TRANSACTION = apiConfig.service_transaction;
|
||||
|
||||
const AddDialog = () => {
|
||||
const { showAddDialog, handleAddDialog } = useManageProviderContext();
|
||||
const { showAddDialog, handleAddDialog, selectedProvider } = useManageProviderContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const parentRef = useRef<any | null>(null);
|
||||
@ -91,6 +92,13 @@ const AddDialog = () => {
|
||||
resetForm();
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Provider');
|
||||
const createActivity = {
|
||||
module: 'Manage Provider',
|
||||
description: `Create Provider => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed Create Provider');
|
||||
@ -293,11 +301,11 @@ const AddDialog = () => {
|
||||
</label>
|
||||
<Popover open={open} onOpenChange={setOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
<button
|
||||
type="button"
|
||||
className="input col-span-5 text-left"
|
||||
style={{ color: 'inherit' }}
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
className="input col-span-5 text-left"
|
||||
style={{ color: 'inherit' }}
|
||||
>
|
||||
{customers.find((customer) => customer.id === formField.agent)
|
||||
?.username || 'Select Agent'}
|
||||
</button>
|
||||
|
||||
@ -4,8 +4,16 @@ import { Alert, useDataGrid } from '@/components';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -29,6 +37,13 @@ const DeleteDialog = () => {
|
||||
setAlert({ show: false, message: '' });
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Provider');
|
||||
const createActivity = {
|
||||
module: 'Manage Provider',
|
||||
description: `Delete Provider => ${selectedProvider}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
|
||||
@ -32,6 +32,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL_CUSTOMER = apiConfig.service_customer;
|
||||
const API_URL_MASTERDATA = apiConfig.service_master_data;
|
||||
@ -82,6 +83,13 @@ const EditDialog = () => {
|
||||
resetForm();
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Provider updated successfully.');
|
||||
const createActivity = {
|
||||
module: 'Manage Provider',
|
||||
description: `Update Provider => ${selectedProvider}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed to update provider.');
|
||||
@ -308,11 +316,11 @@ const EditDialog = () => {
|
||||
</label>
|
||||
<Popover open={open} onOpenChange={setOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
<button
|
||||
type="button"
|
||||
className="input col-span-5 text-left"
|
||||
style={{ color: 'inherit' }}
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
className="input col-span-5 text-left"
|
||||
style={{ color: 'inherit' }}
|
||||
>
|
||||
{customers.find((customer) => customer.id === formField.agent)
|
||||
?.fullname || 'Select Agent'}
|
||||
</button>
|
||||
|
||||
@ -16,8 +16,10 @@ const ListToolbar = () => {
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search Provider"
|
||||
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
|
||||
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
|
||||
value={(table.getColumn('provider_name')?.getFilterValue() as string) ?? ''}
|
||||
onChange={(event) =>
|
||||
table.getColumn('provider_name')?.setFilterValue(event.target.value)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
{/* <DefaultTooltip title={'Filter'} placement={'top'}>
|
||||
|
||||
@ -75,7 +75,7 @@ const ManageProviderContextProvider = ({ children }: { children: React.ReactNode
|
||||
() => [
|
||||
{
|
||||
accessorFn: (row) => row.provider_name,
|
||||
id: 'name',
|
||||
id: 'provider_name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Name" column={column} />,
|
||||
enableSorting: true,
|
||||
enableHiding: false,
|
||||
@ -162,8 +162,9 @@ const ManageProviderContextProvider = ({ children }: { children: React.ReactNode
|
||||
|
||||
const getProviderLists = async (page: number, limit: number, sorting: any, filter: any) => {
|
||||
try {
|
||||
const field = 'Provider.name';
|
||||
sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
|
||||
filter = filter.length == 0 ? {} : { any: filter[0].value?.toLowerCase() };
|
||||
filter = filter.length == 0 ? {} : { [field]: filter[0].value?.toLowerCase() };
|
||||
const response = await GetData(`${API_URL}/provider/list`, {
|
||||
limit,
|
||||
page: page + 1,
|
||||
@ -172,7 +173,7 @@ const ManageProviderContextProvider = ({ children }: { children: React.ReactNode
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
|
||||
filter: JSON.stringify(filter)
|
||||
});
|
||||
console.log(response?.data);
|
||||
// console.log(response?.data);
|
||||
setProvider(response?.data.list);
|
||||
return { data: response?.data.list, totalCount: response?.data.total_count };
|
||||
} catch (error) {
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface PostoAdmsProps {
|
||||
PostoAdms_id: number;
|
||||
@ -33,7 +34,7 @@ const API_URL = apiConfig.service_master_data;
|
||||
|
||||
const AddDialog = () => {
|
||||
const parentRef = useRef<any | null>(null);
|
||||
const { showAddDialog, handleAddDialog } = useManageSucosContext();
|
||||
const { showAddDialog, handleAddDialog, selectedSucos } = useManageSucosContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const parsedUser = getAuth()?.user;
|
||||
@ -69,6 +70,13 @@ const AddDialog = () => {
|
||||
handleAddDialog(false);
|
||||
reload();
|
||||
toast.success('Sucos created successfully!');
|
||||
const createActivity = {
|
||||
module: 'Manage Sucos',
|
||||
description: `Create Suco => ${formField.name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed to create Sucos Please try again.');
|
||||
setAlert({ show: true, message: 'Failed to create Sucos Please try again.' });
|
||||
|
||||
@ -4,8 +4,16 @@ import { useCallback, useState } from 'react';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { Alert, useDataGrid } from '@/components';
|
||||
import { toast } from 'sonner';
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_master_data;
|
||||
|
||||
@ -31,6 +39,13 @@ const DeleteDialog = () => {
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Sucos');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Sucos',
|
||||
description: `Delete Suco => ${selectedSucos}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
setAlert({ show: true, message: response?.message });
|
||||
toast.error('Failed Delete Sucos');
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
CommandItem,
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface PostoAdmsProps {
|
||||
PostoAdms_id: number; // Ubah ke PostoAdms_id
|
||||
@ -76,6 +77,13 @@ const EditDialog = () => {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Sucos');
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Sucos',
|
||||
description: `Edit Suco => ${selectedSucos}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Update Sucos');
|
||||
setAlert({ show: true, message: 'Failed Update Sucos. Please try again' });
|
||||
|
||||
@ -153,7 +153,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
|
||||
const response = await GetData(`${API_URL}/sucos/list`, {
|
||||
limit: 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)
|
||||
|
||||
@ -22,6 +22,7 @@ import {
|
||||
} from '@/components/ui/select';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Checkbox } from '@/components/ui/checkbox';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface CurrencyProps {
|
||||
ID: string;
|
||||
@ -42,7 +43,7 @@ const API_URL_WALLET = apiConfig.service_wallet;
|
||||
const API_URL_MASTER_DATA = apiConfig.service_master_data;
|
||||
|
||||
const AddDialog = () => {
|
||||
const { showAddDialog, handleAddDialog } = useManageWalletContext();
|
||||
const { showAddDialog, handleAddDialog, selectedWallet } = useManageWalletContext();
|
||||
const { GetData, PostData } = useCallApi();
|
||||
const { reload } = useDataGrid();
|
||||
const [alert, setAlert] = useState({
|
||||
@ -101,6 +102,14 @@ const AddDialog = () => {
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Wallet');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Wallet',
|
||||
description: `Create Wallet => ${selectedWallet?.Wallet_id} - ${selectedWallet?.Wallet_name}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Create Wallet');
|
||||
setAlert({ show: true, message: 'Failed Create Wallet' });
|
||||
|
||||
@ -21,6 +21,7 @@ import {
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface CurrencyProps {
|
||||
ID: string;
|
||||
@ -53,13 +54,11 @@ const EditDialog = () => {
|
||||
description: string;
|
||||
status: string;
|
||||
group: string[];
|
||||
currency_id: string;
|
||||
} = {
|
||||
name: '',
|
||||
description: '',
|
||||
status: '',
|
||||
group: [],
|
||||
currency_id: ''
|
||||
group: []
|
||||
};
|
||||
const [formField, setFormField] = useState(initialState);
|
||||
const [currencies, setCurrencies] = useState<CurrencyProps[]>([]);
|
||||
@ -71,18 +70,26 @@ const EditDialog = () => {
|
||||
};
|
||||
|
||||
const doUpdateWallet = useCallback(
|
||||
async (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
async (payload: { name: string; description: string; status: string }) => {
|
||||
// e.preventDefault();
|
||||
|
||||
const response = await PutData(
|
||||
`${API_URL_MASTER_DATA}/wallet/update/${selectedWallet?.Wallet_id}`,
|
||||
formField
|
||||
payload
|
||||
);
|
||||
|
||||
if (response?.status) {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Wallet');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Wallet',
|
||||
description: `Edit Wallet => ${selectedWallet?.Wallet_id} - ${selectedWallet?.Wallet_name}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Update Wallet');
|
||||
setAlert({ show: true, message: 'Failed Update Wallet' });
|
||||
@ -94,8 +101,14 @@ const EditDialog = () => {
|
||||
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
|
||||
console.log(formField);
|
||||
doUpdateWallet(e);
|
||||
// const { name, description, status } = formField;
|
||||
const payload = {
|
||||
name: formField.name,
|
||||
description: formField.description,
|
||||
status: formField.status
|
||||
};
|
||||
// console.log(payload);
|
||||
doUpdateWallet(payload);
|
||||
setAlert({ show: false, message: '' });
|
||||
};
|
||||
|
||||
@ -156,8 +169,6 @@ const EditDialog = () => {
|
||||
.map((g) => g.name)
|
||||
.join(', ');
|
||||
|
||||
const selectedCurrency = currencies.find((currency) => currency.ID === formField.currency_id);
|
||||
|
||||
useEffect(() => {
|
||||
getCurrencyLists([{ id: 'name', desc: false }]);
|
||||
getGroupLists([{ id: 'name', desc: false }]);
|
||||
@ -182,7 +193,7 @@ const EditDialog = () => {
|
||||
resetForm();
|
||||
}
|
||||
}, [showEditDialog]);
|
||||
// console.log(selectedWallet);
|
||||
|
||||
return (
|
||||
<Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
|
||||
<DialogContent className="container-fixed max-w-[768px] flex flex-col p-5 overflow-hidden">
|
||||
@ -246,25 +257,25 @@ const EditDialog = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">Currency</label>
|
||||
<Input type="text" placeholder='Empty' value={selectedCurrency?.name || ''} readOnly />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">Groups</label>
|
||||
<Input type="text" placeholder='Empty' value={selectedGroupNames} readOnly />
|
||||
<div className="relative w-full">
|
||||
<Input
|
||||
type="text"
|
||||
placeholder="Empty"
|
||||
value={selectedGroupNames}
|
||||
readOnly
|
||||
className="bg-gray-100 border border-dashed border-gray-400 text-gray-600 cursor-not-allowed"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end gap-5">
|
||||
<Button type="button" variant="outline" onClick={resetForm}>
|
||||
Reset
|
||||
<Button variant="default" type="submit">
|
||||
Update
|
||||
</Button>
|
||||
<Button variant="default">Update</Button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@ -15,7 +15,7 @@ const ListToolbar = () => {
|
||||
<KeenIcon icon="magnifier" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search Provider"
|
||||
placeholder="Search Wallet"
|
||||
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
|
||||
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
|
||||
/>
|
||||
|
||||
@ -146,7 +146,7 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
const getWalletLists = 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() };
|
||||
filter = filter.length == 0 ? {} : { name: filter[0].value?.toLowerCase() };
|
||||
const response = await GetData(`${API_URL_MASTER_DATA}/wallet/list`, {
|
||||
limit,
|
||||
page: page + 1,
|
||||
@ -183,7 +183,7 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
pagination={{ size: 25 }}
|
||||
toolbar={<ListToolbar />}
|
||||
layout={{ card: true }}
|
||||
sorting={[{ id: 'id', desc: false }]}
|
||||
sorting={[{ id: 'created_at', desc: true }]}
|
||||
serverSide={true}
|
||||
onFetchData={({ pageIndex, pageSize, sorting, columnFilters }) =>
|
||||
getWalletLists(pageIndex, pageSize, sorting, columnFilters)
|
||||
|
||||
@ -31,6 +31,7 @@ import {
|
||||
CommandList
|
||||
} from '@/components/ui/command';
|
||||
import { NumericFormat } from 'react-number-format';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface GroupProps {
|
||||
ID: string;
|
||||
@ -48,7 +49,7 @@ interface WalletProps {
|
||||
|
||||
const API_URL_WALLET = apiConfig.service_wallet;
|
||||
const AddDialog = () => {
|
||||
const { showAddDialog, handleAddDialog } = useManageWalletRuleContext();
|
||||
const { showAddDialog, handleAddDialog, selectedWalletRule } = useManageWalletRuleContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData, GetData } = useCallApi();
|
||||
const [open, setOpen] = useState(false);
|
||||
@ -94,6 +95,14 @@ const AddDialog = () => {
|
||||
handleAddDialog(false);
|
||||
toast.success('Success Create Wallet Rule');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Wallet Rule',
|
||||
description: `Create Wallet Rule => ${selectedWalletRule?.ID}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Create Wallet Rule');
|
||||
setAlert({ show: true, message: 'Failed Create Wallet Rule' });
|
||||
|
||||
@ -13,6 +13,7 @@ import {
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL_WALLET = apiConfig.service_wallet;
|
||||
|
||||
@ -37,6 +38,13 @@ const DeleteDialog = () => {
|
||||
toast.success('Wallet rule deleted successfully');
|
||||
handleDeleteDialog(false, null);
|
||||
reload();
|
||||
const createActivity = {
|
||||
module: 'Manage Wallet Rule',
|
||||
description: `Delete Wallet Rule', => ${selectedWalletRule.ID}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
setAlert({ show: false, message: '' });
|
||||
} else {
|
||||
toast.error('Failed to delete wallet rule');
|
||||
|
||||
@ -31,6 +31,7 @@ import {
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { NumericFormat } from 'react-number-format';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
interface GroupProps {
|
||||
ID: string;
|
||||
@ -97,6 +98,14 @@ const EditDialog = () => {
|
||||
handleEditDialog(false, null);
|
||||
toast.success('Success Update Wallet Rule');
|
||||
reload();
|
||||
|
||||
const createActivity = {
|
||||
module: 'Manage Wallet Rule',
|
||||
description: `Edit Wallet Rule => ${selectedWalletRule?.ID}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
} else {
|
||||
toast.error('Failed Update Wallet Rule');
|
||||
setAlert({ show: true, message: 'Failed Update Wallet Rule' });
|
||||
|
||||
@ -12,13 +12,18 @@ import { toast } from 'sonner';
|
||||
const BASE_URL_MASTER_DATA = apiConfig.service_master_data;
|
||||
const BASE_URL_CUSTOMER = apiConfig.service_customer;
|
||||
|
||||
const CustomerDialog = ({ open, handleClose, handleSubmit, initialData, viewStats, handleReject, page }: any) => {
|
||||
const CustomerDialog = ({ open, handleClose, handleSubmit, initialData, viewStats, handleReject, page, fetchCustomers }: any) => {
|
||||
const [formData, setFormData] = useState(initialData || initialMember);
|
||||
const [viewOnly, setViewOnly] = useState(viewStats || false);
|
||||
const [municipios, setMunicipios] = useState([]);
|
||||
const [aldeias, setAldeias] = useState([]);
|
||||
const [postoAdm, setPostoAdm] = useState([]);
|
||||
const [sucos, setSucos] = useState([]);
|
||||
const [groupData] = useState({
|
||||
reguler: `This fill can not be empty!`,
|
||||
premium: `This field required only for Premium or Agent`,
|
||||
agent: `This field required only for Agent`
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
setFormData(initialData || {}); // Sync formData when initialData changes
|
||||
@ -154,18 +159,20 @@ const CustomerDialog = ({ open, handleClose, handleSubmit, initialData, viewStat
|
||||
) : ('')
|
||||
}
|
||||
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Full Name" name="fullname" value={formData.fullname} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Email" name="email" value={formData.email} onChange={handleChange} />
|
||||
<TextField disabled fullWidth margin="dense" label="Group" name="group" value={formData.group_name} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} required multiline fullWidth margin="dense" label="Full Name" name="fullname" value={formData.fullname} onChange={handleChange} />
|
||||
{/* <Typography fontSize={13} paddingLeft={2} marginTop={-2.5} color="red">{groupData.reguler}</Typography> */}
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="Email" name="email" value={formData.email} onChange={handleChange} />
|
||||
<TextField disabled fullWidth required margin="dense" label="Group" name="group" value={formData.group_name} onChange={handleChange} />
|
||||
{fileTextFile("Photo", formData.photouser, "photouser", handleChange)}
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Username" name="username" value={formData.username} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="MSISDN" name="msisdn" value={formData.msisdn} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Address" name="address" value={formData.address} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Nationality" name="nationality" value={formData.nationality} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Date of Birth" name="date_birth" type="date" value={generateDate(formData.date_birth, null)} onChange={handleChange} InputLabelProps={{ shrink: true }} />
|
||||
<FormControl fullWidth margin="dense">
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="Username" name="username" value={formData.username} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="Mother Fullname" name="mother_fullname" value={formData.mother_fullname} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="MSISDN" name="msisdn" value={formData.msisdn} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="Address" name="address" value={formData.address} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="Nationality" name="nationality" value={formData.nationality} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} required fullWidth margin="dense" label="Date of Birth" name="date_birth" type="date" value={generateDate(formData.date_birth, null)} onChange={handleChange} InputLabelProps={{ shrink: true }} />
|
||||
<FormControl required fullWidth margin="dense">
|
||||
<InputLabel>Gender</InputLabel>
|
||||
<Select disabled={viewOnly} name="gender" value={formData.gender} onChange={handleChange}>
|
||||
<Select required disabled={viewOnly} name="gender" value={formData.gender} onChange={handleChange}>
|
||||
<MenuItem key={1} value="M">Male</MenuItem>
|
||||
<MenuItem key={2} value="F">Female</MenuItem>
|
||||
</Select>
|
||||
@ -181,7 +188,7 @@ const CustomerDialog = ({ open, handleClose, handleSubmit, initialData, viewStat
|
||||
|
||||
{/* AGENT & PREMIUM DATA */}
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Identity Number" name="identity_number" value={formData.identity_number} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} type="number" fullWidth margin="dense" label="License Number" name="license_number" value={formData.license_number} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} type="text" fullWidth margin="dense" label="License Number" name="license_number" value={formData.license_number} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} type="text" fullWidth margin="dense" label="Merchant Address" name="merchantaddress" value={formData.merchantaddress} onChange={handleChange} />
|
||||
{fileTextFile("File Selfie", formData.file_selfie, "file_selfie", handleChange)}
|
||||
<img width={300} height={250} srcSet={formData.file_selfie} src={formData.file_selfie} alt={"file_selfie"} style={{borderRadius: 10}}/>
|
||||
@ -262,18 +269,22 @@ const CustomerDialog = ({ open, handleClose, handleSubmit, initialData, viewStat
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="Bank Account" name="bank_account" value={formData.bank_account} onChange={handleChange} />
|
||||
<TextField disabled={viewOnly} fullWidth margin="dense" label="iBank Number" name="ibank_number" value={formData.ibank_number} onChange={handleChange} />
|
||||
<Divider className="pt-7"/>
|
||||
{getAdmAccess(page, formData)}
|
||||
{/* {getAdmAccess(page, formData, handleClose, fetchCustomers)} */}
|
||||
{
|
||||
page === 'kyc' ? (
|
||||
<>
|
||||
<Typography sx={{color:'grey'}}>Approval</Typography>
|
||||
<TextField fullWidth margin="dense" label="Approval Description" name="description" value={formData.description} onChange={handleChange} />
|
||||
</>
|
||||
) : ('')
|
||||
) : (<>{getAdmAccess(page, formData, handleClose, fetchCustomers, viewOnly, setViewOnly)}</>)
|
||||
}
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => viewOnly ? setViewOnly(false) : setViewOnly(true)} color="secondary">{ viewOnly ? (`Open Edit`) : (`Close Edit`) }</Button>
|
||||
{
|
||||
page === 'kyc' ? (
|
||||
<Button onClick={() => viewOnly ? setViewOnly(false) : setViewOnly(true)} color="secondary">{ viewOnly ? (`Open Edit`) : (`Close Edit`) }</Button>
|
||||
) : ('')
|
||||
}
|
||||
<Button onClick={handleClose} color="secondary">Cancel</Button>
|
||||
{
|
||||
formData.isneedapproval == 1 && page === 'kyc' ? (
|
||||
@ -327,9 +338,35 @@ function fileTextFile(label: string, value: any, name: string, handleChange: any
|
||||
)
|
||||
}
|
||||
|
||||
function getAdmAccess(page: string, data: any) {
|
||||
function getAdmAccess(page: string, data: any, handleClose: any, fetchCustomers: any, viewOnly: any, setViewOnly: any) {
|
||||
const [dialogOpen, setDialogOpen] = useState(false);
|
||||
const [dialogType, setDialogType] = useState('');
|
||||
const [changeGroup, setChangeGroup] = useState('');
|
||||
const [changeGroupD, setChangeGroupD] = useState(false);
|
||||
const [groups, setGroups] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
fetchGroups()
|
||||
}, []);
|
||||
|
||||
const fetchGroups = async () =>{
|
||||
try {
|
||||
let getGroups = await axios.get(`${BASE_URL_CUSTOMER}/groups/list`, {
|
||||
params: {
|
||||
limit: 50,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: 'name',
|
||||
order_direction: 'ASC',
|
||||
}
|
||||
});
|
||||
setGroups(getGroups.data.data.list);
|
||||
} catch (error: any) {
|
||||
console.error(error.message);
|
||||
toast.error(error.message)
|
||||
}
|
||||
}
|
||||
|
||||
const handleYes = async () => {
|
||||
try {
|
||||
if (dialogType === "update status") {
|
||||
@ -347,6 +384,7 @@ function getAdmAccess(page: string, data: any) {
|
||||
toast.error(error.message)
|
||||
} finally {
|
||||
setDialogOpen(false)
|
||||
handleClose()
|
||||
}
|
||||
}
|
||||
|
||||
@ -360,6 +398,31 @@ function getAdmAccess(page: string, data: any) {
|
||||
setDialogOpen(true)
|
||||
}
|
||||
|
||||
async function buttonChangeGroup() {
|
||||
try {
|
||||
let dataObj = {
|
||||
customerid: data.id,
|
||||
destination_group: changeGroup
|
||||
}
|
||||
if (data.group_id === changeGroup) return toast.warning(`You update same group as the exist customer group`)
|
||||
if (dataObj.customerid && dataObj.destination_group) {
|
||||
await axios.post(`${BASE_URL_CUSTOMER}/customer/change-group`, dataObj)
|
||||
}
|
||||
await fetchCustomers()
|
||||
toast.success('Success Change group')
|
||||
} catch (error: any) {
|
||||
toast.error(error.message)
|
||||
} finally {
|
||||
setChangeGroupD(false)
|
||||
handleClose()
|
||||
}
|
||||
}
|
||||
|
||||
function openChangeGroupDialog() {
|
||||
setChangeGroup(data.group_id);
|
||||
setChangeGroupD(true)
|
||||
}
|
||||
|
||||
if (page !== "kyc") {
|
||||
return (
|
||||
<Box p={3} boxShadow={3} borderRadius={2} bgcolor="white">
|
||||
@ -378,14 +441,40 @@ function getAdmAccess(page: string, data: any) {
|
||||
<Grid item xs={6} container direction="column" spacing={2}>
|
||||
<Grid item>
|
||||
<Typography variant="body2">Change Group</Typography>
|
||||
<Button variant="contained" color="primary">Change Group</Button>
|
||||
<Button onClick={() => openChangeGroupDialog()} variant="contained" color="primary">Change Group</Button>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="body2">Edit Member</Typography>
|
||||
<Button variant="contained" color="primary">Edit Member</Button>
|
||||
{/* <Button variant="contained" color="primary">Edit Member</Button> */}
|
||||
<Button onClick={() => viewOnly ? setViewOnly(false) : setViewOnly(true)} variant="contained">{ viewOnly ? (`Open Edit`) : (`Close Edit`) }</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Dialog open={changeGroupD} onClose={() => setChangeGroupD(false)} fullWidth>
|
||||
<Grid container padding={3}>
|
||||
<Typography variant="h6" gutterBottom color="orange">Are you sure to change customer Group?</Typography>
|
||||
<FormControl fullWidth margin="dense">
|
||||
<Typography gutterBottom>Destination Group</Typography>
|
||||
<Select name="groups" value={changeGroup} onChange={(e: any) => setChangeGroup(e.target.value)}>
|
||||
{
|
||||
groups ? groups.map((el: any) => (
|
||||
<MenuItem key={el.id} value={el.id}>{el.name}</MenuItem>
|
||||
)) : ""
|
||||
}
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setChangeGroupD(false)} color="secondary">
|
||||
No
|
||||
</Button>
|
||||
<Button onClick={buttonChangeGroup} color="primary">
|
||||
Yes
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
|
||||
<ConfirmDialog
|
||||
open={dialogOpen}
|
||||
onClose={() => setDialogOpen(false)}
|
||||
@ -427,4 +516,8 @@ function getPinStatus(status: string) {
|
||||
btn: 'No status found',
|
||||
res: null
|
||||
}
|
||||
}
|
||||
|
||||
function showCustomerWallet() {
|
||||
|
||||
}
|
||||
@ -24,15 +24,15 @@ const ManageMembers = () => {
|
||||
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
fetchGroups();
|
||||
fetchCustomers();
|
||||
setLoading(false);
|
||||
}, []);
|
||||
|
||||
async function fetchGroups() {
|
||||
async function fetchCustomers() {
|
||||
try {
|
||||
let groups = await axios.get(`${BASE_URL}/customer/list`, {
|
||||
params: {
|
||||
limit: 10,
|
||||
limit: 20,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: 'fullname',
|
||||
@ -96,16 +96,16 @@ const ManageMembers = () => {
|
||||
delete updateData.group_updated_at;
|
||||
delete updateData.group_deleted_by;
|
||||
delete updateData.group_deleted_at;
|
||||
delete updateData.updated_at;
|
||||
try {
|
||||
if (dialogType === 'update')
|
||||
await axios.put(`${BASE_URL}/customer/update/${selectedMember}`, updateData);
|
||||
// if (dialogType === 'create') await axios.post(`${BASE_URL}/customers/create`, member)
|
||||
await fetchGroups();
|
||||
await fetchCustomers();
|
||||
setDialogOpen(false);
|
||||
setIsDialogOpen(false);
|
||||
toast.success('Success Update Member');
|
||||
} catch (error: any) {
|
||||
alert(error.message);
|
||||
setDialogOpen(false);
|
||||
setIsDialogOpen(false);
|
||||
toast.error(error.message);
|
||||
@ -130,6 +130,7 @@ const ManageMembers = () => {
|
||||
handleClose={closeDialog}
|
||||
handleSubmit={handleSubmit}
|
||||
initialData={member}
|
||||
fetchCustomers={fetchCustomers}
|
||||
/>
|
||||
<h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Members</h1>
|
||||
<Breadcrumbs>
|
||||
|
||||
@ -21,10 +21,11 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_dashboard;
|
||||
const AddDialog = () => {
|
||||
const { showAddDialog, handleAddDialog, parents } = useManageMenusContext();
|
||||
const { showAddDialog, handleAddDialog, parents, selectedMenu } = useManageMenusContext();
|
||||
const { reload } = useDataGrid();
|
||||
const { PostData } = useCallApi();
|
||||
const [open, setOpen] = useState(false);
|
||||
@ -57,21 +58,28 @@ const AddDialog = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('Data dikirim ke API:', formField);
|
||||
// console.log('Data dikirim ke API:', formField);
|
||||
const response = await PostData(`${API_URL}/menus/create`, formField);
|
||||
|
||||
console.log('Response from API:', response);
|
||||
// console.log('Response from API:', response);
|
||||
|
||||
if (response?.status) {
|
||||
handleAddDialog(false);
|
||||
resetForm();
|
||||
toast.success('Success Create Menu');
|
||||
const createActivity = {
|
||||
module: 'Manage Menu',
|
||||
description: `Create Menu => ${selectedMenu}`,
|
||||
action: 'C'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed Create Menu');
|
||||
setAlert({ show: true, message: 'Failed Create Menu' });
|
||||
}
|
||||
console.log(formField);
|
||||
// console.log(formField);
|
||||
setAlert({ show: false, message: '' });
|
||||
};
|
||||
|
||||
|
||||
@ -14,6 +14,7 @@ import {
|
||||
} from '@/components/ui/dialog';
|
||||
import { EnforceSwitch } from '@/components/switch';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_dashboard;
|
||||
const DeleteDialog = () => {
|
||||
@ -34,6 +35,13 @@ const DeleteDialog = () => {
|
||||
setAlert((prev) => ({ ...prev, show: false, message: '' }));
|
||||
handleDeleteDialog(false, null);
|
||||
toast.success('Success Delete Menu');
|
||||
const createActivity = {
|
||||
module: 'Manage Menu',
|
||||
description: `DeleteMenu => ${selectedMenu}`,
|
||||
action: 'D'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed Delete Menu');
|
||||
|
||||
@ -22,6 +22,7 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { doSaveLogActivity } from '@/actions/GlobalActions';
|
||||
|
||||
const API_URL = apiConfig.service_dashboard;
|
||||
|
||||
@ -69,6 +70,13 @@ const EditDialog = () => {
|
||||
handleEditDialog(false, null);
|
||||
resetForm();
|
||||
toast.success('Success Update Menu');
|
||||
const createActivity = {
|
||||
module: 'Manage Menu',
|
||||
description: `Update Menu => ${selectedMenu.name}`,
|
||||
action: 'U'
|
||||
};
|
||||
|
||||
doSaveLogActivity(createActivity);
|
||||
reload();
|
||||
} else {
|
||||
toast.error('Failed Update Menu');
|
||||
|
||||
@ -0,0 +1,31 @@
|
||||
import { Container, DataGridInner } from '@/components';
|
||||
import { ApprovalTransactionProvider } from './hooks/ApprovalTransactionContext';
|
||||
import { Breadcrumbs, Link } from '@mui/material';
|
||||
|
||||
const ApprovalTransaction = () => {
|
||||
return (
|
||||
<ApprovalTransactionProvider>
|
||||
<Container className="mb-7">
|
||||
<h1 className="text-xl font-medium leading-none text-gray-900 mb-5">TRANSACTION</h1>
|
||||
<Breadcrumbs sx={{ mb: 2 }}>
|
||||
<Link underline="none" color="inherit" href="/">
|
||||
<span className="text-sm hover:underline">Dashboard</span>
|
||||
</Link>
|
||||
|
||||
<Link underline="none" color="inherit">
|
||||
<span className="text-sm">Transaction</span>
|
||||
</Link>
|
||||
|
||||
<Link underline="none" color="inherit">
|
||||
<span className="text-sm">Approval Transaction</span>
|
||||
</Link>
|
||||
</Breadcrumbs>
|
||||
<div className="grid gap-5 lg:gap-7.5">
|
||||
<DataGridInner />
|
||||
</div>
|
||||
</Container>
|
||||
</ApprovalTransactionProvider>
|
||||
);
|
||||
};
|
||||
|
||||
export default ApprovalTransaction;
|
||||
@ -0,0 +1,538 @@
|
||||
import { useTransactionContext } from '../hooks/useApprovalTransactionContext';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import { useEffect, useState } from 'react';
|
||||
import {
|
||||
Dialog,
|
||||
DialogBody,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from '@/components/ui/dialog';
|
||||
|
||||
const API_URL = apiConfig.transaction;
|
||||
|
||||
const DetailApprovalTransaction = () => {
|
||||
const { GetData } = useCallApi();
|
||||
const {
|
||||
showDetailDialog,
|
||||
setShowDetailDialog,
|
||||
selectedTransactionId
|
||||
} = useTransactionContext();
|
||||
|
||||
const [transactionDetails, setTransactionDetails] = useState<any>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchTransactionDetails = async () => {
|
||||
if (selectedTransactionId) {
|
||||
try {
|
||||
const response = await GetData(`${API_URL}/transaction/history/detail/${selectedTransactionId}`, {
|
||||
id: selectedTransactionId
|
||||
});
|
||||
// console.log(response?.data);
|
||||
setTransactionDetails(response?.data);
|
||||
} catch (error) {
|
||||
console.error('Error fetching transaction', error);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (showDetailDialog && selectedTransactionId) {
|
||||
fetchTransactionDetails();
|
||||
}
|
||||
}, [showDetailDialog, selectedTransactionId, GetData]);
|
||||
|
||||
const [activeTab, setActiveTab] = useState('detail'); // 'detail', 'log', 'approve'
|
||||
|
||||
return (
|
||||
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
|
||||
<DialogContent className="container-fixed max-w-[1024px] flex flex-col p-5 overflow-hidden">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Transaction Details</DialogTitle>
|
||||
</DialogHeader>
|
||||
<DialogBody>
|
||||
{/* Tabs Navigation */}
|
||||
<div className="flex border-b border-gray-200">
|
||||
<button
|
||||
className={`py-2 px-4 font-medium text-sm focus:outline-none ${activeTab === 'detail' ? 'text-blue-600 border-b-2 border-blue-600' : 'text-gray-500 hover:text-gray-700'}`}
|
||||
onClick={() => setActiveTab('detail')}
|
||||
>
|
||||
Detail Transaction
|
||||
</button>
|
||||
<button
|
||||
className={`py-2 px-4 font-medium text-sm focus:outline-none ${activeTab === 'origincustomer' ? 'text-blue-600 border-b-2 border-blue-600' : 'text-gray-500 hover:text-gray-700'}`}
|
||||
onClick={() => setActiveTab('origincustomer')}
|
||||
>
|
||||
Origin Customer
|
||||
</button>
|
||||
<button
|
||||
className={`py-2 px-4 font-medium text-sm focus:outline-none ${activeTab === 'log' ? 'text-blue-600 border-b-2 border-blue-600' : 'text-gray-500 hover:text-gray-700'}`}
|
||||
onClick={() => setActiveTab('log')}
|
||||
>
|
||||
Transaction Log
|
||||
</button>
|
||||
<button
|
||||
className={`py-2 px-4 font-medium text-sm focus:outline-none ${activeTab === 'approve' ? 'text-blue-600 border-b-2 border-blue-600' : 'text-gray-500 hover:text-gray-700'}`}
|
||||
onClick={() => setActiveTab('approve')}
|
||||
>
|
||||
Approval Log
|
||||
</button>
|
||||
<button
|
||||
className={`py-2 px-4 font-medium text-sm focus:outline-none ${activeTab === 'p24' ? 'text-blue-600 border-b-2 border-blue-600' : 'text-gray-500 hover:text-gray-700'}`}
|
||||
onClick={() => setActiveTab('p24')}
|
||||
>
|
||||
Log P24
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Tab Content */}
|
||||
<div className="py-4 overflow-y-auto max-h-[400px]">
|
||||
{activeTab === 'detail' && transactionDetails?.kind === 'P' && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Transaction Information
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Info
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Transaction Date</p>
|
||||
<p className="font-medium">{transactionDetails?.transaction_date}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Full Name</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Amount</p>
|
||||
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.amount)}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Fee</p>
|
||||
<p className="font-medium">
|
||||
{transactionDetails?.kind === 'P'
|
||||
? transactionDetails?.purchase.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })
|
||||
: transactionDetails?.transfer.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Status</p>
|
||||
<p className="font-medium">
|
||||
{(() => {
|
||||
let status;
|
||||
if (transactionDetails?.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (transactionDetails?.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (transactionDetails?.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else {
|
||||
status = 'PENDING';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Transaction Type</p>
|
||||
<p className="font-medium">
|
||||
{(() => {
|
||||
let kind;
|
||||
if (transactionDetails?.kind === 'T') {
|
||||
kind = 'TRANSFER';
|
||||
} else if (transactionDetails?.kind === 'P') {
|
||||
kind = 'PURCHASE';
|
||||
} else if (transactionDetails?.kind === 'W') {
|
||||
kind = 'WITHDRAW';
|
||||
} else if (transactionDetails?.kind === 'U') {
|
||||
kind = 'TOP UP';
|
||||
} else if (transactionDetails?.kind === 'R') {
|
||||
kind = 'RETURN';
|
||||
}
|
||||
return kind;
|
||||
})()}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Description</p>
|
||||
<p className="font-medium">{transactionDetails?.description}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Name</p>
|
||||
<p className="font-medium">{transactionDetails?.type.name}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Origin Wallet
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Wallet
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Name</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_wallet.name}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Description</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_wallet.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Purchase
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Purchase
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Amount</p>
|
||||
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.amount)}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Cashback</p>
|
||||
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.cashback)}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Cashback Point</p>
|
||||
<p className="font-medium">{transactionDetails?.purchase.cashback_point}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Fee Amount</p>
|
||||
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.fee_amount)}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{activeTab === 'detail' && transactionDetails?.kind != 'P' && transactionDetails?.transfer!=null && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Transaction Information
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Info
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Transaction Date</p>
|
||||
<p className="font-medium">{transactionDetails?.transaction_date}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Full Name</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Amount</p>
|
||||
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.transfer.amount)}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Fee</p>
|
||||
<p className="font-medium">
|
||||
{transactionDetails?.transfer.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Status</p>
|
||||
<p className="font-medium">
|
||||
{(() => {
|
||||
let status;
|
||||
if (transactionDetails?.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (transactionDetails?.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (transactionDetails?.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else {
|
||||
status = 'PENDING';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Transaction Type</p>
|
||||
<p className="font-medium">
|
||||
{(() => {
|
||||
let kind;
|
||||
if (transactionDetails?.kind === 'T') {
|
||||
kind = 'TRANSFER';
|
||||
} else if (transactionDetails?.kind === 'P') {
|
||||
kind = 'PURCHASE';
|
||||
} else if (transactionDetails?.kind === 'W') {
|
||||
kind = 'WITHDRAW';
|
||||
} else if (transactionDetails?.kind === 'U') {
|
||||
kind = 'TOP UP';
|
||||
} else if (transactionDetails?.kind === 'R') {
|
||||
kind = 'RETURN';
|
||||
}
|
||||
return kind;
|
||||
})()}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Description</p>
|
||||
<p className="font-medium">{transactionDetails?.description}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Name</p>
|
||||
<p className="font-medium">{transactionDetails?.type.name}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Reference</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.reference}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Destination Iban</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_iban}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Destination Wallet
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Wallet
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Name</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_wallet.name}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Description</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_wallet.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Destination Customer
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Destination Customer
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Name</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_customer.fullname}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">MSISDN</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_customer.msisdn}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Email</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_customer.email}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">MSISDN</p>
|
||||
<p className="font-medium">{transactionDetails?.transfer.destination_customer.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Origin Wallet
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Wallet
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Name</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_wallet.name}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Description</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_wallet.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
{activeTab === 'origincustomer' && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold">Origin Customer</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Full Name</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_customer.fullname}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Phone Number</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_customer.msisdn}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Email</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_customer.email}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Username</p>
|
||||
<p className="font-medium">{transactionDetails?.origin_customer.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{activeTab === 'log' && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold">Transaction Logs</h3>
|
||||
<div className="border rounded-lg overflow-x-auto">
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Status</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Body</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Body</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Code</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request End Point</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{transactionDetails?.log && transactionDetails?.log.length > 0 ? (
|
||||
transactionDetails.log.map((log: { request_endpoint: string, status: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 font-medium">
|
||||
{(() => {
|
||||
let status;
|
||||
if (log.status === 'P') {
|
||||
status = 'PENDING';
|
||||
} else if (log.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else if (log.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (log.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_date ?? '-'}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.response_date ?? '-'}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_body ?? '-'}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.response_body ?? '-'}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_endpoint ?? '-'}</td>
|
||||
</tr>
|
||||
))
|
||||
) : (
|
||||
<tr>
|
||||
<td colSpan={3} className="px-4 py-2 text-center text-sm text-gray-500">
|
||||
No logs available
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{activeTab === 'approve' && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold">Approval Logs</h3>
|
||||
{transactionDetails?.log_approve.length === 0 ? (
|
||||
<p className="text-sm text-gray-500">No data available</p>
|
||||
) : (
|
||||
<div className="border rounded-lg overflow-x-auto">
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Status</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Created At</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Updated At</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{transactionDetails?.log_approve && transactionDetails?.log_approve.length > 0 ? (
|
||||
transactionDetails.log_approve.map((log: { created_at: string; status: string; updated_at: string }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 font-medium">
|
||||
{(() => {
|
||||
let status;
|
||||
if (log.status === 'W') {
|
||||
status = 'WAITING';
|
||||
} else if (log.status === 'Y') {
|
||||
status = 'APPROVE';
|
||||
} else if (log.status === 'N') {
|
||||
status = 'REJECT';
|
||||
} else if (log.status === 'T') {
|
||||
status = 'NO NEED';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.created_at}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.updated_at}</td>
|
||||
</tr>
|
||||
))
|
||||
) : (
|
||||
<tr>
|
||||
<td colSpan={3} className="px-4 py-2 text-center text-sm text-gray-500">
|
||||
No logs available
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{activeTab === 'p24' && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold">P24 Logs</h3>
|
||||
{transactionDetails?.p24.length === 0 ? (
|
||||
<p className="text-sm text-gray-500">No data available</p>
|
||||
) : (
|
||||
<div className="border rounded-lg overflow-x-auto">
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Type</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Body</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Body</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Code</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Endpoint</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{transactionDetails?.p24 && transactionDetails?.p24.length > 0 ? (
|
||||
transactionDetails.p24.map((log: { request_endpoint: string, type: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.type}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_date}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.response_date}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_body}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.response_body}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_endpoint ?? '-'}</td>
|
||||
</tr>
|
||||
))
|
||||
) : (
|
||||
<tr>
|
||||
<td colSpan={3} className="px-4 py-2 text-center text-sm text-gray-500">
|
||||
No logs available
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
</DialogBody>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
export default DetailApprovalTransaction;
|
||||
@ -0,0 +1,82 @@
|
||||
import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
|
||||
import { useTransactionContext } from '../hooks/useApprovalTransactionContext';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { useCallback, useState, useEffect } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
const ListToolbar = () => {
|
||||
const { table, reload } = useDataGrid();
|
||||
|
||||
// Set the initial state for trxDate
|
||||
const [trxDate, settrxDate] = useState({ from: '', to: '' });
|
||||
|
||||
// Function to format date to YYYY-MM-DD
|
||||
const formatDate = (date: Date): string => {
|
||||
return date.toISOString().split('T')[0];
|
||||
};
|
||||
|
||||
// useEffect to set the default date values
|
||||
useEffect(() => {
|
||||
const today = new Date();
|
||||
const nextWeek = new Date(today);
|
||||
nextWeek.setDate(today.getDate() + 7);
|
||||
|
||||
settrxDate({
|
||||
from: formatDate(today), // Set 'from' to today
|
||||
to: formatDate(nextWeek), // Set 'to' to 7 days later
|
||||
});
|
||||
}, []);
|
||||
|
||||
const handleFilterData = useCallback(() => {
|
||||
try {
|
||||
table.getColumn('transaction_date')?.setFilterValue(trxDate);
|
||||
} catch (error) {
|
||||
toast.error('Error applying filter');
|
||||
console.error('Error applying filter:', error);
|
||||
}
|
||||
}, [trxDate, table]);
|
||||
|
||||
useEffect(() => {
|
||||
if (trxDate.from && trxDate.to) {
|
||||
handleFilterData();
|
||||
}
|
||||
}, [trxDate]);
|
||||
|
||||
return (
|
||||
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
|
||||
<div className="flex flex-wrap gap-2 lg:gap-5 w-full">
|
||||
<div className="flex justify-between w-full items-center">
|
||||
<div className="flex w-[50%] gap-3 items-center">
|
||||
<label className="input input-sm w-1/3">
|
||||
From
|
||||
<input
|
||||
type="date"
|
||||
placeholder="From"
|
||||
value={trxDate.from}
|
||||
onChange={(event) =>
|
||||
settrxDate({ ...trxDate, from: event.target.value })
|
||||
}
|
||||
name="from"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label className="input input-sm w-1/3">
|
||||
To
|
||||
<input
|
||||
type="date"
|
||||
placeholder="To"
|
||||
value={trxDate.to}
|
||||
onChange={(event) =>
|
||||
settrxDate({ ...trxDate, to: event.target.value })
|
||||
}
|
||||
name="to"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ListToolbar;
|
||||
@ -0,0 +1,268 @@
|
||||
import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components';
|
||||
import { Toaster } from '@/components/ui/sonner';
|
||||
import { apiConfig } from '@/config/api.config';
|
||||
import { ColumnDef } from '@tanstack/react-table';
|
||||
import axios from 'axios';
|
||||
import React, { createContext, useCallback, useEffect, useMemo, useState } from 'react';
|
||||
import { useCallApi } from '@/hooks';
|
||||
import ListToolbar from '../blocks/ListToolbar';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { useNavigate } from 'react-router';
|
||||
import DetailApprovalTransaction from '../blocks/DetailApprovalTransaction';
|
||||
|
||||
interface ApprovalTransactionProps {
|
||||
id: number;
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface ContextProps {
|
||||
getTransactionLists: (
|
||||
limit: number,
|
||||
page: number,
|
||||
with_deleted: boolean,
|
||||
order_field: any,
|
||||
order_direction: any,
|
||||
filter: any
|
||||
) => Promise<{ data: ApprovalTransactionProps[]; totalCount: number } | undefined>;
|
||||
showDetailDialog: boolean;
|
||||
setShowDetailDialog: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
selectedTransactionId: number | null;
|
||||
setSelectedTransactionId: React.Dispatch<React.SetStateAction<number | null>>;
|
||||
}
|
||||
|
||||
const initialProps: ContextProps = {
|
||||
getTransactionLists: async () => ({ data: [], totalCount: 0 }),
|
||||
showDetailDialog: false,
|
||||
setShowDetailDialog: () => { },
|
||||
selectedTransactionId: null,
|
||||
setSelectedTransactionId: () => { }
|
||||
};
|
||||
|
||||
const ManageApprovalTransactionContext = createContext<ContextProps>(initialProps);
|
||||
const API_URL = apiConfig.transaction;
|
||||
|
||||
const ApprovalTransactionProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
const [showDetailDialog, setShowDetailDialog] = useState(false);
|
||||
const [selectedTransactionId, setSelectedTransactionId] = useState<number | null>(null);
|
||||
const [transaction, setTransaction] = useState<ApprovalTransactionProps[]>([]);
|
||||
const { GetData } = useCallApi();
|
||||
const navigate = useNavigate();
|
||||
const handleNavigate = (path: string) => {
|
||||
const url = navigate(`${API_URL}/transaction/history/${path}`);
|
||||
};
|
||||
|
||||
const columns = useMemo<ColumnDef<any>[]>(
|
||||
() => [
|
||||
// {
|
||||
// accessorKey: 'transaction_date',
|
||||
// header: ({ column }) => <DataGridColumnHeader title="Transaction Date" column={column} />,
|
||||
// enableSorting: false,
|
||||
// enableHiding: false,
|
||||
// meta: {
|
||||
// headerClassName: 'w-[250px]'
|
||||
// }
|
||||
// },
|
||||
{
|
||||
accessorKey: 'transaction_date',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Transaction Date" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]'
|
||||
},
|
||||
cell: ({ row }) => {
|
||||
// Memformat tanggal dan waktu dari ISO ke format biasa (DD-MM-YYYY HH:MM:SS)
|
||||
const transactionDate = new Date(row.original.transaction_date);
|
||||
const formattedDateTime = transactionDate.toLocaleString('en-GB', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
second: '2-digit',
|
||||
hour12: false // Gunakan format 24 jam
|
||||
});
|
||||
return formattedDateTime; // Format DD-MM-YYYY HH:MM:SS (menggunakan waktu yang sudah ada)
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorKey: 'origin_customer.fullname',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Full Name" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => {
|
||||
const purchaseAmount = row?.purchase?.amount;
|
||||
const transferAmount = row?.transfer?.amount;
|
||||
|
||||
return new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(purchaseAmount ?? transferAmount ?? 0);
|
||||
},
|
||||
id: 'amount',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Amount" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]',
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => {
|
||||
const purchaseAmount = row?.purchase?.fee_amount;
|
||||
const transferAmount = row?.transfer?.fee_amount;
|
||||
|
||||
return new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(purchaseAmount ?? transferAmount ?? 0);
|
||||
},
|
||||
id: 'feeamount',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Fee Amount" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]',
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => {
|
||||
let status;
|
||||
if (row.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (row.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (row.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else {
|
||||
status = 'PENDING';
|
||||
}
|
||||
return status;
|
||||
},
|
||||
accessorKey: 'status',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Status" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]',
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: 'description',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Description" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorKey: 'type.name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Name" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[250px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'actions',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Actions" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
cell: (data) => {
|
||||
const row = data.row.original;
|
||||
return (
|
||||
<div key={`actions-${row.id}`}>
|
||||
<button
|
||||
className="btn btn-sm btn-icon btn-clear btn-light"
|
||||
onClick={() => {
|
||||
setSelectedTransactionId(row.id);
|
||||
setShowDetailDialog(true);
|
||||
}}
|
||||
>
|
||||
<KeenIcon icon="eye" />
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
meta: {
|
||||
headerClassName: 'w-[100px]',
|
||||
cellClassName: 'text-center'
|
||||
}
|
||||
}
|
||||
],
|
||||
[]);
|
||||
|
||||
const getTransactionLists = async (page: number, limit: number, sorting: any, filter: any) => {
|
||||
try {
|
||||
let startdate;
|
||||
let enddate;
|
||||
let formattedFilter;
|
||||
|
||||
if (filter == undefined || filter.length == 0) {
|
||||
const today = new Date();
|
||||
const nextWeek = new Date();
|
||||
nextWeek.setDate(today.getDate() + 7);
|
||||
|
||||
startdate = today.toISOString().split('T')[0];
|
||||
enddate = nextWeek.toISOString().split('T')[0];
|
||||
} else if (filter != undefined || filter.length != 0) {
|
||||
startdate = filter[0].value.from;
|
||||
enddate = filter[0].value.to;
|
||||
}
|
||||
|
||||
formattedFilter = {
|
||||
"Transactions.transaction_date": {
|
||||
from: startdate + " 00:00:00",
|
||||
to: enddate + " 23:59:59"
|
||||
}
|
||||
};
|
||||
|
||||
const response = await GetData(`${API_URL}/transaction/history`, {
|
||||
limit,
|
||||
page: page + 1,
|
||||
with_deleted: false,
|
||||
order_field: "Transactions.created_at",
|
||||
order_direction: 'DESC',
|
||||
filter: JSON.stringify(formattedFilter)
|
||||
});
|
||||
|
||||
setTransaction(response?.data.list);
|
||||
return { data: response?.data.list, totalCount: response?.data.total_count };
|
||||
} catch (error) {
|
||||
console.error('Error fetching transaction', error);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ManageApprovalTransactionContext.Provider
|
||||
value={{
|
||||
getTransactionLists,
|
||||
showDetailDialog,
|
||||
setShowDetailDialog,
|
||||
selectedTransactionId,
|
||||
setSelectedTransactionId
|
||||
}}
|
||||
>
|
||||
<Toaster expand visibleToasts={9} duration={3000} />
|
||||
<DetailApprovalTransaction />
|
||||
|
||||
<DataGridProvider
|
||||
columns={columns}
|
||||
pagination={{ size: 10 }}
|
||||
toolbar={<ListToolbar />}
|
||||
layout={{ card: true }}
|
||||
sorting={[{ id: 'id', desc: false }]}
|
||||
serverSide={true}
|
||||
onFetchData={({ pageIndex, pageSize, sorting, columnFilters }) =>
|
||||
getTransactionLists(pageIndex, pageSize, sorting, columnFilters)
|
||||
}
|
||||
>
|
||||
{children}
|
||||
</DataGridProvider>
|
||||
</ManageApprovalTransactionContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export { ApprovalTransactionProvider, ManageApprovalTransactionContext };
|
||||
export type { ApprovalTransactionProps };
|
||||
@ -0,0 +1,12 @@
|
||||
import { useContext } from 'react';
|
||||
import { ManageApprovalTransactionContext } from './ApprovalTransactionContext';
|
||||
|
||||
const useTransactionContext = () => {
|
||||
const context = useContext(ManageApprovalTransactionContext);
|
||||
|
||||
if (!context) throw new Error('useTransactionContext must be used within AuthProvider');
|
||||
|
||||
return context;
|
||||
};
|
||||
|
||||
export { useTransactionContext };
|
||||
@ -17,7 +17,7 @@ const Transaction = () => {
|
||||
</Link>
|
||||
|
||||
<Link underline="none" color="inherit">
|
||||
<span className="text-sm">Transaction</span>
|
||||
<span className="text-sm">History Transaction</span>
|
||||
</Link>
|
||||
</Breadcrumbs>
|
||||
<div className="grid gap-5 lg:gap-7.5">
|
||||
@ -208,8 +208,44 @@ const DetailTransaction = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{activeTab === 'detail' && transactionDetails?.kind === 'P' && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Product Information
|
||||
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
|
||||
Product Info
|
||||
</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Product Name</p>
|
||||
<p className="font-medium">{transactionDetails?.purchase.product.name}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Price Cash</p>
|
||||
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.product.price_cash)}
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Price Point</p>
|
||||
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.product.price_point)}
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Product Type</p>
|
||||
<p className="font-medium">{transactionDetails?.purchase.product.type}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Provider Name</p>
|
||||
<p className="font-medium">{transactionDetails?.purchase.product.provider.description}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Provider Type</p>
|
||||
<p className="font-medium">{transactionDetails?.purchase.product.provider.type}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{activeTab === 'detail' && transactionDetails?.kind != 'P' && transactionDetails?.transfer!=null && (
|
||||
{activeTab === 'detail' && transactionDetails?.kind != 'P' && transactionDetails?.transfer != null && (
|
||||
<div className="space-y-4">
|
||||
<h3 className="font-semibold flex items-center">
|
||||
Transaction Information
|
||||
@ -11,15 +11,15 @@ const ListToolbar = () => {
|
||||
<div className="flex flex-wrap gap-2 lg:gap-5 w-full">
|
||||
<div className="flex justify-between w-full items-center">
|
||||
<div className="flex w-[50%] gap-3 items-center">
|
||||
<label className="input input-sm w-1/3">
|
||||
{/* <label className="input input-sm w-1/3">
|
||||
<KeenIcon icon="magnifier" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search Wallet"
|
||||
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
|
||||
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
|
||||
value={(table.getColumn('msisdn')?.getFilterValue() as string) ?? ''}
|
||||
onChange={(event) => table.getColumn('msisdn')?.setFilterValue(event.target.value)}
|
||||
/>
|
||||
</label>
|
||||
</label> */}
|
||||
{/* <DefaultTooltip title={'Filter'} placement={'top'}>
|
||||
<Button
|
||||
variant="outline"
|
||||
|
||||
@ -71,9 +71,8 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
const columns = useMemo<ColumnDef<any>[]>(
|
||||
() => [
|
||||
{
|
||||
accessorFn: (row) => row.name,
|
||||
id: 'name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Wallet Name" column={column} />,
|
||||
accessorKey: 'msisdn',
|
||||
header: ({ column }) => <DataGridColumnHeader title="MSISDN" column={column} />,
|
||||
enableSorting: true,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
@ -82,9 +81,63 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.currency.name,
|
||||
accessorKey: 'amount' ,
|
||||
header: ({ column }) => <DataGridColumnHeader title="Ammount" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorKey: 'trx_count_today' ,
|
||||
header: ({ column }) => <DataGridColumnHeader title="Transaction Count Today" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorKey: 'amount_this_month' ,
|
||||
header: ({ column }) => <DataGridColumnHeader title="Ammount This Month" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorKey: 'CreatedAt' ,
|
||||
header: ({ column }) => <DataGridColumnHeader title="Created At" column={column} />,
|
||||
cell: ({ row }) =>
|
||||
new Date(row.original.CreatedAt).toLocaleString('id-ID', {
|
||||
day: '2-digit',
|
||||
month: 'short',
|
||||
year: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
}),
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.balance_type.name,
|
||||
id: 'balance_type_name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Balance Type Name" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.balance_type.currency.name,
|
||||
id: 'currency_name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Currency" column={column} />,
|
||||
header: ({ column }) => <DataGridColumnHeader title="Currency Name" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
@ -92,9 +145,9 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.currency.prefix,
|
||||
id: 'currency_prefix',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Prefix" column={column} />,
|
||||
accessorFn: (row) => row.balance_type.currency.code,
|
||||
id: 'currency_code',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Currency Code" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
@ -102,64 +155,37 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.status,
|
||||
id: 'status',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Status" column={column} />,
|
||||
accessorFn: (row) => row.group.name,
|
||||
id: 'group_name',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Group Name" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
cell: ({ row }) => {
|
||||
const isActive = row.original.status === 'Y';
|
||||
|
||||
return (
|
||||
<span
|
||||
className={`px-2 py-1 text-xs font-semibold rounded-full ${
|
||||
isActive ? 'bg-green-100 text-green-600' : 'bg-red-100 text-red-600'
|
||||
}`}
|
||||
>
|
||||
{isActive ? 'Active' : 'Inactive'}
|
||||
</span>
|
||||
);
|
||||
},
|
||||
meta: {
|
||||
headerClassName: 'w-[100px]',
|
||||
cellClassName: 'text-center'
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.group.is_bank,
|
||||
id: 'is_bank',
|
||||
header: ({ column }) => <DataGridColumnHeader title="Is Bank" column={column} />,
|
||||
enableSorting: false,
|
||||
enableHiding: false,
|
||||
meta: {
|
||||
headerClassName: 'w-[200px]'
|
||||
}
|
||||
}
|
||||
// {
|
||||
// id: 'actions',
|
||||
// header: ({ column }) => <DataGridColumnHeader title="Actions" column={column} />,
|
||||
// cell: (data) => {
|
||||
// const row = data.row.original;
|
||||
// return (
|
||||
// <>
|
||||
// <button
|
||||
// className="btn btn-sm btn-icon btn-clear btn-light"
|
||||
// onClick={() => handleEditDialog(true, row)}
|
||||
// >
|
||||
// <KeenIcon icon="notepad-edit" />
|
||||
// </button>
|
||||
// <button
|
||||
// className="btn btn-sm btn-icon btn-clear btn-light"
|
||||
// onClick={() => handleDeleteDialog(true, row)}
|
||||
// >
|
||||
// <KeenIcon icon="trash" />
|
||||
// </button>
|
||||
// </>
|
||||
// );
|
||||
// },
|
||||
// meta: {
|
||||
// headerClassName: 'w-[150px]'
|
||||
// }
|
||||
// }
|
||||
|
||||
],
|
||||
[]
|
||||
);
|
||||
|
||||
|
||||
|
||||
const getWalletLists = async (page: number, limit: number, sorting: any, filter: any) => {
|
||||
try {
|
||||
sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting;
|
||||
filter = filter.length == 0 ? {} : { name: filter[0].value?.toLowerCase() };
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/wallet`, {
|
||||
const response = await GetData(`${API_URL_WALLET}/dashboard/balance/`, {
|
||||
limit,
|
||||
page: page + 1,
|
||||
with_deleted: false,
|
||||
@ -167,7 +193,7 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC',
|
||||
// filter: JSON.stringify(filter)
|
||||
});
|
||||
console.log(response?.data);
|
||||
// console.log(response?.data);
|
||||
setWallets(response?.data.list);
|
||||
return { data: response?.data.list, totalCount: response?.data.total_count };
|
||||
} catch (error) {
|
||||
@ -192,7 +218,7 @@ const ManageWalletContextProvider = ({ children }: { children: React.ReactNode }
|
||||
<Toaster expand visibleToasts={9} duration={3000} />
|
||||
<DataGridProvider
|
||||
columns={columns}
|
||||
pagination={{ size: 5 }}
|
||||
pagination={{ size: 10 }}
|
||||
toolbar={<ListToolbar />}
|
||||
layout={{ card: true }}
|
||||
sorting={[{ id: 'id', desc: false }]}
|
||||
|
||||
@ -8,7 +8,8 @@ import { ErrorsRouting } from '@/errors';
|
||||
|
||||
import DashboardHomePage from '@/pages/dashboards/home/DashboardHomePage';
|
||||
import ManageUserPage from '@/pages/settings/user/manage-user/ManageUserPage';
|
||||
import Transaction from '@/pages/transaction/Transaction';
|
||||
import Transaction from '@/pages/transaction/history-transaction/Transaction';
|
||||
import ApprovalTransaction from '@/pages/transaction/approval-transaction/ApprovalTransaction';
|
||||
import LogActivityPage from '@/pages/settings/user/log-activity/LogActivityPage';
|
||||
import ManagePositionPage from '@/pages/settings/user/manage-position/ManagePositionPage';
|
||||
import ManageAccount from '@/pages/account/manage-account/ManageAccount';
|
||||
@ -88,6 +89,7 @@ const AppRoutingSetup = (): ReactElement => {
|
||||
<Route path="/notification/notification-management" element={<ManageNotification />} />
|
||||
|
||||
<Route path="/transaction" element={<Transaction />} />
|
||||
<Route path="/approval-transaction" element={<ApprovalTransaction />} />
|
||||
<Route path="/menu/menu-management" element={<ManageMenu />} />
|
||||
<Route path="/menu/welcome" element={<Welcome />} />
|
||||
<Route path="/message/inbox" element={<Inbox />} />
|
||||
|
||||
Reference in New Issue
Block a user