diff --git a/src/pages/master/reward/blocks/AddDialog.tsx b/src/pages/master/reward/blocks/AddDialog.tsx index 6e32603..de9756c 100644 --- a/src/pages/master/reward/blocks/AddDialog.tsx +++ b/src/pages/master/reward/blocks/AddDialog.tsx @@ -23,6 +23,7 @@ import { SelectTrigger, SelectValue } from '@/components/ui/select'; +import { doSaveLogActivity } from '@/actions/GlobalActions'; const API_URL = apiConfig.service_master_data; @@ -75,6 +76,13 @@ const AddDialog = () => { resetForm(); reload(); toast.success('Reward Create successfully!'); + const createActivity = { + module: 'Manage Reward', + description: `Create New Reward => ${formField.name}`, + action: 'C' + }; + + doSaveLogActivity(createActivity); } else { toast.error('Failed to create reward.'); setAlert({ show: true, message: 'Failed to create reward. Please try again.' }); diff --git a/src/pages/master/reward/blocks/DeleteDialog.tsx b/src/pages/master/reward/blocks/DeleteDialog.tsx index 70aaf5e..8014795 100644 --- a/src/pages/master/reward/blocks/DeleteDialog.tsx +++ b/src/pages/master/reward/blocks/DeleteDialog.tsx @@ -13,6 +13,7 @@ import { import { Button } from '@/components/ui/button'; import { DialogDescription } from '@radix-ui/react-dialog'; import { useManageRewardContext } from '../hooks/useManageRewardContext'; +import { doSaveLogActivity } from '@/actions/GlobalActions'; const API_URL = apiConfig.service_master_data; @@ -42,6 +43,13 @@ const DeleteDialog = () => { handleDeleteDialog(false, null); toast.success('Success Delete Reward'); reload(); + const deleteActivity = { + module: 'Manage Reward', + description: `Delete Reward => ${selectedReward}`, + action: 'D' + }; + + doSaveLogActivity(deleteActivity); } else { setAlert({ show: true, message: response?.message }); toast.error('Failed Delete Reward'); diff --git a/src/pages/master/reward/blocks/EditDialog.tsx b/src/pages/master/reward/blocks/EditDialog.tsx index ac71043..817dfb3 100644 --- a/src/pages/master/reward/blocks/EditDialog.tsx +++ b/src/pages/master/reward/blocks/EditDialog.tsx @@ -23,6 +23,7 @@ import { SelectValue } from '@/components/ui/select'; import { useManageRewardContext } from '../hooks/useManageRewardContext'; +import { doSaveLogActivity } from '@/actions/GlobalActions'; const API_URL = apiConfig.service_master_data; @@ -74,6 +75,13 @@ const EditDialog = () => { handleEditDialog(false, null); toast.success('Success Update Reward'); reload(); + const editActivity = { + module: 'Manage Reward', + description: `Edit Reward => ${formField.name}`, + action: 'U' + }; + + doSaveLogActivity(editActivity); } else { toast.error('Error Update Reward'); setAlert({ show: true, message: 'Failed to Update Reward. Please try again.' }); diff --git a/src/pages/settings/user/manage-user/blocks/AddDialog.tsx b/src/pages/settings/user/manage-user/blocks/AddDialog.tsx index 84298fa..333f84c 100644 --- a/src/pages/settings/user/manage-user/blocks/AddDialog.tsx +++ b/src/pages/settings/user/manage-user/blocks/AddDialog.tsx @@ -15,6 +15,16 @@ import { DialogHeader, DialogTitle } from '@/components/ui/dialog'; +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; +import { ChevronDown } from 'lucide-react'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; import { useUserContext } from '../hooks'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; @@ -25,6 +35,14 @@ import { useCallApi } from '@/hooks'; import { doSaveLogActivity } from '@/actions/GlobalActions'; import clsx from 'clsx'; +export interface CustomerProps { + id: string; + msisdn: string; + email: string; + fullname: string; + username: string; +} + interface RoleListProps { id: string; name: string; @@ -42,7 +60,9 @@ interface CreateUserParams { status: string; } +const API_URL_CUSTOMER = apiConfig.service_customer; const API_URL = apiConfig.service_dashboard; + type PasswordType = 'password' | 'retype_password'; const AddDialog = () => { @@ -62,7 +82,8 @@ const AddDialog = () => { retype_password: '', name: '', id_role: '', - status: '' + status: '', + customerid: '' }; const [formField, setFormField] = useState(initialState); const [showPassword, setShowPassword] = useState({ @@ -71,6 +92,8 @@ const AddDialog = () => { }); const [messagePassword, setMessagePassword] = useState(true); + const [open, setOpen] = useState(false); + const [customers, setCustomers] = useState([]); const [isSubmitting, setIsSubmitting] = useState(false); const [passwordErrors, setPasswordErrors] = useState([]); @@ -155,6 +178,23 @@ const AddDialog = () => { // console.log('ini data user_role:', response?.data); }, []); + const getCustomerList = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL_CUSTOMER}/customer/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + setCustomers(response?.data.list); + } catch (error) { + console.error('Error fetching customer', error); + } + }; + useEffect(() => { fetchRoles(); }, [fetchRoles]); @@ -162,7 +202,7 @@ const AddDialog = () => { const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); - console.log('Form data before submit:', formField); + // console.log('Form data before submit:', formField); if ( formField.email.trim() === '' || @@ -171,7 +211,8 @@ const AddDialog = () => { formField.retype_password.trim() === '' || formField.name.trim() === '' || formField.id_role.trim() === '' || - formField.status.trim() === '' + formField.status.trim() === '' || + formField.customerid.trim() === '' ) { setAlert({ show: true, message: 'Please fill name field.' }); return; @@ -196,6 +237,10 @@ const AddDialog = () => { } }, [showAddDialog]); + useEffect(() => { + getCustomerList([{ id: 'id', desc: false }]); + }, []); + const togglePassword = useCallback((event: MouseEvent, key: string) => { event.preventDefault(); setShowPassword((prev) => ({ ...prev, [key]: !prev[key as PasswordType] })); @@ -262,6 +307,58 @@ const AddDialog = () => { +
+
+ + + + + + + + + { + e.currentTarget.scrollTop += e.deltaY; + }} + > + No Customer found. + + {customers.map((customer) => ( + { + setFormField({ + ...formField, + customerid: customer.id + }); + setOpen(false); + }} + > + {customer.username} + + ))} + + + + + +
+
+
diff --git a/src/pages/settings/user/manage-user/blocks/EditDialog.tsx b/src/pages/settings/user/manage-user/blocks/EditDialog.tsx index 0d32ca6..5fc88a1 100644 --- a/src/pages/settings/user/manage-user/blocks/EditDialog.tsx +++ b/src/pages/settings/user/manage-user/blocks/EditDialog.tsx @@ -6,7 +6,15 @@ import { SelectTrigger, SelectValue } from '@/components/ui/select'; - +import { + Command, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList +} from '@/components/ui/command'; +import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; import { Dialog, DialogBody, @@ -15,6 +23,7 @@ import { DialogHeader, DialogTitle } from '@/components/ui/dialog'; +import { CustomerProps } from './AddDialog'; import { useUserContext } from '../hooks'; import { Input } from '@/components/ui/input'; import { Button } from '@/components/ui/button'; @@ -30,6 +39,7 @@ interface RoleListProps { status: string; } +const API_URL_CUSTOMER = apiConfig.service_customer; const API_URL = apiConfig.service_dashboard; const initialState = { @@ -37,7 +47,8 @@ const initialState = { username: '', email: '', id_role: '', - status: '' + status: '', + customerid: '' }; const EditDialog = () => { @@ -45,7 +56,9 @@ const EditDialog = () => { const { showEditDialog, selectedUser, handleEditDialog } = useUserContext(); const { reload } = useDataGrid(); const { GetData, PutData } = useCallApi(); + const [open, setOpen] = useState(false); const [roles, setRoles] = useState([]); + const [customers, setCustomers] = useState([]); const [alert, setAlert] = useState({ show: false, message: '' @@ -109,9 +122,27 @@ const EditDialog = () => { } }, []); + const getCustomerList = async (sorting: any) => { + try { + sorting = sorting.length == 0 ? [{ id: 'name', desc: false }] : sorting; + const response = await GetData(`${API_URL_CUSTOMER}/customer/list`, { + limit: 100, + page: 1, + with_deleted: false, + order_field: sorting[0].id, + order_direction: sorting[0].desc == false ? 'ASC' : 'DESC' + }); + + // console.log('CUSTOMER: ', response?.data); + setCustomers(response?.data.list); + } catch (error) { + console.error('Error fetching customer', error); + } + }; + const doFetchUserData = useCallback(async (id: string) => { const response = await GetData(`${API_URL}/user/detail/${id}`, { id }); - // console.log('User detail response:', response); + console.log('User detail response:', response?.data); if (response?.status) { setFormField((prev) => ({ @@ -120,8 +151,10 @@ const EditDialog = () => { username: response.data.username, email: response.data.email, id_role: response.data.idRole, - status: response.data.status + status: response.data.status, + customerid: response.data.customerid })); + console.log('Customer ID dari user detail:', response.data.customerid); } else { setFormField((prev) => ({ ...prev, @@ -129,7 +162,8 @@ const EditDialog = () => { username: '', email: '', id_role: '0', - status: '' + status: '', + customerid: '' })); } // console.log('Fetched ID Role:', response?.data.id_role); @@ -141,6 +175,10 @@ const EditDialog = () => { } }, [selectedUser]); + useEffect(() => { + getCustomerList([{ id: 'id', desc: false }]); + }, []); + useEffect(() => { if (showEditDialog === false) { resetForm(); @@ -192,6 +230,55 @@ const EditDialog = () => { )}
+
+
+ + + + + + + + + { + e.currentTarget.scrollTop += e.deltaY; + }} + > + No Customer found. + + {customers.map((customer) => ( + { + setFormField({ + ...formField, + customerid: customer.id + }); + setOpen(false); + }} + > + {customer.username} + + ))} + + + + + +
+
+
diff --git a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx index 24cbc41..31c3c48 100644 --- a/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx +++ b/src/pages/settings/user/manage-user/hooks/ManageUserContext.tsx @@ -27,6 +27,7 @@ interface SelectedUser { role: string; new_password: string; check_new_password: string; + customer: string; } const initialProps: ContextProps = { @@ -83,6 +84,16 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode }) enableSorting: true, enableHiding: false }, + { + accessorFn: (row) => row.customer?.username, + id: 'customer', + header: ({ column }) => , + enableSorting: false, + enableHiding: false, + meta: { + headerClassName: 'w-[300px]' + } + }, { accessorFn: (row) => row.email, id: 'email', @@ -100,7 +111,7 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode }) enableSorting: false, enableHiding: false, meta: { - headerClassName: 'w-[350px]' + headerClassName: 'w-[250px]' } }, { @@ -179,7 +190,7 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode }) ); const doGetListData = async (page: number, limit: number, sorting: any, filter: any) => { - sorting = sorting.length == 0 ? [{ id: 'username', desc: false }] : sorting; + sorting = sorting.length == 0 ? [{ id: 'Users.username', desc: false }] : sorting; filter = filter.length == 0 ? {} : { any: filter[0].value.toLowerCase() }; const response = await GetData(`${API_URL}/user/list`, { limit: limit, @@ -189,7 +200,7 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode }) order_direction: sorting[0].desc == false ? 'ASC' : 'DESC', filter: JSON.stringify(filter) }); - console.log('response api:', response); + // console.log('response api:', response); return { data: response?.data.list, totalCount: response?.data.total_count }; }; @@ -215,7 +226,7 @@ const ManageUserContextProvider = ({ children }: { children: React.ReactNode }) pagination={{ size: 10 }} toolbar={} layout={{ card: true }} - sorting={[{ id: 'username', desc: false }]} + sorting={[{ id: 'Users.username', desc: false }]} serverSide={true} onFetchData={({ pageIndex, pageSize, sorting, columnFilters }) => doGetListData(pageIndex, pageSize, sorting, columnFilters)